:root{
    /* merkkleuren, gemeten uit het Acquirio-logo: navy #0E1A30, cream #F4EFE4 */
    --navy-900:#0E1A30;
    --navy-950:#070E1B;
    --navy-850:#111F3A;
    --navy-800:#152443;
    --navy-700:#1D3159;
    --navy-600:#26426F;
    --luxe:#3D6BB3;
    --ice:#A9C8EE;
    --ice-soft:#D7E5F7;
    --champagne:#C8A96E;
    --champagne-deep:#8A6E38;
    --paper:#F4EFE4;
    --paper-2:#EAE2D2;
    --ink:#0E1A30;
    --ink-soft:#41506B;
    --white:#FCFAF5;
    --radius-lg:28px;
    --radius-md:18px;
    --radius-sm:12px;
    --radius-pill:999px;
    --max:1180px;
    --nav-h:74px;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  /* overflow-x:clip op de wortel voorkomt elke horizontale pan zonder een
     scroll-container te maken (zodat de sticky nav blijft werken). Clip moet
     op html EN body staan: alleen op body laat de viewport (html) tóch scrollen. */
  html{-webkit-text-size-adjust:100%;overflow-x:clip}
  body{
    font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
    background:var(--navy-900);
    color:var(--white);
    -webkit-font-smoothing:antialiased;
    line-height:1.6;
    overflow-x:clip;
  }
  ::selection{background:var(--champagne);color:var(--navy-900)}
  a{color:inherit}
  img,svg{max-width:100%}
  .display{font-family:'Playfair Display',Georgia,serif;font-weight:500;line-height:1.1;letter-spacing:-0.02em}
  .wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
  section{position:relative}
  :target{scroll-margin-top:calc(var(--nav-h) + 24px)}

  .eyebrow{
    font-size:11.5px;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;
    display:inline-flex;align-items:center;gap:9px;
  }
  .eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--champagne);flex-shrink:0}

  .skip{position:absolute;left:-9999px;top:0;background:var(--champagne);color:var(--navy-900);padding:12px 18px;z-index:200;border-radius:0 0 8px 0;font-weight:700}
  .skip:focus{left:0}

  /* ---------- BUTTONS ---------- */
  .btn{
    display:inline-flex;align-items:center;gap:9px;justify-content:center;
    padding:14px 27px;border-radius:var(--radius-pill);
    font-size:12px;font-weight:700;letter-spacing:0.11em;text-transform:uppercase;
    text-decoration:none;cursor:pointer;border:none;line-height:1;
    transition:transform .2s cubic-bezier(.22,.61,.36,1),box-shadow .2s ease,background .2s,border-color .2s,color .2s;
    will-change:transform;
  }
  .btn svg{width:14px;height:14px;flex-shrink:0}
  .btn:focus-visible{outline:2px solid var(--ice);outline-offset:3px}
  .btn-gold{background:var(--champagne);color:var(--navy-900);box-shadow:0 10px 26px -12px rgba(200,169,110,.5)}
  .btn-gold:hover{background:#D8BC85;transform:translateY(-2px);box-shadow:0 18px 38px -14px rgba(200,169,110,.55)}
  .btn-ghost{background:transparent;color:var(--ice-soft);border:1px solid rgba(169,200,238,.35)}
  .btn-ghost:hover{border-color:var(--ice);color:var(--white);transform:translateY(-2px)}
  .nav-menu .nav-login{padding:11px 18px}
  @media (min-width:901px){.nav-menu{gap:18px}.nav-menu .nav-links{margin-right:12px}}
  .btn-ink{background:var(--ink);color:var(--white)}
  .btn-ink:hover{background:#1B2E4F;transform:translateY(-2px)}
  .btn-lg{padding:17px 34px;font-size:12.5px}

  /* ---------- NAV ---------- */
  .nav{
    position:sticky;top:0;z-index:60;
    background:rgba(6,15,32,.72);
    border-bottom:1px solid rgba(169,200,238,.08);
    transition:background .3s ease,border-color .3s ease,box-shadow .3s ease;
  }
  @supports (backdrop-filter:blur(2px)){
    .nav{backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%)}
  }
  .nav.is-stuck{background:rgba(6,15,32,.94);box-shadow:0 12px 34px -22px rgba(0,0,0,.9)}
  .nav-inner{
    max-width:var(--max);margin:0 auto;padding:0 24px;
    height:var(--nav-h);display:flex;align-items:center;gap:18px;
  }
  .brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;flex-shrink:0}
  .brand-mark{height:28px;width:auto;display:block;flex-shrink:0}
  .brand-name{font-family:'Playfair Display',Georgia,serif;font-size:21px;font-weight:600;letter-spacing:-0.01em;color:var(--white)}
  .nav-menu{display:flex;align-items:center;gap:30px;margin-left:auto}
  .nav-links{display:flex;gap:28px;font-size:11.5px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;list-style:none}
  .nav-links a{color:var(--ice-soft);text-decoration:none;opacity:.72;transition:opacity .2s,color .2s;position:relative;padding:6px 0}
  .nav-links a::after{
    content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--champagne);
    transition:right .28s cubic-bezier(.22,.61,.36,1);
  }
  .nav-links a:hover,.nav-links a:focus-visible{opacity:1;color:var(--white)}
  .nav-links a:hover::after,.nav-links a:focus-visible::after{right:0}
  .nav-toggle{
    display:none;margin-left:auto;width:44px;height:44px;border-radius:11px;
    background:rgba(169,200,238,.08);border:1px solid rgba(169,200,238,.18);
    cursor:pointer;place-items:center;flex-shrink:0;
  }
  .nav-toggle svg{width:20px;height:20px;stroke:var(--ice-soft);stroke-width:1.7;fill:none;stroke-linecap:round}
  .nav-toggle .ic-x{display:none}
  .nav.open .nav-toggle .ic-menu{display:none}
  .nav.open .nav-toggle .ic-x{display:block}

  /* ---------- HERO ---------- */
  .hero{
    background:
      radial-gradient(1200px 560px at 22% -12%, rgba(61,107,179,.42), transparent 62%),
      radial-gradient(760px 430px at 92% 18%, rgba(200,169,110,.13), transparent 62%),
      linear-gradient(180deg,var(--navy-800) 0%,var(--navy-900) 88%);
    padding:clamp(58px,8vh,92px) 0 0;overflow:hidden;
  }
  .hero::after{
    content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
    background-image:radial-gradient(rgba(169,200,238,.10) 1px, transparent 1px);
    background-size:34px 34px;
    mask-image:radial-gradient(900px 460px at 30% 8%, #000 0%, transparent 72%);
    -webkit-mask-image:radial-gradient(900px 460px at 30% 8%, #000 0%, transparent 72%);
  }
  .hero-grid{
    position:relative;z-index:1;
    display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(32px,5vw,64px);align-items:center;
  }
  .hero .eyebrow{color:var(--ice);margin-bottom:24px}
  .hero h1{font-size:clamp(37px,5.6vw,66px);max-width:15ch}
  .hero h1 .accent{display:block;font-style:italic;font-weight:400;color:var(--ice)}
  .hero p.sub{max-width:52ch;margin-top:24px;color:var(--ice-soft);font-size:17px}
  .hero-cta{display:flex;gap:13px;margin-top:34px;flex-wrap:wrap}
  .hero-note{
    margin-top:28px;font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;
    color:rgba(215,229,247,.72);display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  }
  .hero-note b{color:var(--champagne);font-weight:600}

  /* bespoke hero visual: money-model ladder */
  .ladder{
    background:linear-gradient(165deg,rgba(22,56,107,.55),rgba(8,21,42,.86));
    border:1px solid rgba(169,200,238,.16);
    border-radius:var(--radius-lg);padding:28px;
    box-shadow:0 40px 90px -46px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.07);
    position:relative;overflow:hidden;
  }
  .ladder::before{
    content:"";position:absolute;top:0;left:-40%;width:40%;height:100%;
    background:linear-gradient(90deg,transparent,rgba(200,169,110,.09),transparent);
    animation:sheen 7s ease-in-out infinite;
  }
  @keyframes sheen{0%,100%{left:-40%}55%{left:110%}}
  .ladder-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:22px;position:relative}
  .ladder-head .lt{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ice)}
  .ladder-head .lv{font-family:'Playfair Display',Georgia,serif;font-size:13px;font-style:italic;color:rgba(215,229,247,.7)}
  .rung{display:grid;grid-template-columns:1fr;gap:9px;margin-bottom:14px;position:relative}
  .rung-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
  .rung-name{font-family:'Playfair Display',Georgia,serif;font-size:16px;font-weight:600}
  .rung-tag{font-size:10.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:rgba(215,229,247,.62)}
  .rung-bar{height:9px;border-radius:99px;background:rgba(169,200,238,.11);overflow:hidden}
  .rung-bar i{
    display:block;height:100%;border-radius:99px;width:0;
    transition:width 1.25s cubic-bezier(.22,.61,.36,1);
  }
  .rung.a .rung-bar i{background:linear-gradient(90deg,var(--luxe),#5A87CE)}
  .rung.b .rung-bar i{background:linear-gradient(90deg,#5A87CE,var(--ice))}
  .rung.c .rung-bar i{background:linear-gradient(90deg,var(--champagne-deep),var(--champagne))}
  .ladder.in .rung.a .rung-bar i{width:34%}
  .ladder.in .rung.b .rung-bar i{width:68%}
  .ladder.in .rung.c .rung-bar i{width:100%}
  .ladder-foot{
    margin-top:22px;padding-top:18px;border-top:1px dashed rgba(169,200,238,.2);
    display:flex;align-items:center;gap:11px;font-size:13px;color:var(--ice-soft);position:relative;
  }
  .ladder-foot svg{width:17px;height:17px;stroke:var(--champagne);fill:none;stroke-width:1.6;flex-shrink:0}
  .flowline{position:absolute;left:14px;top:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent,rgba(200,169,110,.3),transparent);pointer-events:none}

  /* offer parameter strip */
  .params{
    margin:clamp(52px,6.5vw,80px) 0 clamp(20px,3vw,34px);padding:0;
    display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
    background:rgba(169,200,238,.14);border:1px solid rgba(169,200,238,.14);border-radius:var(--radius-md);
    overflow:hidden;position:relative;z-index:1;
  }
  .param{background:var(--navy-850);padding:26px 24px}
  .param .pk{font-size:10.5px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--ice);opacity:.9}
  .param .pv{font-family:'Playfair Display',Georgia,serif;font-size:clamp(26px,3vw,34px);font-weight:600;line-height:1.05;margin-top:9px}
  .param .pd{font-size:12.5px;color:rgba(215,229,247,.66);margin-top:7px}
  .param.gold .pv{color:var(--champagne)}

  /* ---------- SHARED HEADS ---------- */
  .head{max-width:760px;margin:0 auto 60px;text-align:center}
  .head h2{font-size:clamp(29px,4.3vw,50px);margin-top:20px}
  .head p.lead{margin-top:20px;font-size:16.5px}

  /* ---------- DARK SECTION ---------- */
  .dark{background:var(--navy-900);padding:clamp(78px,10vw,112px) 0}
  .dark .eyebrow{color:var(--ice)}
  .dark .head p.lead{color:var(--ice-soft)}
  .dark h2 em{color:var(--ice);font-weight:400;font-style:italic}

  /* ---------- LIGHT SECTION ---------- */
  .light{background:var(--paper);color:var(--ink);padding:clamp(78px,10vw,112px) 0}
  .light .eyebrow{color:var(--ink-soft)}
  .light .head .eyebrow{justify-content:center}
  .light .head p.lead{color:var(--ink-soft)}
  .light h2 .muted{color:#5E6E87;font-style:italic;font-weight:400}
  .light h2 .pill-ic{
    display:inline-grid;place-items:center;width:.92em;height:.92em;border-radius:50%;
    background:var(--luxe);vertical-align:baseline;transform:translateY(.1em);
  }
  .light h2 .pill-ic svg{width:.5em;height:.5em;stroke:#fff;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
  .light h2 .pill-ic.gold{background:var(--champagne)}
  .light h2 .pill-ic.gold svg{stroke:var(--navy-900)}

  .bcard{
    border-radius:var(--radius-lg);padding:30px;background:var(--white);
    box-shadow:0 12px 36px -18px rgba(14,29,54,.22);
    transition:transform .3s cubic-bezier(.22,.61,.36,1),box-shadow .3s;
  }
  .bcard:hover{transform:translateY(-4px);box-shadow:0 24px 52px -22px rgba(14,29,54,.3)}
  .bcard .k{font-size:11.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--ink-soft)}
  .bcard.quote{display:flex;flex-direction:column;justify-content:space-between;gap:18px}
  .bcard.quote blockquote{font-family:'Playfair Display',Georgia,serif;font-size:clamp(19px,2.3vw,23px);font-style:italic;line-height:1.42}
  .bcard.quote blockquote::before{content:"\201C"}
  .bcard.quote blockquote::after{content:"\201D"}

  /* ---------- OLD vs NEW ---------- */
  .vs-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
  .vs-col{border-radius:var(--radius-lg);padding:clamp(26px,3.4vw,38px)}
  .vs-col.old{background:rgba(169,200,238,.045);border:1px solid rgba(169,200,238,.12)}
  .vs-col.new{background:linear-gradient(160deg,var(--navy-700),var(--navy-800));border:1px solid rgba(200,169,110,.35);box-shadow:0 30px 70px -40px rgba(0,0,0,.9)}
  .vs-col h3{font-family:'Playfair Display',Georgia,serif;font-size:clamp(21px,2.5vw,25px);font-weight:600;margin-bottom:6px}
  .vs-col .tag{font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;display:block;margin-bottom:16px}
  .vs-col.old .tag{color:#8497B5}
  .vs-col.new .tag{color:var(--champagne)}
  .vs-col ul{list-style:none;display:grid;gap:15px;margin-top:20px}
  .vs-col li{display:flex;gap:13px;font-size:15px;color:var(--ice-soft);align-items:flex-start}
  .vs-col li .li-ic{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;margin-top:2px}
  .vs-col li .li-ic svg{width:10px;height:10px;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
  .vs-col.old li .li-ic{background:rgba(169,200,238,.1)}
  .vs-col.old li .li-ic svg{stroke:#8497B5}
  .vs-col.new li .li-ic{background:rgba(200,169,110,.16)}
  .vs-col.new li .li-ic svg{stroke:var(--champagne)}
  .bridge{
    max-width:640px;margin:52px auto 0;text-align:center;
    font-family:'Playfair Display',Georgia,serif;font-size:clamp(18px,2.3vw,21px);font-style:italic;
    color:var(--ice);line-height:1.5;
  }

  /* ---------- TIMELINE ---------- */
  .tl{margin-top:56px;position:relative;display:grid;gap:22px}
  .tl::before{
    content:"";position:absolute;left:23px;top:14px;bottom:14px;width:2px;
    background:linear-gradient(180deg,rgba(200,169,110,.5),rgba(61,107,179,.35),rgba(169,200,238,.1));
  }
  .tl-item{display:grid;grid-template-columns:48px 1fr;gap:22px;align-items:start;position:relative}
  .tl-dot{
    width:48px;height:48px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;
    background:var(--paper);border:2px solid var(--luxe);
    font-family:'Playfair Display',Georgia,serif;font-size:15px;font-weight:600;color:var(--ink);
    position:relative;z-index:1;
  }
  .tl-item:last-child .tl-dot{border-color:var(--champagne)}
  .tl-body{
    background:var(--white);border-radius:var(--radius-md);padding:26px 28px;
    box-shadow:0 12px 34px -20px rgba(14,29,54,.24);
  }
  .tl-when{font-size:10.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--luxe)}
  .tl-item:last-child .tl-when{color:var(--champagne-deep)}
  .tl-body h3{font-family:'Playfair Display',Georgia,serif;font-size:21px;font-weight:600;margin:8px 0 10px}
  .tl-body p{font-size:14.5px;color:var(--ink-soft)}
  .tl-body ul{list-style:none;margin-top:14px;display:grid;gap:9px}
  .tl-body li{display:flex;gap:11px;font-size:14px;color:var(--ink-soft);align-items:flex-start}
  .tl-body li svg{width:15px;height:15px;stroke:var(--luxe);fill:none;stroke-width:2.2;flex-shrink:0;margin-top:3px;stroke-linecap:round;stroke-linejoin:round}

  /* ---------- FIT ---------- */
  .fit{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:52px}
  .fit-col{border-radius:var(--radius-lg);padding:clamp(26px,3.2vw,34px)}
  .fit-col.yes{background:linear-gradient(160deg,rgba(200,169,110,.14),rgba(10,27,54,.5));border:1px solid rgba(200,169,110,.34)}
  .fit-col.no{background:rgba(169,200,238,.045);border:1px solid rgba(169,200,238,.12)}
  .fit-col h3{font-family:'Playfair Display',Georgia,serif;font-size:21px;font-weight:600;margin-bottom:18px;display:flex;align-items:center;gap:11px}
  .fit-col h3 svg{width:20px;height:20px;fill:none;stroke-width:2.2;flex-shrink:0;stroke-linecap:round;stroke-linejoin:round}
  .fit-col.yes h3 svg{stroke:var(--champagne)}
  .fit-col.no h3 svg{stroke:#8497B5}
  .fit-col ul{list-style:none;display:grid;gap:13px}
  .fit-col li{font-size:14.5px;color:var(--ice-soft);padding-left:18px;position:relative}
  .fit-col li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%}
  .fit-col.yes li::before{background:var(--champagne)}
  .fit-col.no li::before{background:rgba(132,151,181,.7)}

  /* ---------- FAQ ---------- */
  .faq{max-width:820px;margin:52px auto 0;display:grid;gap:12px}
  .fq{
    background:var(--white);border-radius:var(--radius-md);
    box-shadow:0 10px 30px -20px rgba(14,29,54,.24);overflow:hidden;
    border:1px solid rgba(14,29,54,.07);
  }
  .fq summary{
    cursor:pointer;list-style:none;padding:22px 26px;
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    font-family:'Playfair Display',Georgia,serif;font-size:17.5px;font-weight:600;color:var(--ink);
  }
  .fq summary::-webkit-details-marker{display:none}
  .fq summary:focus-visible{outline:2px solid var(--luxe);outline-offset:-3px}
  .fq .chev{width:22px;height:22px;flex-shrink:0;stroke:var(--luxe);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s ease}
  .fq[open] .chev{transform:rotate(180deg)}
  .fq .ans{padding:0 26px 24px;font-size:15px;color:var(--ink-soft)}
  .fq .ans p + p{margin-top:12px}

  /* ---------- CTA / FORM ---------- */
  .cta-final{
    background:
      radial-gradient(1000px 500px at 50% 118%, rgba(200,169,110,.17), transparent 62%),
      linear-gradient(180deg,var(--navy-900),var(--navy-800));
    padding:clamp(84px,11vw,120px) 0 clamp(88px,11vw,124px);
  }
  .cta-final .eyebrow{color:var(--champagne)}
  .cta-head{max-width:720px;margin:0 auto 46px;text-align:center}
  .cta-head h2{font-size:clamp(30px,4.6vw,52px);margin-top:20px}
  .cta-head h2 em{color:var(--ice);font-weight:400;font-style:italic}
  .cta-head p{margin:20px auto 0;color:var(--ice-soft);font-size:16px;max-width:52ch}
  .assur{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 26px;margin-top:26px}
  .assur span{display:flex;align-items:center;gap:10px;font-size:14px;color:rgba(215,229,247,.82)}
  .assur svg{width:17px;height:17px;stroke:var(--champagne);fill:none;stroke-width:2.2;flex-shrink:0;stroke-linecap:round;stroke-linejoin:round}

  .bookcard{
    max-width:1000px;margin:0 auto;
    background:linear-gradient(170deg,rgba(247,245,240,.98),rgba(239,235,226,.97));
    color:var(--ink);border-radius:var(--radius-lg);padding:clamp(20px,2.6vw,30px);
    box-shadow:0 40px 90px -46px rgba(0,0,0,.85);
    display:flex;flex-direction:column;min-width:0;
  }
  .bookcard-head{text-align:center;max-width:560px;margin:0 auto}
  .bookcard-head h3{font-family:'Playfair Display',Georgia,serif;font-size:24px;font-weight:600}
  .bookcard-head .fsub{font-size:14.5px;color:var(--ink-soft);margin-top:8px}
  /* De GHL-kalender is in een iframe alleen bruikbaar op bredere schermen
     (GHL forceert daar een desktop-grid). Op desktop tonen we hem inline op
     volle breedte; op mobiel een knop naar hun eigen responsive boekingspagina. */
  .cal-frame{
    margin-top:22px;border-radius:var(--radius-md);overflow:hidden;
    background:var(--white);border:1px solid rgba(14,26,48,.1);
    min-height:720px;
  }
  .cal-frame iframe{display:block;width:100%;height:100%;min-height:720px;border:0}
  .cal-mobile{display:none;margin-top:22px}
  .cal-mobile .cal-sum{
    display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;margin-bottom:20px;
    font-size:14px;color:var(--ink-soft);
  }
  .cal-mobile .cal-sum span{display:inline-flex;align-items:center;gap:8px}
  .cal-mobile .cal-sum svg{width:16px;height:16px;stroke:var(--luxe);fill:none;stroke-width:1.8;flex-shrink:0}
  .cal-mobile .btn{width:100%}
  .cal-mobile .cal-note{margin-top:12px;font-size:12.5px;color:var(--ink-soft);text-align:center}

  /* ---------- FOOTER ---------- */
  footer{background:var(--navy-900);border-top:1px solid rgba(169,200,238,.09)}
  .foot-inner{
    max-width:var(--max);margin:0 auto;padding:34px 24px;
    display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;
    font-size:13px;color:rgba(215,229,247,.6);
  }
  .foot-inner a{color:rgba(215,229,247,.78);text-decoration:none;transition:color .2s}
  .foot-inner a:hover{color:var(--champagne)}
  .foot-credit{display:inline-flex;align-items:center;gap:7px}

  /* ---------- REVEAL ---------- */
  [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.22,.61,.36,1),transform .8s cubic-bezier(.22,.61,.36,1),filter .8s ease;filter:blur(5px)}
  [data-reveal].in{opacity:1;transform:none;filter:none}
  [data-reveal="left"]{transform:translateX(-28px)}
  [data-reveal="right"]{transform:translateX(28px)}
  [data-reveal="scale"]{transform:scale(.96)}

  /* ---------- RESPONSIVE ---------- */
  @media (max-width:900px){
    :root{--nav-h:66px}
    /* Op mobiel zijn kaarten volle breedte; een horizontale reveal-verschuiving
       duwt ze dan buiten beeld en veroorzaakt zijwaartse scroll. Daarom hier
       alleen een verticale reveal, geen translateX. */
    [data-reveal="left"],[data-reveal="right"]{transform:translateY(26px)}
    .nav-toggle{display:grid}
    /* Geen backdrop-filter op mobiel: dat maakt van .nav een containing block
       voor het position:fixed drawer-menu, waardoor het menu tot de balk krimpt
       en de items over de hero gaan zweven. */
    .nav,.nav.is-stuck{backdrop-filter:none;-webkit-backdrop-filter:none}
    .nav{background:rgba(14,26,48,.94)}
    .nav.is-stuck{background:var(--navy-900)}
    .nav-menu{
      position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;width:100%;
      margin-left:0;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;
      background:var(--navy-900);padding:22px 24px 40px;
      transform:translateY(-14px);opacity:0;visibility:hidden;pointer-events:none;
      transition:transform .32s cubic-bezier(.22,.61,.36,1),opacity .28s ease,visibility 0s linear .32s;
      overflow-y:auto;
    }
    .nav.open .nav-menu{transform:none;opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
    .nav-links{flex-direction:column;gap:0;font-size:13px}
    .nav-links li{border-bottom:1px solid rgba(169,200,238,.1)}
    .nav-links a{display:block;padding:17px 2px}
    .nav-links a::after{display:none}
    .nav-menu .btn{margin-top:24px;width:100%;padding:16px 24px}
    .hero-grid{grid-template-columns:1fr;gap:40px}
    .hero h1{max-width:none}
    .hero p.sub{max-width:none}
    .params{grid-template-columns:1fr 1fr}
    .vs-grid,.fit{grid-template-columns:1fr}
  }
  @media (max-width:620px){
    .wrap{padding:0 18px}
    .params{grid-template-columns:1fr}
    .head{margin-bottom:44px;text-align:left}
    .head .eyebrow,.light .head .eyebrow{justify-content:flex-start}
    .tl::before{left:19px}
    .tl-item{grid-template-columns:40px 1fr;gap:16px}
    .tl-dot{width:40px;height:40px;font-size:13px}
    .tl-body{padding:22px}
    /* GHL forceert in een iframe een desktop-grid; op mobiel dus geen iframe,
       maar een knop naar hun eigen responsive boekingspagina. */
    .cal-frame{display:none}
    .cal-mobile{display:block}
    .foot-inner{flex-direction:column;align-items:flex-start;gap:14px;text-align:left}
    .fq summary{padding:18px 20px;font-size:16px}
    .fq .ans{padding:0 20px 20px}
    .hero-cta .btn{width:100%}
  }
  @media (prefers-reduced-motion: reduce){
    *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
    [data-reveal]{opacity:1;transform:none;filter:none}
    .ladder .rung-bar i{transition:none}
  }
  /* ---------- copy-versie 24 okt 2026 ---------- */
  .hero h1{font-size:clamp(32px,4.1vw,50px);max-width:21ch}
  .cta-head h2{font-size:clamp(28px,3.8vw,44px)}
  .wrap > .head:last-child{margin-bottom:0}
  .usp{max-width:820px;margin:56px auto 0}
  .params.duo{grid-template-columns:repeat(2,1fr);max-width:760px;margin:0 auto}
  .params.duo .param{padding:30px 28px}
  .params.duo .pv{font-size:clamp(36px,4.6vw,50px)}
  .light .vs-col.old{background:var(--white);border:1px solid rgba(14,29,54,.08);box-shadow:0 12px 34px -20px rgba(14,29,54,.24)}
  .light .vs-col.old .tag{color:var(--ink-soft)}
  .light .vs-col.old li{color:var(--ink-soft)}
  .light .vs-col.old li .li-ic{background:rgba(14,29,54,.07)}
  .light .vs-col.old li .li-ic svg{stroke:var(--ink-soft)}
  .light .vs-col.new{color:var(--white)}
  .light .bridge{color:var(--navy-600)}
  .fit-cta{margin-top:48px;text-align:center}
  .fit-cta p{color:var(--ice-soft);font-size:16.5px;margin:0 auto 22px;max-width:52ch}
  .cta-head p + p{margin-top:14px}
  @media (max-width:620px){
    .params.duo{grid-template-columns:1fr}
    .fit-cta{text-align:left}
    .fit-cta .btn{width:100%}
  }