/* MERKPODIUM  ·  één stylesheet, geen stapels overschrijvingen
   kleuren: crème #FAF8F6, kaartvlak #F1ECE6, terracotta #B69286,
   diep grijsgroen #5C5C54 voor de donkere band, tekst #3A3A34      */
:root{
  --creme:#FAF8F6; --kaart:#F1ECE6; --lijn:#E4DCD4;
  --terra:#B69286; --terra-diep:#95705F; --terra-licht:#D8C3B9;
  --grijs:#5C5C54; --grijs-diep:#46463F; --salie:#9EA493;
  --tekst:#3A3A34; --tekst-licht:#5F5C56;
  --sans:"Montserrat",system-ui,sans-serif; --serif:"Libre Baskerville",Georgia,serif;
  --wrap:1280px; --gut:clamp(20px,4vw,48px); --r:14px;
  --schaduw:0 20px 48px -28px rgba(58,58,52,.45);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--creme);color:var(--tekst-licht);font-family:var(--sans);font-weight:400;
  font-size:clamp(15.5px,1vw,16.5px);line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block;height:auto}
a{color:var(--terra-diep);text-decoration:none}a:hover{text-decoration:underline}
strong,b{font-weight:600;color:var(--tekst)}
:focus-visible{outline:2px solid var(--terra-diep);outline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:400;color:var(--tekst);margin:0 0 .55em;line-height:1.3;overflow:visible}
h1{font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.22}
h2{font-size:clamp(1.45rem,2.4vw,2rem)}
h3{font-size:clamp(1.02rem,1.2vw,1.14rem);line-height:1.45}
h1 em,h2 em{font-style:italic;color:var(--terra-diep)}
p{margin:0 0 1em;max-width:62ch}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gut)}
.sectie{padding-block:clamp(48px,5.5vw,84px)}
.lead{font-size:clamp(1rem,1.15vw,1.08rem)}
.kicker{display:inline-block;font-size:.7rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--terra-diep);margin-bottom:12px}
.streep{display:block;width:100%;max-width:220px;height:8px;overflow:visible;color:var(--terra);margin-bottom:14px}
.streep path{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}

.btn{display:inline-flex;align-items:center;gap:.5em;padding:.82em 1.5em;border-radius:8px;border:1px solid transparent;
  font-family:var(--sans);font-weight:600;font-size:.88rem;cursor:pointer;transition:.2s}
.btn:hover{text-decoration:none;transform:translateY(-1px)}
.btn--vol{background:var(--terra);color:#fff}
.btn--vol:hover{background:var(--terra-diep)}
.btn--lijn{background:#fff;color:var(--tekst);border-color:var(--lijn)}
.btn--lijn:hover{border-color:var(--terra)}
.btnrij{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;align-items:center}

/* ---------- header, altijd leesbaar ---------- */
.header{position:sticky;top:0;z-index:80;background:rgba(250,248,246,.97);border-bottom:1px solid var(--lijn);
  backdrop-filter:blur(8px)}
.header__in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:10px}
.header .logo img{height:38px}
.nav{display:flex;align-items:center;gap:clamp(12px,1.6vw,24px)}
.nav a{color:var(--tekst);font-size:.86rem}
.nav a:hover{color:var(--terra-diep);text-decoration:none}
.burger{display:none;width:42px;height:42px;border:1px solid var(--lijn);border-radius:8px;background:#fff;cursor:pointer;
  align-items:center;justify-content:center;position:relative;z-index:90}
.burger span{display:block;width:17px;height:1.6px;background:var(--tekst);position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:17px;height:1.6px;background:var(--tekst)}
.burger span::before{top:-6px}.burger span::after{top:6px}
@media(max-width:1000px){
  .burger{display:flex}
  .nav{position:fixed;inset:0;flex-direction:column;justify-content:center;gap:6px;background:var(--creme);padding:var(--gut);display:none;z-index:70}
  .nav.open{display:flex}
  .nav a{font-family:var(--serif);font-size:1.4rem;padding:8px 0}
}

/* ---------- hero ---------- */
.hero{padding-block:clamp(36px,4.5vw,64px)}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,56px);align-items:center}
.hero__media img{border-radius:var(--r);box-shadow:var(--schaduw);width:100%;max-height:460px;object-fit:cover;object-position:center 22%}
.hero p{max-width:46ch}
@media(max-width:900px){.hero__grid{grid-template-columns:1fr;gap:24px}.hero__media{order:-1}
  .hero__media img{max-height:320px}}

