@font-face{font-family:"Satoshi";src:url("../assets/fonts/satoshi-variable.woff2") format("woff2");font-weight:300 900;font-style:normal;font-display:swap}


:root{
  --color-indigo:#4338E0; --color-periwinkle:#7494FF; --color-orange:#FFA603; --color-peach:#FFE6CB;
  --color-logo-mauve:#C6A3BC; --color-logo-apricot:#FFD09C;
  --color-indigo-dark:#1E1A66; --color-indigo-dark-hover:#2A2486;
  --color-fog:#F7F7F8; --color-ash:#D1D1DB; --color-text-muted:#4B5563; --color-border-input:#6B7280;
  --color-tint-cream:#FFF7E8; --color-tint-periwinkle:#EEF2FF; --color-tint-mauve:#FBF1F7;
  --color-amber-dark:#8A5300; --color-mauve-dark:#7A4F6D;
  --gradient-hero:radial-gradient(at left top,#4338E0 38%,#7494FF 100%);
  --radius-button:40px; --radius-input:8px; --radius-image:8px; --radius-card:8px;
  --elevation-1:0 4px 24px rgba(18,18,23,.06);
  --font-display:"Satoshi",system-ui,sans-serif; --font-sans:"Satoshi",system-ui,sans-serif;
  --color-white:#FFFFFF;
  --color-black:#121217;
  --color-logo-violet:#856FE2;
  --color-logo-blush:#EFC3A5;
  --color-logo-amber:#FFBE5B;
  --color-error:#B42318;
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--font-sans);font-size:1.125rem;line-height:1.7;letter-spacing:.012em;color:var(--color-black);background:var(--color-white)}
h1,h2,h3,p,ul,ol,figure{margin:0}
a{color:inherit}
:focus-visible{outline:3px solid var(--color-indigo-dark);outline-offset:3px}
.on-dark :focus-visible{outline-color:var(--color-white)}
.wrap{width:100%;max-width:1200px;margin:0 auto;padding-left:clamp(16px,4vw,32px);padding-right:clamp(16px,4vw,32px)}
/* sectie-ruimte volgens Lemon Squeezy: 160 / 80 / 64 / 48px */
:root{--sec:10rem}
@media(max-width:991px){:root{--sec:5rem}}
@media(max-width:767px){:root{--sec:4rem}}
@media(max-width:479px){:root{--sec:3rem}}
.band{padding-top:var(--sec);padding-bottom:var(--sec)}
.display{font-family:var(--font-display);font-size:clamp(2.75rem,1.7rem + 4.4vw,5rem);line-height:1;letter-spacing:-0.025em;font-weight:500}
.h2{font-family:var(--font-display);font-size:clamp(2.125rem,1.6rem + 2vw,3rem);line-height:1.2;letter-spacing:-0.015em;font-weight:500;color:var(--color-black)}
.h3{font-family:var(--font-display);font-size:clamp(1.375rem,1.2rem + .6vw,1.625rem);line-height:1.25;letter-spacing:-0.015em;font-weight:500;color:var(--color-black)}
.lead{font-size:1.25rem;line-height:1.6;letter-spacing:.01em}
.muted{color:#6A6A87}
.muted strong,.lead strong,.muted b,.lead b{color:#121217;font-weight:450}
.on-dark .lead b,.on-dark .lead strong,.on-dark .muted b,.on-dark .muted strong{color:inherit}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border:0;border-radius:var(--radius-button);font:500 .9375rem/1.2 var(--font-sans);text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .15s ease-out,box-shadow .15s ease-out}
.btn-primary{background:var(--color-indigo-dark);color:var(--color-white)}
.btn-primary:hover{background:var(--color-indigo-dark-hover)}
.btn-light{background:var(--color-white);color:var(--color-indigo-dark)}
.btn-light:hover{background:var(--color-fog);box-shadow:var(--elevation-1)}
.btn-outline{background:transparent;color:var(--color-white);box-shadow:inset 0 0 0 1px #fff}
.btn-outline:hover{background:rgba(255,255,255,.12)}
.link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:500;color:var(--color-black);text-decoration:underline;text-underline-offset:4px;position:relative}
.link:hover{color:var(--color-indigo);text-decoration-thickness:2px}
.tile{display:flex;flex-direction:column;align-items:flex-start;gap:24px;padding:clamp(1.5rem,.8rem + 2vw,2.5rem);border-radius:var(--radius-card)}
.tile-fog{background:var(--color-fog)}
.tile-white{background:var(--color-white);box-shadow:inset 0 0 0 1px var(--color-ash)}
.tile .link{margin-top:auto}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:24px}
.ico{flex:none;width:56px;height:56px;border-radius:50%;background:var(--color-logo-apricot);color:var(--color-indigo-dark);display:flex;align-items:center;justify-content:center}
.stack{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.stack-lg{gap:clamp(2.5rem,1.5rem + 3vw,4rem)!important}
.announce{background:var(--color-orange);color:var(--color-indigo-dark);text-align:center;font-size:.875rem;font-weight:500;padding:10px 16px}
.announce a{font-weight:500}
.topbar{background:var(--color-fog);font-size:.875rem;font-weight:500;color:var(--color-text-muted)}
.topbar .wrap{padding-top:4px;padding-bottom:4px;display:flex;gap:4px 28px;flex-wrap:wrap;justify-content:flex-end}
.topbar a{text-decoration:none;display:inline-flex;align-items:center;min-height:44px}
.topbar a:hover{text-decoration:underline;color:var(--color-black)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:12px;padding-bottom:12px}
.nav-links{display:flex;gap:4px 8px;align-items:center;flex-wrap:wrap}
.nav-links a:not(.btn){display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;font-size:.9375rem;font-weight:500;color:var(--color-text-muted);text-decoration:none}
.nav-links a:not(.btn):hover{background:var(--color-fog);color:var(--color-black)}
.menu-btn{display:none}
.skip{position:absolute;left:16px;top:-80px;z-index:20;background:var(--color-indigo-dark);color:var(--color-white);padding:12px 20px;border-radius:var(--radius-button);font-weight:500;text-decoration:none}
.skip:focus{top:12px}
::selection{background:var(--color-logo-apricot);color:var(--color-indigo-dark)}
input,textarea{accent-color:var(--color-indigo);caret-color:var(--color-indigo)}
html{scrollbar-color:var(--color-ash) transparent;scroll-behavior:smooth}
.h2,.h3,.display{text-wrap:balance}
p{text-wrap:pretty}
.tile p,.split-copy p,.hero-text p{max-width:60ch}
.rows{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;width:100%}
.rows li{border-top:1px solid var(--color-ash)}
.rows li:not(.rows-note):nth-last-child(-n+3){border-bottom:1px solid var(--color-ash)}
.rows li:first-child:nth-last-child(3){border-bottom:0}
.rows li:first-child:nth-last-child(3)~li:last-child{margin-top:-1px}
.rows li.rows-note{border:0;display:flex;align-items:center;background:var(--color-fog,#f7f7f8);border-radius:var(--radius-card,8px);padding:24px 32px;margin-top:1px}
.rows .rows-note p{margin:0;font-size:.9375rem;line-height:1.6;max-width:none}
.rows .h3{font-size:clamp(1.25rem,1.1rem + .5vw,1.5rem)}
.rows a{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:28px 0;min-height:88px;color:var(--color-black);text-decoration:none}
.rows a:hover .h3{color:var(--color-indigo)}
.rows a:hover .arr{transform:translateX(4px)}
.rows .arr{flex:none;transition:transform .2s cubic-bezier(.16,1,.3,1)}
.rows .sub{display:block;font-size:.9375rem;color:var(--color-text-muted);margin-top:4px}
.steps{list-style:none;padding:0;width:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:48px}
.steps li{display:flex;flex-direction:column;gap:16px;align-items:flex-start;padding-top:32px;border-top:1px solid var(--color-ash)}
.todo{display:inline-block;border:2px dashed var(--color-border-input);border-radius:12px;padding:2px 10px;font-size:.9375rem;font-weight:500;color:var(--color-indigo-dark);background:var(--color-white)}
.req{color:var(--color-text-muted);font-weight:400}
.field .help{font-size:.875rem;color:var(--color-text-muted)}
.field input:focus-visible,.field textarea:focus-visible{border-color:var(--color-periwinkle,#7494FF);box-shadow:0 0 0 1px var(--color-periwinkle,#7494FF);outline:0}
.field.is-error input{border-color:var(--color-error,#B42318)}
.field .err{font-size:.875rem;font-weight:500;color:#B42318}
.btn[disabled]{background:var(--color-fog);color:var(--color-border-input);box-shadow:inset 0 0 0 1px var(--color-ash);cursor:not-allowed}
.mnav{display:none;position:relative}
.mnav summary{list-style:none;cursor:pointer}
.mnav summary::-webkit-details-marker{display:none}
.mnav ul{list-style:none;margin:0;padding:8px;position:absolute;right:0;top:56px;z-index:10;min-width:260px;background:var(--color-white);border-radius:12px;box-shadow:0 4px 24px rgba(18,18,23,.12),inset 0 0 0 1px var(--color-ash)}
.mnav li a{display:flex;align-items:center;min-height:48px;padding:0 16px;border-radius:999px;font-weight:500;text-decoration:none;color:var(--color-black)}
.mnav li a:not(.btn):hover{background:var(--color-fog)}
.grid-aud{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:24px}
.hero{background:var(--gradient-hero);color:var(--color-white)}
.hero .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:64px;padding-top:clamp(4rem,2.5rem + 5vw,7.5rem);padding-bottom:clamp(4rem,2.5rem + 5vw,7.5rem)}
.hero-text{flex:1 1 460px;display:flex;flex-direction:column;gap:32px;align-items:flex-start;min-width:0}
.hero-img{flex:8 1 380px;min-width:0}
.photo{display:block;width:100%;height:auto;object-fit:cover;border-radius:var(--radius-image)}
.hero-usps{flex:1 1 100%;background:rgba(30,26,102,.4);border-radius:var(--radius-card);padding:clamp(1.25rem,1rem + 1vw,2rem)}
.hero-usps .ico{background:rgba(255,255,255,.16);color:var(--color-white)}
.hero-usps .muted{color:rgba(255,255,255,.92)!important}
.hero-strip{background:rgba(30,26,102,.4);border-top:1px solid rgba(255,255,255,.28)}
.hero-strip .inner{list-style:none;margin:0 auto;max-width:1200px;padding:28px clamp(16px,4vw,32px);display:flex;flex-wrap:wrap;gap:16px 48px;justify-content:space-between;align-items:center}
.hero-strip li{display:flex;align-items:center;gap:12px;font-size:1.125rem;font-weight:500;color:var(--color-white)}
.chk{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;flex:none}
.trust{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:24px 32px}
.trust-item{display:flex;gap:16px;align-items:center}
.placeholder{display:inline-block;background:var(--color-white);border:2px dashed var(--color-border-input);color:var(--color-indigo-dark);border-radius:12px;padding:2px 10px;font-size:.9375rem;font-weight:500}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:clamp(30rem,20rem + 25vw,40rem)}
.h2,.h3,.display{overflow-wrap:break-word;hyphens:auto}
#slaapstoornissen .grid3>:last-child:nth-child(3n+1){grid-column:1/-1}
.split.rev .split-panel{order:2}
.split-panel{display:flex;align-items:center;justify-content:center;padding:clamp(3rem,2rem + 4vw,5rem) clamp(16px,4vw,48px)}
#onderzoek .split-panel{--pp:clamp(24px,5vw,72px);padding:var(--pp)}
@media(min-width:901px) and (max-height:1400px){
#onderzoek{min-height:0}
#onderzoek.split .split-panel .photo{align-self:center;width:auto;max-width:100%;height:min(calc(100vh - 2*var(--pp)),760px);aspect-ratio:1/1}
}
#onderzoek .split-panel .photo{width:100%;max-width:none;align-self:stretch;aspect-ratio:auto;object-fit:cover;object-position:50% 50%}
@media(max-width:900px){#onderzoek .split-panel .photo{align-self:auto;aspect-ratio:3/2}}
.split-copy{display:flex;flex-direction:column;gap:32px;align-items:flex-start;justify-content:center;padding:var(--sec) clamp(16px,5vw,96px)}
.split-copy>*{max-width:460px}
.split-copy>.h2{max-width:none}
.p-orange{background:var(--color-orange)}
.p-periwinkle{background:var(--color-periwinkle)}
.p-mauve{background:var(--color-logo-mauve)}
.t-cream{background:var(--color-tint-cream)}
.t-periwinkle{background:var(--color-tint-periwinkle)}
.t-mauve{background:var(--color-tint-mauve)}
.svcs{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.svc{display:flex;flex-direction:column;align-items:flex-start;gap:20px;background:var(--color-white);border-radius:var(--radius-card);padding:clamp(1.5rem,.8rem + 2vw,2.5rem)}
.svc .ico{width:72px;height:72px}
.svcs-a .svc .ico{width:56px;height:56px}
.svcs-b .svc .ico{width:auto;height:auto;justify-content:flex-start}
.svcs-b .svc .ico svg{width:40px;height:40px}
.svc .h3{font-size:clamp(1.5rem,1.2rem + 1vw,1.875rem);line-height:1.2;overflow-wrap:break-word}
.svc .link{margin-top:auto;text-decoration:none}
@media(max-width:900px){.svcs{grid-template-columns:minmax(0,1fr)}}
.cols3{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px clamp(32px,4vw,64px)}
.cols3 li{display:flex;flex-direction:column;align-items:flex-start;gap:24px;padding:24px;margin:-24px;border-radius:var(--radius-image);background:transparent;transition:background-color .2s ease-out}
.cols3 li:hover,.cols3 li:focus-within{background:var(--color-fog)}
@media(prefers-reduced-motion:reduce){.cols3 li{transition:none}}
@media(max-width:900px){.cols3 li{padding:16px;margin:-16px}}
.eyebrow{text-transform:uppercase;font-size:.875rem;font-weight:500;letter-spacing:.08em;color:var(--color-indigo);margin-bottom:16px}
.split-copy>.eyebrow{margin-bottom:0}
.cta .eyebrow{margin-bottom:8px}
.col-h{font-size:clamp(2rem,1.5rem + 1.6vw,2.75rem)!important;overflow-wrap:break-word}
.cols3 .link{margin-top:auto}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:900px){.cols3{grid-template-columns:minmax(0,1fr)}}
#werkwijze .cols3 li:hover,#werkwijze .cols3 li:focus-within{background:var(--color-white)}
.initials{width:64px;height:64px;border-radius:50%;background:var(--color-tint-periwinkle);color:var(--color-indigo-dark);font:600 1.125rem/1 var(--font-display);display:flex;align-items:center;justify-content:center;flex:none}
.story{align-items:stretch}
.story-panel{align-items:flex-start;justify-content:center}
.story-copy{position:sticky;top:96px;max-width:440px;display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.story-panel{--pp:clamp(24px,5vw,72px);padding:var(--pp)}
.story-panel .story-copy{width:100%;max-width:none}
.story-panel .photo{width:100%;max-width:none;aspect-ratio:4/5;object-fit:cover;object-position:50% 35%;flex:1;min-height:0}
.story-steps{justify-content:flex-start;padding-top:var(--sec);padding-bottom:var(--sec)}
.story-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:clamp(5rem,3rem + 8vw,10rem);max-width:460px}
.story-step{display:flex;flex-direction:column;gap:16px;align-items:flex-start;min-height:200px}
@keyframes st1{0%,38%{opacity:1;transform:none}41%,100%{opacity:0;transform:translateY(-24px)}}
@keyframes st2{0%,41%{opacity:0;transform:translateY(24px)}44%,53%{opacity:1;transform:none}56%,100%{opacity:0;transform:translateY(-24px)}}
@keyframes st3{0%,57%{opacity:0;transform:translateY(24px)}60%,100%{opacity:1;transform:none}}
.story-btn{margin-top:8px}
.story-head{display:flex;flex-direction:column;gap:16px}
.story-intro-grid{display:grid;grid-template-columns:minmax(0,488px) minmax(0,472px);justify-content:space-between;gap:2rem;align-items:start;max-width:1216px}
/* animaties zoals Lemon Squeezy: fade + 2rem omhoog, outCubic, bij in beeld komen */
@keyframes fade-up{from{opacity:0;transform:translateY(2rem)}to{opacity:1;transform:none}}
@keyframes fade-up-load{from{opacity:0;transform:translateY(2rem)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:no-preference){
.hero-text>*,.hero-img{animation:fade-up-load .6s cubic-bezier(.33,1,.68,1) backwards}
.hero-text>:nth-child(2){animation-delay:.15s}.hero-text>:nth-child(3){animation-delay:.3s}.hero-text>:nth-child(4){animation-delay:.45s}.hero-img{animation-delay:.3s}
}
/* reveal-on-scroll (script): fade + 2rem omhoog, 600ms outCubic, zoals Lemon Squeezy */
.js-rv .rv{opacity:0;transform:translateY(2rem);transition:opacity .8s cubic-bezier(.33,1,.68,1),transform .8s cubic-bezier(.33,1,.68,1)}
.js-rv .rv.rv-in{opacity:1;transform:none}
/* uitlijning op het raster van de intro (container 1152px, tekst 472px rechts) */
:root{--pad:clamp(16px,4vw,32px);--W:min(1152px,calc(100vw - 2*var(--pad)));--cl:calc((100vw - var(--W))/2)}
@media(min-width:1000px){
#werkwijze .story-steps{padding-left:max(16px,calc(var(--cl) + var(--W) - 472px - 50vw))}
#onderzoek .split-copy{padding-left:var(--cl)}
}
.story-intro-text{margin:calc(.875rem*1.7 + 16px) 0 0;font-size:18px;line-height:1.7}
@media(max-width:900px){.story-intro-text{margin-top:0}}
.story-intro-title{font-size:clamp(2.25rem,1.2rem + 3vw,3.5rem);line-height:1.14;letter-spacing:-0.03em}
@media(max-width:900px){.story-intro-grid{grid-template-columns:minmax(0,1fr)}}

.story-acc .acc-intro{max-width:460px;width:100%;display:flex;flex-direction:column;gap:20px;margin-bottom:clamp(1rem,.5rem + 1.5vw,1.75rem)}
.story-acc .acc-intro .story-intro-title{margin:0}
.story-acc .acc-intro .story-intro-text{margin:0;font-size:18px;line-height:1.7}
.story-acc .story-steps{flex-direction:column;align-items:flex-start}
.story-acc .acc-intro .story-intro-title{font-size:clamp(1.875rem,1.2rem + 1.6vw,2.5rem)}
.story-acc .story-panel{align-items:flex-start;padding-top:0;padding-bottom:0}
.story-acc .story-copy{position:sticky;top:0;height:100vh;min-height:560px;justify-content:center}
.story-acc .story-panel .photo{height:min(calc(100vh - 2*var(--pp)),760px)}
@media(max-width:900px){.story-acc .story-copy{position:static;height:auto;min-height:0;padding:0}.story-acc .story-panel .photo{height:auto;width:100%}}
@media(min-width:1500px){.story-acc .story-panel{padding-right:104px}.story-acc .story-copy{align-items:flex-end}}
.story-acc .story{min-height:0}
.story-acc .story-panel{align-items:center}
.story-acc .story-copy{position:static;align-items:center;width:100%}
.story-acc .story-panel .photo{flex:none;width:auto;max-width:100%;height:min(calc(100vh - 2*var(--pp)),760px);min-height:320px;aspect-ratio:4/5}
.story-acc .story-steps{justify-content:center;padding-top:var(--sec);padding-bottom:var(--sec)}
.story-acc .story-list{display:block;max-width:460px;width:100%}
.story-acc .story-step{display:block;min-height:0;border-top:1px solid var(--color-ash)}
.story-acc .story-step:last-child{border-bottom:1px solid var(--color-ash)}
.story-acc summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:20px;padding:26px 0;color:var(--color-black,#121217)}
.story-acc summary::-webkit-details-marker{display:none}
.story-acc .acc-n{font-size:.875rem;color:var(--color-indigo,#4338E0);min-width:1.5rem}
.story-acc .acc-t{flex:1;font-size:clamp(1.375rem,1rem + 1vw,1.75rem);line-height:1.2;letter-spacing:-.01em;font-weight:400;transition:color .2s ease-out}
.story-acc summary:hover .acc-t{color:var(--color-indigo,#4338E0)}
.story-acc .acc-a{color:var(--color-indigo,#4338E0);opacity:0;transition:transform .25s ease-out,opacity .2s ease-out}
.story-acc summary:hover .acc-a,.story-acc summary:focus-visible .acc-a{opacity:1}
.story-acc details[open] .acc-a{transform:rotate(90deg)}
.story-acc summary:focus-visible{outline:2px solid var(--color-periwinkle,#7494FF);outline-offset:2px}
.story-acc .acc-body{display:flex;flex-direction:column;gap:20px;align-items:flex-start;padding:0 0 28px 44px}
.story-acc .acc-body p{margin:0}
.story-acc .story .story-panel{align-items:center;padding-top:var(--pp);padding-bottom:var(--pp)}
.story-acc .story .story-copy{position:static;height:auto;min-height:0}
.story-acc .story .story-panel .photo{height:min(70vh,680px);min-height:320px}
@media(min-width:1500px){.story-acc .story .story-panel{padding-right:104px}.story-acc .story .story-copy{align-items:flex-end}#onderzoek.split .split-panel{padding-left:104px}#onderzoek.split .split-panel{justify-content:flex-start}}
#onderzoek.split .split-panel .photo{height:min(70vh,680px);min-height:320px}
@media(max-width:900px){.story-acc .story .story-panel .photo{height:auto;min-height:0}#onderzoek.split .split-panel .photo{height:auto}}
@media(max-width:900px){.story-acc .acc-intro,.story-acc .story-list{max-width:none}.story-acc .story-steps{align-items:stretch}.story-acc .acc-body{padding-left:44px;max-width:44rem}}
#onderzoek.split .split-panel .photo{aspect-ratio:4/5;object-position:50% 40%}
@media(min-width:901px){.story-acc .story,#onderzoek.split{min-height:max(800px,min(960px,100vh))}.story-acc .story-steps,#onderzoek .split-copy{justify-content:center}}
@media(min-width:901px){#onderzoek .split-copy,.story-acc .story-steps{padding-top:clamp(3rem,2rem + 4vw,6rem);padding-bottom:clamp(3rem,2rem + 4vw,6rem)}.story-acc .story .story-panel .photo,#onderzoek.split .split-panel .photo{height:min(78vh,780px)}}

@media(max-width:900px){.story-acc .story .story-panel .photo,#onderzoek.split .split-panel .photo{width:100%;height:auto;min-height:0;aspect-ratio:3/2;object-position:50% 40%}}


@media(min-width:901px) and (max-height:1400px) and (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){
.story-pin{height:calc(100vh + 1100px);view-timeline-name:--story;view-timeline-axis:block;position:relative}
.story-pin .story{position:sticky;top:0;height:100vh;min-height:560px}
.story-pin .story-panel{align-items:center}
.story-pin .story{grid-template-rows:minmax(0,1fr)}
.story-pin .story-panel{min-height:0}
.story-pin .story-copy{position:static;align-items:center}
.story-pin .story-panel .photo{position:static;flex:none;width:auto;max-width:100%;height:min(calc(100vh - 2*var(--pp)),760px);aspect-ratio:4/5}
.story-pin .story-steps{position:relative;padding-top:0;padding-bottom:0}
.story-pin .story-list{display:block;position:relative;height:100%;max-width:none;width:100%}
.story-pin .story-step{position:absolute;left:0;top:50%;margin-top:-110px;max-width:460px;animation-timeline:--story;animation-range:cover 0% cover 100%;animation-fill-mode:both;animation-timing-function:linear}
.story-pin .story-step:nth-child(1){animation-name:st1}
.story-pin .story-step:nth-child(2){animation-name:st2}
.story-pin .story-step:nth-child(3){animation-name:st3}
.story-pin .story-step:nth-child(3) .story-btn{pointer-events:auto}
}}
@media(max-width:900px){.story-copy{position:static}.story-list{gap:3rem}}
.mock{width:100%;max-width:400px;background:var(--color-white);border-radius:var(--radius-image);padding:24px;box-shadow:var(--elevation-1);display:flex;flex-direction:column;gap:16px}
.mock-row{display:flex;align-items:center;gap:16px}
.mock-row .ico{width:48px;height:48px}
.mock-row b{font-family:var(--font-display);font-weight:500;font-size:1.125rem;letter-spacing:-0.02em;display:block;line-height:1.3}
.mock-row span.s{font-size:.875rem;color:var(--color-text-muted)}
.listlinks{list-style:none;padding:0;display:flex;flex-direction:column;width:100%}
.listlinks li{border-top:1px solid var(--color-ash)}
.listlinks li:last-child{border-bottom:1px solid var(--color-ash)}
.listlinks a{padding:4px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:56px;font-weight:500;color:var(--color-black);text-decoration:none}
.listlinks a:hover{color:var(--color-indigo)}
.num{width:56px;height:56px;border-radius:50%;background:var(--color-indigo);color:var(--color-white);font:500 1.375rem/1 var(--font-display);display:flex;align-items:center;justify-content:center;flex:none}
.cta{background:var(--color-indigo);color:var(--color-white);border-radius:var(--radius-card);padding:clamp(1.5rem,1rem + 4vw,5rem);display:flex;flex-wrap:wrap;gap:64px;align-items:flex-start}
.cta a{color:var(--color-white)}
.field{display:flex;flex-direction:column;gap:8px}
.field label{font-weight:500;font-size:.9375rem}
.field input,.field textarea{font:400 1rem/1.4 var(--font-sans);min-height:52px;padding:12px 16px;border-radius:var(--radius-input);border:1px solid var(--color-border-input);background:var(--color-white);color:var(--color-black);width:100%}
.field textarea{min-height:120px;resize:vertical}
.field input:hover,.field textarea:hover{border-color:var(--color-periwinkle,#7494FF);box-shadow:0 0 0 1px var(--color-periwinkle,#7494FF)}
/* label in het veld, schuift omhoog bij focus of invullen */
.field{position:relative;gap:0}
.field label{position:absolute;left:17px;top:15px;z-index:1;max-width:calc(100% - 34px);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:400;font-size:1rem;line-height:1.4;color:#9CA3AF;pointer-events:none;transition:top .15s ease-out,font-size .15s ease-out}
.field input,.field textarea{padding-top:24px;padding-bottom:8px}
.field:focus-within label,.field:has(input:not(:placeholder-shown)) label,.field:has(textarea:not(:placeholder-shown)) label{top:7px;font-size:.75rem;font-weight:400}
.footer{background:var(--color-indigo-dark);color:var(--color-white);font-size:.9375rem}
.footer a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center;color:rgba(255,255,255,.65);transition:color .2s ease-out}
.footer a:hover{color:#fff;text-decoration:none}
@media (max-width:860px){
  .nav-links a:not(.btn){display:none}
  .mnav{display:block}
  .grid-aud{grid-template-columns:minmax(0,1fr)}
  .rows{grid-template-columns:minmax(0,1fr)}
  .rows li:nth-last-child(2){border-bottom:0}
  .rows li:first-child:nth-last-child(3)~li:last-child{margin-top:0}
  .nav-links .btn-primary{display:none}
  .topbar .wrap{justify-content:flex-start}
  .hero{background:linear-gradient(rgba(30,26,102,.22),rgba(30,26,102,.22)),var(--gradient-hero)}
  .split{grid-template-columns:minmax(0,1fr)}
  .split.rev .split-panel{order:0}
  .split-copy>*{max-width:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}


html,body{margin:0;background:#fff}body{font-size:16px}

/* Header: vast, verdwijnt bij naar beneden scrollen, bij terugscrollen alleen de hoofdbalk; oranje balk alleen bovenaan */
html{scroll-padding-top:96px}
.site-head{position:relative;z-index:100}
.site-head header{background:var(--color-white,#fff)}
html.js-hd .site-head{position:fixed;top:0;left:0;right:0;transform:translateY(0);transition:transform .3s ease;will-change:transform}
html.js-hd .site-head-space{height:var(--hh,0px)}
html.js-hd.hd-scrolled .site-head{transform:translateY(calc(-1 * var(--ann,40px)))}
html.js-hd.hd-scrolled.hd-hide .site-head{transform:translateY(-100%)}
@media (prefers-reduced-motion:reduce){html.js-hd .site-head{transition:none}}

/* Wachtwoordpoort */
html.gate-locked{overflow:hidden}
html.gate-locked body>*:not(.gate){display:none!important}
.gate{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--color-indigo-dark,#1E1A66);font-family:"Satoshi",system-ui,sans-serif}
.gate-card{width:100%;max-width:420px;background:#fff;color:#121217;border-radius:8px;padding:32px;display:flex;flex-direction:column;gap:12px}
.gate-title{font-size:1.5rem;font-weight:600;line-height:1.2;margin:0}
.gate-text{margin:0 0 8px;color:#6A6A87}
.gate-label{font-weight:500;font-size:.875rem}
.gate-input{font:inherit;padding:12px 16px;border:1px solid #6B7280;border-radius:8px;background:#fff;color:#121217}
.gate-input:focus{outline:2px solid #4338E0;outline-offset:2px}
.gate-error{margin:0;color:#B00020;font-size:.875rem}
.gate-btn{font:inherit;font-weight:500;cursor:pointer;margin-top:8px;padding:12px 24px;border:0;border-radius:40px;background:#1E1A66;color:#fff}
.gate-btn:hover{background:#2A2486}