/* Wendy Regisseert. — huisstijl
   Breekpunten: tot 720px telefoon, 720–1040px tablet, daarboven desktop. */

@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500 600;font-display:swap;src:url(/assets/fonts/cormorant-garamond.woff2) format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:500;font-display:swap;src:url(/assets/fonts/cormorant-garamond-italic.woff2) format('woff2')}
@font-face{font-family:'Work Sans';font-style:normal;font-weight:400 600;font-display:swap;src:url(/assets/fonts/work-sans.woff2) format('woff2')}

:root{
  --ivoor:#F8F5EF;
  --zand:#F1ECE1;
  --lijn:#E3DCCF;
  --lijn-donker:#DDD5C6;
  --inkt:#2A2622;
  --grijs:#66605A;
  --groen:#2E5E52;
  --groen-donker:#25493F;
  --groen-tint:#DCE6E2;
  --aubergine:#7A3B52;
  --amber:#E8A33D;
  --merk:var(--groen);
  --merk-donker:var(--groen-donker);
  --merk-tint:var(--groen-tint);
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Work Sans',Verdana,sans-serif;
  --marge:40px;
}

/* Basis */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--ivoor);color:var(--inkt);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
p,figure,blockquote,ul,ol{margin:0;padding:0}
ul,ol{list-style:none}
h1,h2,h3{margin:0;font-family:var(--serif);font-weight:600;color:var(--inkt)}
img{display:block;max-width:100%;height:auto}
a{color:var(--merk)}
a:hover{color:var(--merk-donker)}
strong{font-weight:600}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
a:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none}

.punt{color:var(--amber)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:16px;top:-80px;z-index:20;background:var(--inkt);color:var(--ivoor);padding:12px 18px;font-weight:600;font-size:15px;text-decoration:none;border-radius:2px}
.skip:focus{top:16px;color:var(--ivoor)}

.wrap{max-width:calc(1120px + 2 * var(--marge));margin:0 auto;padding-left:var(--marge);padding-right:var(--marge);position:relative}
.sectie{position:relative;background:var(--ivoor)}
.sectie--zand{background:var(--zand)}
.sectie--groen{background:var(--merk);color:var(--ivoor)}
.sectie--groen h2,.sectie--groen h3{color:var(--ivoor)}
.pad-96{padding-top:96px;padding-bottom:96px}
.pad-80{padding-top:80px;padding-bottom:80px}
.pad-72{padding-top:72px;padding-bottom:72px}
.stack{display:flex;flex-direction:column}
.g-8{gap:8px}
.g-10{gap:10px}.g-12{gap:12px}.g-14{gap:14px}.g-16{gap:16px}.g-20{gap:20px}.g-24{gap:24px}.g-40{gap:40px}

/* 12-koloms raster */
.raster{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px}
.raster--40{gap:40px}
.raster--48{gap:48px}
.raster--midden{align-items:center}
.raster--start{align-items:start}
.c-1{grid-column:span 1}.c-2{grid-column:span 2}.c-3{grid-column:span 3}.c-4{grid-column:span 4}.c-5{grid-column:span 5}
.c-6{grid-column:span 6}.c-7{grid-column:span 7}.c-8{grid-column:span 8}.c-9{grid-column:span 9}.c-11{grid-column:span 11}
.c-rechts-7{grid-column:span 7/-1}
.c-rechts-4{grid-column:span 4/-1}