/* ---------- merkenbalk ---------- */
.balk{background:#fff;border-block:1px solid var(--lijn);padding-block:18px}
.balk .wrap{display:flex;justify-content:center}
.balk img{width:100%;max-width:720px;opacity:.9}

/* ---------- vlakken ---------- */
.vlak-licht{background:var(--kaart)}
.vlak-donker{background:var(--grijs);color:#F2F1ED}
.vlak-donker h2,.vlak-donker h3{color:#fff}
.vlak-donker h2 em{color:var(--terra-licht)}
.vlak-donker p,.vlak-donker .lead{color:#DCDAD3}
.vlak-donker .kicker{color:var(--terra-licht)}
.vlak-donker .streep{color:var(--terra-licht)}
.vlak-donker .kaart{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18)}
.vlak-donker .kaart h3{color:#fff}.vlak-donker .kaart p{color:#DCDAD3}
.vlak-donker .kaart__meta{color:var(--terra-licht)}
.vlak-donker .btn--lijn{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}

.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,56px);align-items:center}
.split--om .beeld{order:2}
.beeld img{border-radius:var(--r);box-shadow:var(--schaduw);width:100%;max-height:420px;object-fit:cover}
@media(max-width:900px){.split{grid-template-columns:1fr}.split--om .beeld{order:0}}

/* ---------- kaarten ---------- */
.kaarten{display:grid;grid-template-columns:repeat(var(--kol,3),1fr);gap:18px;margin-top:26px}
@media(max-width:900px){.kaarten{grid-template-columns:1fr}}
.kaart{background:#fff;border:1px solid var(--lijn);border-radius:12px;padding:24px;display:flex;flex-direction:column;gap:8px;
  transition:transform .3s,box-shadow .3s,border-color .3s}
.kaart:hover{transform:translateY(-3px);box-shadow:var(--schaduw);border-color:var(--terra-licht);text-decoration:none}
.kaart h3{margin:0}
.kaart p{margin:0;font-size:.92rem}
.kaart__meta{font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--terra-diep)}
.kaart__nr{font-family:var(--serif);font-size:1.5rem;color:var(--terra);line-height:1}
.kaart__meer{margin-top:auto;padding-top:10px;font-weight:600;font-size:.86rem;color:var(--tekst)}

/* ---------- telefoon met demo ---------- */
.toestel{max-width:280px;margin-inline:auto}
.toestel .rand{background:var(--grijs-diep);border-radius:30px;padding:9px;box-shadow:var(--schaduw)}
.scherm{position:relative;aspect-ratio:9/18;border-radius:23px;overflow:hidden;background:#fff}
.scherm iframe{position:absolute;top:0;left:0;border:0;transform-origin:top left}
.start{position:absolute;inset:0;display:grid;place-items:center;cursor:pointer;border:0;
  background:linear-gradient(180deg,rgba(58,58,52,.1),rgba(58,58,52,.45))}
.play{width:58px;height:58px;border-radius:50%;background:var(--terra);display:grid;place-items:center}
.play svg{width:18px;height:18px;fill:#fff;margin-left:3px}
.toestel__onder{text-align:center;font-size:.8rem;margin-top:12px}

/* ---------- quote-rail ---------- */
.rail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;margin-top:24px}
.rail__item{flex:0 0 min(260px,70vw);scroll-snap-align:start}
.rail__item img{border-radius:12px;box-shadow:var(--schaduw);width:100%;aspect-ratio:5/6.2;object-fit:contain;background:#fff}
.railnav{display:flex;gap:8px;margin-top:4px}
.railnav button{width:42px;height:42px;border-radius:50%;border:1px solid var(--lijn);background:#fff;cursor:pointer;color:var(--tekst)}

/* ---------- tabs ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0 0;padding:0;list-style:none}
.tab{border:1px solid var(--lijn);background:#fff;color:var(--tekst);padding:.5em 1em;border-radius:8px;font:inherit;font-size:.84rem;cursor:pointer}
.tab[aria-pressed="true"]{background:var(--terra);border-color:var(--terra);color:#fff;font-weight:600}

/* ---------- slot en voet ---------- */
.slot{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(22px,3vw,44px);align-items:center}
.slot__lijst{display:grid;gap:10px}
.slot__lijst a{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);border-radius:10px;padding:14px 16px;color:#fff;font-weight:600}
.slot__lijst a small{display:block;font-weight:400;font-size:.76rem;color:#DCDAD3;margin-bottom:2px}
.slot__lijst a:hover{background:var(--terra);border-color:var(--terra);text-decoration:none}
@media(max-width:900px){.slot{grid-template-columns:1fr}}
.voet{background:#fff;border-top:1px solid var(--lijn);padding-block:34px 26px;font-size:.84rem}
.voet__in{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between}
.voet__links{display:flex;flex-wrap:wrap;gap:14px}
.voet img{height:30px;margin-bottom:8px}
.voet a{color:var(--tekst)}

/* ---------- contactknop ---------- */
.bel{position:fixed;right:16px;bottom:16px;z-index:120}
.bel__knop{width:58px;height:58px;border-radius:50%;border:3px solid #fff;overflow:hidden;cursor:pointer;padding:0;box-shadow:var(--schaduw)}
.bel__knop img{width:100%;height:100%;object-fit:cover}
.bel__paneel{position:fixed;right:16px;bottom:86px;width:min(320px,calc(100vw - 32px));background:#fff;border:1px solid var(--lijn);
  border-radius:14px;box-shadow:var(--schaduw);overflow:hidden;z-index:120;opacity:0;transform:translateY(10px);pointer-events:none;transition:.25s}
.bel__paneel.open{opacity:1;transform:none;pointer-events:auto}
.bel__kop{background:var(--grijs);color:#fff;padding:14px 16px;display:flex;align-items:center;gap:10px;font-weight:600;font-size:.88rem}
.bel__kop img{width:34px;height:34px;border-radius:50%;object-fit:cover}
.bel__body{padding:16px}
.bel__body p{font-size:.9rem;margin:0 0 12px}
.bel__opties{display:grid;gap:8px}
.bel__opties a{border:1px solid var(--lijn);border-left:3px solid var(--terra);border-radius:8px;padding:11px 13px;color:var(--tekst);font-weight:600;font-size:.88rem}
.bel__opties a:hover{background:var(--kaart);text-decoration:none}

/* ---------- beweging, altijd met zichtbare eindtoestand ---------- */
@keyframes opkomst{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.speel{animation:opkomst .6s ease both}
@media(prefers-reduced-motion:reduce){.speel{animation:none}}

/* ---------- productsite: demo direct in de hero ---------- */
.hero--product{position:relative;overflow:hidden;padding-block:clamp(40px,5vw,72px)}
.hero--product::before{content:"";position:absolute;width:52vw;height:52vw;right:-16vw;top:-18vw;border-radius:50%;
  background:radial-gradient(circle at 45% 45%,rgba(182,146,134,.22),rgba(182,146,134,0) 68%);pointer-events:none}
.hero--product .wrap{position:relative}
.hero__grid--demo{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,4vw,64px);align-items:center}
.badge-rij{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.pil{display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--lijn);border-radius:999px;
  padding:.38em .8em;font-size:.76rem;font-weight:600;color:var(--tekst)}
.pil i{width:6px;height:6px;border-radius:50%;background:var(--terra);display:block}
.demo-blok{position:relative;display:flex;justify-content:center}
.demo-blok .toestel{max-width:300px}
.demo-label{position:absolute;left:0;top:14px;background:#fff;border:1px solid var(--lijn);border-radius:10px;
  padding:10px 13px;box-shadow:var(--schaduw);font-size:.78rem;font-weight:600;color:var(--tekst);max-width:180px}
.demo-label span{display:block;font-weight:400;color:var(--tekst-licht);margin-top:2px}
@media(max-width:1000px){.hero__grid--demo{grid-template-columns:1fr}.demo-label{display:none}}

/* app-tegels met echte schermen */
.apps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px}
@media(max-width:900px){.apps-grid{grid-template-columns:1fr}}
.app-tegel{background:#fff;border:1px solid var(--lijn);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;
  transition:transform .3s,box-shadow .3s,border-color .3s}
.app-tegel:hover{transform:translateY(-4px);box-shadow:var(--schaduw);border-color:var(--terra-licht);text-decoration:none}
.app-tegel__beeld{aspect-ratio:16/10;overflow:hidden}
.app-tegel__beeld img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.app-tegel:hover .app-tegel__beeld img{transform:scale(1.04)}
.app-tegel__body{padding:20px;display:flex;flex-direction:column;gap:7px;flex:1}
.app-tegel h3{margin:0}
.app-tegel p{margin:0;font-size:.9rem}
.app-tegel__res{margin-top:auto;padding-top:10px;font-size:.84rem;color:var(--terra-diep);font-weight:600}

/* stappen */
.stappen{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px;counter-reset:s}
@media(max-width:900px){.stappen{grid-template-columns:1fr}}
.stap{position:relative;padding:22px 22px 22px 60px;background:#fff;border:1px solid var(--lijn);border-radius:12px}
.stap::before{counter-increment:s;content:"0" counter(s);position:absolute;left:20px;top:20px;
  font-family:var(--serif);font-size:1.2rem;color:var(--terra)}
.stap h3{margin:0 0 4px}
.stap p{margin:0;font-size:.9rem}
.vlak-donker .stap{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18)}
.vlak-donker .stap h3{color:#fff}.vlak-donker .stap p{color:#DCDAD3}
.vlak-donker .stap::before{color:var(--terra-licht)}

/* hero: jouw foto met de werkende app ervoor */
.hero__grid--demo{grid-template-columns:1.02fr .98fr}
.hero__media{position:relative;padding-bottom:10px}
.hero__media>img{border-radius:var(--r);box-shadow:var(--schaduw);width:100%;max-height:470px;object-fit:cover;object-position:center 20%}
.hero__tel{position:absolute;right:-6px;bottom:-26px;width:168px}
.hero__tel .rand{background:var(--grijs-diep);border-radius:24px;padding:7px;box-shadow:0 22px 40px -22px rgba(58,58,52,.75)}
.hero__tel .scherm{aspect-ratio:9/18;border-radius:18px}
.hero__tel .play{width:44px;height:44px}
.hero__tel .play svg{width:14px;height:14px}
.hero .demo-label{left:-14px;bottom:30px;top:auto}
@media(max-width:1000px){
  .hero__media{padding-bottom:0}
  .hero__tel{position:static;width:190px;margin:18px auto 0}
  .hero .demo-label{display:none}
}

/* twee demo's naast elkaar */
.proef{display:grid;grid-template-columns:1.45fr .55fr;gap:clamp(24px,3vw,44px);align-items:end;margin-top:26px}
@media(max-width:900px){.proef{grid-template-columns:1fr}}
.laptop__rand{background:var(--grijs-diep);border-radius:12px 12px 3px 3px;padding:10px 10px 12px;box-shadow:var(--schaduw)}
.laptop .scherm{aspect-ratio:16/10;border-radius:5px}
.laptop__voet{height:11px;width:112%;margin-left:-6%;background:linear-gradient(180deg,#8A8A80,#5C5C54);border-radius:0 0 11px 11px}
.laptop .play{width:62px;height:62px}

/* productkaarten zonder beeld */
.app-tegel--tekst .app-tegel__body{padding:26px}
.app-tegel--tekst .kaart__meta{margin-bottom:2px}
.app-tegel--tekst h3{font-size:clamp(1.1rem,1.4vw,1.28rem)}
.app-tegel--tekst .kaart__meer{margin-top:14px;padding-top:0}
.app-tegel__res{font-style:italic}
#nieuws .kaarten{margin-top:14px}
#nieuws .kaart{padding:20px}

.beeld--breed img{width:100%;height:auto;max-height:none;object-fit:contain}
.kop-na-beeld{margin-top:26px;max-width:64ch}
#kennismaken .beeld img{max-height:360px}
/* nieuwskaart: datum en titel direct onder elkaar */
#nieuws .kaart{gap:4px}
#nieuws .kaart h3{margin-top:2px;line-height:1.35}
#nieuws .kaart__meer{padding-top:8px}

/* heroportret krijgt contrast: terracotta vlak erachter, iets verschoven */
.hero__media{position:relative}
.hero__media::before{content:"";position:absolute;right:-14px;bottom:-14px;width:72%;height:72%;
  background:var(--terra);opacity:.22;border-radius:var(--r);z-index:0}
.hero__media img{position:relative;z-index:1}
@media(max-width:900px){.hero__media::before{right:-8px;bottom:-8px}}

/* ---------- meer variatie in achtergronden ---------- */
.vlak-zand{background:#EFE9E2}
.vlak-salie{background:#EDF0EA}
.vlak-roze{background:#F7EFEB}
.vlak-wit{background:#fff}
.vlak-salie .kicker,.vlak-roze .kicker,.vlak-zand .kicker{color:var(--terra-diep)}
.vlak-salie .kaart,.vlak-roze .kaart,.vlak-zand .kaart,.vlak-licht .kaart{background:#fff}
.vlak-salie .app-tegel,.vlak-roze .app-tegel,.vlak-zand .app-tegel{background:#fff}
/* subpagina-hero */
.paginakop{padding-block:clamp(34px,4vw,56px) clamp(24px,3vw,40px);background:#EFE9E2}
.paginakop h1{margin-bottom:.35em}
.paginakop p{max-width:58ch}
.prijs{font-weight:600;color:var(--tekst)}
.lijst{list-style:none;padding:0;margin:0 0 16px}
.lijst li{padding-left:22px;position:relative;margin-bottom:7px}
.lijst li::before{content:"";position:absolute;left:0;top:.72em;width:7px;height:7px;border-radius:50%;background:var(--terra)}

/* nooit meer koppen afsnijden: beelden houden hun eigen verhouding */
.beeld img{max-height:none;height:auto;object-fit:contain}
.hero__media img{max-height:none;height:auto;object-fit:contain}
.app-tegel__beeld{aspect-ratio:16/10}
.app-tegel__beeld img{object-fit:cover;object-position:center 30%}

/* ---------- keuzehulp: één vraag, één antwoord, één knop ---------- */
.kiezer{background:var(--grijs);color:#F2F1ED;padding-block:clamp(44px,5vw,78px)}
.kiezer h2,.kiezer h3{color:#fff}
.kiezer h2 em{color:var(--terra-licht)}
.kiezer p{color:#DCDAD3}
.kiezer .kicker{color:var(--terra-licht)}
.kiezer__knoppen{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:26px 0 0}
@media(max-width:860px){.kiezer__knoppen{grid-template-columns:1fr}}
.kiezer__knop{text-align:left;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.2);
  border-radius:12px;padding:18px 20px;cursor:pointer;color:#F2F1ED;font:inherit;transition:.25s}
.kiezer__knop b{display:block;font-family:var(--serif);font-size:1.05rem;color:#fff;margin-bottom:4px;font-weight:400}
.kiezer__knop span{font-size:.88rem;color:#CFCCC5}
.kiezer__knop:hover{background:rgba(255,255,255,.12);border-color:var(--terra-licht)}
.kiezer__knop[aria-pressed="true"]{background:var(--terra);border-color:var(--terra)}
.kiezer__knop[aria-pressed="true"] span{color:#F8F0EC}
.antwoord{margin-top:22px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);
  border-radius:14px;padding:clamp(20px,3vw,34px);display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(20px,3vw,40px);align-items:center}
@media(max-width:860px){.antwoord{grid-template-columns:1fr}}
.antwoord h3{font-size:clamp(1.25rem,2vw,1.7rem);margin-bottom:.4em}
.antwoord ul{list-style:none;padding:0;margin:0 0 18px}
.antwoord li{padding-left:22px;position:relative;margin-bottom:6px;color:#DCDAD3;font-size:.94rem}
.antwoord li::before{content:"";position:absolute;left:0;top:.7em;width:6px;height:6px;border-radius:50%;background:var(--terra-licht)}
.antwoord img{border-radius:12px;width:100%;height:auto}
.antwoord .btn--vol{background:var(--terra)}
.antwoord .btn--lijn{background:transparent;color:#fff;border-color:rgba(255,255,255,.35)}
/* vaste balk onderaan op mobiel */
.plakbalk{position:fixed;left:0;right:0;bottom:0;z-index:110;background:rgba(250,248,246,.97);
  border-top:1px solid var(--lijn);padding:10px 14px;display:none;gap:10px;align-items:center;justify-content:space-between;
  backdrop-filter:blur(8px)}
.plakbalk span{font-size:.82rem;color:var(--tekst)}
@media(max-width:860px){.plakbalk{display:flex}body{padding-bottom:64px}.bel{bottom:74px}}

.bewijs{background:rgba(255,255,255,.07);border-left:3px solid var(--terra-licht);border-radius:10px;padding:22px 24px}
.bewijs p{font-family:var(--serif);font-size:1.05rem;line-height:1.55;color:#fff;margin:0 0 10px}
.bewijs span{font-size:.82rem;color:#C9C5BE}

.antwoord[hidden]{display:none}
.antwoord{animation:opkomst .45s ease both}

/* 1. staande foto's helemaal in beeld, ook de schoenen */
.beeld img,.hero__media img{object-fit:contain;object-position:center top;max-height:none}
#maatwerk .beeld img{max-width:420px}
/* 2. stappen niet meer in smalle kolommen op mobiel */
@media(max-width:860px){
  .stappen{grid-template-columns:1fr !important}
  .kaarten{grid-template-columns:1fr !important}
  .apps-grid{grid-template-columns:1fr !important}
}
/* 4. quotes als swipebare rij */
.quoterail{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;margin-top:22px}
.quoterail .kaart{flex:0 0 min(320px,82vw);scroll-snap-align:start}

/* startbeeld in de toestellen, zodat er nooit een leeg grijs vlak staat */
.scherm{background:#EFE9E2}
.poster{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:18px;
  background:linear-gradient(140deg,#F3EDE8,#E6DED5)}
.poster img{width:120px;margin:0 auto 10px;opacity:.9}
.poster b{display:block;font-family:var(--serif);font-weight:400;color:var(--tekst);font-size:1.05rem}
.poster span{display:block;font-size:.84rem;color:var(--tekst-licht);margin-top:4px}
.start{background:linear-gradient(180deg,rgba(58,58,52,.05),rgba(58,58,52,.3))}

/* ---------- cookiemelding ---------- */
.cookie{position:fixed;left:14px;right:14px;bottom:14px;z-index:200;background:#fff;border:1px solid var(--lijn);
  border-radius:14px;box-shadow:var(--schaduw);padding:18px 20px;display:none;max-width:560px}
.cookie.aan{display:block}
.cookie h3{margin:0 0 6px;font-size:1.02rem}
.cookie p{margin:0 0 14px;font-size:.88rem}
.cookie .btnrij{margin-top:0}
.cookie a{text-decoration:underline}
@media(max-width:860px){.cookie{bottom:78px}}

/* ---------- afspraak inplannen ---------- */
.agenda{background:#fff;border:1px solid var(--lijn);border-radius:14px;overflow:hidden;min-height:620px}
.agenda iframe{width:100%;min-height:620px;border:0;display:block}
.agenda__uit{padding:26px;text-align:center}
.agenda__uit p{margin:0 auto 14px;max-width:46ch;font-size:.92rem}

/* ---------- merkenbalk groter, met regel erboven ---------- */
.balk{padding-block:26px}
.balk__kop{text-align:center;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--terra-diep);margin:0 0 14px;font-weight:600}
.balk img{max-width:900px}
@media(max-width:700px){.balk img{max-width:none}}

/* ---------- schuine randen, zoals in je voorbeeld ---------- */
.schuin-boven{clip-path:polygon(0 42px,100% 0,100% 100%,0 100%)}
.schuin-onder{clip-path:polygon(0 0,100% 0,100% calc(100% - 42px),0 100%)}
@media(max-width:700px){.schuin-boven{clip-path:polygon(0 24px,100% 0,100% 100%,0 100%)}
 .schuin-onder{clip-path:polygon(0 0,100% 0,100% calc(100% - 24px),0 100%)}}

/* ---------- grote cijfers als blikvanger ---------- */
.cijferkaart{background:#fff;border:1px solid var(--lijn);border-left:5px solid var(--terra);border-radius:12px;
  padding:24px 26px;max-width:420px}
.cijferkaart b{display:block;font-family:var(--serif);font-size:clamp(2.4rem,5vw,3.4rem);line-height:1;color:var(--terra-diep)}
.cijferkaart span{display:block;margin-top:8px;font-size:.95rem;color:var(--tekst-licht)}
.vlak-donker .cijferkaart{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2);border-left-color:var(--terra-licht)}
.vlak-donker .cijferkaart b{color:#fff}.vlak-donker .cijferkaart span{color:#DCDAD3}

/* ---------- meer kleur: salie als accent ---------- */
.vlak-salie{background:#E9EEE4}
.vlak-salie .kicker{color:#5F6B55}
.vlak-salie .streep{color:#7E8C72}
.accent-salie{color:#5F6B55}

/* ---------- speels invliegen ---------- */
@keyframes vliegLinks{from{opacity:0;transform:translateX(-34px)}to{opacity:1;transform:none}}
@keyframes vliegRechts{from{opacity:0;transform:translateX(34px)}to{opacity:1;transform:none}}
@keyframes vliegOp{from{opacity:0;transform:translateY(26px) scale(.98)}to{opacity:1;transform:none}}
.vlieg-l{animation:vliegLinks .7s cubic-bezier(.22,.9,.3,1) both}
.vlieg-r{animation:vliegRechts .7s cubic-bezier(.22,.9,.3,1) both}
.vlieg-o{animation:vliegOp .7s cubic-bezier(.22,.9,.3,1) both}
@media(prefers-reduced-motion:reduce){.vlieg-l,.vlieg-r,.vlieg-o{animation:none}}

/* ===== geen groen meer, warm zand ervoor in de plaats ===== */
.vlak-salie{background:#F2EBE4}
.vlak-salie .kicker{color:var(--terra-diep)}
.vlak-salie .streep{color:var(--terra)}

/* ===== fluorroze als klein accent, spaarzaam ===== */
:root{--fluor:#FF4FA3}
.kicker::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--fluor);
  margin-left:7px;vertical-align:.08em}
.btn--vol::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--fluor);
  opacity:0;transition:opacity .25s}
.btn--vol:hover::before{opacity:1}
.tab[aria-pressed="true"]{box-shadow:inset 0 -3px 0 var(--fluor)}
.kiezer__knop[aria-pressed="true"]{box-shadow:inset 0 -3px 0 var(--fluor)}
.play{box-shadow:0 0 0 0 rgba(255,79,163,.5);animation:klop 2.6s ease-out infinite}
@keyframes klop{0%{box-shadow:0 0 0 0 rgba(255,79,163,.45)}70%{box-shadow:0 0 0 16px rgba(255,79,163,0)}100%{box-shadow:0 0 0 0 rgba(255,79,163,0)}}
.cijferkaart{border-left-color:var(--fluor)}
.bel__knop{border-color:#fff;box-shadow:0 0 0 2px var(--fluor),0 12px 26px -12px rgba(69,59,55,.75)}
@media(prefers-reduced-motion:reduce){.play{animation:none}}

/* ===== streep: recht, forser, in fluorroze ===== */
.streep{height:10px;max-width:260px;color:var(--fluor);margin-bottom:16px}
.streep path{fill:currentColor;stroke:none}
.vlak-donker .streep,.kiezer .streep{color:var(--fluor)}
.kicker::after{background:var(--fluor)}

/* ===== strepen terug in terracotta ===== */
.streep{color:var(--terra)}
.vlak-donker .streep,.kiezer .streep{color:var(--terra-licht)}


/* ===== fluorroze alleen als klein detail op beweegbare onderdelen ===== */
.btn--vol::after{content:"";position:absolute;left:14px;right:14px;bottom:7px;height:2px;background:var(--fluor);
  transform:scaleX(0);transform-origin:left;transition:transform .3s;opacity:.9}
.btn--vol:hover::after{transform:scaleX(1)}
.btn--vol::before{display:none}
.kaart:hover{border-color:var(--fluor)}
.app-tegel:hover{border-color:var(--fluor)}
.railnav button:hover{border-color:var(--fluor);color:var(--fluor)}
.cijferkaart b::after{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--fluor);
  margin-left:8px;vertical-align:.55em}
.cijferkaart{border-left-color:var(--fluor)}
.plakbalk .btn--vol{box-shadow:0 0 0 2px rgba(255,79,163,.35)}

/* fluorbolletjes op plekken waar je ze ook echt ziet */
.antwoord li::before{background:var(--fluor)}
.kiezer__knop b::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;
  background:var(--fluor);margin-right:9px;vertical-align:.1em}
.app-tegel__res::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;
  background:var(--fluor);margin-right:8px;vertical-align:.08em}
.slot__lijst a::before{content:"";position:absolute;left:0;top:50%;width:4px;height:0;background:var(--fluor);
  transform:translateY(-50%);transition:height .25s}
.slot__lijst a{position:relative}
.slot__lijst a:hover::before{height:60%}
.toestel__onder::before,.balk__kop::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;
  background:var(--fluor);margin-right:8px;vertical-align:.05em}

/* het fluorstipje staat weer achter elk kopje, zoals in het begin */
.kicker::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--fluor);
  margin-left:7px;vertical-align:.08em}
/* en weg bij de plekken waar het te druk werd */
.toestel__onder::before,.balk__kop::before,.app-tegel__res::before{display:none}

/* geen roze stip in de keuzeblokken en geen roze ring om de contactknop */
.kiezer__knop b::before{display:none}
.bel__knop{box-shadow:0 12px 26px -12px rgba(69,59,55,.75);border-color:#fff}

/* ---------- eigen kennismakingsformulier ---------- */
.formulier{background:#fff;border:1px solid var(--lijn);border-radius:14px;padding:clamp(20px,3vw,30px)}
.velden{display:grid;gap:14px}
.velden label{display:block;font-size:.82rem;font-weight:600;color:var(--tekst)}
.velden input,.velden textarea{display:block;width:100%;margin-top:6px;padding:12px 14px;border:1px solid var(--lijn);
  border-radius:9px;font:inherit;font-size:.95rem;color:var(--tekst);background:#FBFAF8}
.velden input:focus,.velden textarea:focus{outline:none;border-color:var(--terra);box-shadow:0 0 0 3px rgba(255,79,163,.18)}
.velden textarea{resize:vertical}
.formulier .klein{font-size:.8rem;color:var(--tekst-licht);margin:10px 0 0}
.verborgen{position:absolute;left:-9999px}
.vlak-donker .formulier{background:#fff}
.vlak-donker .formulier .klein{color:var(--tekst-licht)}

/* uitklapbaar formulier */
.formulier{padding:0;overflow:hidden}
.formulier__knop{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;
  background:#fff;border:0;padding:20px 24px;font:inherit;font-weight:600;color:var(--tekst);cursor:pointer;text-align:left}
.formulier__knop i{font-style:normal;font-size:1.3rem;color:var(--terra);transition:transform .3s}
.formulier__knop[aria-expanded="true"] i{transform:rotate(45deg)}
.formulier__knop:hover{background:#FBFAF8}
.formulier__veld{padding:0 24px 24px}
.formulier__veld[hidden]{display:none}

/* alle knoppen terracotta */
.btn--lijn{background:transparent;color:var(--terra-diep);border:1.5px solid var(--terra)}
.btn--lijn:hover{background:rgba(182,146,134,.1);border-color:var(--terra-diep);color:var(--terra-diep)}
.vlak-donker .btn--lijn,.kiezer .btn--lijn,.paneel .btn--lijn{color:#F6F2EE;border-color:var(--terra-licht)}
.vlak-donker .btn--lijn:hover{background:rgba(255,255,255,.1);color:#fff;border-color:#fff}
.btn--wit{background:var(--terra);color:#fff;border:0}
.btn--wit:hover{background:var(--terra-diep)}
.tab[aria-pressed="false"]{color:var(--terra-diep);border-color:var(--terra-licht)}
.railnav button{color:var(--terra-diep);border-color:var(--terra-licht)}
/* startbeeld ook in de telefoon */
.toestel .poster b{font-size:.95rem}

/* 1 en 6. geen roze rand meer bij hover */
.kaart:hover{border-color:var(--terra-licht)}
.app-tegel:hover{border-color:var(--terra-licht)}
.vlak-donker .kaart:hover{border-color:rgba(255,255,255,.4)}
.railnav button:hover{border-color:var(--terra);color:var(--terra-diep)}

/* 2. beelden nooit afsnijden, ook niet in de hoogte */
.beeld img,.hero__media img,.beeld--breed img{max-height:none !important;height:auto !important;object-fit:contain !important}

/* 8. alle knoppen terracotta gevuld */
.btn--lijn,.btn--wit{background:var(--terra);color:#fff;border:1px solid var(--terra)}
.btn--lijn:hover,.btn--wit:hover{background:var(--terra-diep);border-color:var(--terra-diep);color:#fff}
.vlak-donker .btn--lijn,.kiezer .btn--lijn{background:var(--terra);color:#fff;border-color:var(--terra)}
.vlak-donker .btn--lijn:hover,.kiezer .btn--lijn:hover{background:var(--terra-diep);border-color:var(--terra-diep)}

/* opsommingen in terracotta, ook in het antwoord van de keuzehulp */
.antwoord li::before{background:var(--terra-licht)}

/* beelden nooit breder dan nodig */
.beeld img{max-width:560px;margin-inline:auto}
.split .beeld img{max-width:100%}
.beeld--breed img{max-width:900px;margin-inline:auto}
.hero__media img{max-width:620px;margin-inline:auto}
/* hint dat je in het scherm kunt klikken */
.klikhint{display:inline-flex;align-items:center;gap:7px;background:var(--terra);color:#fff;border-radius:999px;
  padding:.35em .8em;font-size:.76rem;font-weight:600;margin-top:10px}
.klikhint::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--fluor)}
.poster span{display:block;font-size:.8rem;color:var(--tekst-licht);margin-top:4px}
.poster em{display:block;font-style:normal;font-size:.74rem;color:var(--terra-diep);margin-top:8px;font-weight:600}

/* pagina mag niet meer vanzelf meespringen met de demo */
html,body{overflow-anchor:none}
.scherm,.scherm iframe{overflow-anchor:none}

/* ===== tekst mag de volle breedte gebruiken ===== */
p,.lead{max-width:none}
.wrap>div>p,.wrap>p{max-width:76ch}
.split p{max-width:none}
/* ===== beelden rustiger ===== */
.beeld img{max-width:440px}
.split .beeld img{max-width:420px}
.hero__media img{max-width:520px}
.beeld--breed img{max-width:760px}
/* ===== toestellen netjes naast elkaar ===== */
.proef{align-items:end}
.laptop{max-width:640px;margin-inline:auto}
.toestel{max-width:250px}
.toestel__onder{min-height:2.4em}
/* ===== demo-beeld in de laptop ===== */
.laptop .scherm img.schermvul{width:100%;height:100%;object-fit:cover;object-position:top}
/* ===== formulier als vast blok, niet als uitklapper ===== */
.formulier__knop{background:var(--terra);color:#fff;border-radius:10px}
.formulier__knop i{color:#fff}
.formulier__knop:hover{background:var(--terra-diep)}

.poster--beeld{padding:0;background:#fff}
.formulier__kop{margin:0;padding:18px 24px 0;font-weight:600;color:var(--tekst)}

/* kleiner portret naast de tekst */
.beeld--klein img{max-width:330px}
/* tijdens de demo kun je gewoon verder scrollen */
.scherm.aan{touch-action:pan-y}
.scherm iframe{pointer-events:none}
.scherm.aan iframe{pointer-events:auto}
.toestel,.laptop{touch-action:pan-y}

/* ===== gaver: cijfers, diepte, welkom, verslag ===== */
.cijfers{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:980px;margin:22px auto 6px;text-align:center}
.cijfers b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(2rem,3.4vw,2.8rem);line-height:1.1;color:var(--terra-diep);font-variant-numeric:tabular-nums}
.cijfers span{display:block;font-size:.8rem;line-height:1.45;margin-top:6px;max-width:22ch;margin-inline:auto}
@media(max-width:700px){.cijfers{grid-template-columns:repeat(2,1fr)}}

.diepte{will-change:transform}

.welkom{position:absolute;left:-18px;bottom:34px;z-index:3;display:flex;align-items:center;gap:12px;
  background:#fff;border:0;border-radius:999px;padding:8px 20px 8px 8px;box-shadow:var(--schaduw);cursor:pointer;
  font-family:var(--sans);text-align:left;color:var(--tekst);transition:transform .25s}
.welkom:hover{transform:translateY(-2px)}
.welkom[hidden]{display:none}
.welkom__play{width:44px;height:44px;border-radius:50%;background:var(--terra);display:grid;place-items:center;flex:none;
  box-shadow:0 0 0 0 rgba(182,146,134,.5);animation:welkomPuls 2.4s infinite}
.welkom__play svg{width:18px;fill:#fff;margin-left:2px}
.welkom b{display:block;font-size:.9rem}.welkom small{display:block;font-size:.74rem;color:var(--tekst-licht)}
@keyframes welkomPuls{70%{box-shadow:0 0 0 14px rgba(182,146,134,0)}100%{box-shadow:0 0 0 0 rgba(182,146,134,0)}}
@media(max-width:900px){.welkom{left:12px;bottom:12px}}
.videolaag{position:fixed;inset:0;z-index:200;background:rgba(40,40,36,.82);display:grid;place-items:center;padding:20px}
.videolaag__in{position:relative;width:min(900px,100%);aspect-ratio:16/9;background:#000;border-radius:var(--r);overflow:hidden}
.videolaag__in iframe,.videolaag__in video{width:100%;height:100%;border:0;display:block}
.videolaag__dicht{position:absolute;top:-44px;right:0;background:none;border:0;color:#fff;font-size:2rem;cursor:pointer;line-height:1}

.verslag{background:#fff;border-radius:var(--r);box-shadow:var(--schaduw);padding:22px;max-width:460px;margin-inline:auto;width:100%}
.verslag__kop{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--lijn)}
.verslag__logo{width:36px;height:36px;border-radius:50%;background:#3A3A34;color:#fff;display:grid;place-items:center;font-family:var(--serif);flex:none}
.verslag__kop b{display:block;font-size:.9rem;color:var(--tekst)}.verslag__kop small{font-size:.74rem}
.verslag__kop em{margin-left:auto;font-style:normal;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;background:var(--kaart);padding:4px 9px;border-radius:999px}
.verslag__prio{display:flex;align-items:center;gap:8px;margin:14px 0 6px;font-size:.8rem;font-weight:600;color:var(--terra-diep)}
.verslag__prio span{width:9px;height:9px;border-radius:50%;background:#E0607E;box-shadow:0 0 0 4px rgba(224,96,126,.15)}
.verslag ul{list-style:none;margin:0;padding:0}
.verslag li{padding:12px 0 12px 14px;border-left:3px solid var(--terra-licht);margin-top:10px;font-size:.84rem;line-height:1.5;
  opacity:0;transform:translateY(12px);transition:opacity .6s,transform .6s,border-color .6s}
.verslag li.aan{opacity:1;transform:none;border-color:var(--terra)}
.verslag li small{display:block;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--terra-diep)}
.verslag li b{display:block;color:var(--tekst);font-size:.9rem}
@media(prefers-reduced-motion:reduce){.verslag li{opacity:1;transform:none}.welkom__play{animation:none}}
.hero__media::before{transform:translate3d(0,var(--blok,0px),0)}

/* ===== ronde 3: beeld links, woordenwolk, gesprekskaart ===== */
.hero__grid--links{grid-template-columns:.95fr 1.05fr}
.hero__grid--links .hero__media{order:-1}
.hero__grid--links .hero__media::before{right:auto;left:-14px}
.split--links .beeld{order:-1}
@media(max-width:900px){.hero__grid--links{grid-template-columns:1fr}}
p strong{color:var(--tekst);font-weight:600}
.vlak-donker p strong{color:#fff}
p em{font-family:var(--serif);font-style:italic;color:var(--terra-diep);font-size:1.03em}
.vlak-donker p em{color:var(--terra-licht)}

.woorden{position:relative;min-height:320px;background:#fff;border:1px solid var(--lijn);border-radius:var(--r);box-shadow:var(--schaduw);overflow:hidden}
.woorden span{position:absolute;left:var(--x);top:calc(var(--y) + 4%);font-family:var(--serif);font-size:1.1rem;color:#B9B2AA;
  white-space:nowrap;opacity:.75}
.woorden b{position:absolute;left:50%;bottom:6%;transform:translateX(-50%) rotate(-3deg);font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:clamp(1.6rem,2.6vw,2.2rem);color:var(--terra-diep);white-space:nowrap}
.woorden b::after{content:"";position:absolute;left:-4%;right:-4%;bottom:-6px;height:8px;background:var(--terra-licht);border-radius:8px;z-index:-1;opacity:.7}

.gesprek{background:#fff;border-radius:var(--r);box-shadow:var(--schaduw);padding:22px;max-width:460px;width:100%;margin-inline:auto;position:relative}
.gesprek__jij{background:#3A3A34;color:#fff;border-radius:14px 14px 4px 14px;padding:10px 14px;font-size:.86rem;margin-left:16%;line-height:1.5}
.gesprek__ai{display:flex;gap:10px;margin-top:16px}
.gesprek__av{width:30px;height:30px;border-radius:50%;background:var(--terra);color:#fff;display:grid;place-items:center;font-family:var(--serif);flex:none;font-size:.85rem}
.gesprek__ai>div{background:var(--creme);border:1px solid var(--lijn);border-radius:4px 14px 14px 14px;padding:12px 14px;font-size:.84rem;line-height:1.55}
.gesprek__ai b{color:var(--tekst)}.gesprek__ai p{margin:4px 0 8px}.gesprek__ai small{color:var(--terra-diep);font-weight:600}
.gesprek__label{position:absolute;top:-12px;right:18px;font-style:normal;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;background:var(--terra);color:#fff;padding:4px 10px;border-radius:999px}

/* ===================== NIEUWE STIJL (okt 2026) ===================== */
html,body{overflow-x:clip}
:root{--rand:max(var(--gut),calc((100vw / var(--z,1) - var(--wrap)) / 2 + var(--gut)))}
/* grotere koppen */
h1{font-size:clamp(2.5rem,5vw,4.6rem);line-height:1.06;letter-spacing:-.015em}
h2{font-size:clamp(1.9rem,3.4vw,3.1rem);line-height:1.12;letter-spacing:-.01em}
.lead{font-size:clamp(1.05rem,1.25vw,1.2rem)}
.kicker{letter-spacing:.3em}
/* ronde knoppen met pijl */
.btn{border-radius:999px;padding:1.1em 1.7em;font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;gap:.8em;position:relative}
.btn--vol{background:var(--grijs-diep);color:#fff;border-color:var(--grijs-diep)}
.btn--vol:hover{background:#2E2E29;border-color:#2E2E29}
.btn--vol::before{display:none}
.btn--vol::after{content:"\2192";position:static;display:inline;background:none;height:auto;width:auto;transform:none;font-size:1rem;letter-spacing:0;line-height:1}
.btn--lijn{border-radius:999px;background:transparent;color:var(--tekst);border:1.5px solid var(--tekst)}
.btn--lijn:hover{background:var(--tekst);color:#fff}
.vlak-donker .btn--vol,.kiezer .btn--vol,.antwoord .btn--vol{background:#fff;color:var(--tekst);border-color:#fff}
.vlak-donker .btn--lijn,.antwoord .btn--lijn{color:#fff;border-color:rgba(255,255,255,.6)}
.nav .btn--vol{padding:.95em 1.4em;font-size:.68rem}
.nav .btn--vol::after{content:none}

/* hero: foto tot de rand */
.hero{padding:0;background:#EFE8E1}
.hero .hero__grid{max-width:none;padding:0;gap:0;grid-template-columns:1fr 1fr;align-items:stretch;min-height:min(calc(100vh / var(--z,1) - 72px),860px)}
.hero .hero__grid>div:first-child{padding:clamp(48px,7vw,110px) clamp(28px,4vw,72px) clamp(48px,7vw,110px) var(--rand);align-self:center}
.hero .hero__grid--links>div:first-child{padding-left:clamp(28px,4vw,72px);padding-right:var(--rand)}
.hero .hero__media{padding:0;overflow:hidden;min-height:420px}
.hero .hero__media::before{display:none}
.hero .hero__media>img{position:absolute;inset:0;width:100%;height:100% !important;max-height:none !important;max-width:none;
  object-fit:cover !important;border-radius:0;box-shadow:none;object-position:center 22%}
.hero p{max-width:40ch}
.welkom{left:24px;bottom:24px}
@media(max-width:900px){
  .hero .hero__grid{grid-template-columns:1fr;min-height:0}
  .hero .hero__media{order:-1;height:62vh;min-height:360px}
  .hero .hero__grid>div:first-child,.hero .hero__grid--links>div:first-child{padding:40px var(--gut) 56px}
}

/* secties met foto tot de rand */
.bleed{padding-block:0 !important}
.bleed>.wrap.split{max-width:none;padding:0;gap:0;grid-template-columns:1fr 1fr;align-items:stretch}
.bleed>.wrap.split>div:not(.beeld){padding:clamp(64px,8vw,120px) clamp(28px,4vw,72px);align-self:center}
.bleed>.wrap.split>div:not(.beeld):first-child{padding-left:var(--rand)}
.bleed>.wrap.split>div:not(.beeld):last-child{padding-right:var(--rand)}
.bleed .beeld{position:relative;overflow:hidden;min-height:560px}
.bleed .beeld img{position:absolute;inset:0;width:100% !important;height:100% !important;max-width:none !important;max-height:none !important;
  object-fit:cover !important;object-position:center 25%;border-radius:0 !important;box-shadow:none !important;margin:0 !important}
@media(max-width:900px){
  .bleed>.wrap.split{grid-template-columns:1fr}
  .bleed .beeld{order:-1;min-height:380px}
  .bleed>.wrap.split>div:not(.beeld),.bleed>.wrap.split>div:not(.beeld):first-child,.bleed>.wrap.split>div:not(.beeld):last-child{padding:48px var(--gut) 60px}
}

/* grote uitspraak in het midden */
.uitspraak{text-align:center;padding-block:clamp(80px,10vw,150px)}
.uitspraak .kop-na-beeld{max-width:820px;margin-inline:auto}
.uitspraak h2{font-size:clamp(2.4rem,5.4vw,4.8rem);line-height:1.06}
.uitspraak p{margin-inline:auto;font-size:1.08rem}
.uitspraak .streep{margin-inline:auto}
.uitspraak .btnrij{justify-content:center}

/* laptop mag niet buiten beeld steken op mobiel */
@media(max-width:700px){.laptop__voet{width:100%;margin-left:0}}
.nav a.btn--vol,.nav a.btn--vol:hover{color:#fff}

/* ===================== HOME IN DE STIJL VAN DE VOORPROEF ===================== */
.vp-label{display:block;font:600 .7rem/1.5 var(--sans);letter-spacing:.32em;text-transform:uppercase;color:var(--terra-diep);margin-bottom:22px}
.vp-label::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#E0607E;margin-left:10px;vertical-align:middle}
[class^="vp-"] h1,[class^="vp-"] h2,[class^="vp-"] h3{font-family:var(--serif);font-weight:400;color:var(--tekst);margin:0;letter-spacing:-.015em}
[class^="vp-"] p{max-width:none}
.vp-knop{display:inline-flex;align-items:center;gap:12px;background:var(--grijs-diep);color:#fff;text-decoration:none;font:600 .72rem/1 var(--sans);
  letter-spacing:.2em;text-transform:uppercase;padding:16px 22px;border-radius:999px;margin-top:30px;transition:background .2s,transform .2s}
.vp-knop::after{content:"\2192";font-size:1rem;letter-spacing:0}
.vp-knop:hover{background:#2E2E29;text-decoration:none;transform:translateY(-1px)}
.vp-knop--licht{background:#fff;color:var(--tekst)}.vp-knop--licht:hover{background:var(--kaart)}
.vp-knop--lijn{background:transparent;color:var(--tekst);border:1.5px solid var(--tekst)}.vp-knop--lijn:hover{background:var(--tekst);color:#fff}
.vp-knoppen{display:flex;flex-wrap:wrap;gap:12px}

/* 1 hero */
.vp-hero{display:grid;grid-template-columns:1fr 1fr;min-height:min(calc(100vh - 72px),900px);background:#EFE8E1}
.vp-hero__tekst{padding:clamp(60px,8vw,120px) clamp(28px,4vw,64px) clamp(60px,8vw,120px) var(--rand);display:flex;flex-direction:column;justify-content:center}
.vp-hero h1{font-size:clamp(3rem,5.6vw,5.4rem);line-height:1.04}
.vp-hero h1 em{display:block}
.vp-hero p{font-size:1.12rem;max-width:34ch;margin:30px 0 0;color:var(--tekst)}
.vp-hero__foto{position:relative;overflow:hidden;min-height:420px}
.vp-hero__foto>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%;filter:saturate(.9)}

/* 2 grote uitspraak */
.vp-uitspraak{padding:clamp(90px,11vw,150px) var(--gut);text-align:center}
.vp-uitspraak h2{font-size:clamp(2.6rem,6.4vw,6rem);line-height:1.05;max-width:16ch;margin:0 auto}
.vp-uitspraak h2 em{color:var(--terra)}
.vp-uitspraak p{max-width:58ch;margin:28px auto 0;font-size:1.08rem}
.vp-uitspraak p+p{margin-top:12px}

/* 3 foto tegen de rand */
.vp-split{display:grid;grid-template-columns:.9fr 1.1fr;background:#fff}
.vp-split__foto{position:relative;overflow:hidden;min-height:640px}
.vp-split__foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%}
.vp-split__tekst{padding:clamp(70px,9vw,120px) var(--rand) clamp(70px,9vw,120px) clamp(28px,5vw,80px);align-self:center}
.vp-split__tekst h2{font-size:clamp(2.2rem,3.8vw,3.4rem);line-height:1.12;max-width:15ch}
.vp-split__tekst p{max-width:46ch;margin:24px 0 0}
.vp-split__tekst blockquote{margin:34px 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(1.4rem,2.2vw,1.9rem);line-height:1.35;color:var(--terra);max-width:22ch}

/* 4 donkere band */
.vp-band{position:relative;padding:clamp(100px,12vw,160px) var(--gut);text-align:center;color:#E9E4DD;overflow:hidden;background:#3F3E39}
.vp-band::before{content:"";position:absolute;inset:0;background:url(../images/f-deur.jpg) center 30%/cover;opacity:.18;filter:grayscale(1)}
.vp-band>*{position:relative}
.vp-band .vp-label{color:var(--terra-licht)}
.vp-band h2{color:#fff;font-size:clamp(2.6rem,5.6vw,5.4rem);line-height:1.04;max-width:18ch;margin:0 auto}
.vp-band h2 em{color:var(--terra-licht)}
.vp-band>p{max-width:60ch;margin:30px auto 0;font-size:1rem;color:#E9E4DD}
.vp-band__drie{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;max-width:1000px;margin:52px auto 0}
.vp-band__drie b{display:block;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.4rem,2.2vw,1.8rem);color:var(--terra-licht);margin-bottom:10px}
.vp-band__drie span{display:block;font-size:.9rem;line-height:1.6;color:#D9D4CC}

/* 5 grote cijfers */
.vp-cijfers{padding:clamp(90px,10vw,140px) var(--gut);max-width:1100px;margin:0 auto;text-align:center}
.vp-merken{max-width:720px;width:100%;margin:0 auto 60px;opacity:.9}
.vp-rij{display:grid;grid-template-columns:220px 1fr;align-items:center;gap:34px;padding:26px 0;border-top:1px solid var(--lijn);text-align:left}
.vp-rij:last-child{border-bottom:1px solid var(--lijn)}
.vp-rij b{font-family:var(--serif);font-weight:400;font-size:clamp(4rem,7vw,6.5rem);line-height:1;color:var(--terra);text-align:right;font-variant-numeric:tabular-nums}
.vp-rij span{font:500 .82rem/1.7 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--tekst)}

/* 6 kaarten met foto */
.vp-werk{background:#3F3E39;padding:clamp(90px,10vw,130px) var(--gut);text-align:center}
.vp-werk .vp-label{color:var(--terra-licht)}
.vp-werk h2{color:#fff;font-size:clamp(2.4rem,4.6vw,4.2rem);line-height:1.08}
.vp-werk h2 em{color:var(--terra-licht)}
.vp-werk__kaarten{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;max-width:1180px;margin:60px auto 0;text-align:left}
.vp-werk__kaart{color:#D9D4CC;text-decoration:none}
.vp-werk__kaart:hover{text-decoration:none}
.vp-werk__kaart>div{overflow:hidden}
.vp-werk__kaart img{aspect-ratio:4/5;object-fit:cover;width:100%;filter:saturate(.9);transition:transform .6s}
.vp-werk__kaart:hover img{transform:scale(1.04)}
.vp-werk__kaart h3{color:#fff;font-size:1.35rem;line-height:1.3;margin:22px 0 8px}
.vp-werk__kaart p{margin:0;font-size:.92rem;color:#D9D4CC}
.vp-werk__kaart span{display:inline-block;margin-top:14px;font:600 .7rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--terra-licht)}

/* 7 klantverhaal */
.vp-verhaal{display:grid;grid-template-columns:1.1fr .9fr;background:#EFE8E1}
.vp-verhaal__tekst{padding:clamp(70px,9vw,120px) clamp(28px,5vw,80px) clamp(70px,9vw,120px) var(--rand);align-self:center}
.vp-verhaal__tekst h2{font-size:clamp(2rem,3.4vw,3rem);line-height:1.15}
.vp-verhaal__tekst blockquote{margin:30px 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1.4;color:var(--terra-diep)}
.vp-verhaal__tekst cite{display:block;margin-top:22px;font:600 .72rem/1.6 var(--sans);letter-spacing:.2em;text-transform:uppercase;font-style:normal;color:var(--tekst)}
.vp-verhaal__foto{position:relative;overflow:hidden;min-height:600px}
.vp-verhaal__foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vp-reviews{background:#EFE8E1;padding:0 0 clamp(60px,7vw,100px)}

/* 8 zelf bekijken */
.vp-instap{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,5vw,70px);align-items:center;padding:clamp(90px,10vw,130px) var(--gut);max-width:1240px;margin:0 auto}
.vp-instap__beeld{background:#EFE8E1;border-radius:6px;padding:clamp(28px,4vw,50px);display:grid;place-items:center}
.vp-instap__beeld .verslag{transform:rotate(-2deg)}
.vp-instap h2{font-size:clamp(2.2rem,4vw,3.4rem);line-height:1.1}
.vp-instap h2 em{display:block}
.vp-instap p{max-width:48ch;margin:20px 0 0}

/* 10 kennismaken */
.vp-slot{position:relative;padding:clamp(110px,13vw,170px) var(--gut);text-align:center;overflow:hidden}
.vp-slot::before{content:"";position:absolute;inset:0;background:url(../images/koffie.jpg) center/cover;opacity:.16}
.vp-slot>*{position:relative}
.vp-slot h2{font-size:clamp(2.8rem,5.6vw,5rem);line-height:1.05}
.vp-slot>p{max-width:50ch;margin:26px auto 0;font-size:1.05rem;color:var(--tekst)}
.vp-slot__contact{max-width:560px;margin:36px auto 0;text-align:left}
.vp-slot .slot__lijst a{background:#fff;border-color:var(--lijn);color:var(--tekst)}
.vp-slot .slot__lijst a small{color:var(--tekst-licht)}
.vp-slot .slot__lijst a:hover{background:var(--grijs-diep);border-color:var(--grijs-diep);color:#fff}
.vp-slot .slot__lijst a:hover small{color:#DCDAD3}
.vp-slot .slot__lijst,.vp-slot .formulier{max-width:none !important}

@media(max-width:900px){
  .vp-hero,.vp-split,.vp-verhaal,.vp-instap{grid-template-columns:1fr}
  .vp-hero__foto{order:-1;height:62vh;min-height:360px}
  .vp-hero__tekst{padding:44px var(--gut) 64px}
  .vp-split__foto,.vp-verhaal__foto{min-height:420px}
  .vp-split__tekst,.vp-verhaal__tekst{padding:56px var(--gut) 64px}
  .vp-verhaal__foto{order:-1}
  .vp-band__drie,.vp-werk__kaarten{grid-template-columns:1fr}
  .vp-rij{grid-template-columns:100px 1fr;gap:20px}
  .vp-instap__beeld{order:2}
}

/* kies je vraag: antwoord in de kaart */
.vp-werk__kaart{display:flex;flex-direction:column}
.vp-werk__beeld{position:relative;overflow:hidden;aspect-ratio:4/5;cursor:pointer}
.vp-werk__beeld>img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;transition:transform .6s,filter .4s}
.vp-werk__kaart:hover .vp-werk__beeld>img{transform:scale(1.04)}
.vp-werk__antwoord{position:absolute;inset:0;background:rgba(46,46,41,.94);color:#E9E4DD;padding:26px 24px 22px;overflow-y:auto;cursor:default;
  opacity:0;visibility:hidden;transform:translateY(16px);transition:opacity .35s,transform .35s,visibility .35s}
.vp-werk__kaart.open .vp-werk__antwoord{opacity:1;visibility:visible;transform:none}
.vp-werk__kaart.open .vp-werk__beeld>img{filter:blur(2px)}
.vp-werk__antwoord h4{font-family:var(--serif);font-weight:400;font-size:1.35rem;color:#fff;margin:0 30px 10px 0;line-height:1.25}
.vp-werk__antwoord p{font-size:.88rem;line-height:1.6;margin:0 0 12px;color:#E9E4DD}
.vp-werk__antwoord ul{list-style:none;margin:0 0 16px;padding:0}
.vp-werk__antwoord li{position:relative;padding-left:18px;font-size:.86rem;line-height:1.5;margin-bottom:6px}
.vp-werk__antwoord li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--terra-licht)}
.vp-werk__knoppen{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.vp-werk__knoppen .vp-knop{margin-top:0;padding:13px 18px;font-size:.66rem}
.vp-werk__tweede{color:var(--terra-licht);font:600 .66rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;text-decoration:none}
.vp-werk__dicht{position:absolute;top:12px;right:14px;background:none;border:0;color:#fff;font-size:1.6rem;line-height:1;cursor:pointer}
.vp-werk__klik{background:none;border:0;padding:0;text-align:left;cursor:pointer;font:inherit;color:inherit}
.vp-werk__klik h3{color:#fff;font-family:var(--serif);font-weight:400;font-size:1.35rem;line-height:1.3;margin:22px 0 8px}
.vp-werk__klik p{margin:0;font-size:.92rem;color:#D9D4CC}
.vp-werk__klik span{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font:600 .7rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--terra-licht)}
.vp-werk__klik i{font-style:normal;font-size:1rem;transition:transform .3s}
.vp-werk__kaart.open .vp-werk__klik i{transform:rotate(45deg)}
@media(max-width:900px){.vp-werk__beeld{aspect-ratio:auto;min-height:440px}}

/* ===================== BOUWSTENEN VOOR ALLE PAGINA'S ===================== */
.vp-hero--links .vp-hero__foto{order:-1}
.vp-hero--links .vp-hero__tekst{padding-left:clamp(28px,4vw,72px);padding-right:var(--rand)}
.vp-hero__tekst .vp-knoppen .vp-knop{margin-top:30px}
.vp-hero p+p{margin-top:14px;font-size:1rem;color:var(--tekst-licht)}
.vp-hero--lang h1{font-size:clamp(2.8rem,4.6vw,4.6rem)}

/* foto rechts */
.vp-split--rechts{grid-template-columns:1.1fr .9fr}
.vp-split--rechts .vp-split__foto{order:2}
.vp-split--rechts .vp-split__tekst{padding:clamp(70px,9vw,120px) clamp(28px,5vw,80px) clamp(70px,9vw,120px) var(--rand)}
.vp-split--zand{background:#EFE8E1}
.vp-lijst{list-style:none;margin:24px 0 0;padding:0;max-width:48ch}
.vp-lijst li{position:relative;padding:12px 0 12px 26px;border-bottom:1px solid var(--lijn);line-height:1.55}
.vp-lijst li:first-child{border-top:1px solid var(--lijn)}
.vp-lijst li::before{content:"";position:absolute;left:2px;top:1.25em;width:7px;height:7px;border-radius:50%;background:var(--terra)}
.vp-klein{font-size:.88rem;margin-top:12px !important}

/* sectie met kop in het midden */
.vp-sectie{padding:clamp(90px,10vw,140px) var(--gut);text-align:center}
.vp-sectie--zand{background:#EFE8E1}
.vp-sectie h2{font-size:clamp(2.4rem,4.6vw,4.2rem);line-height:1.08;max-width:18ch;margin:0 auto}
.vp-sectie>p{max-width:58ch;margin:24px auto 0}
.vp-binnen{max-width:1180px;margin:56px auto 0;text-align:left}

/* genummerde rijen met titel */
.vp-rijen{max-width:1000px;margin:56px auto 0;text-align:left}
.vp-rij h3{font-size:clamp(1.4rem,2.2vw,1.9rem);margin:0 0 6px;font-family:var(--serif);font-weight:400;color:var(--tekst)}
.vp-rij p{margin:0;max-width:56ch}
.vp-rijen .vp-rij b{font-style:italic}

/* donkere band met foto erachter, als echte afbeelding */
.vp-band__bg{position:absolute !important;inset:0;width:100%;height:100%;object-fit:cover;opacity:.17;filter:grayscale(1)}
.vp-band:has(.vp-band__bg)::before{display:none}
.vp-band__drie ul{list-style:none;margin:6px 0 0;padding:0;text-align:left}
.vp-band__drie li{position:relative;padding:7px 0 7px 18px;font-size:.9rem;line-height:1.5;color:#D9D4CC;border-top:1px solid rgba(255,255,255,.12)}
.vp-band__drie li::before{content:"";position:absolute;left:0;top:1em;width:6px;height:6px;border-radius:50%;background:var(--terra-licht)}
.vp-band>p+p{margin-top:14px}

/* lichte drie kolommen */
.vp-drie{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,44px)}
.vp-drie>div{border-top:2px solid var(--terra);padding-top:22px}
.vp-drie h3{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.4rem,2vw,1.75rem);color:var(--terra-diep);margin:0 0 12px;line-height:1.25}
.vp-drie p{font-size:.92rem}
.vp-drie a{color:var(--terra-diep);font:600 .7rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;display:inline-block;margin-top:14px}
.vp-drie .vp-lijst{margin-top:0}
.vp-drie .vp-lijst li{font-size:.9rem;padding-block:9px}

/* stappen met grote cijfers */
.vp-stappen{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(22px,3vw,40px)}
.vp-stappen--3{grid-template-columns:repeat(3,1fr)}
.vp-stap b{display:block;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(3.4rem,5vw,4.6rem);line-height:1;color:var(--terra)}
.vp-stap h3{font-family:var(--serif);font-weight:400;font-size:1.3rem;color:var(--tekst);margin:16px 0 8px;line-height:1.3}
.vp-stap p{font-size:.92rem;margin:0}

/* demo */
.vp-demo{background:#EFE8E1;padding:clamp(90px,10vw,140px) var(--gut);text-align:center}
.vp-demo h2{font-size:clamp(2.4rem,4.6vw,4.2rem);line-height:1.08}
.vp-demo>p{max-width:52ch;margin:22px auto 0}
.vp-demo .laptop{margin:46px auto 0 !important;text-align:left}
.vp-demo .klikhint{margin-inline:auto}

/* vragen */
.vp-faq{max-width:900px;margin:52px auto 0;text-align:left}
.vp-faq div{padding:28px 0;border-top:1px solid var(--lijn)}
.vp-faq div:last-child{border-bottom:1px solid var(--lijn)}
.vp-faq h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.3rem,2vw,1.7rem);color:var(--tekst);margin:0 0 8px}
.vp-faq p{margin:0}

/* beeld in een zandvlak, aan de rechterkant */
.vp-instap--om .vp-instap__beeld{order:2}
.vp-instap__beeld .gesprek,.vp-instap__beeld .woorden{width:100%;max-width:460px;margin:0}
.vp-instap .vp-lijst{margin-top:20px}

/* quotes onder een klantverhaal */
.vp-quotes{background:#EFE8E1;padding:0 var(--gut) clamp(60px,7vw,100px)}
.vp-quotes .quoterail{max-width:1180px;margin:0 auto}

/* kennismaken op subpagina's */
.vp-slot .slot__lijst{display:grid;gap:10px}
.vp-slot__bg{position:absolute !important;inset:0;width:100%;height:100%;object-fit:cover;opacity:.16}
.vp-slot:has(.vp-slot__bg)::before{display:none}

@media(max-width:900px){
  .vp-hero--links .vp-hero__tekst{padding:44px var(--gut) 64px}
  .vp-split--rechts .vp-split__foto{order:-1}
  .vp-split--rechts .vp-split__tekst{padding:56px var(--gut) 64px}
  .vp-drie,.vp-stappen,.vp-stappen--3{grid-template-columns:1fr}
  .vp-instap--om .vp-instap__beeld{order:2}
}
.vp-hero--lang p{max-width:48ch}
.vp-hero__tekst .vp-knoppen{gap:12px}
@media(max-width:600px){
  .vp-hero h1,.vp-hero--lang h1{font-size:2.35rem;line-height:1.08}
  .vp-uitspraak h2,.vp-band h2,.vp-slot h2{font-size:2.1rem}
  .vp-sectie h2,.vp-demo h2,.vp-werk h2{font-size:2rem}
  .woorden span{font-size:.92rem}
  .woorden{min-height:280px}
}

/* ===================== MARGES: ALLES IN ÉÉN MIDDENKOLOM ===================== */
:root{--kader:1180px;--zij:max(var(--gut),calc((100% - var(--kader)) / 2))}
.vp-hero,.vp-split,.vp-verhaal{min-height:0;gap:clamp(36px,5vw,80px);align-items:center;
  padding:clamp(56px,7vw,100px) var(--zij)}
.vp-hero__tekst,.vp-hero--links .vp-hero__tekst,.vp-split__tekst,.vp-split--rechts .vp-split__tekst,.vp-verhaal__tekst{padding:0}
.vp-hero__foto,.vp-split__foto,.vp-verhaal__foto{min-height:0;aspect-ratio:4/5;max-height:640px;width:100%}
.vp-hero__foto>img,.vp-split__foto img,.vp-verhaal__foto img{object-position:center 18%}
.vp-hero{grid-template-columns:1.05fr .95fr}
.vp-hero--links{grid-template-columns:.95fr 1.05fr}
.vp-split{grid-template-columns:.9fr 1.1fr}.vp-split--rechts{grid-template-columns:1.1fr .9fr}
.vp-verhaal{grid-template-columns:1.1fr .9fr}
.vp-instap{max-width:calc(var(--kader) + 2 * var(--gut))}
.vp-binnen,.vp-band__drie,.vp-werk__kaarten,.vp-rijen,.vp-faq{max-width:var(--kader)}
.vp-cijfers{max-width:calc(var(--kader) + 2 * var(--gut))}
.vp-reviews{padding-top:clamp(36px,4vw,56px)}
.vp-reviews .wrap{max-width:calc(var(--kader) + 2 * var(--gut))}

/* rustigere maten op grote schermen */
.vp-hero h1{font-size:clamp(2.4rem,4vw,3.9rem)}
.vp-hero--lang h1{font-size:clamp(2.3rem,3.6vw,3.5rem)}
.vp-uitspraak h2{font-size:clamp(2.2rem,4.4vw,4rem)}
.vp-band h2{font-size:clamp(2.2rem,4vw,3.8rem)}
.vp-slot h2{font-size:clamp(2.2rem,4vw,3.6rem)}
.vp-sectie h2,.vp-demo h2,.vp-werk h2,.vp-instap h2{font-size:clamp(2rem,3.4vw,3.2rem)}
.vp-split__tekst h2,.vp-verhaal__tekst h2{font-size:clamp(2rem,3vw,2.8rem)}
.vp-split__tekst blockquote,.vp-verhaal__tekst blockquote{font-size:clamp(1.3rem,1.9vw,1.7rem)}
.vp-rij b{font-size:clamp(3.2rem,5vw,5rem)}
.vp-rij{grid-template-columns:170px 1fr}
.vp-rij span{letter-spacing:.18em}

/* hoofden in beeld bij de foto achter donkere banden */
.vp-band__bg{object-position:center 12%}
.vp-slot__bg{object-position:center 45%}
.vp-slot:not(.vp-slot--donker) .vp-slot__bg{opacity:.3}

/* tweede donker blok */
.vp-sectie--donker{background:#3F3E39;color:#D9D4CC}
.vp-sectie--donker .vp-label{color:var(--terra-licht)}
.vp-sectie--donker h2{color:#fff}.vp-sectie--donker h2 em{color:var(--terra-licht)}
.vp-sectie--donker .vp-rij{border-color:rgba(255,255,255,.15)}
.vp-sectie--donker .vp-rij b{color:var(--terra-licht)}
.vp-sectie--donker .vp-rij h3{color:#fff}.vp-sectie--donker .vp-rij p{color:#D9D4CC}
.vp-sectie--donker .vp-drie>div{border-color:var(--terra-licht)}
.vp-sectie--donker .vp-drie h3{color:var(--terra-licht)}
.vp-sectie--donker .vp-drie p{color:#D9D4CC}.vp-sectie--donker .vp-drie a{color:#fff}
.vp-slot--donker{background:#3F3E39}
.vp-slot--donker .vp-slot__bg{opacity:.14;filter:grayscale(1)}
.vp-slot--donker .vp-label{color:var(--terra-licht)}
.vp-slot--donker h2{color:#fff}.vp-slot--donker h2 em{color:var(--terra-licht)}
.vp-slot--donker>p{color:#E9E4DD}

@media(max-width:900px){
  .vp-hero,.vp-split,.vp-verhaal{grid-template-columns:1fr !important;padding:0 0 56px;gap:36px}
  .vp-hero__tekst,.vp-split__tekst,.vp-verhaal__tekst,.vp-hero--links .vp-hero__tekst{padding:0 var(--gut)}
  .vp-hero__foto,.vp-split__foto,.vp-verhaal__foto{aspect-ratio:4/5;max-height:70vh}
  .vp-rij{grid-template-columns:90px 1fr}
}


/* ===================== TERUG NAAR DE VOORPROEF: FOTO'S TOT DE RAND ===================== */
:root{--zijrand:clamp(24px,5.5vw,110px)}
.vp-hero,.vp-split,.vp-verhaal{padding:0;gap:0;align-items:stretch}
.vp-hero{grid-template-columns:1fr 1fr;min-height:min(calc(100vh - 72px),880px)}
.vp-hero--links{grid-template-columns:1fr 1fr}
.vp-split,.vp-split--rechts{grid-template-columns:1fr 1fr}
.vp-verhaal{grid-template-columns:1fr 1fr}
.vp-hero__tekst{padding:clamp(70px,8vw,120px) clamp(32px,4vw,72px) clamp(70px,8vw,120px) var(--zijrand);align-self:center}
.vp-hero--links .vp-hero__tekst{padding-left:clamp(32px,4vw,72px);padding-right:var(--zijrand)}
.vp-split__tekst{padding:clamp(70px,8vw,120px) var(--zijrand) clamp(70px,8vw,120px) clamp(32px,5vw,90px);align-self:center}
.vp-split--rechts .vp-split__tekst{padding:clamp(70px,8vw,120px) clamp(32px,5vw,90px) clamp(70px,8vw,120px) var(--zijrand)}
.vp-verhaal__tekst{padding:clamp(70px,8vw,120px) clamp(32px,5vw,90px) clamp(70px,8vw,120px) var(--zijrand);align-self:center}
.vp-hero__foto,.vp-split__foto,.vp-verhaal__foto{aspect-ratio:auto;max-height:none;min-height:min(86vh,780px)}
.vp-hero__foto>img,.vp-split__foto img,.vp-verhaal__foto img{object-position:center 15%}
.vp-hero h1{font-size:clamp(2.6rem,4.4vw,4.8rem);line-height:1.05}
.vp-hero--lang h1{font-size:clamp(2.4rem,3.8vw,4rem)}
.vp-hero p{max-width:42ch}
.vp-split__tekst h2,.vp-verhaal__tekst h2{font-size:clamp(2.2rem,3.4vw,3.4rem)}
.vp-uitspraak h2{font-size:clamp(2.6rem,5.2vw,5.2rem)}
.vp-band h2{font-size:clamp(2.6rem,4.8vw,4.8rem)}
.vp-slot h2{font-size:clamp(2.6rem,4.6vw,4.6rem)}
@media(max-width:900px){
  .vp-hero,.vp-split,.vp-verhaal{grid-template-columns:1fr !important;padding:0}
  .vp-hero__foto,.vp-split__foto,.vp-verhaal__foto{min-height:0;height:68vh;order:-1}
  .vp-hero__tekst,.vp-hero--links .vp-hero__tekst,.vp-split__tekst,.vp-split--rechts .vp-split__tekst,.vp-verhaal__tekst{padding:48px var(--gut) 60px}
}

/* ===================== ALLES OVER DE VOLLE BREEDTE ===================== */
/* één vaste zijmarge voor alles: menu, tekst, kolommen, footer */
.wrap{max-width:none;padding-inline:var(--zijrand)}
.vp-uitspraak,.vp-band,.vp-sectie,.vp-demo,.vp-werk,.vp-slot,.vp-cijfers{padding-inline:var(--zijrand)}
.vp-cijfers,.vp-instap{max-width:none}
.vp-instap{padding-inline:var(--zijrand);grid-template-columns:1fr 1fr}
.vp-binnen,.vp-band__drie,.vp-werk__kaarten,.vp-rijen,.vp-faq{max-width:none}
.vp-quotes{padding-inline:var(--zijrand)}.vp-quotes .quoterail{max-width:none}
.vp-reviews .wrap{max-width:none}
.vp-rijen .vp-rij,.vp-cijfers .vp-rij{grid-template-columns:clamp(110px,14vw,240px) 1fr}
.vp-band__drie,.vp-werk__kaarten{gap:clamp(24px,3vw,56px)}
.vp-uitspraak p,.vp-band>p,.vp-sectie>p,.vp-demo>p,.vp-slot>p{max-width:62ch}
.vp-uitspraak h2,.vp-band h2,.vp-sectie h2{max-width:22ch}
.vp-demo .laptop{max-width:1100px !important}
.vp-slot__contact{max-width:620px}
/* afwisselende achtergronden: nooit twee dezelfde vlakken achter elkaar */
section.bg-zand{background:#EFE8E1 !important}
section.bg-wit{background:#fff !important}
.bg-zand .vp-instap__beeld{background:#fff}
/* echte laptopfoto als mockup, de demo draait in het scherm */
.laptop--foto{position:relative;max-width:1000px !important;aspect-ratio:1562/1010;background:url(../images/laptop-mockup.jpg) center/100% 100% no-repeat;border-radius:6px;overflow:hidden}
.laptop--foto .laptop__rand{position:absolute;left:11.4%;top:4.75%;width:74.26%;height:71.68%;padding:0;background:#000;border-radius:2px;box-shadow:none}
.laptop--foto .scherm{aspect-ratio:auto;height:100%;border-radius:0}
.laptop--foto .laptop__voet{display:none}

/* ===================== NIET BEELDVULLEND: SITE MAX 1440 BREED ===================== */
/* de inhoud staat in een kader van max 1440px; de kleur van elk vlak loopt door tot de rand */
:root{--zijrand:clamp(24px,5vw,80px)}
main>section{max-width:1320px;margin-inline:auto;position:relative}
.wrap{max-width:1320px;margin-inline:auto}
.vp-band__bg{object-position:center 0%}
.vp-hero__foto>img,.vp-split__foto img,.vp-verhaal__foto img{object-position:center 12%}

/* ===================== RONDE: UITLIJNING, CIJFERS, ACHTERGRONDEN ===================== */
/* alle inhoud in hetzelfde kader van 1440, met dezelfde binnenmarge */
main>section{max-width:1320px !important;margin-inline:auto !important}
.vp-instap,.vp-cijfers{padding-inline:var(--zijrand) !important}

/* 1 + 7: achtergrondfoto's lopen door tot de rand, gezicht in beeld */
.vp-band,.vp-slot{overflow:visible}
.vp-band__bg,.vp-slot__bg{left:calc(50% - 50vw / var(--z,1)) !important;width:calc(100vw / var(--z,1)) !important;right:auto;transform:none !important}
.vp-band__bg{object-position:center 8% !important}

/* 2: cijfers in het midden */
.vp-cijfers .vp-rij{max-width:860px;margin-inline:auto;grid-template-columns:200px 1fr}

/* 3: antwoord in de kaart beter leesbaar */
.vp-werk__antwoord{padding:30px 28px 26px;background:rgba(40,40,36,.96)}
.vp-werk__antwoord h4{font-size:1.6rem}
.vp-werk__antwoord p{font-size:1rem;line-height:1.65}
.vp-werk__antwoord li{font-size:.98rem;line-height:1.55;margin-bottom:8px}
.vp-werk__knoppen .vp-knop{font-size:.72rem;padding:14px 20px}
.vp-werk__tweede{font-size:.72rem}

/* 4: reviews zonder witrand, zelfde lijn als tekst en foto erboven */
.vp-reviews .wrap{padding-inline:var(--zijrand)}
.vp-reviews .rail__item,.vp-reviews .rail__item img{border:0 !important;background:none !important;box-shadow:none !important;padding:0 !important;border-radius:4px}
.vp-reviews .rail{scrollbar-width:none}.vp-reviews .rail::-webkit-scrollbar{display:none}

/* 6: klantverhaal zonder foto, quote in het midden */
.vp-verhaal--tekst{grid-template-columns:1fr !important;text-align:center}
.vp-verhaal--tekst .vp-verhaal__tekst{padding:clamp(80px,9vw,120px) var(--zijrand) 40px !important;max-width:900px;margin:0 auto}
.vp-verhaal--tekst blockquote{font-size:clamp(1.6rem,2.6vw,2.3rem) !important}
.vp-instap__beeld--foto{padding:0;background:none !important;overflow:hidden;aspect-ratio:4/5;max-height:620px}
.vp-instap__beeld--foto img{width:100%;height:100%;object-fit:cover;object-position:center 20%}
/* hoofdfoto's in verhouding met de tekst ernaast */
.vp-hero{min-height:0 !important;grid-template-columns:1.15fr .85fr !important}
.vp-hero--links{grid-template-columns:.85fr 1.15fr !important}
.vp-hero__foto{min-height:min(74vh,660px) !important}
.vp-split__foto,.vp-verhaal__foto{min-height:min(76vh,680px) !important}
@media(max-width:900px){.vp-hero{grid-template-columns:1fr !important}.vp-hero__foto{min-height:0 !important;height:60vh}}
/* achtergrondfoto's via ::before (home) ook tot de rand */
.vp-band::before,.vp-slot::before{left:calc(50% - 50vw / var(--z,1)) !important;right:auto !important;width:calc(100vw / var(--z,1))}
.vp-band::before{background-position:center 8% !important}
/* Over: lopende tekst bovenaan even groot als de eerste alinea */
.vp-hero--lang p+p{font-size:1.06rem !important;line-height:1.75;color:var(--tekst-licht)}
.vp-hero--lang p{max-width:46ch}
/* quotes training: geen scrollbalk, alle vier naast elkaar, los van de foto */
.vp-quotes{padding:clamp(48px,5vw,72px) var(--zijrand) clamp(70px,8vw,110px) !important}
.vp-quotes .quoterail{display:grid !important;grid-template-columns:repeat(4,1fr);gap:20px;overflow:visible;padding:0;margin:0}
.vp-quotes .quoterail .kaart{flex:none;width:auto}
@media(max-width:900px){.vp-quotes .quoterail{grid-template-columns:1fr}}
/* reviews home: altijd hele kaarten in beeld, 4 tegelijk */
.vp-reviews .rail{gap:16px}
.vp-reviews .rail__item{flex:0 0 calc((100% - 48px)/4) !important;width:auto !important}
@media(max-width:900px){.vp-reviews .rail__item{flex-basis:78% !important}}
/* ===== één vaste binnenlijn voor alle tekst en kolommen (gelijk aan logo en menu) ===== */
.vp-uitspraak,.vp-band,.vp-sectie,.vp-demo,.vp-werk,.vp-slot,.vp-cijfers,.vp-instap,.vp-quotes,.vp-reviews,main>section.sectie{padding-left:var(--zijrand) !important;padding-right:var(--zijrand) !important}
.vp-reviews .wrap,main>section.sectie>.wrap{padding-inline:0 !important}
.vp-binnen,.vp-band__drie,.vp-werk__kaarten,.vp-rijen,.vp-faq{max-width:none !important;margin-inline:0 !important}
.vp-hero:not(.vp-hero--links) .vp-hero__tekst{padding-left:var(--zijrand) !important}
.vp-hero--links .vp-hero__tekst{padding-right:var(--zijrand) !important}
.vp-split:not(.vp-split--rechts) .vp-split__tekst{padding-right:var(--zijrand) !important}
.vp-split--rechts .vp-split__tekst{padding-left:var(--zijrand) !important}
.vp-verhaal:not(.vp-verhaal--tekst) .vp-verhaal__tekst{padding-left:var(--zijrand) !important}
@media(max-width:900px){
  .vp-hero__tekst,.vp-split__tekst,.vp-verhaal__tekst{padding-left:var(--gut) !important;padding-right:var(--gut) !important}
  .vp-uitspraak,.vp-band,.vp-sectie,.vp-demo,.vp-werk,.vp-slot,.vp-cijfers,.vp-instap,.vp-quotes,.vp-reviews,main>section.sectie{padding-left:var(--gut) !important;padding-right:var(--gut) !important}
}

/* ===== klantverhalen als tekst met portret ===== */
.vp-stemmen{background:#EFE8E1}
.stemmen{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,32px);margin-top:56px;text-align:left}
.stem{margin:0;background:#fff;border-radius:6px;padding:32px 30px 26px;display:flex;flex-direction:column;justify-content:space-between;gap:26px}
.stem blockquote{margin:0;font-family:var(--serif);font-style:italic;font-size:1.08rem;line-height:1.6;color:var(--tekst)}
.stem figcaption{display:flex;align-items:center;gap:16px;padding-top:20px;border-top:1px solid var(--lijn)}
.stem img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none}
.stem b{display:block;font:600 .74rem/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--tekst)}
.stem span{font-size:.82rem;line-height:1.45;color:var(--tekst-licht)}
@media(max-width:1000px){.stemmen{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.stemmen{grid-template-columns:1fr}}

/* 1: Zelf bekijken: foto vult het hele blok, zonder witruimte erboven of eronder */
.vp-instap:has(.vp-instap__beeld--foto){padding-top:0 !important;padding-bottom:0 !important;padding-left:0 !important;align-items:stretch;gap:0;grid-template-columns:1fr 1fr}
.vp-instap__beeld--foto{aspect-ratio:auto !important;max-height:none !important;min-height:min(76vh,680px);border-radius:0;position:relative}
.vp-instap__beeld--foto img{position:absolute;inset:0}
.vp-instap:has(.vp-instap__beeld--foto)>div:last-child{align-self:center;padding:clamp(70px,8vw,120px) 0 clamp(70px,8vw,120px) clamp(32px,5vw,90px)}
@media(max-width:900px){.vp-instap:has(.vp-instap__beeld--foto){grid-template-columns:1fr;padding-left:0 !important;padding-right:0 !important}
 .vp-instap__beeld--foto{min-height:0;height:60vh;order:-1 !important}
 .vp-instap:has(.vp-instap__beeld--foto)>div:last-child{padding:48px var(--gut) 60px}}

/* 3: hoofdfoto home, persoon iets meer naar links */
.vp-hero:not(.vp-hero--links) .vp-hero__foto>img[src*="home-hero"]{object-position:68% 15%}

/* 4: logobalk zonder witte achtergrond */
.vp-merken{mix-blend-mode:multiply}

/* 6: contactvlakken donker */
.vp-slot .slot__lijst a{background:var(--grijs-diep) !important;border-color:var(--grijs-diep) !important;color:#fff !important}
.vp-slot .slot__lijst a small{color:#D9D4CC !important}
.vp-slot .slot__lijst a:hover{background:#2E2E29 !important}
.vp-slot--donker .slot__lijst a{background:#fff !important;border-color:#fff !important;color:var(--tekst) !important}
.vp-slot--donker .slot__lijst a small{color:var(--tekst-licht) !important}
.vp-band__bg,.vp-slot__bg{max-width:none !important;height:100% !important;top:0 !important;bottom:auto !important}

/* ===== ronde: uitsnedes per foto, laptopachtergrond ===== */
.vp-band__bg.pos-apkband{object-position:center 19% !important}
.vp-band__bg.pos-trband{object-position:center 22% !important}
.vp-band__bg.pos-dnband{object-position:center 0% !important}
/* assistent-band: hele foto in het midden, zachte randen */
.vp-band__bg.pos-heel{object-fit:contain !important;object-position:center center !important;opacity:.22;
  -webkit-mask-image:linear-gradient(90deg,transparent 22%,#000 40%,#000 60%,transparent 78%);mask-image:linear-gradient(90deg,transparent 22%,#000 40%,#000 60%,transparent 78%)}
.vp-hero__foto>img.pos-apkhero{object-position:30% 20% !important}
.vp-hero__foto>img.pos-asshero{object-position:62% 15% !important}
.vp-hero__foto>img.pos-dnhero{object-position:54% 25% !important}
.vp-uitspraak--tekst h2{max-width:20ch}
.vp-uitspraak--tekst p{max-width:60ch}

/* demo-vak: laptopfoto vult het hele vak, vervaagd */
.vp-demo{position:relative;overflow:visible;isolation:isolate}
.vp-demo::before{content:"";position:absolute;top:0;bottom:0;left:calc(50% - 50vw / var(--z,1));width:calc(100vw / var(--z,1));z-index:-1;
  background:url(../images/laptop-mockup.jpg) center/cover;filter:blur(22px) saturate(.9);transform:scale(1.08)}
.vp-demo::after{content:"";position:absolute;top:0;bottom:0;left:calc(50% - 50vw / var(--z,1));width:calc(100vw / var(--z,1));z-index:-1;background:rgba(239,232,225,.55)}
.vp-demo .laptop--foto{box-shadow:0 30px 70px -30px rgba(40,40,36,.45)}

/* ===== demo-vak: rustige zandkleur met een boog achter de laptop (vervangt de vervaagde foto) ===== */
.vp-demo::before,.vp-demo::after{content:none !important}
.vp-demo{background:#EFE8E1 !important}
.demo-podium{position:relative;max-width:1000px;margin:46px auto 0;padding-bottom:30px;isolation:isolate}
.demo-podium::before{content:"";position:absolute;z-index:-1;left:50%;transform:translateX(-50%);bottom:0;width:80%;height:112%;
  border-radius:999px 999px 0 0;background:var(--terra-licht);opacity:.6}
.demo-podium::after{content:"";position:absolute;z-index:-1;left:4%;right:4%;bottom:0;height:2px;background:var(--terra);opacity:.6}
.demo-podium .laptop--foto{margin:0 auto !important;border-radius:10px;box-shadow:0 40px 80px -40px rgba(58,58,52,.55)}
@media(max-width:700px){.demo-podium::before{width:96%;height:108%}}
.demo-podium{margin-top:clamp(70px,7vw,110px) !important}
.demo-podium::before{height:calc(100% + 50px) !important;width:72% !important}
@media(max-width:700px){.demo-podium{margin-top:60px !important}.demo-podium::before{width:92% !important;height:calc(100% + 30px) !important}}

/* klantverhalen: grote vierkante portretten */
.stemmen{gap:clamp(24px,3vw,44px)}
.stem{padding:0;background:none;gap:0;display:flex;flex-direction:column}
.stem figcaption{order:-1;display:block;padding:0;border:0}
.stem figcaption img{width:100%;height:auto;aspect-ratio:1/1;border-radius:6px;display:block;margin-bottom:22px;transition:transform .6s}
.stem:hover figcaption img{transform:scale(1.02)}
.stem figcaption span{display:block}
.stem blockquote{font-size:1.12rem;margin:16px 0 0}
.stem b{margin-bottom:4px}
.stem{justify-content:flex-start !important}
.stem figcaption span{min-height:3.2em}

/* ===== klantverhalen carrousel ===== */
.stemmen{display:grid !important;grid-auto-flow:column;grid-template-columns:none !important;grid-auto-columns:calc((100% - 2*clamp(24px,3vw,44px))/3);
  overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:4px}
.stemmen::-webkit-scrollbar{display:none}
.stem{scroll-snap-align:start}
.stem figcaption img{aspect-ratio:4/5 !important;object-fit:cover;object-position:center 30%}
.stemmen__nav{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:40px}
.stemmen__pijl{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--tekst);background:none;color:var(--tekst);font-size:1.1rem;cursor:pointer;transition:background .2s,color .2s}
.stemmen__pijl:hover{background:var(--tekst);color:#fff}
.stemmen__stip{display:flex;gap:10px}
.stemmen__stip button{width:9px;height:9px;border-radius:50%;border:0;padding:0;background:var(--terra-licht);cursor:pointer;transition:width .3s,background .3s}
.stemmen__stip button.aan{width:28px;border-radius:9px;background:var(--terra-diep)}
@media(max-width:1000px){.stemmen{grid-auto-columns:calc((100% - clamp(24px,3vw,44px))/2)}}
@media(max-width:640px){.stemmen{grid-auto-columns:84%}}

/* laptop zonder achtergrondvorm */
.demo-podium::before,.demo-podium::after{content:none !important}
.demo-podium{padding-bottom:0;margin-top:46px !important}

/* ===== klantverhalen: kleine foto, grote quote, twee per keer ===== */
.stemmen{grid-auto-columns:calc((100% - clamp(24px,3vw,44px))/2) !important}
.stem{background:#fff !important;border-radius:8px;padding:clamp(26px,2.6vw,40px) !important;display:grid !important;
  grid-template-columns:clamp(120px,11vw,170px) 1fr;grid-template-areas:"foto quote" "foto naam";column-gap:clamp(22px,2.4vw,36px);row-gap:18px;align-items:start}
.stem figcaption{display:contents !important}
.stem figcaption img{grid-area:foto;width:100% !important;margin:0 !important;aspect-ratio:4/5 !important;border-radius:6px}
.stem figcaption span{grid-area:naam;min-height:0 !important}
.stem blockquote{grid-area:quote;margin:0 !important;font-size:clamp(1.15rem,1.35vw,1.4rem) !important;line-height:1.55 !important;color:var(--tekst)}
.stem:hover figcaption img{transform:none}
@media(max-width:1000px){.stemmen{grid-auto-columns:88% !important}}
@media(max-width:640px){.stem{grid-template-columns:96px 1fr;grid-template-areas:"foto naam" "quote quote"}
  .stem blockquote{font-size:1.08rem !important}}
.stem{align-content:start;grid-template-rows:auto 1fr}
.stem figcaption span{align-self:start}
@media(max-width:640px){.stem{grid-template-rows:auto auto}.stem figcaption span{align-self:center}}
.vp-band__bg.pos-assband{object-fit:cover !important;object-position:center 22% !important;opacity:.2}

/* ===== ronde okt-17 ===== */
/* menu iets groter */
.nav a{font-size:.95rem !important}
.nav .btn--vol{font-size:.72rem !important}

/* hero met foto in eigen verhouding: niets van het hoofd afsnijden */
.vp-hero--vrij{grid-template-columns:1fr 1fr !important;align-items:center !important;min-height:0 !important}
.vp-hero--vrij .vp-hero__foto{min-height:0 !important;height:auto;align-self:center;width:100%}
.vp-hero--vrij .vp-hero__foto>img{object-fit:cover !important;object-position:center !important}
@media(max-width:900px){.vp-hero--vrij .vp-hero__foto{height:auto !important}}

/* APK-band: brede, uitgezoomde foto */
.vp-band__bg.pos-apkbreed{object-position:center 18% !important}

/* home: over-blok zonder foto */
.vp-over blockquote{margin:30px auto 0;font-family:var(--serif);font-style:italic;font-size:clamp(1.4rem,2.2vw,1.9rem);line-height:1.4;color:var(--terra-diep);max-width:26ch}
.vp-over p{max-width:58ch}

/* klantverhalen: één verhaal per keer, groot en in het midden */
.stemmen{grid-auto-columns:100% !important;align-items:stretch}
.stem{background:#fff !important;border-radius:10px;padding:clamp(40px,5vw,72px) clamp(24px,6vw,110px) !important;
  display:flex !important;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:0 !important;min-height:420px}
.stem figcaption{display:flex !important;flex-direction:column;align-items:center;order:2 !important;margin-top:28px}
.stem figcaption img{width:110px !important;height:110px !important;aspect-ratio:1/1 !important;border-radius:50% !important;object-fit:cover;object-position:center 12% !important;
  margin:0 0 14px !important;filter:saturate(.72) contrast(.95) brightness(1.04) sepia(.08)}
.stem figcaption span{min-height:0 !important;text-align:center}
.stem blockquote{order:1;max-width:46ch;font-size:clamp(1.25rem,1.8vw,1.65rem) !important;line-height:1.55 !important;margin:0 !important}
@media(max-width:640px){.stem{min-height:0;padding:36px 22px !important}.stem blockquote{font-size:1.12rem !important}}

/* juridische pagina's */
.juridisch{max-width:820px;margin:0 auto;padding:clamp(56px,7vw,100px) var(--gut) clamp(70px,8vw,120px)}
.juridisch h1{font-size:clamp(2.2rem,4vw,3.4rem);line-height:1.1;margin:0 0 10px}
.juridisch .versie{color:var(--tekst-licht);font-size:.9rem;margin:0 0 30px}
.juridisch .download{display:inline-flex;margin:0 0 40px}
.juridisch h2{font-size:clamp(1.3rem,2vw,1.6rem);margin:42px 0 12px;padding-top:24px;border-top:1px solid var(--lijn)}
.juridisch h2 span{color:var(--terra-diep);font-style:italic}
.juridisch p,.juridisch li{max-width:none;font-size:.97rem;line-height:1.75}
.juridisch .lid{color:var(--tekst);font-weight:600;margin-right:6px}
.juridisch ul{padding-left:22px;margin:0 0 1em}
.juridisch li{margin-bottom:6px}
.juridisch .inhoud{columns:2;column-gap:30px;font-size:.9rem;margin:0 0 20px;padding:22px 26px;background:#EFE8E1;border-radius:8px;list-style:none}
.juridisch .inhoud a{color:var(--tekst)}
@media(max-width:640px){.juridisch .inhoud{columns:1}}

/* klantverhalen: de review-afbeeldingen, drie tegelijk */
.stemmen--beeld{grid-auto-columns:calc((100% - 2*24px)/3) !important;gap:24px !important}
.stem-beeld{scroll-snap-align:start}
.stem-beeld img{display:block;width:100%;height:auto;border-radius:8px;box-shadow:0 18px 40px -26px rgba(58,58,52,.45)}
@media(max-width:1000px){.stemmen--beeld{grid-auto-columns:calc((100% - 24px)/2) !important}}
@media(max-width:640px){.stemmen--beeld{grid-auto-columns:82% !important}}
.stem-beeld img{aspect-ratio:556/680;object-fit:cover;object-position:center top}
.stemmen--beeld{align-items:start}
.vp-band p strong{color:#fff}
.vp-band__bg.pos-dienstband{object-position:center 15% !important}

/* ervaring naast foto, compact */
.vp-ervaring .vp-merken{margin:4px 0 34px;max-width:520px;width:100%}
.ervaring{display:grid;grid-template-columns:1fr 1fr;gap:26px 34px;max-width:560px}
.ervaring div{border-top:1px solid var(--lijn);padding-top:16px}
.ervaring b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(2.6rem,3.6vw,3.4rem);line-height:1;color:var(--terra);font-variant-numeric:tabular-nums}
.ervaring span{display:block;margin-top:8px;font:500 .72rem/1.55 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--tekst)}
.vp-proef .vp-knoppen{justify-content:center}
/* klantfoto's zachter */
.stem-beeld img{filter:saturate(.78) brightness(1.03) contrast(.96)}
/* linkedin in de footer */
.voet__social{display:inline-flex;align-items:center;gap:8px;margin-top:12px;color:var(--tekst);font-size:.85rem}
.voet__social svg{width:22px;height:22px;fill:var(--terra-diep);transition:fill .2s}
.voet__social:hover svg{fill:var(--tekst)}
.vp-split.vp-over blockquote{margin:28px 0 0;text-align:left;max-width:24ch}
.vp-split.vp-over p{max-width:46ch}
.over-ervaring{margin-top:36px;padding-top:28px;border-top:1px solid var(--lijn)}
.over-ervaring .vp-label{margin-bottom:14px}
.over-ervaring .vp-merken{margin:0 0 26px;max-width:460px;width:100%;mix-blend-mode:multiply}
.over-ervaring .ervaring{gap:18px 30px}
.over-ervaring .ervaring b{font-size:clamp(2.2rem,3vw,2.8rem)}
.vp-over .vp-split__foto{min-height:100% !important}
/* opgericht door: hele foto tonen, niet inzoomen */
.vp-split.vp-over{grid-template-columns:.9fr 1.1fr !important;align-items:center !important}
.vp-over .vp-split__foto{min-height:0 !important;height:auto !important;aspect-ratio:1454/1082;align-self:center}
.vp-over .vp-split__foto img{object-fit:cover !important;object-position:center !important;transform:none !important}
@media(max-width:900px){.vp-split.vp-over{grid-template-columns:1fr !important}.vp-over .vp-split__foto{height:auto !important}}
/* opgericht door: foto bovenaan rechts, logo's en cijfers eronder */
.vp-split.vp-over{align-items:start !important}
.vp-over .vp-split__tekst{align-self:start;padding-top:clamp(70px,8vw,120px) !important}
.over-rechts{order:2;padding:clamp(70px,8vw,120px) var(--zijrand) clamp(70px,8vw,120px) 0}
.over-rechts .over-ervaring{margin-top:30px;padding-top:0;border-top:0}
.over-rechts .vp-split__foto{order:0 !important}
@media(max-width:900px){.over-rechts{order:-1;padding:0 0 10px}.over-rechts .over-ervaring{padding:0 var(--gut)}}
/* opgericht door: tekst links, foto + logo's + cijfers rechts */
.vp-over2{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(40px,5vw,90px);align-items:start;padding:clamp(70px,8vw,120px) var(--zijrand);background:#FAF8F6}
.vp-over2 h2{font-size:clamp(2.2rem,3.4vw,3.4rem);line-height:1.1;margin:0}
.vp-over2 p{max-width:44ch;margin:24px 0 0}
.vp-over2 blockquote{margin:30px 0 0;font-family:var(--serif);font-style:italic;font-size:clamp(1.4rem,2.1vw,1.9rem);line-height:1.35;color:var(--terra-diep);max-width:22ch}
.vp-over2__foto{width:100%;height:auto;display:block;margin-bottom:34px}
.vp-over2 .vp-merken{max-width:480px;width:100%;margin:0 0 26px;mix-blend-mode:multiply}
.vp-over2 .ervaring{grid-template-columns:repeat(4,1fr);max-width:none;gap:24px}
.vp-over2 .ervaring b{font-size:clamp(2.2rem,3vw,2.8rem)}
@media(max-width:1100px){.vp-over2 .ervaring{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.vp-over2{grid-template-columns:1fr;padding:56px var(--gut)}}

/* ===== mobiel: menu, plakbalk, labels ===== */
@media(max-width:900px){
  /* backdrop-filter maakte het menu even klein als de kopbalk */
  .header{backdrop-filter:none;-webkit-backdrop-filter:none;background:#FAF8F6}
  .nav{position:fixed !important;top:0;left:0;right:0;bottom:0;height:100vh;height:100dvh;background:#FAF8F6 !important;
    z-index:120 !important;padding:90px var(--gut) 40px;gap:4px;overflow-y:auto}
  .nav a{font-size:1.5rem !important;padding:10px 0}
  .nav .btn--vol{font-size:.8rem !important;margin-top:18px;padding:1em 1.8em}
  .burger{position:relative;z-index:130}
  body.menu-open{overflow:hidden}
  body.menu-open .plakbalk,body.menu-open .bel,body.menu-open .bel__paneel{display:none !important}
  /* labels boven koppen niet te breed */
  .vp-label,.kicker{letter-spacing:.18em !important;font-size:.66rem !important;line-height:1.6}
  /* plakbalk compacter */
  .plakbalk{padding:10px var(--gut) !important;gap:12px}
  .plakbalk span{font-size:.8rem;line-height:1.35}
  .plakbalk .btn{padding:.85em 1.1em !important;font-size:.62rem !important;letter-spacing:.12em !important;white-space:nowrap;flex:none}
  .plakbalk .btn::after{display:none}
  /* fotoknop boven de plakbalk, niet over tekst */
  .bel{bottom:84px !important;right:14px !important}
  .bel__knop{width:50px;height:50px}
}
@media(max-width:900px){
  .burger[aria-expanded="true"] span{background:transparent}
  .burger[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
  .burger[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}
}

/* ===================== RONDE MOBIEL + LOSSE PUNTEN ===================== */
/* 1-3: heroes met eigen fotoverhouding ook op mobiel onder elkaar */
@media(max-width:900px){
  .vp-hero.vp-hero--vrij,.vp-hero.vp-hero--links.vp-hero--vrij{grid-template-columns:1fr !important;padding:0 !important}
  .vp-hero--vrij .vp-hero__foto{order:-1 !important;width:100%;aspect-ratio:auto !important;height:auto !important;min-height:0 !important}
  .vp-hero--vrij .vp-hero__foto>img{position:static !important;width:100%;height:auto !important;transform:none !important}
  .vp-hero--vrij .vp-hero__tekst{padding:40px var(--gut) 56px !important}
  .vp-hero h1{font-size:2.35rem !important;line-height:1.1}
}
/* 4: quotes op de training als carrousel */
.vp-testers blockquote{font-family:var(--serif);font-style:italic;font-size:clamp(1.4rem,2.4vw,2rem);line-height:1.4;color:var(--terra-diep);max-width:30ch;margin:30px auto 0}
.vp-testers cite{display:block;margin-top:16px;font:600 .72rem/1.6 var(--sans);letter-spacing:.2em;text-transform:uppercase;font-style:normal;color:var(--tekst)}
.stemmen--tekst{grid-auto-columns:calc((100% - 2*24px)/3) !important;gap:24px !important;margin-top:50px;text-align:left}
.stemmen--tekst .kaart{scroll-snap-align:start;background:#fff;border:1px solid var(--lijn);border-radius:10px;padding:28px 26px;display:flex;flex-direction:column;justify-content:space-between;gap:18px}
.stemmen--tekst .kaart p{margin:0;font-size:.95rem;line-height:1.65}
@media(max-width:1000px){.stemmen--tekst{grid-auto-columns:calc((100% - 24px)/2) !important}}
@media(max-width:640px){.stemmen--tekst{grid-auto-columns:86% !important}}
/* 5: demo in een rechthoek, zonder laptop */
.demo-podium{max-width:1000px;margin:46px auto 0 !important}
.laptop.demo-kader{max-width:1000px !important;margin:0 auto;background:none;aspect-ratio:auto}
.demo-kader .laptop__rand{position:static;padding:0;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 30px 60px -32px rgba(58,58,52,.55);border:1px solid var(--lijn)}
.demo-kader .scherm{aspect-ratio:16/10;border-radius:0}
.demo-kader .laptop__voet{display:none}
@media(max-width:700px){.demo-kader .scherm{aspect-ratio:4/5}}
/* 6: wat je meeneemt als donkere band */
.vp-band__bg.pos-meeneem{object-position:center 25% !important}
.vp-band--meeneem .vp-band__drie h3{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.4rem,2.2vw,1.8rem);color:var(--terra-licht);margin:0 0 10px}
.vp-band--meeneem .vp-band__drie p{font-size:.92rem;color:#D9D4CC;margin:0}
.vp-band--meeneem .vp-band__drie p em{color:#fff}
/* 7: huisstijlcollage helemaal zichtbaar op mobiel */
@media(max-width:900px){.vp-split__foto img[src*="huisstijl"]{position:static !important;width:100%;height:auto !important;object-fit:contain !important;transform:none !important}
  .vp-split__foto:has(img[src*="huisstijl"]){height:auto !important;min-height:0 !important}}
/* 8: compacte footer */
.voet--nieuw{padding:26px 0 18px !important}
.voet__rij{display:flex;align-items:center;justify-content:space-between;gap:16px 30px;flex-wrap:wrap}
.voet__merk{display:flex;align-items:center;gap:16px}
.voet--nieuw .voet__merk img{height:30px;margin:0}
.voet__li{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#EFE8E1;transition:background .2s}
.voet__li svg{width:18px;height:18px;fill:var(--tekst)}
.voet__li:hover{background:var(--terra-licht)}
.voet--nieuw .voet__links{gap:6px 16px}
.voet__klein{margin-top:16px;padding-top:12px;border-top:1px solid #EFE8E1;font-size:.74rem;color:#8a857e}
@media(max-width:700px){.voet--nieuw .voet__links{font-size:.8rem;gap:4px 14px}.voet--nieuw .voet__links a{padding:4px 0}}
/* 9: mobiel menu als paneel onder de kopbalk, niet schermvullend */
@media(max-width:900px){
  .nav{top:var(--kop,64px) !important;bottom:auto !important;height:auto !important;max-height:calc(100dvh - var(--kop,64px));
    left:0;right:0;padding:8px var(--gut) 22px !important;justify-content:flex-start !important;align-items:stretch !important;gap:0 !important;
    border-bottom:1px solid var(--lijn);box-shadow:0 24px 40px -24px rgba(58,58,52,.35);z-index:79 !important}
  .nav a{font-family:var(--sans) !important;font-size:1.02rem !important;padding:13px 2px !important;border-bottom:1px solid #EFE8E1;text-align:left}
  .nav a[aria-current="page"]{color:var(--terra-diep);font-weight:600}
  .nav a.btn--vol{border:0;margin-top:16px;text-align:center;justify-content:center;font-size:.74rem !important;padding:1em 1.4em !important}
  body.menu-open::after{content:"";position:fixed;inset:0;background:rgba(40,40,36,.35);z-index:78}
}
@media(max-width:860px){body{padding-bottom:78px !important}}

/* kies je vraag: op mobiel één beeld met de vragen eronder */
.werk-mobiel{display:none}
@media(max-width:900px){
  .vp-werk__kaarten{display:none !important}
  .werk-mobiel{display:block;margin-top:34px;text-align:left}
  .wm__beeld{position:relative;overflow:hidden;aspect-ratio:4/5;border-radius:4px}
  .wm__beeld img{width:100%;height:100%;object-fit:cover;transition:filter .4s}
  .werk-mobiel.open .wm__beeld img{filter:blur(2px)}
  .werk-mobiel.open .wm__antwoord{opacity:1;visibility:visible;transform:none}
  .wm__vragen{margin-top:18px;display:grid;gap:10px}
  .wm__vraag{display:grid;grid-template-columns:1fr auto;gap:4px 14px;align-items:center;text-align:left;background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.18);border-radius:10px;padding:16px 18px;color:#fff;font:inherit;cursor:pointer}
  .wm__vraag b{font-family:var(--serif);font-weight:400;font-size:1.12rem;line-height:1.3}
  .wm__vraag span{grid-column:1;font-size:.86rem;color:#D9D4CC;line-height:1.45}
  .wm__vraag i{grid-column:2;grid-row:1/3;font-style:normal;font-size:1.3rem;color:var(--terra-licht);transition:transform .3s}
  .wm__vraag.aan{background:rgba(255,255,255,.12);border-color:var(--terra-licht)}
  .wm__vraag.aan i{transform:rotate(45deg)}
}
@media(max-width:900px){
  .wm__vraag b{color:#fff !important}
  .wm__beeld{aspect-ratio:auto;min-height:118vw}
  .wm__beeld img{position:absolute;inset:0}
  .wm__antwoord{padding:24px 22px 22px !important}
  .wm__antwoord h4{font-size:1.35rem !important}
  .wm__antwoord p,.wm__antwoord li{font-size:.92rem !important}
}

/* ===== drie lichte tinten om en om (donkere vakken blijven) ===== */
section.bg-wit{background:#FFFFFF !important}
section.bg-creme{background:#FAF8F6 !important}
section.bg-zand{background:#EFE8E1 !important}
section.bg-wit .vp-instap__beeld,section.bg-wit .vp-drie>div{background-color:transparent}
.bg-zand .stem-beeld img{box-shadow:0 18px 40px -26px rgba(58,58,52,.5)}

/* ===== menu in kleine hoofdletters, contact met pijl ===== */
@media(min-width:901px){
  .nav a:not(.btn){font:500 .74rem/1 var(--sans) !important;letter-spacing:.14em;text-transform:uppercase;color:var(--tekst)}
  .nav a:not(.btn)[aria-current="page"]{color:var(--terra-diep)}
  .nav a.btn--vol{font-size:.7rem !important;letter-spacing:.2em;padding:1em 1.4em}
  .nav a.btn--vol::after{content:"\2192" !important;display:inline !important;position:static !important;background:none !important;width:auto !important;height:auto !important;transform:none !important;font-size:.95rem;letter-spacing:0;margin-left:2px}
}

/* ===== cursief in de grote koppen lichter terra ===== */
.vp-uitspraak h2 em,.vp-sectie:not(.vp-sectie--donker) h2 em,.vp-split__tekst h2 em,.vp-over2 h2 em,.vp-demo h2 em,.vp-instap h2 em{color:var(--terra) !important}
.vp-vier{grid-template-columns:repeat(4,1fr) !important}
@media(max-width:1000px){.vp-vier{grid-template-columns:1fr 1fr !important}}
@media(max-width:640px){.vp-vier{grid-template-columns:1fr !important}}
.video-kader{max-width:1000px;margin:40px auto 30px;aspect-ratio:16/9;border-radius:12px;overflow:hidden;background:#000;box-shadow:0 30px 60px -32px rgba(58,58,52,.55)}
.video-kader iframe{width:100%;height:100%;border:0;display:block}
/* jouw merk */
.jm-intro p{max-width:58ch}
.jm-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:34px}
.jm-nav a{border:1.5px solid var(--tekst);border-radius:999px;padding:.7em 1.2em;font:600 .68rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--tekst);text-decoration:none}
.jm-nav a:hover{background:var(--tekst);color:#fff}
.jm-groep{padding-block:clamp(70px,8vw,110px)}
.jm-faq h3{display:flex;gap:16px;align-items:baseline}
.jm-nr{font-family:var(--serif);font-style:italic;color:var(--terra);font-size:1.6rem;min-width:2ch}
.jm-faq p{padding-left:calc(2ch + 16px + .5rem);font-size:1rem}
.jm-groep{scroll-margin-top:70px}
@media(max-width:640px){.jm-faq p{padding-left:0}}
.vp-sectie--donker .vp-faq div{border-color:rgba(255,255,255,.15)}
.vp-sectie--donker .vp-faq h3{color:#fff}
.vp-sectie--donker .vp-faq p{color:#D9D4CC}
.vp-sectie--donker .jm-nr{color:var(--terra-licht)}
/* demo als laag op mobiel */
.demolaag{position:fixed;inset:0;z-index:300;background:#FAF8F6;display:flex;flex-direction:column}
.demolaag__kop{display:flex;align-items:center;justify-content:space-between;padding:10px 14px 10px 18px;background:#3F3E39;color:#fff;font:600 .72rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;flex:none}
.demolaag__kop button{width:40px;height:40px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:1.6rem;line-height:1;cursor:pointer}
.demolaag iframe{flex:1;width:100%;border:0;background:#fff}
body.demo-open{overflow:hidden}
body.demo-open .plakbalk,body.demo-open .bel,body.demo-open .bel__paneel{display:none !important}

/* ===== ronde 17 okt ===== */
/* demoknop: donkere pil met play en tekst */
.demo-kader .start{background:linear-gradient(180deg,rgba(58,58,52,.08),rgba(58,58,52,.42)) !important;transition:background .3s}
.demo-kader .start:hover{background:linear-gradient(180deg,rgba(58,58,52,.12),rgba(58,58,52,.55)) !important}
.start__knop{display:inline-flex;align-items:center;gap:16px;background:var(--grijs-diep,#3A3A34);color:#fff;border-radius:999px;
  padding:9px 30px 9px 9px;box-shadow:0 22px 44px -18px rgba(30,28,24,.7);transition:transform .3s}
.demo-kader .start:hover .start__knop{transform:translateY(-3px)}
.start__knop .play{width:56px !important;height:56px !important;background:var(--terra) !important;flex:none}
.start__tekst{font-family:var(--sans);font-size:.78rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
@media(max-width:700px){.start__knop{gap:12px;padding:7px 22px 7px 7px}.start__knop .play{width:46px !important;height:46px !important}.start__tekst{font-size:.7rem;letter-spacing:.16em}}
/* kies je vraag op mobiel: telefoon helemaal in beeld */
@media(max-width:900px){.wm__beeld img{object-position:36% center !important}}
/* donkere banden op mobiel verder uitgezoomd */
@media(max-width:900px){
  .vp-band__bg{height:min(100%,135vw) !important;object-fit:cover !important;
    -webkit-mask-image:linear-gradient(180deg,#000 60%,transparent 100%);mask-image:linear-gradient(180deg,#000 60%,transparent 100%)}
  .vp-band__bg.pos-dnband{object-position:center 20% !important}
  .vp-band__bg.pos-meeneem{object-position:center 30% !important}
}
@media(max-width:900px){.vp-band__bg.pos-meeneem{height:min(100%,95vw) !important;object-position:center 20% !important}}
.vp-werk__beeld>img[src*="f-telefoon"]{object-position:60% center}
/* demo-voorkant: A helder scherm, B donker met foto */
.poster--beeld picture{position:absolute;inset:0}
.poster--beeld picture img{width:100%;height:100%;object-fit:cover;object-position:top}
.poster__donker{display:none}
.demo-kader--helder .start{background:linear-gradient(180deg,rgba(58,58,52,0) 55%,rgba(58,58,52,.18)) !important}
.demo-kader--donker .poster__donker{display:flex;position:absolute;inset:0;background:#3A3A34;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding-bottom:120px}
.poster__donker img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1);opacity:.22}
.poster__donker span{position:relative;font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:#D9D4CC}
.poster__donker span::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--fluor,#FF4FA3);margin-left:12px;vertical-align:middle}
.poster__donker b{position:relative;font-family:var(--serif);font-weight:400;color:#fff;font-size:clamp(2rem,4vw,3.4rem);line-height:1.1}
.poster__donker b em{color:var(--terra-licht,#D8BFB4)}
.demo-kader--donker .start{background:none !important}
.demo-kader--donker .start__knop{margin-top:190px}
@media(max-width:700px){.demo-kader--donker .poster__donker{padding-bottom:100px}.demo-kader--donker .start__knop{margin-top:150px}}
.poster__donker b em{display:inline !important;font-family:var(--serif) !important;font-style:italic !important;font-weight:400 !important;font-size:inherit !important;margin:0 !important;color:#D8BFB4 !important;letter-spacing:0 !important}
@media(max-width:900px){.wm__beeld{min-height:100vw !important}}
@media(max-width:900px){.werk-mobiel.open .wm__antwoord{position:relative !important;inset:auto !important;min-height:100vw}}
/* demo naast de foto: tekst en knipperende knop */
.demo-blok{margin-top:38px;padding-top:30px;border-top:1px solid var(--lijn)}
.demo-blok h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.5rem,2.2vw,2rem);line-height:1.2;margin:10px 0 10px}
.demo-blok h3 em{color:var(--terra)}
.demo-blok p{margin:0 0 24px}
.demo-knop{display:inline-flex;align-items:center;gap:16px;border:0;cursor:pointer;background:var(--grijs-diep,#46463F);color:#fff;border-radius:999px;padding:8px 28px 8px 8px;
  box-shadow:0 18px 36px -18px rgba(30,28,24,.6);animation:knipper 2.2s ease-out infinite;transition:transform .3s,background .3s}
.demo-knop:hover{transform:translateY(-2px);background:#3A3A34}
.demo-knop .play{width:50px;height:50px;border-radius:50%;background:var(--terra);display:grid;place-items:center;animation:none !important;box-shadow:none !important}
.demo-knop .play svg{width:16px;height:16px;fill:#fff;margin-left:3px}
@keyframes knipper{0%{box-shadow:0 0 0 0 rgba(255,79,163,.55),0 18px 36px -18px rgba(30,28,24,.6)}70%{box-shadow:0 0 0 16px rgba(255,79,163,0),0 18px 36px -18px rgba(30,28,24,.6)}100%{box-shadow:0 0 0 0 rgba(255,79,163,0),0 18px 36px -18px rgba(30,28,24,.6)}}
@media(prefers-reduced-motion:reduce){.demo-knop{animation:none}}
/* demolaag: op de computer als venster, op mobiel schermvullend */
.demolaag{background:rgba(30,28,24,.72) !important;display:grid !important;place-items:center}
.demolaag__doos{display:flex;flex-direction:column;width:min(1280px,92vw);height:min(820px,88vh);background:#FAF8F6;border-radius:12px;overflow:hidden;box-shadow:0 40px 80px -30px rgba(0,0,0,.6)}
.demolaag__doos iframe{flex:1;width:100%;border:0;background:#fff}
@media(max-width:900px){.demolaag__doos{width:100%;height:100%;border-radius:0}}
body.demo-open{overflow:hidden}
.vp-split__tekst .demo-blok{display:block !important;width:100%;grid-template-columns:none !important;flex:none !important}
.demo-blok>*{max-width:none !important}
.demo-blok .vp-label{display:inline-flex !important}
.demo-blok h3,.demo-blok p{display:block !important;width:auto !important}
.demo-blok .demo-knop{display:inline-flex !important;width:auto !important;height:auto !important;border-radius:999px !important;aspect-ratio:auto !important}
.vp-split__tekst blockquote + .demo-blok{margin-top:34px}
.demo-blok{border-top:0 !important;padding-top:0 !important;margin-top:44px !important}
/* demo als foto met tekst erover */
.vp-demofoto{position:relative;overflow:hidden;display:flex;align-items:center;min-height:clamp(540px,44vw,660px);padding:clamp(48px,6vw,90px) var(--zijrand,clamp(20px,6vw,96px));background:#3A3A34;color:#fff}
.vp-demofoto__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center;transform:none !important}
.vp-demofoto::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(46,45,40,.92) 0%,rgba(46,45,40,.8) 30%,rgba(46,45,40,.25) 55%,rgba(46,45,40,0) 70%)}
.vp-demofoto__tekst{position:relative;z-index:2;max-width:500px}
.vp-demofoto .vp-label{color:#D9D4CC}
.vp-demofoto h2{color:#fff;margin:14px 0 16px}
.vp-demofoto h2 em{color:#D8BFB4}
.vp-demofoto p{color:#E6E1DA;margin:0 0 30px;font-size:1.02rem}
.vp-demofoto p em{color:#fff}
.vp-demofoto .demo-knop{background:#fff;color:var(--tekst)}
.vp-demofoto .demo-knop:hover{background:#F3EEE9}
@media(max-width:900px){
  .vp-demofoto{align-items:flex-end;min-height:0;padding-top:118vw;padding-bottom:48px}
  .vp-demofoto__bg{height:135vw;bottom:auto;object-position:84% top}
  .vp-demofoto::before{background:linear-gradient(180deg,rgba(46,45,40,0) 0,rgba(46,45,40,0) 60vw,rgba(46,45,40,.85) 112vw,#2E2D28 135vw,#2E2D28 100%)}
}
/* ===== ronde 17 okt middag ===== */
/* gecentreerde tekstblokken zonder foto */
.vp-midden{text-align:center}
.vp-midden .vp-lijst{display:inline-block;text-align:left;max-width:620px;margin-inline:auto}
.vp-midden blockquote{margin-inline:auto;max-width:560px;text-align:center;border:0 !important;padding-left:0 !important}
.vp-midden h2{margin-inline:auto}
/* demo met foto links, tekst rechts */
.vp-demofoto--links{justify-content:flex-end}
.vp-demofoto--links .vp-demofoto__bg{object-position:left center}
.vp-demofoto--links::before{background:linear-gradient(270deg,rgba(46,45,40,.92) 0%,rgba(46,45,40,.8) 30%,rgba(46,45,40,.25) 55%,rgba(46,45,40,0) 70%)}
@media(max-width:900px){.vp-demofoto--links{justify-content:flex-start}.vp-demofoto--links .vp-demofoto__bg{object-position:16% top}
  .vp-demofoto--links::before{background:linear-gradient(180deg,rgba(46,45,40,0) 0,rgba(46,45,40,0) 60vw,rgba(46,45,40,.85) 112vw,#2E2D28 135vw,#2E2D28 100%)}}
/* training band iets uitgezoomd */
.vp-band__bg.pos-trband{object-position:center 20% !important}
/* over: tekst groter, foto smaller */
.vp-hero--over p{font-size:1.06rem !important;line-height:1.7;max-width:46ch}
/* home: telefoonfoto, vrouw meer naar rechts; dienstenband, vrouw hoger */
.vp-werk__beeld>img[src*="f-telefoon"]{object-position:30% center !important}
.vp-band__bg.pos-dienstband{object-position:center 42% !important}
.vp-midden blockquote{font-family:var(--serif) !important;font-style:italic;font-size:clamp(1.4rem,2vw,1.8rem) !important;color:var(--terra) !important;margin-top:34px !important}
.vp-band__bg.pos-dienstband{object-position:center 60% !important}
/* contactblokjes in donker vlak: hover blijft leesbaar */
.vp-slot--donker .slot__lijst a:hover,.vp-slot--donker .slot__lijst a:focus-visible{background:#F2ECE9 !important;border-color:#F2ECE9 !important;color:var(--tekst) !important}
.vp-slot--donker .slot__lijst a:hover small,.vp-slot--donker .slot__lijst a:focus-visible small{color:var(--terra-diep) !important}
.vp-slot:not(.vp-slot--donker) .slot__lijst a:hover,.vp-slot:not(.vp-slot--donker) .slot__lijst a:hover *{color:#fff !important}

/* ===== bovenste blokken gelijk aan home ===== */
@media(min-width:901px){
  .vp-hero .vp-hero__foto{align-self:stretch !important;max-height:none !important}
  .vp-hero .vp-hero__foto>img{position:absolute !important;inset:0;width:100%;height:100%;object-fit:cover !important}
  .vp-hero--links .vp-hero__tekst{padding-left:clamp(32px,4vw,72px) !important}
  .vp-hero h1,.vp-hero--lang h1,.vp-hero--over h1{font-size:clamp(2.6rem,4.4vw,4.8rem) !important;line-height:1.05}
}
.vp-hero__foto>img[src*="f-blouse"]{object-position:center 25% !important}
.vp-hero__foto>img[src*="f-schrijven-hero"]{object-position:center 20% !important}
.vp-hero__foto>img[src*="f-laptop-tafel"]{object-position:center center !important}
.vp-hero__foto>img[src*="f-zwart"]{object-position:center 20% !important}
/* punt 2: telefoonfoto uitzoomen */
.vp-werk__beeld>img[src*="f-telefoon"]{object-fit:cover;transform:none !important;object-position:35% 40% !important}
/* punt 3 en 4: banden */
.vp-band__bg.pos-trband{object-position:center 50% !important}
.vp-band__bg.pos-dnband{object-position:center 15% !important}
/* mobiel: genummerde rijen meer naar links */
@media(max-width:900px){
  .vp-rijen .vp-rij,.vp-rij{grid-template-columns:64px 1fr !important;gap:16px !important}
  .vp-rij b{font-size:3.2rem !important;text-align:left !important}
}
@media(min-width:901px){.vp-hero{min-height:min(calc(100vh / var(--z,1) - 72px),860px) !important}}
.vp-werk__beeld>img[src*="f-telefoon"]{object-position:40% bottom !important}
.vp-werk__beeld>img[src*="f-telefoon"]{object-position:38% center !important}
/* liggende foto's bovenaan: bredere fotokolom zodat er minder wordt ingezoomd */
@media(min-width:901px){
  .vp-hero--breed{grid-template-columns:.85fr 1.15fr !important}
  .vp-hero--links.vp-hero--breed{grid-template-columns:1.15fr .85fr !important}
  .vp-hero--breed h1{font-size:clamp(2.4rem,3.9vw,4.2rem) !important}
  .vp-hero--over .vp-hero__tekst p{font-size:1.16rem !important;line-height:1.65;max-width:60ch !important}
  .vp-hero--over .vp-hero__tekst{padding-right:clamp(40px,5vw,90px) !important}
}
.vp-hero--breed .vp-hero__foto>img.pos-apkhero{object-position:30% 30% !important}
@media(min-width:901px){.vp-hero--breed .vp-knoppen{flex-wrap:nowrap}.vp-hero--breed .vp-knoppen .vp-knop{padding-left:18px;padding-right:18px;white-space:nowrap}}

/* ===== rustiger op de computer: alles iets kleiner, meer lucht ===== */
@media(min-width:1200px){:root{--z:.85}html{zoom:.85}}
/* donkere banden met foto: foto loopt zacht over in de rand */
@media(min-width:901px){
  .vp-demofoto{overflow:visible !important}
  .vp-demofoto__bg,.vp-demofoto::before{left:calc(50% - 50vw / var(--z,1)) !important;right:auto !important;width:calc(100vw / var(--z,1)) !important}
  .vp-demofoto::before{background:linear-gradient(90deg,rgba(46,45,40,.95) 0%,rgba(46,45,40,.85) 35%,rgba(46,45,40,.25) 55%,rgba(46,45,40,0) 68%) !important}
  .vp-demofoto--links::before{background:linear-gradient(270deg,rgba(46,45,40,.95) 0%,rgba(46,45,40,.85) 35%,rgba(46,45,40,.25) 55%,rgba(46,45,40,0) 68%) !important}
}
/* kernwaarden */
.vp-waarden .vp-drie>div{border-top:1px solid var(--lijn);padding-top:26px}
.vp-waarden h3{font-family:var(--serif) !important;font-style:italic;font-weight:400;font-size:clamp(2.2rem,3.4vw,3.2rem) !important;color:var(--terra) !important;margin:0 0 14px}
.vp-waarden p{margin:0 0 18px}
.vp-waarden small{display:block;font-size:.86rem;color:var(--tekst-licht);line-height:1.6}
.vp-waarden small b{display:block;font:600 .68rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--terra-diep);margin-bottom:8px}
.vp-waarden-kort{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--terra);margin:6px 0 26px !important;letter-spacing:.02em}
.vp-band__intro{max-width:60ch;margin:0 auto 10px;color:#D9D4CC;text-align:center;position:relative}
@media(min-width:901px){.vp-demofoto__bg{max-width:none !important;height:100% !important;top:0 !important}}
/* diensten: uitvoering in twee rijen van twee */
@media(min-width:901px){.vp-drie.vp-twee{grid-template-columns:repeat(2,1fr);column-gap:clamp(40px,6vw,110px);row-gap:46px}}
.vp-slotzin{max-width:62ch;margin:44px auto 0 !important;text-align:center;font-family:var(--serif);font-style:italic;font-size:1.25rem;color:var(--terra-diep)}
.vp-klein{font-size:.92rem !important;color:var(--tekst-licht) !important}
.voet__klein a{color:inherit;text-decoration:none}.voet__klein a:hover{text-decoration:underline}
/* kernwaarden: donker, woorden komen een voor een binnen */
.vp-waarden2 .waarden{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(30px,4vw,70px);max-width:1100px;margin:56px auto 0;text-align:left}
.waarde b{display:block;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(3.2rem,6vw,5.6rem);line-height:1;color:#fff;margin-bottom:22px}
.waarde b i{color:var(--fluor,#FF4FA3);font-style:normal}
.waarde p{color:#D9D4CC;font-size:1.02rem;margin:0;max-width:30ch}
.waarde{opacity:0;transform:translateY(40px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.waarde.in{opacity:1;transform:none}
@media(max-width:900px){.vp-waarden2 .waarden{grid-template-columns:1fr;gap:42px}}
@media(prefers-reduced-motion:reduce){.waarde{opacity:1;transform:none;transition:none}}
@media(min-width:901px){.vp-drie.vp-twee{grid-template-columns:repeat(4,1fr) !important;column-gap:clamp(24px,2.6vw,44px) !important;row-gap:0 !important}}
.vp-slotzin{margin-top:34px !important;font-size:1.1rem}
.vp-hero__foto>img.pos-gesprekhero{object-position:42% 20% !important}
.vp-hero__foto>img.pos-gesprekhero{object-position:100% 30% !important}
@media(min-width:901px){.vp-hero--gesprek{grid-template-columns:.75fr 1.25fr !important}}
@media(min-width:901px){.vp-hero__foto>img.pos-gesprekhero{object-position:30% 30% !important}}
.vp-hero:not(.vp-hero--breed) .vp-hero__foto>img.pos-apkhero{object-position:60% 30% !important}
@media(min-width:901px){
  .vp-hero--tel{grid-template-columns:1fr 1fr !important;min-height:0 !important}
  .vp-hero--tel .vp-hero__foto{min-height:0 !important}
  .vp-hero--tel .vp-hero__tekst{padding-top:clamp(56px,6vw,90px) !important;padding-bottom:clamp(56px,6vw,90px) !important}
  .vp-hero--tel .vp-hero__foto>img.pos-apkhero{object-position:0% 40% !important}
}
@media(min-width:901px){.vp-hero--tel .vp-hero__foto{max-width:none !important;width:100% !important;margin:0 !important}}
@media(min-width:901px){
  .vp-hero--tel{grid-template-columns:.88fr 1.12fr !important}
  .vp-hero--tel .vp-hero__foto>img{transform:none !important;object-position:4% 50% !important}
}
/* cookiemelding onderaan in het midden */
@media(min-width:701px){.cookie{left:50% !important;right:auto !important;transform:translateX(-50%);width:min(560px,calc(100% - 28px));bottom:20px}}
/* mobiel: uitsnedes per foto */
@media(max-width:900px){
  .vp-band__bg.pos-dnband{object-position:21% 15% !important}
  .vp-band__bg.pos-trband{height:100% !important;object-position:center 30% !important}
  .vp-hero__foto>img.pos-gesprekhero{object-position:55% 30% !important}
  .vp-split__foto img[src*="denim-tafel"]{object-position:42% 45% !important}
  .vp-hero__foto>img.pos-apkhero{object-position:25% 30% !important}
}
@media(max-width:900px){
  .vp-split__foto img[src*="denim-tafel"]{object-position:42% 85% !important}
  .vp-hero__foto>img.pos-apkhero{object-position:0% 30% !important}
}
@media(max-width:900px){.vp-split__foto img[src*="denim-tafel"]{object-position:42% 100% !important}}
/* mobiel: foto's echt zichtbaar anders */
@media(max-width:900px){
  .vp-split__foto picture{display:block;width:100%;height:100%}
  .vp-split__foto picture img{width:100%;height:100%;object-fit:cover;object-position:40% 0% !important}
  .vp-hero--tel .vp-hero__foto{height:auto !important;min-height:0 !important;aspect-ratio:1200/879 !important}
  .vp-hero--tel .vp-hero__foto>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center !important;transform:none !important}
}
.review-vraag{text-align:center;margin:34px 0 0;font-size:.95rem;color:var(--tekst-licht)}
.review-vraag a{color:var(--tekst);font-weight:600;text-decoration:none;border-bottom:1px solid var(--terra);padding-bottom:2px;margin-left:6px}
.review-vraag a:hover{color:var(--terra-diep)}
.vp-hero__foto>img.pos-homehero{object-position:62% 20% !important}
.vp-hero__foto>img.pos-asshero2{object-position:40% 15% !important}
@media(max-width:900px){.vp-hero__foto>img.pos-asshero2{object-position:42% 10% !important}.vp-hero__foto>img.pos-homehero{object-position:60% 15% !important}}
/* ronde 17 okt avond */
@media(min-width:901px){
  .vp-hero--gesprek{grid-template-columns:.72fr 1.28fr !important}
  .vp-hero--gesprek .vp-hero__foto>img.pos-gesprekhero{object-position:40% 25% !important}
  .vp-band__bg.pos-trband{transform:scale(1.22) !important;transform-origin:50% 30%;object-position:center 30% !important}
}
.vp-hero__foto>img.pos-vest{object-position:50% 20% !important}
.vp-hero__foto>img.pos-asshero2{object-position:37% 15% !important}
.vp-werk__beeld>img[src*="stoel-wit"],.wm__beeld img[src*="stoel-wit"]{object-position:50% 30%}
/* mobiel: alle foto's over de volle breedte */
@media(max-width:900px){
  .werk-mobiel .wm__beeld{margin-left:calc(-1 * var(--gut,20px));margin-right:calc(-1 * var(--gut,20px));border-radius:0 !important}
  .vp-over2__rechts .vp-over2__foto,.vp-over2 img.vp-over2__foto{width:calc(100% + 2 * var(--gut,20px)) !important;max-width:none !important;margin-left:calc(-1 * var(--gut,20px)) !important}
}
@media(min-width:901px){.vp-demofoto__bg{object-position:left 12% !important}.vp-demofoto:not(.vp-demofoto--links) .vp-demofoto__bg{object-position:right 12% !important}}
.vp-werk__beeld>img[src*="stoel-denim2"],.wm__beeld img[src*="stoel-denim2"]{object-position:55% 25%}
blockquote.visie{font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,2.3vw,2rem);line-height:1.35;color:var(--terra-diep);border:0;padding:0 0 0 22px;margin:26px 0;position:relative;max-width:30ch}
blockquote.visie::before{content:"";position:absolute;left:0;top:.3em;bottom:.3em;width:3px;background:var(--terra);border-radius:2px}
input,textarea,select{font-size:max(16px,1em)}
/* bovenste foto binnen dezelfde marge als de rest van de pagina */
@media(min-width:901px){
  .vp-hero:not(.vp-hero--links){padding-right:var(--zijrand) !important}
  .vp-hero.vp-hero--links{padding-left:var(--zijrand) !important}
  .vp-hero.vp-hero--links .vp-hero__tekst{padding-left:clamp(32px,4vw,72px) !important}
}
/* home: twee demokaarten */
.proef-kaarten{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px);max-width:1000px;margin:44px auto 0}
.proef-kaart{background:#FAF8F6;border:1px solid var(--lijn);border-radius:14px;padding:clamp(28px,3vw,44px);text-align:left;display:flex;flex-direction:column;gap:14px}
.proef-kaart h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.3rem,1.8vw,1.6rem);line-height:1.3;margin:0 0 10px;color:var(--tekst)}
.proef-kaart .demo-knop{align-self:flex-start;margin-top:auto}
@media(max-width:900px){.proef-kaarten{grid-template-columns:1fr}}
/* drie stappen op home */
.werk-intro{max-width:56ch;margin:18px auto 0;color:#D9D4CC;font-size:1.05rem;text-align:center}
.stap-nr,.wm__vraag small{display:block;font:600 .7rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--terra-licht,#D8BFB4);margin:22px 0 -12px}
.wm__vraag small{margin:0 0 6px}
.vp-werk__klik p{color:#D9D4CC !important;margin:0 !important;font-size:.95rem}
.wm__vraag span{display:block;font-size:.88rem;color:#D9D4CC;margin-top:4px;font-family:var(--sans)}
@media(min-width:901px){
  .werk-stappen{position:relative}
  .werk-stappen .vp-werk__kaart{position:relative}
  .werk-stappen .vp-werk__kaart:not(:last-child)::after{content:"";position:absolute;top:50%;right:calc(-1 * clamp(12px,1.6vw,24px));width:clamp(12px,1.6vw,24px);height:1px;background:var(--terra-licht,#D8BFB4);opacity:.6}
}
.stap-tag{display:block;font:600 .66rem/1.3 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--terra);margin:0 0 10px}
.vp-band .stap-tag,.vp-sectie--donker .stap-tag{color:var(--terra-licht,#D8BFB4)}
.dienst-samen{margin-top:14px !important}
.vp-werk__beeld>img[src*="f-schrijven.jpg"]{object-position:28% 30% !important}
/* tijdelijk: live-confetti */
.vp-hero__foto .confetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
.live-label{position:absolute;left:50%;bottom:28px;z-index:4;transform:translate(-50%,16px);opacity:0;background:rgba(58,58,52,.88);color:#fff;
  font:600 .74rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;padding:14px 22px;border-radius:999px;white-space:nowrap;
  box-shadow:0 0 0 1px #C9A45C inset,0 14px 30px -14px rgba(0,0,0,.6);transition:opacity .7s,transform .7s}
.live-label::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#C9A45C;margin-right:10px;vertical-align:middle}
.live-label.in{opacity:1;transform:translate(-50%,0)}
.live-label.uit{opacity:0;transform:translate(-50%,10px)}
/* kernwaarden als rustige band boven kennismaken */
.waarden-band{overflow:hidden;background:#EFE8E1;padding:clamp(22px,3vw,36px) 0;max-width:none !important;width:calc(100vw / var(--z,1));margin-left:calc(50% - 50vw / var(--z,1))}
.waarden-band__rij{display:flex;align-items:center;gap:clamp(28px,4vw,64px);width:max-content;animation:waardenloop 60s linear infinite}
.waarden-band span{font-family:var(--serif);font-style:italic;font-size:clamp(2rem,4.2vw,3.6rem);color:var(--terra-diep);line-height:1;white-space:nowrap}
.waarden-band i{width:9px;height:9px;border-radius:50%;background:var(--fluor,#FF4FA3);flex:none}
@keyframes waardenloop{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.waarden-band__rij{animation:none}}
/* merkcheck */
.merkcheck-cta{margin-top:54px;text-align:center}
.merkcheck-cta p{color:#D9D4CC;margin:0 0 14px;font-family:var(--serif);font-style:italic;font-size:1.25rem}
.merkcheck{position:fixed;inset:0;z-index:300;background:rgba(30,28,24,.72);display:grid;place-items:center;padding:16px}
.mc__doos{width:min(620px,100%);background:#FAF8F6;border-radius:14px;overflow:hidden;box-shadow:0 40px 80px -30px rgba(0,0,0,.6)}
.mc__kop{display:flex;align-items:center;justify-content:space-between;padding:12px 14px 12px 22px;background:#3F3E39;color:#fff;font:600 .72rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase}
.mc__kop button{width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:1.5rem;cursor:pointer}
.mc__inhoud{padding:clamp(24px,4vw,40px)}
.mc__voortgang{height:3px;background:var(--lijn);border-radius:3px;overflow:hidden;margin-bottom:22px}
.mc__voortgang span{display:block;height:100%;background:var(--terra);transition:width .4s}
.mc__nr{display:block;font:600 .68rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--terra-diep);margin-bottom:12px}
.mc__inhoud h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.35rem,2.4vw,1.75rem);line-height:1.3;margin:0 0 24px;color:var(--tekst)}
.mc__opties{display:grid;gap:10px}
.mc__opties button{text-align:left;padding:16px 20px;border:1px solid var(--lijn);border-radius:10px;background:#fff;font:500 1rem var(--sans);color:var(--tekst);cursor:pointer;transition:border-color .2s,transform .2s}
.mc__opties button:hover{border-color:var(--terra);transform:translateX(3px)}
.mc__terug{margin-top:18px;border:0;background:none;color:var(--tekst-licht);font:500 .85rem var(--sans);cursor:pointer;padding:0}
.mc__sub{font-family:var(--serif);font-style:italic;color:var(--terra-diep);font-size:1.15rem;margin:-14px 0 14px}
.mc__knoppen{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
/* merkcheck in de pagina */
#merkcheck{max-width:640px;margin:64px auto 0}
#merkcheck>p{color:#D9D4CC;margin:0 0 18px;font-family:var(--serif);font-style:italic;font-size:1.3rem;text-align:center}
#merkcheck .mc__doos{width:100%;text-align:left;box-shadow:0 30px 60px -30px rgba(0,0,0,.5)}
#merkcheck .mc__inhoud p{color:var(--tekst)}
@media(max-width:900px){#merkcheck{margin-top:44px}#merkcheck .mc__inhoud{padding:24px 20px}}
#merkcheck .mc__inhoud p{font-family:var(--sans);font-style:normal;font-size:1rem;line-height:1.65;margin:0 0 12px}
#merkcheck .mc__inhoud p.mc__sub{font-family:var(--serif);font-style:italic;font-size:1.15rem;color:var(--terra-diep);margin:-14px 0 14px}
#merkcheck .mc__inhoud h3{color:var(--tekst)}
/* merkcheck v2: magazine-opmaak */
#merkcheck.mc2{max-width:none;margin:88px 0 0;display:grid;grid-template-columns:5fr 7fr;gap:clamp(32px,6vw,96px);align-items:center;border-top:1px solid rgba(255,255,255,.14);padding-top:72px}
.mc2__label{display:block;font:600 .7rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#C9A89A;margin-bottom:18px}
.mc2__intro h3{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,3.4vw,2.9rem);line-height:1.12;color:#fff;margin:0 0 16px}
.mc2__intro>p{color:#D9D4CC;font-size:1.05rem;line-height:1.65;margin:0 0 32px;max-width:30ch}
.mc2__stappen{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.mc2__stappen li{display:flex;align-items:center;gap:14px;padding:10px 0;color:rgba(255,255,255,.45);font:500 .95rem var(--sans);transition:color .35s}
.mc2__stappen b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,.25);font:400 1rem var(--serif);transition:all .35s}
.mc2__stappen li.nu{color:#fff}
.mc2__stappen li.nu b{border-color:#C9A89A;color:#C9A89A}
.mc2__stappen li.uit{color:#fff}
.mc2__stappen li.uit b{background:var(--terra);border-color:var(--terra);color:#fff;transform:scale(1.12)}
.mc2__kaart{background:#FAF8F6;border-radius:18px;padding:clamp(28px,4vw,52px);box-shadow:0 40px 80px -40px rgba(0,0,0,.6);min-height:380px;display:flex;flex-direction:column;justify-content:center}
.mc2__top{display:flex;align-items:center;gap:20px;margin-bottom:26px}
.mc2__nr{font:400 2.4rem/1 var(--serif);color:var(--terra);white-space:nowrap}
.mc2__nr small{font-size:1rem;color:var(--tekst-licht)}
.mc2__balk{flex:1;display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.mc2__balk i{height:4px;border-radius:4px;background:#E6DED6;transition:background .4s}
.mc2__balk i.af{background:var(--terra)}
.mc2__balk i.nu{background:#C9A89A}
#merkcheck .mc2__kaart h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.5rem,2.3vw,1.95rem);line-height:1.28;margin:0 0 30px;color:var(--tekst)}
#merkcheck .mc__opties{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
#merkcheck .mc__opties button{text-align:center;padding:16px 10px;border:1.5px solid #3F3E39;border-radius:999px;background:transparent;font:600 .78rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#3F3E39;transition:background .2s,color .2s,transform .2s}
#merkcheck .mc__opties button:hover,#merkcheck .mc__opties button:focus-visible{background:#3F3E39;color:#fff;transform:translateY(-2px)}
#merkcheck .mc__terug{margin-top:22px;align-self:flex-start}
#merkcheck .mc__nr{margin-bottom:10px}
.mc2-in>*{animation:mc2in .45s cubic-bezier(.2,.7,.2,1) both}
.mc2-in>*:nth-child(2){animation-delay:.05s}.mc2-in>*:nth-child(3){animation-delay:.1s}.mc2-in>*:nth-child(4){animation-delay:.15s}
@keyframes mc2in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.mc2-in>*{animation:none}}
.mc__inhoud{display:flex;flex-direction:column}
@media(max-width:900px){
 #merkcheck.mc2{grid-template-columns:1fr;gap:28px;margin-top:56px;padding-top:48px}
 .mc2__intro>p{margin-bottom:18px}
 .mc2__stappen{grid-template-columns:repeat(3,1fr);gap:8px}
 .mc2__stappen li{flex-direction:column;text-align:center;gap:8px;font-size:.78rem;line-height:1.3;padding:0}
 .mc2__kaart{min-height:0;padding:26px 20px;border-radius:14px}
 .mc2__nr{font-size:1.9rem}
 #merkcheck .mc__opties button{padding:15px 4px;letter-spacing:.08em;font-size:.72rem}
}
#merkcheck.mc2,#merkcheck.mc2 *{text-align:left}
#merkcheck .mc__opties button{text-align:center}
.mc2__intro>p{margin-left:0}
.mc2__stappen b{color:rgba(255,255,255,.55)}
#merkcheck .mc__opties button:hover{background:transparent;color:#3F3E39;transform:none}
@media(hover:hover){#merkcheck .mc__opties button:hover{background:#3F3E39;color:#fff;transform:translateY(-2px)}}
#merkcheck .mc__opties button{white-space:nowrap}
@media(max-width:900px){
 #merkcheck.mc2 .mc2__stappen li{text-align:center}
 #merkcheck .mc__opties button{letter-spacing:.05em;font-size:.7rem;padding:15px 2px}
}
/* merkcheck v3: eigen licht blok */
.mc3{padding-top:clamp(64px,7vw,96px)!important;padding-bottom:clamp(64px,7vw,96px)!important}
.mc3__grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:5fr 6fr;gap:clamp(32px,6vw,90px);align-items:center;text-align:left}
.mc3__intro .vp-label{display:inline-block}
.mc3__intro h2{margin:12px 0 14px;text-align:left}
.mc3__intro p{margin:0;max-width:34ch;text-align:left}
.mc3__vraag{border-left:1px solid var(--lijn);padding-left:clamp(28px,4vw,56px);min-height:210px;display:flex;align-items:center}
.mc3__vraag .mc__inhoud{width:100%}
#merkcheck.mc3__grid .mc2__top{display:flex;align-items:center;gap:18px;margin-bottom:16px}
#merkcheck .mc2__nr{font-size:1.6rem}
#merkcheck .mc3__vraag h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.3rem,1.9vw,1.6rem);line-height:1.3;margin:0 0 22px;color:var(--tekst);text-align:left}
#merkcheck .mc3__vraag p{font-family:var(--sans);font-style:normal;font-size:1rem;line-height:1.65;margin:0 0 6px;color:var(--tekst);text-align:left}
#merkcheck .mc__opties{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
#merkcheck .mc__opties button{text-align:center;white-space:nowrap;padding:14px 8px;border:1.5px solid #3F3E39;border-radius:999px;background:transparent;font:600 .74rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#3F3E39;cursor:pointer;transition:background .2s,color .2s}
@media(hover:hover){#merkcheck .mc__opties button:hover{background:#3F3E39;color:#fff}}
#merkcheck .mc__terug{margin-top:16px;border:0;background:none;color:var(--tekst-licht);font:500 .85rem var(--sans);cursor:pointer;padding:0}
#merkcheck .mc__nr{display:block;font:600 .68rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--terra-diep);margin-bottom:8px}
#merkcheck .mc__knoppen{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.mc2__balk i{background:#DDD3C9}
@media(max-width:900px){
 .mc3__grid{grid-template-columns:1fr;gap:26px}
 .mc3__vraag{border-left:0;padding-left:0;border-top:1px solid var(--lijn);padding-top:24px;min-height:0}
 #merkcheck .mc__opties button{letter-spacing:.05em;font-size:.7rem;padding:14px 2px}
}
#merkcheck.mc3__grid{max-width:1100px;margin:0 auto;padding:0;border:0}
#merkcheck .mc3__vraag .mc__inhoud{padding:0}
@media(max-width:900px){
 .wm__beeld:has(img[src*="stoel-denim2"]){min-height:124vw !important}
 .wm__beeld img[src*="stoel-denim2"]{object-position:50% 100% !important}
 .wm__vraag small{letter-spacing:.12em;font-size:.64rem;white-space:nowrap}
}
.routes .vp-drie>div{text-align:left}
.routes .vp-drie a{display:inline-block;margin-top:12px;font:600 .74rem var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--terra-diep);text-decoration:none}
#merkcheck .mc__uitbesteed{margin-top:16px !important;font-size:.92rem !important;color:var(--tekst-licht) !important}
#merkcheck .mc__uitbesteed a{color:var(--terra-diep);font-weight:600}
.hero-echt{margin-top:14px !important;font-family:var(--serif);font-style:italic;font-size:1.2rem !important;color:var(--terra-diep)}
@media(min-width:1001px){.stemmen--beeld{max-width:90% !important;margin-left:auto !important;margin-right:auto !important}}
/* quotes op de foto (Over) */
.vp-hero--over .vp-hero__foto{position:relative}
.foto-quote{position:absolute;left:0;right:0;bottom:0;padding:90px clamp(22px,3vw,40px) clamp(24px,3vw,38px);background:linear-gradient(to top,rgba(20,19,17,.82),rgba(20,19,17,.55) 60%,transparent);z-index:2}
.foto-quote blockquote{margin:0;font-family:var(--serif);font-style:italic;font-size:clamp(1.05rem,1.35vw,1.3rem);line-height:1.4;color:#fff;max-width:30ch;padding-left:16px;border-left:2px solid var(--terra)}
.foto-quote .foto-quote__kort{margin-top:14px;font-size:clamp(.95rem,1.1vw,1.08rem);color:#E6D3CA}
@media(max-width:900px){.foto-quote{padding:70px 20px 22px}.foto-quote blockquote{font-size:1.02rem}}
@media(min-width:901px){
 .vp-hero--over{grid-template-columns:1fr 1fr !important}
 .vp-hero--over .vp-hero__foto{max-width:none !important;width:100% !important}
}
@media(max-width:900px){
 .vp-hero--over .vp-hero__foto{overflow:visible;height:auto !important}
 .vp-hero--over .vp-hero__foto img{height:60vh;width:100%;object-fit:cover;display:block}
 .vp-hero--over .foto-quote{position:static;background:#3F3E39;padding:22px 20px 24px}
}
@media(max-width:900px){.vp-hero--over .vp-hero__foto img{position:relative !important;inset:auto !important;height:60vh !important}}
.foto-quote blockquote{max-width:none !important;font-size:clamp(1.15rem,1.5vw,1.4rem) !important}
.vp-werk__beeld>img[src*="f-schrijven2"]{object-position:55% 40% !important}
.wm__beeld img[src*="f-schrijven2"]{object-position:55% 40% !important}
.vp-werk__beeld>img[src*="stoel-denim2-uit"]{object-position:50% 20% !important}
/* Over: quote hoger en groter */
.vp-hero--over .foto-quote{padding:120px clamp(28px,3.4vw,48px) clamp(70px,9vh,120px) !important}
.vp-hero--over .foto-quote blockquote{font-size:clamp(1.4rem,1.9vw,1.8rem) !important;line-height:1.35;max-width:24ch !important}
@media(max-width:900px){.vp-hero--over .foto-quote{padding:22px 20px 24px !important}.vp-hero--over .foto-quote blockquote{font-size:1.15rem !important;max-width:none !important}}
.vp-werk__beeld>img[src*="stoel-denim3"]{object-position:50% 25% !important}
@media(min-width:901px){.uitvoering-twee{grid-template-columns:1fr 1fr !important;max-width:900px;margin-left:auto !important;margin-right:auto !important}}
.live-training{margin-top:26px !important;padding-top:20px;border-top:1px solid var(--lijn);font-size:1rem}
.live-training a{color:var(--terra-diep);font-weight:600;white-space:nowrap}
@media(max-width:900px){.werk-mobiel.open .wm__beeld,.werk-mobiel.open .wm__beeld:has(img){min-height:0 !important}}
.plakbalk{transition:transform .3s,opacity .3s}
.plakbalk.plakbalk--weg{transform:translateY(110%);opacity:0;pointer-events:none}
@media(max-width:860px){footer.voet{padding-bottom:40px}}
/* uitvoering: twee kolommen, gecentreerd over de volle breedte */
@media(min-width:901px){section .vp-binnen.vp-drie.vp-twee.uitvoering-twee{grid-template-columns:1fr 1fr !important;gap:clamp(40px,5vw,80px) !important;max-width:980px !important;margin-left:auto !important;margin-right:auto !important}}
/* desktop: lopende tekst iets groter */
@media(min-width:1200px){
 main .vp-lijst li,main ul li,.vp-split__tekst p,section.vp-band>p,.vp-band__drie p,.vp-sectie>p,.vp-binnen p,.waarde p,.vp-demofoto__tekst p,.vp-over2__tekst p,.mc3__intro p,.vp-slot>p,.vp-slot p,.werk-intro,.vp-werk__antwoord p,#merkcheck .mc3__vraag p{font-size:1.12rem !important;line-height:1.62 !important}
 .vp-stap p,.vp-werk__klik p,.kaart p,.review-vraag{font-size:1.03rem !important}
 .vp-split__tekst p.vp-klein{font-size:.95rem !important}
}
.vp-split__foto img[src*="huisstijl-zand"]{object-fit:contain !important;background:#EFE8E1;padding:clamp(16px,2vw,32px) 0}
@media(min-width:1200px){
 main .vp-lijst li,main ul li,.vp-split__tekst p,section.vp-band>p,.vp-band__drie p,.vp-sectie>p,.vp-binnen p,.waarde p,.vp-demofoto__tekst p,.vp-over2__tekst p,.mc3__intro p,.vp-slot>p,.vp-slot p,.werk-intro,.vp-werk__antwoord p,#merkcheck .mc3__vraag p{font-size:1.22rem !important;line-height:1.6 !important}
 .vp-stap p,.vp-werk__klik p,.kaart p,.review-vraag{font-size:1.1rem !important}
 .vp-split__tekst p.vp-klein{font-size:1rem !important}
}
@media(min-width:901px){.vp-split--rechts .vp-split__foto:has(img[src*="huisstijl-zand"]){padding-right:var(--zijrand);background:#EFE8E1}}
@media(min-width:901px){.vp-split .vp-split__foto.foto-collage{padding-right:var(--zijrand) !important;background:#EFE8E1}
 .vp-split .vp-split__foto.foto-collage img{position:relative !important;inset:auto !important;width:100% !important;height:100% !important}}
.foto-collage img{transform:none !important}
/* tussenvariant: lopende tekst iets groter, kleine teksten weer klein */
@media(min-width:1200px){
 main .vp-lijst li,main ul li,.vp-split__tekst p,section.vp-band>p,.vp-band__drie p,.vp-sectie>p,.vp-binnen p,.waarde p,.vp-demofoto__tekst p,.vp-over2__tekst p,.mc3__intro p,.vp-slot>p,.vp-slot p,.werk-intro,.vp-werk__antwoord p,#merkcheck .mc3__vraag p{font-size:1.14rem !important;line-height:1.62 !important}
 .vp-stap p,.vp-werk__klik p,.kaart p,.review-vraag{font-size:.98rem !important}
 .vp-split__tekst p.vp-klein{font-size:.9rem !important}
}
@media(min-width:1200px){
 main .vp-lijst li,main ul li{font-size:1.06rem !important}
 section.vp-band ul li,.vp-band__drie li,.vp-band__drie p{font-size:1rem !important;line-height:1.55 !important}
}
@media(min-width:901px){
 .vp-werk__antwoord p,.vp-werk__antwoord li{font-size:.98rem !important;line-height:1.5 !important}
 .vp-werk__antwoord li{margin-bottom:4px !important}
 .vp-werk__antwoord h4{font-size:1.5rem !important;line-height:1.15 !important;margin-bottom:10px !important}
 .vp-werk__antwoord ul{margin:12px 0 18px !important}
}
@media(min-width:901px){.vp-werk__beeld .vp-werk__antwoord{padding:22px 24px !important}.vp-werk__antwoord ul{margin:10px 0 14px !important}}
.band-maatwerk{margin-top:22px !important;font-size:.95rem !important;color:#D9D4CC}
.band-maatwerk a{color:#fff;font-weight:600;border-bottom:1px solid rgba(255,255,255,.4);text-decoration:none}
.over-vvp{margin:-6px 0 22px !important;font-size:.95rem !important;color:var(--tekst-licht)}
.over-vvp a{color:var(--terra-diep);font-weight:600;text-decoration:none}
@media(min-width:901px){.vp-hero--over{grid-template-columns:.95fr 1.05fr !important}.vp-hero--over .vp-hero__foto img{object-position:center 22% !important}}
.vp-hero--over .vp-hero__foto img[src*="zwart-bank"]{object-position:center 45% !important}@media(max-width:900px){.vp-hero--over .vp-hero__foto img[src*="zwart-bank"]{object-position:center 25% !important}}
.bel__opties a.bel__wa{display:flex;align-items:center;gap:10px}
.bel__opties a.bel__wa::before{content:"";width:20px;height:20px;flex:none;background:#25D366;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm5.3 14.1c-.2.6-1.3 1.2-1.8 1.2s-1 .3-3.4-.7a11.7 11.7 0 0 1-4.6-4.1c-.4-.6-1.1-1.6-1.1-2.9s.7-2 1-2.3a1 1 0 0 1 .7-.3h.5c.2 0 .4 0 .6.5l.8 2c.1.2.1.4 0 .6l-.4.6-.3.4c-.1.2-.3.3-.1.6s.7 1.2 1.5 1.9a7 7 0 0 0 2.1 1.3c.3.1.4.1.6-.1l.8-1c.2-.3.4-.2.6-.1l1.9.9c.3.1.5.2.5.3s0 .6-.2 1.2z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-8.6 15.1L2 22l5-1.3A10 10 0 1 0 12 2zm5.3 14.1c-.2.6-1.3 1.2-1.8 1.2s-1 .3-3.4-.7a11.7 11.7 0 0 1-4.6-4.1c-.4-.6-1.1-1.6-1.1-2.9s.7-2 1-2.3a1 1 0 0 1 .7-.3h.5c.2 0 .4 0 .6.5l.8 2c.1.2.1.4 0 .6l-.4.6-.3.4c-.1.2-.3.3-.1.6s.7 1.2 1.5 1.9a7 7 0 0 0 2.1 1.3c.3.1.4.1.6-.1l.8-1c.2-.3.4-.2.6-.1l1.9.9c.3.1.5.2.5.3s0 .6-.2 1.2z'/%3E%3C/svg%3E") center/contain no-repeat}

.tools-slot{margin-top:36px !important;font-weight:600}
