/*
Theme Name: Wij Fashion Rheden Compleet
Theme URI: https://www.wijfashion.nl/
Author: Wij Fashion
Description: Bewegende brochurewebsite voor Wij Fashion Rheden met sfeerfoto's, Vriendinnenavond en contactformulier.
Version: 1.0.0
Text Domain: wij-fashion
*/
:root{
  --brown:#8b684f;--brown-dark:#5b4130;--cream:#f7f1eb;--sand:#e5d7ca;
  --white:#fffdf9;--ink:#2d2824;--serif:Georgia,"Times New Roman",serif;--sans:Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--sans);line-height:1.65;overflow-x:hidden}
a{color:inherit;text-decoration:none}img{display:block;max-width:100%;height:auto}
.site-header{position:fixed;z-index:99;top:0;left:0;right:0;padding:16px 5vw;display:flex;justify-content:space-between;align-items:center;background:rgba(247,241,235,.78);backdrop-filter:blur(14px);transition:.3s}
.site-header.scrolled{padding:9px 5vw;box-shadow:0 8px 30px rgba(70,45,30,.08)}.header-logo{width:92px}
.nav{display:flex;gap:24px;align-items:center;font-size:11px;text-transform:uppercase;letter-spacing:.15em}.nav a{position:relative}.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:1px;background:var(--brown);transition:.25s}.nav a:hover:after{right:0}
.menu-toggle{display:none;border:0;background:none;font-size:28px;color:var(--brown-dark)}
.hero{min-height:100vh;display:grid;place-items:center;position:relative;overflow:hidden;background:var(--brown)}
.hero-photo{position:absolute;inset:0;background:linear-gradient(90deg,rgba(47,32,22,.72),rgba(47,32,22,.1)),url("assets/images/wij-fashion-storefront.jpg") center/cover no-repeat;transform:scale(1.04);animation:slowZoom 14s ease-in-out infinite alternate}
.hero-content{position:relative;z-index:2;width:min(1120px,90%);color:#fff;padding-top:80px}.hero-kicker{font-size:11px;text-transform:uppercase;letter-spacing:.28em;margin-bottom:18px}.hero h1{font:normal clamp(58px,9vw,124px)/.88 var(--serif);margin:0;max-width:900px}.hero h1 em{font-style:italic}.hero-sub{font-size:18px;max-width:560px;margin:26px 0 28px}
.cta{display:inline-flex;align-items:center;gap:10px;padding:14px 22px;background:var(--white);color:var(--brown-dark);text-transform:uppercase;letter-spacing:.14em;font-size:11px;transition:.25s;border:0;cursor:pointer}.cta:hover{transform:translateY(-2px)}
.section{padding:105px 7vw}.section-inner{max-width:1180px;margin:auto}.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:.24em;color:var(--brown);margin-bottom:12px}h2{font:normal clamp(40px,6vw,72px)/1 var(--serif);color:var(--brown-dark);margin:0 0 24px}.lead{font:20px/1.65 var(--serif);max-width:760px}
.intro{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.intro-card{background:var(--sand);padding:52px}.script{font:italic 56px/1 var(--serif);color:var(--brown);margin-bottom:18px}
.sfeer-section{background:#fbf7f3}.sfeer-grid{margin-top:40px;display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:185px;gap:16px}.sfeer-item{position:relative;overflow:hidden;margin:0;grid-column:span 4;grid-row:span 2;background:#d8cabe;box-shadow:0 12px 30px rgba(65,45,32,.08)}.sfeer-wide{grid-column:span 8;grid-row:span 3}.sfeer-tall{grid-column:span 4;grid-row:span 3}.sfeer-item img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s ease,filter .5s ease}.sfeer-item:hover img{transform:scale(1.055);filter:saturate(1.04)}.sfeer-item:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(35,24,17,.58),transparent 55%)}.sfeer-item figcaption{position:absolute;z-index:2;left:18px;bottom:15px;color:white;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.friends-section{background:#efe3d8}.friends-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:55px;align-items:center}.friends-card{background:var(--white);padding:52px;box-shadow:0 18px 48px rgba(70,50,30,.08)}.friends-list{display:grid;gap:14px}.friends-list div{display:flex;align-items:center;gap:14px;background:rgba(255,255,255,.58);padding:18px}.friends-list strong{font-size:25px}.friends-list span{font:20px var(--serif);color:var(--brown-dark)}
.quote{background:var(--brown);color:#fff;text-align:center;padding:110px 8vw}.quote p{font:italic clamp(34px,5vw,60px)/1.12 var(--serif);max-width:980px;margin:0 auto 22px}.quote span{font-size:10px;text-transform:uppercase;letter-spacing:.24em}
.visit{display:grid;grid-template-columns:1fr 1fr;gap:45px}.visit-photo{min-height:460px;background:url("assets/images/wij-fashion-storefront.jpg") center/cover no-repeat}.visit-info{background:var(--white);padding:52px}.info-row{padding:16px 0;border-bottom:1px solid #e8ddd2}.info-row strong{display:block;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--brown)}.info-row span{font:20px var(--serif)}
.contact-section{background:var(--sand)}.contact-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px}.contact-card{background:var(--white);padding:42px;box-shadow:0 20px 50px rgba(70,50,30,.08)}.wij-contact-form label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:var(--brown-dark);margin:0 0 16px}.wij-contact-form input,.wij-contact-form textarea,.wij-contact-form select{display:block;width:100%;margin-top:7px;border:1px solid #ddd1c5;background:white;padding:13px 14px;font:16px/1.5 var(--sans);color:var(--ink)}.wij-contact-form textarea{resize:vertical;min-height:135px}.form-note{font-size:11px;color:#817367}.form-message{padding:16px 18px;margin-bottom:22px;border-left:3px solid var(--brown);background:#f8f1ea}.friends-fields{display:none}.friends-fields.visible{display:block}.honeypot{position:absolute!important;left:-9999px!important;height:0!important;width:0!important;overflow:hidden!important}
.footer{background:#2e251f;color:#eee6df;padding:60px 7vw}.footer-grid{max-width:1180px;margin:auto;display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:36px}.footer h3{font:normal 28px var(--serif);margin:0 0 10px}.footer p{margin:5px 0;color:#d8ccc1}.footer-bottom{max-width:1180px;margin:40px auto 0;border-top:1px solid rgba(255,255,255,.15);padding-top:16px;font-size:10px;letter-spacing:.13em;text-transform:uppercase}
.reveal{opacity:0;transform:translateY(28px);transition:.8s ease}.reveal.visible{opacity:1;transform:none}@keyframes slowZoom{to{transform:scale(1.1)}}
@media(max-width:900px){.intro,.friends-grid,.visit,.contact-layout{grid-template-columns:1fr}.sfeer-grid{grid-template-columns:1fr 1fr;grid-auto-rows:220px}.sfeer-item,.sfeer-wide,.sfeer-tall{grid-column:span 1;grid-row:span 1}}
@media(max-width:800px){.menu-toggle{display:block}.nav{display:none;position:absolute;top:70px;left:0;right:0;background:var(--cream);padding:24px 5vw;flex-direction:column;align-items:flex-start}.nav.open{display:flex}.header-logo{width:76px}.section{padding:72px 6vw}.hero h1{font-size:62px}.friends-card,.contact-card{padding:28px 22px}.footer-grid{grid-template-columns:1fr}}
@media(max-width:560px){.sfeer-grid{grid-template-columns:1fr;grid-auto-rows:275px}}

/* Warmere uitstraling van de bestaande startfoto */
.hero-photo{
  filter:sepia(.16) saturate(1.12) brightness(.96) contrast(1.02);
}
.hero:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(112,67,38,.18),rgba(177,115,70,.06));
}

/* Alleen de drie nieuwe buitenfoto's bij de adresgegevens */
.visit-gallery{min-height:520px;position:relative;overflow:hidden;background:#d8cabe}
.visit-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transform:scale(1.02);transition:opacity 1.1s ease,transform 7s ease}
.visit-slide.active{opacity:1;transform:scale(1.07)}
@media(max-width:900px){.visit-gallery{min-height:430px}}

/* Extra warme, luxe uitstraling van de hoofdfoto */
.hero-photo{
  filter:sepia(.28) saturate(1.20) brightness(.91) contrast(1.03) !important;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(86,48,27,.30),rgba(153,91,52,.13) 55%,rgba(191,129,82,.08)),
    radial-gradient(circle at 70% 35%,rgba(222,164,112,.12),transparent 46%);
}
.hero-content{z-index:3}

/* Lokale SEO-inhoud, visueel passend bij de site */
.seo-local-section{background:#fffaf5}
.seo-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:38px}
.seo-cards article{background:var(--white);padding:28px;border:1px solid #eadfd5}
.seo-cards h3{font:normal 27px/1.15 var(--serif);color:var(--brown-dark);margin:0 0 12px}
.seo-cards p{margin:0}
@media(max-width:800px){.seo-cards{grid-template-columns:1fr}}

/* Vriendinnenavond zonder gekleurde icoontjes */
.friends-list div{padding:20px 22px;border-left:2px solid var(--brown)}
.friends-list span{font:20px var(--serif);color:var(--brown-dark)}