/* Typografie */
.label{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.26em;line-height:1.45;text-transform:uppercase;color:var(--merk)}
.sectie--groen .label{color:var(--ivoor);opacity:.8}
.h1-hero{font-size:68px;line-height:1.05}
.h1{font-size:60px;line-height:1.05}
.h1--56{font-size:56px}
.h1--54{font-size:54px}
.h2{font-size:44px;line-height:1.1}
.h2--40{font-size:40px}
.h2--48{font-size:48px}
.h3{font-size:32px;line-height:1.1}
.h3--36{font-size:36px}
.h3--30{font-size:30px;line-height:1.15}
.h3--28{font-size:28px;line-height:1.15}
.h3--26{font-size:26px;line-height:1.15}
.h3--24{font-size:24px;line-height:1.15}
.lead{font-size:19px;line-height:1.6;color:var(--grijs)}
.intro{font-size:18px;line-height:1.6;color:var(--grijs)}
.t-18{font-size:18px}
.t-17{font-size:17px}
.t-16{font-size:16px}
.t-15{font-size:15px}
.t-14{font-size:14px}
.klein{font-size:14px;line-height:1.6;color:var(--grijs)}
.klein-15{font-size:15px;line-height:1.6;color:var(--grijs)}
.grijs{color:var(--grijs)}
.nadruk{font-weight:600;color:var(--merk)}
.cijfer{font-family:var(--serif);font-weight:600;color:var(--merk);line-height:.9}
.prijs{font-family:var(--serif);font-size:44px;font-weight:600;line-height:1;color:var(--merk)}
.citaat{font-family:var(--serif);font-style:italic;font-weight:500;line-height:1.4}
.pijl-link{font-size:15px;font-weight:600;text-decoration:none;color:var(--merk)}

/* Knoppen */
.knop{display:inline-block;background:var(--merk);color:var(--ivoor);text-decoration:none;font-weight:600;font-size:15px;line-height:1.2;padding:16px 28px;border-radius:2px;letter-spacing:.01em;text-align:center}
.knop:hover{background:var(--merk-donker);color:var(--ivoor)}
.knop--klein{font-size:14px;padding:14px 24px;letter-spacing:0}
.knop--licht{background:var(--ivoor);color:var(--merk)}
.knop--licht:hover{background:var(--zand);color:var(--merk-donker)}

/* Logo: tekst, geen afbeelding */
.logo{text-decoration:none;display:inline-flex;flex-direction:column;gap:2px;line-height:1}
.logo__naam{font-family:var(--serif);font-weight:600;font-size:30px;color:var(--inkt)}
.logo__werkwoord{font-family:var(--sans);font-weight:600;font-size:11px;letter-spacing:.26em;color:var(--merk)}
.logo--footer .logo__naam{font-size:26px}
.logo--footer .logo__werkwoord{font-size:10px}

/* Header */
.kop{display:flex;align-items:center;justify-content:space-between;max-width:calc(1120px + 2 * var(--marge));margin:0 auto;padding:28px var(--marge);gap:32px;position:relative;z-index:5}
.kop__rechts{display:flex;align-items:center;gap:36px}
.menu{display:flex;align-items:center;gap:36px}
.menu a{text-decoration:none;color:var(--inkt);font-size:15px;font-weight:500;padding:6px 0;border-bottom:2px solid transparent}
.menu a:hover{color:var(--merk)}
.menu a[aria-current="page"]{color:var(--merk);border-bottom-color:var(--amber)}
.kop .knop{font-size:14px}
.menu-knop{display:none}

/* Coulissen: schuine vlakken aan de randen */
.coulisse{position:absolute;top:0;bottom:0;pointer-events:none}
.coulisse--l{left:0;width:220px;background:var(--merk);clip-path:polygon(0 0,100% 0,50% 100%,0 100%)}
.coulisse--r{right:0;width:280px;background:var(--merk-tint);clip-path:polygon(60.71% 0,100% 0,100% 100%,0 100%)}
.coulisse--contact-r{clip-path:polygon(67.86% 0,100% 0,100% 100%,7.14% 100%)}
.coulisse--statement{right:0;width:520px;background:var(--merk);clip-path:polygon(57.69% 0,100% 0,100% 100%,15.38% 100%)}
.coulisse--cta-l{left:0;width:200px;background:var(--merk-donker);clip-path:polygon(0 0,100% 0,50% 100%,0 100%)}
.coulisse--cta-r{right:0;width:260px;background:var(--merk-donker);clip-path:polygon(57.69% 0,100% 0,100% 100%,0 100%)}

