/* Dlivered cinematic homepage. Progressive enhancement: text is visible before JS. */
/* The scoped V2 art-direction layer lives in polish.css. */
:root{--ink:#182726;--muted:#58615d;--blue:#2549d9;--paper:#f7f5f0;--line:#dddeda;--header:78px;--page:1280px;--gutter:clamp(22px,5vw,88px);font-synthesis:none}
*{box-sizing:border-box}
html{scroll-padding-top:calc(var(--header) + 22px);-webkit-text-size-adjust:100%}
body{margin:0;color:var(--ink);background:#fff;font-family:Inter,Arial,sans-serif;font-size:16px;line-height:1.65}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:Sora,Inter,Arial,sans-serif;font-weight:500;letter-spacing:-.055em;line-height:1.12}
h1{font-size:clamp(44px,4.75vw,74px)}
h2{font-size:clamp(34px,3.65vw,56px)}
h3{font-size:24px;letter-spacing:-.035em}
em{font-style:normal;color:var(--blue)}
a{color:inherit;text-decoration:none}
button{font:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible{outline:3px solid var(--blue);outline-offset:5px;border-radius:5px}
::selection{color:#fff;background:var(--blue)}
img,video{display:block;max-width:100%}
button{cursor:pointer}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;z-index:100;top:12px;left:12px;padding:12px 20px;background:#fff;transform:translateY(-150%);border:2px solid var(--blue)}
.skip-link:focus{transform:none}
.site-header{height:var(--header);position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:30px;padding:0 var(--gutter);background:rgba(255,255,255,.97);border-bottom:1px solid rgba(24,39,38,.09)}
.brand{font-family:Sora,Arial,sans-serif;font-size:30px;font-weight:700;letter-spacing:-1.6px;line-height:1}
.brand span{color:var(--blue)}
.main-nav{display:flex;align-items:center;gap:32px;margin-left:auto;font-size:13px;font-weight:500}
.main-nav>a:not(.nav-contact):hover{color:var(--blue)}
.nav-contact{display:inline-flex;align-items:center;min-height:44px;background:var(--ink);color:#fff;padding:11px 18px;border-radius:8px}
.nav-contact span{margin-left:14px}
.nav-contact:hover{background:var(--blue)}
.motion-toggle{border:0;background:none;color:var(--muted);font-size:11px;padding:10px 0;display:inline-flex;align-items:center;gap:7px;line-height:1.3;min-height:44px}
.motion-toggle[aria-pressed="true"]{color:var(--blue)}
.motion-icon{font-size:14px;border:1px solid #abb1ac;border-radius:50%;width:24px;height:24px;display:grid;place-items:center}
.section-wrap{width:min(var(--page),calc(100% - var(--gutter)*2));margin-inline:auto}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;display:flex;align-items:center;gap:9px;line-height:1.5}
.small-dot{width:7px;height:7px;border-radius:50%;background:var(--blue);flex:none}
.button{display:inline-flex;align-items:center;justify-content:center;gap:30px;min-height:52px;border-radius:8px;padding:14px 22px;font-size:13px;font-weight:600;line-height:1.5;border:1px solid transparent;transition:background .18s}
.button.primary{background:var(--blue);color:#fff}
.button.primary:hover{background:#1936ad}
a.button[href*="/kennismaken"],a.nav-contact[href*="/kennismaken"],a.wa-chip[href*="/kennismaken"]{background:#2e48d1;color:#fff;border-color:transparent;font-weight:600}
a.button[href*="/kennismaken"]:hover,a.nav-contact[href*="/kennismaken"]:hover,a.wa-chip[href*="/kennismaken"]:hover{background:#2e48d1;filter:brightness(1.06)}
.button.secondary{background:#fff;border-color:#ced1cd}
.button.secondary:hover{background:#efefeb}
.button span[aria-hidden]{font-size:20px;font-weight:400}
.text-link{display:inline-flex;align-items:center;gap:20px;font-size:13px;font-weight:600;line-height:1.6;padding-block:8px;border-bottom:1px solid #aeb6b0}
.text-link:hover{color:var(--blue);border-color:var(--blue)}
.film{position:relative;overflow:hidden;background:#e8dfd0;isolation:isolate}
.film picture,.film video{width:100%;height:100%}
.film picture img{width:100%;height:100%;object-fit:contain}
.film video{position:absolute;inset:0;object-fit:contain;opacity:0}
.film.has-frame video{opacity:1}
.film.is-failed video{opacity:0}
.media-fallback{display:none;position:absolute;left:14px;bottom:14px;background:#fff;padding:7px 10px;border-radius:6px;font-size:11px;color:var(--muted);z-index:5}
.media-fallback:not(:empty){display:block}
.intro-stage{position:relative;min-height:700px;overflow:hidden;background:#e9d6b6}
.intro-film{position:absolute;inset:0;background:#e9d6b6}
.intro-film picture img,.intro-film video{object-fit:cover;object-position:55% center}
.intro-copy{position:relative;z-index:2;width:min(570px,47%);padding:92px 0 145px var(--gutter)}
.intro-copy .eyebrow{font-size:12px;letter-spacing:.13em;margin-bottom:26px}
.intro-copy h1{line-height:1.08;letter-spacing:-.063em}
.intro-copy::before{content:"";position:absolute;inset:-100vh -90px -100vh -110px;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(243,226,199,.94),rgba(243,226,199,.78) 50%,rgba(243,226,199,0))}
.intro-description{max-width:330px;margin:24px 0;font-size:16px;color:#35423a;line-height:1.7}
.intro-note{display:block;font-size:11px;color:#394337;margin-top:13px;line-height:1.6}
.intro-bottom{position:absolute;z-index:3;bottom:30px;left:var(--gutter);right:var(--gutter);display:flex;align-items:center;justify-content:flex-end;gap:18px;font-size:11px}
.intro-bottom>a{background:rgba(255,255,255,.88);padding:7px 12px;border-radius:6px}
.intro-white{display:none;position:absolute;inset:0;background:#fff;opacity:0;z-index:4;pointer-events:none}
.bridge{padding-block:124px 132px}
.bridge h2{margin-top:22px;max-width:970px}
.bridge h2 span,.section-heading h2 span,.approach h2 span{color:#79817b}
.bridge-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:50px;margin-top:36px}
.bridge-bottom>p{max-width:510px;color:var(--muted);font-size:16px}
.bridge-bottom .text-link{flex-shrink:0}
.story{background:var(--paper)}
.story-stage{position:relative;padding:38px var(--gutter);overflow:hidden}
.story-top{width:min(var(--page),100%);margin:0 auto 38px;display:flex;justify-content:space-between;align-items:center;gap:28px}
.story-top>.eyebrow{color:var(--muted);font-size:10px}
.chapter-nav{display:flex;gap:6px}
.chapter-nav a{display:flex;align-items:center;min-height:44px;gap:7px;padding:9px 12px;border:1px solid transparent;font-size:11px;border-radius:7px;white-space:nowrap}
.chapter-nav a span{font-size:9px;color:var(--muted)}
.chapter-nav a:hover,.chapter-nav a[aria-current="step"]{background:#fff;border-color:var(--line)}
.chapter-nav a[aria-current="step"] span{color:var(--blue)}
.chapters{width:min(var(--page),100%);margin-inline:auto}
.chapter{display:grid;grid-template-columns:minmax(0,1.95fr) minmax(295px,1fr);align-items:center;gap:clamp(22px,3vw,44px);padding-block:38px}
.chapter-film{aspect-ratio:1916/1080;border-radius:16px;box-shadow:0 18px 48px -30px rgba(44,37,27,.25)}
.card-stack{display:grid;gap:22px;min-width:0}
.story-card{padding:clamp(25px,3vw,42px);background:#fff;border:1px solid #e4e4dd;border-radius:14px}
.card-index{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--muted);margin-bottom:28px}
.story-card h2{font-size:clamp(26px,2.4vw,38px);line-height:1.17}
.story-card p{font-size:16px;line-height:1.75;color:var(--muted);margin-top:21px}
.card-rule{display:block;width:28px;height:2px;background:var(--blue);margin-block:28px 16px}
.card-aside{font-size:10px;line-height:1.6;display:block;color:var(--muted)}
.story-bottom{display:none;width:min(var(--page),100%);margin:30px auto 0;font-size:10px;color:var(--muted);align-items:center;gap:35px}
.story-progress{height:2px;background:#d4d9d1;flex:1;overflow:hidden}
.story-progress>span{height:100%;display:block;background:var(--blue);transform:scaleX(0);transform-origin:left}
.story-white{display:none;position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;z-index:6}
.services{padding-block:125px}
.section-heading{max-width:730px}
.section-heading h2{margin-block:22px 27px}
.section-heading>p:last-child{font-size:15px;color:var(--muted);max-width:550px}
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:54px;margin-bottom:32px}
.service-card{position:relative;display:flex;flex-direction:column;padding:32px;border-radius:14px;border:1px solid var(--line);min-height:334px;background:#fbfbf9}
.service-number{position:absolute;right:26px;top:32px;font-size:11px;color:var(--muted)}
.service-card h3{font-size:21px;margin-top:36px}
.service-card p{margin:17px 0 27px;font-size:16px;color:var(--muted);line-height:1.75}
.service-tag{margin-top:auto;font-size:10px;color:var(--blue);font-weight:500}
.service-mark{width:38px;height:38px;display:grid;grid-template-columns:1fr 1fr;gap:4px;color:var(--blue)}
.service-mark>span{border:1.5px solid currentColor;border-radius:4px}
.connections{display:flex;align-items:center;width:58px;gap:0}
.connections>span{width:18px;height:18px;flex:none;border-radius:50%}
.connections>span:nth-child(2){width:20px;height:1px;border:0;background:currentColor}
.agent-mark{display:flex;align-items:center;justify-content:center;border:1.5px solid currentColor;border-radius:12px;gap:7px}
.agent-mark>span{width:4px;height:8px;background:currentColor;border:0}
.approach{padding-block:30px 125px;display:grid;grid-template-columns:1.2fr 1fr;gap:80px}
.approach h2{font-size:clamp(32px,3.2vw,48px);margin-top:22px}
.approach-intro{font-size:15px;color:var(--muted);max-width:410px;margin:26px 0}
.steps{list-style:none;padding:0;margin:0}
.steps>li{display:flex;gap:25px;padding-block:27px;border-bottom:1px solid var(--line)}
.steps>li:first-child{padding-top:0}
.steps>li>span{font-size:11px;color:var(--blue);padding-top:4px}
.steps h3{font-size:19px;margin-bottom:10px}
.steps p{font-size:16px;line-height:1.75;color:var(--muted)}
.contact{text-align:center;background:#f1f4ec;border:1px solid #e8eddf;border-radius:22px;padding:90px 30px 40px;margin-bottom:100px}
.contact .eyebrow{justify-content:center;font-size:10px}
.contact h2{font-size:clamp(40px,5vw,72px);margin:26px auto;line-height:1.1}
.contact>p:not(.eyebrow){max-width:445px;margin:0 auto;font-size:15px;color:var(--muted)}
.contact-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:35px}
.contact-note{display:block;font-size:10px;color:var(--muted);margin-top:18px}
.contact-direct{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;border-top:1px solid #d9e0d0;padding-top:30px;margin-top:62px;font-size:11px;color:var(--muted)}
.contact-direct a:hover{text-decoration:underline}
.site-footer{padding-bottom:30px}
.footer-top,.footer-bottom{display:flex;justify-content:space-between;gap:22px;align-items:center}
.footer-top{padding-bottom:38px;border-bottom:1px solid var(--line)}
.footer-top p{font-size:13px;color:var(--muted)}
.footer-bottom{font-size:10px;color:var(--muted);padding-top:23px;flex-wrap:wrap}
.footer-bottom nav{display:flex;gap:20px}
.footer-bottom a:hover{text-decoration:underline}
.concept-note{font-size:9px}
.noscript-note{padding:16px;background:var(--paper);font-size:13px;margin:0;text-align:center}
/* Only enable sticky sequencing after the controller has been constructed. */
.motion-ready .intro{height:350svh}
.motion-ready .intro-stage{position:sticky;top:var(--header);height:calc(100svh - var(--header));min-height:0}
.motion-ready .intro-copy{position:absolute;top:50%;transform:translateY(-51%);padding-block:0}
.motion-ready .intro-white{display:block}
.motion-ready .story{height:880svh}
.motion-ready .story-stage{position:sticky;top:var(--header);height:calc(100svh - var(--header));display:flex;flex-direction:column;justify-content:space-between;padding-block:28px}
.motion-ready .story-top{flex:none;margin-bottom:0;position:relative;z-index:8}
.motion-ready .chapters{position:relative;flex:1;min-height:0}
.motion-ready .chapter{position:absolute;inset:0;padding-block:28px;opacity:0;pointer-events:none}
.motion-ready .chapter.is-active{pointer-events:auto}
.motion-ready .chapter-film{max-height:100%;width:100%}
.motion-ready .card-stack{display:grid}
.motion-ready .story-card{grid-area:1/1;opacity:0}
.motion-ready .story-bottom{display:flex;position:relative;z-index:8;margin-top:0;flex:none}
.motion-ready .story-white{display:block}
.motion-ready .story-card{will-change:opacity,transform}
@media(min-width:1600px){
  .intro-copy{padding-left:max(var(--gutter),calc((100vw - 1420px)/2))}
}
@media(max-width:1150px){
  .site-header{gap:20px}
  .main-nav{gap:20px}
  .chapter{grid-template-columns:minmax(0,1.65fr) minmax(275px,1fr);gap:24px}
  .story-card{padding:27px}
  .story-card h2{font-size:28px}
  .card-index{margin-bottom:20px}
  .card-rule{margin-top:20px}
  .story-top{gap:16px}
  .story-top>.eyebrow{max-width:160px}
  .chapter-nav a{padding-inline:8px}
  .intro-copy{width:49%}
}
@media(max-width:900px){
  :root{--header:70px;--gutter:26px}
  h1{font-size:46px}
  .site-header{gap:16px}
  .brand{font-size:25px}
  .main-nav{gap:16px}
  .main-nav>a:not(.nav-contact){display:none}
  .nav-contact{font-size:11px;padding:10px 13px}
  .nav-contact span{margin-left:7px}
  .motion-toggle{font-size:10px}
  .motion-label{max-width:62px;text-align:left}
  .intro-stage{min-height:0;background:#f2e9dc;display:flex;flex-direction:column}
  .intro-film{position:relative;aspect-ratio:1916/1080;width:100%;order:2;flex:none}
  .intro-film picture img,.intro-film video{object-fit:contain}
  .intro-copy{width:100%;padding:44px var(--gutter) 36px;order:1}
  .intro-copy::before{display:none}
  .intro-copy h1{font-size:clamp(38px,5.8vw,54px)}
  .intro-copy h1 br:nth-of-type(2){display:none}
  .intro-copy .eyebrow{margin-bottom:20px;font-size:11px}
  .intro-description{font-size:16px;line-height:1.65;max-width:430px;margin-block:18px}
  .intro-copy .button{min-height:46px;padding:10px 17px;font-size:12px}
  .intro-note{font-size:9px}
  .intro-bottom{position:static;order:3;font-size:10px;padding:15px var(--gutter);background:#f2e9dc}
  .intro-bottom>a{font-size:9px;padding:0;background:none;max-width:120px;text-align:right}
  .motion-ready .intro{height:290svh}
  .motion-ready .intro-stage{justify-content:center}
  .motion-ready .intro-copy{position:relative;top:auto;transform:none;padding-block:24px}
  .motion-ready .intro-bottom{padding-block:12px}
  .bridge{padding-block:84px}
  .bridge-bottom{display:block;margin-top:26px}
  .bridge-bottom>p{font-size:14px}
  .bridge-bottom .text-link{margin-top:25px}
  .story-stage{padding:30px var(--gutter)}
  .story-top{display:block;margin-bottom:25px}
  .story-top>.eyebrow{max-width:none}
  .chapter-nav{margin-top:14px;gap:5px;justify-content:space-between}
  .chapter-nav a{padding:7px;font-size:10px;gap:5px}
  .chapter-nav a span{font-size:8px}
  .chapter{display:flex;flex-direction:column;align-items:stretch;padding-block:24px;gap:20px}
  .chapter-film{border-radius:12px;flex:none}
  .card-stack{width:100%}
  .story-card{padding:24px 26px}
  .story-card h2{font-size:28px}
  .story-card h2 br{display:initial}
  .story-card p{font-size:16px;margin-top:15px}
  .card-index{font-size:9px;margin-bottom:16px}
  .card-rule{margin-block:20px 12px}
  .card-aside{font-size:10px}
  .motion-ready .story{height:760svh}
  .motion-ready .story-stage{padding-block:22px}
  .motion-ready .chapter{justify-content:center;padding-block:20px;gap:18px}
  .motion-ready .chapter-film{max-width:680px;margin-inline:auto}
  .motion-ready .story-card{min-height:235px}
  .story-bottom{gap:20px;font-size:9px}
  .services{padding-block:84px}
  .services-grid{gap:14px}
  .service-card{padding:24px}
  .service-card h3{font-size:19px}
  .service-card p{font-size:16px}
  .approach{gap:40px;padding-block:0 84px}
  .contact{padding:70px 26px 30px;margin-bottom:70px}
  .contact-direct{gap:18px}
}
@media(max-width:600px){
  :root{--gutter:22px}
  h2{font-size:34px}
  .site-header{gap:10px;padding-inline:18px}
  .nav-contact{font-size:10px}
  .brand{font-size:23px}
  .motion-toggle{gap:5px}
  .motion-icon{width:22px;height:22px;font-size:12px}
  .motion-label{font-size:9px;max-width:55px}
  .intro-copy h1{font-size:41px}
  .intro-copy h1 br:nth-of-type(2){display:block}
  .intro-description{max-width:310px}
  .motion-ready .intro-stage{justify-content:flex-start}
  .motion-ready .intro-copy{padding-top:32px;padding-bottom:26px}
  .intro-film{margin-top:auto}
  .intro-bottom{margin-bottom:auto}
  .story-top>.eyebrow{font-size:9px}
  .chapter-nav a{padding:7px 5px;font-size:9px}
  .chapter-nav a span{font-size:8px}
  .motion-ready .story-stage{padding-top:21px;padding-bottom:20px}
  .motion-ready .chapter{justify-content:flex-start;padding-top:25px}
  .motion-ready .chapter-film{margin:0}
  .motion-ready .story-card{padding:24px;min-height:254px}
  .story-card h2{font-size:27px;line-height:1.2}
  .story-card p{font-size:16px;line-height:1.65}
  .motion-ready .story-card .card-rule,.motion-ready .story-card .card-aside{display:none}
  .story-card h2 br{display:initial}
  .card-aside{font-size:9px}
  .card-index{margin-bottom:17px}
  .card-rule{margin-top:23px}
  .story-bottom{font-size:8px;gap:14px}
  .services-grid{grid-template-columns:1fr;margin-top:36px;gap:15px}
  .service-card{min-height:0;padding:28px}
  .service-card h3{font-size:22px;margin-top:28px}
  .service-card p{font-size:16px}
  .service-tag{font-size:11px}
  .approach{grid-template-columns:1fr;gap:45px}
  .approach h2{font-size:34px}
  .steps p{font-size:16px}
  .contact{padding:55px 21px 30px}
  .contact h2{font-size:39px}
  .contact .eyebrow{font-size:8px;letter-spacing:.11em}
  .contact>p:not(.eyebrow){font-size:14px}
  .contact-actions{display:grid;gap:10px}
  .contact-actions .button{font-size:11px;gap:15px;padding-inline:14px}
  .contact-note{font-size:9px}
  .contact-direct{flex-direction:column;gap:12px;margin-top:36px}
  .footer-top{align-items:flex-start;flex-direction:column;gap:18px;padding-bottom:26px}
  .footer-top p{font-size:12px}
  .footer-bottom{gap:18px;flex-direction:column;align-items:flex-start}
  .footer-bottom nav{gap:18px;flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
/* Reserve the same first-screen geometry before the deferred animation scripts arrive. */
@media(min-width:901px) and (min-height:650px){
  .intro-stage{height:calc(100svh - var(--header));min-height:0}
  .intro-copy{position:absolute;top:50%;transform:translateY(-51%);padding-block:0}
}
@media(max-width:900px) and (min-height:940px), (max-width:600px) and (min-height:740px){
  .intro-stage{height:calc(100svh - var(--header));min-height:0;justify-content:center}
  .intro-copy{padding-block:24px}
  .intro-bottom{padding-block:12px}
}
@media(max-width:600px) and (min-height:740px){
  .intro-stage{justify-content:flex-start}
  .intro-copy{padding-top:32px;padding-bottom:26px}
}
.nav-contact{white-space:nowrap}
@media (max-width:560px){.main-nav .nav-contact{padding-inline:12px;font-size:11px}.nav-contact span[aria-hidden]{display:none}}
.intro-proof-label{display:block;font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:#5b6657;margin-bottom:8px}
.contact-person{display:flex;align-items:center;gap:14px;margin:22px 0 4px}
.contact-person img{width:64px;height:64px;border-radius:50%;object-fit:cover;display:block;border:2px solid #fff;box-shadow:0 0 0 1px var(--line)}
.contact-person p{margin:0;font-size:14px;line-height:1.5;color:var(--muted)}
.contact-person strong{color:var(--ink);font-weight:600}
.booking-photo{margin:0 0 24px;border-radius:20px;overflow:hidden;aspect-ratio:4/3;background:#e6dccb}
.booking-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;display:block}
.contact-photo{margin:-50px auto 40px;max-width:720px;border-radius:22px;overflow:hidden;aspect-ratio:4/3;background:#dfe6d6}
.contact-photo img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:760px){.contact-photo{margin:-30px auto 30px}}
.home-contact .contact-person p{color:#c9d3cb}.home-contact .contact-person strong{color:#f7f5f0}.home-contact .contact-person img{box-shadow:none;width:104px;height:104px}.home-contact .contact-person picture{flex:none}
.contact-reassure{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px;font-weight:500;color:#f7f5f0}
.contact-reassure li{display:flex;align-items:center;gap:8px}
.contact-reassure li::before{content:"✓";display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.14);font-size:11px;font-weight:700}