/* Hero (Home) */
.hero{overflow:hidden}
.hero__binnen{max-width:840px;margin:0 auto;padding:136px 40px 144px;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px}
.hero__sub{font-size:20px;line-height:1.5;color:var(--grijs)}
.hero__actie{display:flex;flex-direction:column;align-items:center;gap:14px;padding-top:30px}
.hero__actie span{font-size:14px;color:var(--grijs)}

/* Paginakop (Aanpak, Cases) */
.paginakop{padding-top:72px;padding-bottom:80px}
.paginakop__tekst{max-width:800px}

/* Home: herkenning */
.twee{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:64px;align-items:start}

/* Home: Zo werk ik, trap */
.zowerk{padding-top:96px;padding-bottom:80px}
.stap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px;align-items:start;padding:36px 0;border-top:1px solid var(--lijn-donker)}
.stap__nr{grid-column:1/span 2;font-size:88px}
.stap:nth-child(2) .stap__nr{grid-column:3/span 2}
.stap:nth-child(3) .stap__nr{grid-column:5/span 2}
.stap__tekst{grid-column:span 6;display:flex;flex-direction:column;gap:12px;padding-top:10px}

/* Home: statement-band */
.statement{overflow:hidden}
.statement .wrap{padding-top:120px;padding-bottom:120px}
.statement p{font-family:var(--serif);font-weight:600;font-size:64px;line-height:1.05;max-width:720px}

/* Home: Waarom ik (groen) */
.waarom__kop{max-width:640px}
.waarom__rij{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px;padding:32px 0;border-top:1px solid rgba(248,245,239,.25)}
.waarom__nr{grid-column:span 1;font-family:var(--serif);font-size:30px;font-weight:600;color:var(--ivoor);opacity:.7;line-height:1.1}
.waarom__rij h3{grid-column:span 4}
.waarom__tekst{grid-column:span 7;display:flex;flex-direction:column;gap:14px}
.waarom__citaat{font-size:20px;opacity:.9;padding-top:6px}
.waarom__bron{font-family:var(--sans);font-style:normal;font-size:12px;letter-spacing:.26em}

/* Home: opdracht */
.opdracht__kop{max-width:720px}
.opdracht{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:stretch}
.blok{background:var(--zand);border-radius:2px;display:flex;flex-direction:column}
.blok--groot{grid-column:span 7;padding:44px 40px;gap:20px}
.blok--klein{padding:32px;gap:12px;flex-grow:1}
.opdracht__rechts{grid-column:span 5;display:flex;flex-direction:column;gap:24px}
.prijsregel{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;padding-top:8px}
.blok .klein{padding-top:4px}

/* Home: waar het werkte */
.cases-kop{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
.cases-kop > div{max-width:640px}
.caserij{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:32px;padding:32px 0;border-top:1px solid var(--lijn-donker);text-decoration:none;color:var(--inkt);align-items:start}
.caserij:hover{color:var(--inkt)}
.caserij:hover .caserij__pijl{transform:translateX(4px)}
.caserij__naam{grid-column:span 3;font-family:var(--serif);font-size:30px;font-weight:600;line-height:1.1}
.caserij .label{grid-column:span 3;padding-top:10px}
.caserij p{grid-column:span 5;font-size:16px;line-height:1.6}
.caserij__pijl{grid-column:span 1;text-align:right;font-size:22px;color:var(--merk);padding-top:4px;transition:transform .2s}

/* Quote (gecentreerd) */
.quote{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:24px;text-align:center;align-items:center}
.quote__teken{font-family:var(--serif);font-size:72px;line-height:.5;color:var(--amber);padding-top:20px}
.quote p{font-size:30px;line-height:1.35}

/* Foto's */
.foto{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;background:var(--zand)}
.foto--liggend{aspect-ratio:4/3}
.foto-plek{width:100%;aspect-ratio:4/3;background:var(--merk-tint)}

/* Afsluitende uitnodiging (groen met coulissen) */
.cta{overflow:hidden}
.cta__binnen{max-width:840px;margin:0 auto;padding:104px 40px;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px}
.cta__binnen > p{font-size:18px;line-height:1.6}
.cta__knop{padding-top:8px}
.cta__contact{font-size:15px;opacity:.85}
.cta__contact a{color:var(--ivoor);text-decoration:none}
.cta__contact a:hover{text-decoration:underline;color:var(--ivoor)}

/* Aanpak */
.fase__kant{display:flex;flex-direction:column;gap:10px}
.fase__kant .cijfer{font-size:72px}
.fase__inhoud{display:flex;flex-direction:column;gap:20px}
.drie{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.kaart{background:var(--ivoor);border-radius:2px;padding:24px;display:flex;flex-direction:column;gap:10px}
.kaart p:not(.label){font-size:15px;line-height:1.6}
.oplever{padding-top:12px;gap:40px}
.oplever__rij{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;padding:18px 0;border-top:1px solid var(--lijn-donker)}
.oplever__nr{grid-column:span 1;font-family:var(--serif);font-size:26px;font-weight:600;color:var(--merk);line-height:1.2}
.oplever__rij p{grid-column:span 11;font-size:16px;line-height:1.6}
.oplever__slot{padding-top:6px}
.prijsblok{align-self:start;background:var(--merk);color:var(--ivoor);padding:32px 28px;display:flex;flex-direction:column;gap:16px;border-radius:2px}
.prijsblok .label{color:var(--ivoor);opacity:1}
.prijsblok .prijs{color:var(--ivoor)}
.prijsblok p:not(.label):not(.prijs){font-size:14px;line-height:1.6;opacity:.9}
.vraag{display:flex;flex-direction:column;gap:10px;padding:28px 0;border-top:1px solid var(--lijn)}
.vraag h3{font-size:26px;line-height:1.2}
.vraag p{font-size:16px;line-height:1.6;max-width:760px}
.vraag a{font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* Cases */
.case-rijen{padding-top:16px}
.case-rij{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;padding:24px 0;border-top:1px solid var(--lijn)}
.case-rij .label{padding-top:6px}
.case-rij p{grid-column:span 3}
.case-citaat{padding:36px 40px;margin-top:24px;display:flex;flex-direction:column;gap:14px;border-radius:2px}
.case-citaat p{font-size:24px}

/* Over Wendy */
.over-kop{padding-top:72px;padding-bottom:96px}
.merk-r{color:var(--merk);font-weight:600}
.werft-link{color:var(--aubergine);font-weight:600;text-decoration:none}
.werft-link:hover{color:var(--aubergine);text-decoration:underline}
.feiten{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:32px}
.feit{display:flex;flex-direction:column;gap:6px;padding:24px 0;border-top:2px solid var(--merk)}
.feit__kop{font-family:var(--serif);font-size:26px;font-weight:600;line-height:1.1}
.feit__sub{font-size:14px;color:var(--grijs);line-height:1.5}

/* Contact */
.contact{overflow:hidden;flex-grow:1}
.contact .wrap{padding-top:96px;padding-bottom:120px}
.contact__tekst{grid-column:3/span 5;display:flex;flex-direction:column;gap:24px}
.contact__lijst{display:flex;flex-direction:column;gap:14px;padding-top:8px;font-size:18px}
.contact__lijst a{text-decoration:none;color:var(--inkt);font-weight:500}
.contact__lijst a:hover{color:var(--merk)}
.contact__lijst a.contact__li{color:var(--merk)}
.contact__kaart{grid-column:8/span 4;background:var(--merk);color:var(--ivoor);padding:40px 36px;display:flex;flex-direction:column;gap:20px;border-radius:2px}
.contact__kaart .label{color:var(--ivoor);opacity:1}
.contact__kaart h2{color:var(--ivoor)}
.contact__kaart p:not(.label){font-size:15px;line-height:1.6;opacity:.9}

/* 404 */
.nietgevonden{overflow:hidden;flex-grow:1}
.nietgevonden .wrap{padding-top:120px;padding-bottom:140px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:24px}
.nietgevonden__knoppen{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;padding-top:8px}
.knop--rand{background:transparent;color:var(--merk);box-shadow:inset 0 0 0 1px var(--merk)}
.knop--rand:hover{background:var(--merk);color:var(--ivoor)}

/* Pagina-opbouw */
.pagina{min-height:100vh;display:flex;flex-direction:column}
main{display:flex;flex-direction:column;flex-grow:1}

/* Footer */
.voet{background:var(--zand);border-top:1px solid var(--lijn)}
.voet__binnen{max-width:calc(1120px + 2 * var(--marge));margin:0 auto;padding:48px var(--marge);display:flex;flex-direction:column;gap:28px}
.voet__boven{display:flex;justify-content:space-between;align-items:flex-start;gap:40px;flex-wrap:wrap}
.voet__links{display:flex;gap:40px;font-size:14px;flex-wrap:wrap}
.voet__links a{text-decoration:none;color:var(--inkt)}
.voet__links a:hover{color:var(--merk)}
.voet__onder{display:flex;justify-content:space-between;gap:16px 40px;flex-wrap:wrap;font-size:13px;color:var(--grijs);line-height:1.6}
.voet__ander{color:var(--aubergine)}
.voet__ander a{color:var(--aubergine);text-decoration:none;font-weight:600}
.voet__ander a:hover{text-decoration:underline;color:var(--aubergine)}

/* ---------- Tablet: 720–1040px ---------- */
@media (max-width:1040px){
  .kop{width:100%}
  .kop__rechts,.menu{gap:20px}
  .kop .knop{padding:14px 20px}
  .h1-hero{font-size:56px}
  .h1{font-size:52px}
  .statement p{font-size:52px;max-width:calc(100% - 300px)}
  .coulisse--statement{width:360px}
  .zowerk .raster > .c-4,.zowerk .raster > .c-8{grid-column:1/-1}
  .waarom__rij{grid-template-columns:48px minmax(0,1fr);gap:16px 24px}
  .waarom__nr{grid-column:1}
  .waarom__rij h3{grid-column:2}
  .waarom__tekst{grid-column:2}
  .blok--groot,.opdracht__rechts{grid-column:1/-1}
  .opdracht__rechts{flex-direction:row}
  .opdracht__rechts .blok{flex:1 1 0}
  .caserij{grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) 32px;gap:12px 32px}
  .caserij__naam{grid-column:1}
  .caserij .label{grid-column:1;grid-row:2;padding-top:0}
  .caserij p{grid-column:2;grid-row:1/span 2}
  .caserij__pijl{grid-column:3;grid-row:1}
  .wie .c-4,.move .c-4{grid-column:span 5}
  .wie .c-rechts-7,.move .c-rechts-7{grid-column:span 7/-1}
  .fase .c-3,.fase .c-9{grid-column:1/-1}
  .fase__kant{flex-direction:row;align-items:baseline;gap:20px}
  .drie{grid-template-columns:repeat(2,minmax(0,1fr))}
  .oplever > .c-8,.oplever > .c-4{grid-column:1/-1}
  .prijsblok{max-width:420px}
  .faq .c-4,.faq .c-8{grid-column:1/-1}
  .feiten{grid-template-columns:repeat(2,minmax(0,1fr))}
  .over-hero .c-7{grid-column:span 7}
  .over-hero .c-rechts-4{grid-column:span 5/-1}
  .contact .raster{display:flex;flex-direction:column;gap:48px}
  .contact .wrap{padding-left:120px;padding-right:96px}
  .contact__kaart{max-width:460px}
  .contact .coulisse--l{width:96px}
  .contact .coulisse--r{width:120px}
  .coulisse--l{width:140px}
  .coulisse--r{width:180px}
  .coulisse--cta-l{width:120px}
  .coulisse--cta-r{width:160px}
}

/* ---------- Telefoon: tot 720px ---------- */
@media (max-width:719.98px){
  :root{--marge:24px}
  body{font-size:17px}
  .raster,.raster--40,.raster--48{display:flex;flex-direction:column;gap:32px}
  .pad-96,.pad-80,.pad-72,.zowerk{padding-top:56px;padding-bottom:56px}
  .paginakop,.over-kop{padding-top:40px;padding-bottom:56px}

  /* Koppen */
  .h1-hero,.h1,.h1--56,.h1--54{font-size:40px;line-height:1.05}
  .h2,.h2--40,.h2--48{font-size:32px;line-height:1.1}
  .h3,.h3--36,.h3--30,.h3--28,.h3--26{font-size:24px;line-height:1.15}
  .lead,.intro,.t-18,.t-17,.cta__binnen > p{font-size:17px}
  .vraag h3{font-size:22px}

  /* Header */
  .kop{padding:20px var(--marge);gap:8px;flex-wrap:wrap}
  .logo{flex:none}
  .logo__naam{font-size:24px}
  .logo__werkwoord{font-size:9px}
  .kop__rechts{gap:8px;display:contents}
  .kop .knop{font-size:13px;padding:13px 10px;margin-left:auto;letter-spacing:0;white-space:nowrap}
  .menu-knop{display:inline-flex;align-items:center;background:none;border:1px solid var(--merk);color:var(--merk);font:600 13px/1 var(--sans);padding:0 10px;height:44px;border-radius:2px;cursor:pointer;flex:none}
  .menu-knop[aria-expanded="true"]{background:var(--merk);color:var(--ivoor)}
  .menu{order:5;flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;border-top:1px solid var(--lijn);margin-top:4px}
  .menu a{padding:14px 0;border-bottom:1px solid var(--lijn);font-size:17px}
  .menu a[aria-current="page"]{border-bottom-color:var(--lijn);box-shadow:inset 3px 0 0 var(--amber);padding-left:12px}
  .js .menu{display:none}
  .js .menu.is-open{display:flex}
  html:not(.js) .menu-knop{display:none}

  /* Coulissen smaller, schuin */
  .coulisse--l{width:72px;clip-path:polygon(0 0,100% 0,55.56% 100%,0 100%)}
  .coulisse--r{width:72px;clip-path:polygon(55.56% 0,100% 0,100% 100%,0 100%)}
  .coulisse--cta-l{width:48px}
  .coulisse--cta-r{width:60px;clip-path:polygon(53.33% 0,100% 0,100% 100%,0 100%)}
  .coulisse--contact-r{clip-path:polygon(55.56% 0,100% 0,100% 100%,0 100%)}

  /* Hero */
  .hero__binnen{padding:72px 40px 80px}
  .hero__sub{font-size:17px}
  .hero__actie{padding-top:18px}
  .hero__actie span{font-size:13px;max-width:271px}

  /* Herkenning */
  .twee{grid-template-columns:1fr;gap:24px}

  /* Zo werk ik: kaarten */
  .zowerk{padding-bottom:16px}
  .stap{display:flex;flex-direction:column;gap:12px;background:var(--ivoor);padding:24px;border:0;border-radius:2px;margin-bottom:16px}
  .stap__nr{font-size:32px;line-height:1}
  .stap__tekst{padding-top:0}
  .stap__tekst p{font-size:16px}

  /* Statement: sluit aan op Zo werk ik */
  .statement{background:var(--zand)}
  .statement .coulisse--statement{display:none}
  .statement .wrap{padding-top:8px;padding-bottom:56px}
  .statement p{font-size:28px;line-height:1.2;text-align:center;max-width:none}
  .statement br{display:none}

  /* Waarom ik: ivoor met groene lijnen */
  .waarom{background:var(--ivoor);color:var(--inkt)}
  .waarom h2,.waarom h3{color:var(--inkt)}
  .waarom .label{color:var(--merk);opacity:1}
  .waarom__rij{display:flex;flex-direction:column;gap:10px;padding:24px 0 0;border-top:2px solid var(--merk);margin-bottom:8px}
  .waarom__nr{font-size:28px;color:var(--merk);opacity:1;line-height:1}
  .waarom__tekst p:not(.citaat){font-size:16px}
  .waarom__citaat{font-size:19px}
  .waarom__citaat{font-size:20px;opacity:1}
  .waarom__bron{opacity:1;color:var(--merk);display:block;padding-top:6px;letter-spacing:.2em}

  /* Opdracht: ivoren kaarten op zand */
  .sectie.opdracht-sectie{background:var(--zand)}
  .opdracht{display:flex;flex-direction:column;gap:16px}
  .opdracht__rechts{flex-direction:column;gap:16px}
  .blok{background:var(--ivoor)}
  .blok--groot,.blok--klein{padding:24px;gap:12px}
  .blok p:not(.label):not(.prijs){font-size:16px}
  .prijs{font-size:40px}

  /* Waar het werkte */
  .caserij{display:flex;flex-direction:column;gap:10px;padding:24px 0;position:relative}
  .caserij__naam{font-size:26px;padding-right:32px}
  .caserij .label{padding-top:0}
  .caserij__pijl{position:absolute;right:0;top:24px}
  .cases-kop{flex-direction:column;align-items:flex-start;gap:20px}
  .sectie.cases-sectie{background:var(--ivoor)}
  .quote-sectie{border-top:1px solid var(--lijn)}

  /* Quote */
  .quote__teken{font-size:60px;padding-top:16px}
  .quote p{font-size:24px}

  /* Wie er binnenkomt: tekst boven beeld */
  .wie .raster > .c-4{order:2}

  /* Uitnodiging */
  .cta__binnen{padding:72px 32px;gap:20px}
  .cta__contact{font-size:14px}
  .cta__contact a{display:block}
  .cta__contact .punt{display:none}

  /* Aanpak */
  .fase__kant .cijfer{font-size:56px}
  .drie{grid-template-columns:1fr}
  .oplever__rij{grid-template-columns:28px minmax(0,1fr);gap:12px}
  .oplever__nr{grid-column:1}
  .oplever__rij p{grid-column:2}
  .prijsblok{max-width:none}

  /* Cases */
  .case-rijen{padding-top:16px}
.case-rij{grid-template-columns:1fr;gap:8px}
  .case-rij p{grid-column:1}
  .case-citaat{padding:24px 0 0}
  .case-citaat p{font-size:22px}

  /* Over Wendy */
  .over-hero .raster > .c-rechts-4{order:2}
  .move .raster > .c-4{order:2}
  .feiten{grid-template-columns:1fr;gap:0}
  .feit{padding:20px 0}

  /* Contact */
  .contact .wrap{padding-top:48px;padding-bottom:72px;padding-left:40px;padding-right:40px}
  .contact .coulisse--l,.contact .coulisse--r{width:28px}
  .contact__kaart{padding:32px 24px}

  /* 404 */
  .nietgevonden .wrap{padding:72px 56px 96px}

  /* Footer */
  .voet__binnen{padding:40px var(--marge);gap:20px}
  .logo--footer .logo__naam{font-size:22px}
  .logo--footer .logo__werkwoord{font-size:9px}
  .voet__links{gap:12px 24px}
}

@media (prefers-reduced-motion:reduce){*{transition:none!important}}