/* ============================================================
   THE CENTERED FOUNDER · funnel v6 · gedeelde stylesheet
   Laag 1 (/founding) + drie routepagina's op één sjabloon.
   Design-lock: paper #F4F1EA, ink #1C2430, terra #C0552B,
   sage #8FA58B, Switzer self-hosted, nooit weight 700.
   Fonts via ../fonts/ zodat dit bestand werkt vanaf de root
   én vanaf de route-subfolders.
============================================================ */

@font-face{font-family:'Switzer';src:url('../fonts/switzer-200.woff2') format('woff2');font-weight:200;font-display:swap;font-style:normal}
@font-face{font-family:'Switzer';src:url('../fonts/switzer-300.woff2') format('woff2');font-weight:300;font-display:swap;font-style:normal}
@font-face{font-family:'Switzer';src:url('../fonts/switzer-400.woff2') format('woff2');font-weight:400;font-display:swap;font-style:normal}
@font-face{font-family:'Switzer';src:url('../fonts/switzer-500.woff2') format('woff2');font-weight:500;font-display:swap;font-style:normal}
@font-face{font-family:'Switzer';src:url('../fonts/switzer-600.woff2') format('woff2');font-weight:600;font-display:swap;font-style:normal}

:root{
  --paper:#F4F1EA; --paper-deep:#EDE8DE; --ink:#1C2430; --ink2:#232D3D;
  --muted:#5D6878; --muted-l:#9AA4B5; --sage:#8FA58B; --sage-d:#75906D;
  --terra:#C0552B; --terra-l:#E2703F;
  --line-d:rgba(28,36,48,.16); --line-l:rgba(244,241,234,.16);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:70px}
body{font-family:'Switzer',sans-serif;background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased}
::selection{background:var(--sage);color:var(--paper)}
img{max-width:100%;display:block}

.wrap{max-width:1180px;margin:0 auto;padding:0 5vw}
.kicker{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--terra)}
.block-dark .kicker{color:var(--sage)}
.orbit-mark{position:relative;width:38px;height:38px;flex:0 0 38px}
.orbit-mark .core{position:absolute;inset:12px;border-radius:50%;background:var(--paper)}
.orbit-mark .ring{position:absolute;inset:0;border:1px solid rgba(244,241,234,.4);border-radius:50%;animation:spin 24s linear infinite}
.orbit-mark .ring::after{content:'';position:absolute;top:-3px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;background:var(--sage)}
@keyframes spin{to{transform:rotate(360deg)}}
.wordmark{font-weight:500;font-size:1rem;line-height:1.2}
.wordmark small{display:block;font-size:.56rem;color:var(--muted-l);letter-spacing:.16em;text-transform:uppercase;margin-top:2px;font-weight:400}

/* =====================================================
   LAAG 1 · /founding
   ===================================================== */
.l1-hero{background:linear-gradient(168deg,var(--ink) 0%,var(--ink2) 100%);color:var(--paper);padding:30px 0 clamp(40px,5vw,60px);position:relative;overflow:hidden;min-height:min(80vh,760px);display:flex;flex-direction:column}
.l1-hero .arc{position:absolute;border:1px solid rgba(244,241,234,.11);border-radius:50%;width:110vh;height:110vh;left:-42vh;bottom:-74vh;pointer-events:none}
.l1-hero .arc.a2{width:140vh;height:140vh;left:-55vh;bottom:-96vh}
.l1-hero>.wrap{flex:1;display:flex;flex-direction:column;position:relative;z-index:1}
.l1-brand{display:flex;align-items:center;gap:12px;position:relative;z-index:1}
.l1-brand .spotpill{margin-left:auto}

/* ---- spots-badge + aanbod-blok, gedeeld door alle pagina's ---- */
.spotpill{display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border:1px solid var(--terra);border-radius:30px;font-size:.8rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;color:var(--terra);background:rgba(192,85,43,.08);white-space:nowrap}
.spotpill i{flex:0 0 9px;height:9px;border-radius:50%;background:var(--terra);animation:spotpulse 1.9s ease-in-out infinite}
.l1-hero .spotpill,.blk-dark .spotpill{color:var(--terra-l);border-color:var(--terra-l);background:rgba(226,112,63,.13)}
.l1-hero .spotpill i,.blk-dark .spotpill i{background:var(--terra-l)}
@keyframes spotpulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.7)}}

/* Kaders zijn ALTIJD 1px rondom. Nooit een dikkere lijn aan één kant
   (Robbert 2-8-2026: "die dikkere verticale lijn links, dat is niet mooi"). */
.offerbox{border:1px solid var(--terra);border-radius:4px;padding:clamp(20px,2.4vw,26px) clamp(22px,2.6vw,30px);background:rgba(192,85,43,.06);max-width:58rem}
.offerbox .ol{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--terra)}
.offerbox p{margin-top:11px;font-size:clamp(.97rem,1.35vw,1.06rem);line-height:1.6;font-weight:300;color:var(--ink)}
.offerbox b{font-weight:500}
.was{text-decoration:line-through;text-decoration-thickness:1px;color:var(--muted);font-weight:300}
.blk-dark .was,.l1-hero .was{color:var(--muted-l)}
.offerbox .ask{margin-top:15px;padding-top:15px;border-top:1px solid rgba(192,85,43,.3);font-size:.89rem;line-height:1.58;font-weight:300;color:var(--muted)}
.ask>b{font-weight:500;color:var(--ink)}
.asklist{margin-top:12px;list-style:none;padding:0;display:grid;gap:9px}
.asklist li{display:flex;gap:11px;font-size:.89rem;line-height:1.55;font-weight:400;color:var(--muted)}
.asklist li i{flex:0 0 11px;height:11px;margin-top:5px;position:relative}
.asklist li i::before{content:'';position:absolute;left:1px;top:2px;width:9px;height:5px;border-left:1.4px solid var(--sage);border-bottom:1.4px solid var(--sage);transform:rotate(-45deg)}
.askfoot{margin-top:13px;padding-top:12px;border-top:1px solid rgba(192,85,43,.22);font-size:.89rem;font-weight:500;color:var(--ink)}
.l1-hero .ask>b,.blk-dark .ask>b{color:var(--paper)}
.l1-hero .askfoot,.blk-dark .askfoot{color:var(--paper);border-top-color:rgba(226,112,63,.28)}
.l1-hero .offerbox,.blk-dark .offerbox{border-color:var(--terra-l);background:rgba(226,112,63,.1)}
.l1-hero .offerbox .ol,.blk-dark .offerbox .ol{color:var(--terra-l)}
.l1-hero .offerbox p,.blk-dark .offerbox p{color:var(--paper)}
.l1-hero .offerbox .ask,.blk-dark .offerbox .ask{color:var(--muted-l);border-top-color:rgba(226,112,63,.32)}
.l1-head{position:relative;z-index:1;margin:auto 0;padding:clamp(40px,7vw,80px) 0}
.l1-hero h1{font-weight:200;font-size:clamp(2.9rem,7.4vw,6rem);line-height:.98;letter-spacing:-.045em;max-width:15ch}
.l1-hero h1 em{font-style:normal;color:var(--sage)}
.l1-hero .sub{margin-top:clamp(22px,2.6vw,32px);font-weight:300;font-size:clamp(1.02rem,1.55vw,1.22rem);line-height:1.62;color:var(--muted-l);max-width:none}
.l1-head .offerbox{margin-top:clamp(26px,3vw,38px)}
.l1-mini{margin-top:clamp(24px,2.8vw,34px);display:flex;flex-wrap:wrap;gap:11px 30px}
.l1-mini span{display:flex;align-items:center;gap:10px;font-size:.85rem;color:var(--muted-l);font-weight:300}
.l1-mini i{flex:0 0 5px;height:5px;border-radius:50%;background:var(--sage)}
.l1-cue{position:relative;z-index:1;display:flex;align-items:center;gap:12px;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--muted-l)}
.l1-cue svg{width:15px;height:15px;stroke:var(--sage);fill:none;stroke-width:1.7;animation:cuebob 2.1s ease-in-out infinite}
@keyframes cuebob{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}

.l1-chips{background:var(--paper-deep);padding:26px 0;border-bottom:1px solid var(--line-d)}
.l1-chips .q{font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);font-weight:600;margin-bottom:14px}
.chips{display:flex;gap:10px;flex-wrap:wrap}
.chip{border:1px solid var(--line-d);border-radius:30px;padding:10px 19px;font-size:.88rem;font-weight:400;background:var(--paper);color:var(--ink);text-decoration:none;transition:background .2s,border-color .2s,color .2s}
.chip:hover,.chip:focus-visible{border-color:var(--sage-d);background:var(--sage);color:var(--paper);outline:none}

/* ---- laag 1 · voor wie dit is (blok 2, licht tussen donker en deep) ---- */
.l1-who{background:var(--paper);padding:clamp(58px,7vw,100px) 0}
.l1-who .wrap{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(30px,4.6vw,70px);align-items:start}
.l1-who h2{margin-top:16px;font-weight:200;font-size:clamp(1.8rem,3.6vw,2.6rem);letter-spacing:-.032em;line-height:1.13;max-width:22ch}
.l1-who h2 em{font-style:normal;color:var(--terra)}
.wholede{margin-top:22px;font-weight:300;font-size:clamp(1rem,1.45vw,1.1rem);line-height:1.72;color:var(--muted)}
.wholede b{font-weight:500;color:var(--ink)}
.whorow{display:grid;grid-template-columns:1fr;gap:clamp(18px,2vw,24px);padding-top:9px}
.wq{border-top:1px solid var(--line-d);padding-top:16px;font-size:.94rem;line-height:1.6;font-weight:300;color:var(--muted)}
.wholink{margin-top:clamp(28px,3.2vw,38px);display:inline-flex;align-items:center;gap:11px;font-size:.92rem;font-weight:500;color:var(--terra);text-decoration:none;border-bottom:1px solid rgba(192,85,43,.35);padding-bottom:4px;transition:color .2s,border-color .2s}
.wholink:hover{color:var(--sage-d);border-color:var(--sage)}
.wholink svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7}

.l1-routes{background:var(--paper-deep);border-top:1px solid var(--line-d)}
.l1-tiles{padding:clamp(46px,6vw,74px) 0 10px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}
.tile{border:1px solid var(--line-d);border-radius:5px;padding:clamp(28px,3vw,36px) clamp(24px,2.6vw,32px) clamp(26px,2.6vw,32px);display:flex;flex-direction:column;background:var(--paper);transition:transform .28s ease-out,box-shadow .28s ease-out,border-color .28s}
.tile:hover{transform:translateY(-5px);box-shadow:0 16px 38px rgba(28,36,48,.13)}
.tile.dark{background:linear-gradient(165deg,var(--ink),var(--ink2));color:var(--paper);border-color:transparent}
.tile:target{border-color:var(--terra);box-shadow:0 0 0 3px rgba(192,85,43,.16)}
.tile.dark:target{border-color:var(--terra)}
.t-label{display:flex;align-items:baseline;gap:11px;padding-bottom:15px;border-bottom:1px solid var(--line-d);font-size:clamp(1.02rem,1.5vw,1.18rem);letter-spacing:-.01em;font-weight:500;color:var(--terra)}
.t-label b{font-weight:600;font-size:.72rem;letter-spacing:.12em;color:var(--muted-l)}
.tile.dark .t-label{color:var(--terra-l);border-bottom-color:rgba(244,241,234,.17)}
.tile h2 em{font-style:normal;color:var(--terra)}
.tile.dark h2 em{color:var(--sage)}
.tile h2{margin-top:clamp(22px,2.6vw,32px);min-height:3em;font-weight:200;font-size:clamp(1.7rem,2.55vw,2.2rem);line-height:1;letter-spacing:-.04em}
.t-one{margin-top:14px;min-height:6.2em;font-size:.94rem;line-height:1.55;font-weight:300;color:var(--muted);max-width:28ch}
.tile.dark .t-one{color:var(--muted-l)}
.t-sec{margin-top:clamp(24px,2.6vw,30px);font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--sage-d)}
.tile.dark .t-sec{color:var(--sage)}
.tile ul{margin:14px 0 clamp(28px,3vw,38px);list-style:none;display:grid;gap:11px}
.tile li{display:flex;gap:11px;font-size:.9rem;line-height:1.5;font-weight:300;color:var(--muted)}
.tile.dark li{color:var(--muted-l)}
.tile li i{flex:0 0 5px;height:5px;border-radius:50%;background:var(--sage);margin-top:8px}
.t-btn{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:10px;padding:15px;border-radius:3px;background:var(--ink);color:var(--paper);font-size:.88rem;font-weight:500;text-decoration:none;transition:background .2s;text-align:center}
.tile.dark .t-btn{background:var(--terra)}
.t-btn:hover{background:var(--terra)}
.tile.dark .t-btn:hover{background:var(--sage-d)}
.t-btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7}

.l1-cond{margin-top:clamp(34px,4vw,46px);background:var(--paper-deep);border-left:2px solid var(--terra);padding:24px 28px}
.l1-cond .lab{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--terra);margin-bottom:10px}
.l1-cond p{font-weight:300;font-size:.96rem;line-height:1.7;color:var(--muted);max-width:52rem}
.l1-cond p b{font-weight:500;color:var(--ink)}
.l1-cta{padding:clamp(40px,5vw,58px) 0 clamp(48px,6vw,64px);text-align:center}
.l1-cta p{margin-top:14px;font-size:.82rem;color:var(--muted-l);font-weight:300}

/* =====================================================
   LAAG 2 · routepagina's
   ===================================================== */
.rnav{position:sticky;top:0;z-index:40;background:rgba(28,36,48,.97);backdrop-filter:blur(8px);color:var(--paper);border-bottom:1px solid var(--line-l)}
.rnav .wrap{display:flex;align-items:center;gap:clamp(12px,2vw,24px);padding-top:11px;padding-bottom:11px;font-size:.82rem}
.rnav a{color:var(--muted-l);text-decoration:none;font-weight:300;white-space:nowrap;transition:color .2s}
.rnav a:hover{color:var(--paper)}
.rnav a.back{margin-right:auto;color:var(--sage);font-weight:400}
.rnav a.on{color:var(--paper);font-weight:500;border-bottom:1px solid var(--sage);padding-bottom:2px}

.rhero{background:var(--paper-deep);padding:clamp(46px,5.6vw,74px) 0;border-bottom:1px solid var(--line-d)}
.rhero .wrap{display:grid;grid-template-columns:1.55fr 1fr;gap:clamp(26px,4vw,46px);align-items:end}
.rhero h1{margin-top:14px;font-weight:200;font-size:clamp(1.9rem,4vw,2.7rem);letter-spacing:-.028em;line-height:1.12}
.rhero h1 em{font-style:normal;color:var(--sage-d)}
.rhero .lede{margin-top:18px;font-weight:300;font-size:clamp(.95rem,1.4vw,1.04rem);line-height:1.68;color:var(--muted);max-width:36rem}
.buycard{background:var(--paper);border:1px solid var(--line-d);border-radius:4px;padding:24px}
.buycard .p{font-size:1.55rem;font-weight:300;letter-spacing:-.015em}
.buycard .p small{display:block;font-size:.75rem;color:var(--muted-l);margin-top:5px;font-weight:300;letter-spacing:0}
.buycard .btn{margin-top:18px;display:flex;align-items:center;justify-content:center;gap:10px;padding:14px;background:var(--terra);color:var(--paper);border-radius:3px;font-weight:500;font-size:.88rem;text-decoration:none;transition:background .2s;text-align:center}
.buycard .btn:hover{background:var(--sage-d)}
.buycard .btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7}
.buycard .fine{margin-top:12px;font-size:.75rem;color:var(--muted-l);font-weight:300;text-align:center;line-height:1.5}

/* ---- "jij bent gekozen"-kaart, vervangt het prijsblok in de hero ---- */
.pickcard .pk{font-weight:300;font-size:1.4rem;letter-spacing:-.024em;line-height:1.18}
.pickcard .pk em{font-style:normal;color:var(--terra)}
.pickcard p{margin-top:12px;font-size:.88rem;line-height:1.62;font-weight:300;color:var(--muted)}

/* ---- oude situatie vs nieuwe situatie, onderin elke hero ---- */
.rhero .swapwrap{display:block;margin-top:clamp(32px,3.8vw,50px)}
.swap{display:grid;grid-template-columns:1fr 58px 1fr;border:1px solid var(--line-d);border-radius:5px;overflow:hidden;background:var(--paper)}
.swapcol{padding:clamp(24px,2.7vw,34px) clamp(22px,2.5vw,32px)}
.swapcol.now{background:var(--paper)}
.swapcol.next{background:linear-gradient(165deg,var(--ink),var(--ink2));color:var(--paper)}
.swapcol h3{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--muted)}
.swapcol.next h3{color:var(--sage)}
.swapcol ul{margin-top:18px;list-style:none;display:grid;gap:14px}
.swapcol li{display:flex;gap:13px;font-size:clamp(.91rem,1.25vw,1rem);line-height:1.55;font-weight:300;color:var(--muted)}
.swapcol.next li{color:var(--paper)}
.swapcol li i{flex:0 0 11px;height:11px;margin-top:6px;position:relative}
.swapcol.now li i::before,.swapcol.now li i::after{content:'';position:absolute;left:0;top:5px;width:11px;height:1px;background:var(--muted-l)}
.swapcol.now li i::before{transform:rotate(45deg)}
.swapcol.now li i::after{transform:rotate(-45deg)}
.swapcol.next li i::before{content:'';position:absolute;left:1px;top:0;width:9px;height:5px;border-left:1.4px solid var(--sage);border-bottom:1.4px solid var(--sage);transform:rotate(-45deg)}
.swaparr{display:flex;align-items:center;justify-content:center;background:var(--paper);border-left:1px solid var(--line-d)}
.swaparr svg{width:19px;height:19px;stroke:var(--terra);fill:none;stroke-width:1.6}

.blk{padding:clamp(58px,7.2vw,104px) 0}
.blk-deep{background:var(--paper-deep)}
.blk-dark{background:linear-gradient(168deg,var(--ink) 0%,var(--ink2) 100%);color:var(--paper)}
.blk h2{margin-top:14px;font-weight:200;font-size:clamp(1.6rem,3.2vw,2.3rem);letter-spacing:-.025em;line-height:1.16;max-width:22ch}
.blk h2 em{font-style:normal;color:var(--sage-d)}
.blk-dark h2 em{color:var(--sage)}
.blk .intro{margin-top:16px;max-width:44rem;font-weight:300;font-size:clamp(.95rem,1.4vw,1.04rem);line-height:1.72;color:var(--muted)}
.blk-dark .intro{color:var(--muted-l)}
.blk .intro b,.blk .intro strong{font-weight:500;color:var(--ink)}
.blk-dark .intro b,.blk-dark .intro strong{color:var(--paper)}

/* wel / niet blokken */
.feelgrid{margin-top:34px;display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:clamp(14px,2vw,26px)}
.feelcol{border-top:2px solid var(--sage);padding-top:20px}
.feelcol.gone{border-top-color:var(--muted-l)}
.feelcol.not{border-top-color:var(--terra)}
.feelcol h3{font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--sage-d)}
.feelcol.gone h3{color:var(--muted)}
.feelcol.not h3{color:var(--terra)}
.feelcol ul{margin-top:15px;list-style:none;display:grid;gap:13px}
.feelcol li{display:flex;gap:11px;font-size:.93rem;line-height:1.6;font-weight:300;color:var(--muted)}
.feelcol li i{flex:0 0 6px;height:6px;border-radius:50%;background:var(--sage);margin-top:8px}
.feelcol.gone li i{border-radius:0;height:1px;width:9px;flex-basis:9px;background:var(--muted-l);margin-top:11px}
.feelcol.not li i{border-radius:0;height:9px;width:9px;flex-basis:9px;background:none;border-left:1px solid var(--terra);border-bottom:1px solid var(--terra);transform:rotate(-45deg);margin-top:6px;opacity:.75}

/* grote cijfers */
.bignums{margin-top:36px;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,2vw,22px)}
.bignum{border-top:1px solid var(--line-l);padding-top:20px}
.blk-light .bignum{border-top-color:var(--line-d)}
.bignum .n{font-weight:200;font-size:clamp(2.1rem,4.6vw,3.3rem);letter-spacing:-.035em;line-height:1;color:var(--sage)}
.bignum .l{margin-top:11px;font-size:.86rem;line-height:1.55;font-weight:300;color:var(--muted-l)}
.bignums-note{margin-top:26px;font-size:.84rem;color:var(--muted-l);font-weight:300;max-width:44rem;line-height:1.65}

/* uitkomsten in woorden, niet in data */
.outcomes{margin-top:clamp(34px,3.8vw,46px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,2.6vw,34px) clamp(22px,3vw,44px)}
.oc{border-top:1px solid var(--line-l);padding-top:22px}
.blk:not(.blk-dark) .oc{border-top-color:var(--line-d)}
.oc .ot{font-weight:200;font-size:clamp(1.3rem,2.4vw,1.85rem);letter-spacing:-.032em;line-height:1.14;color:var(--sage)}
.oc p{margin-top:13px;font-size:.93rem;line-height:1.62;font-weight:300;color:var(--muted-l)}
.blk:not(.blk-dark) .oc p{color:var(--muted)}

/* tijdlijn */
.tl{margin-top:34px;position:relative}
.tl::before{content:'';position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--line-d)}
.blk-dark .tl::before{background:var(--line-l)}
.tl::after{content:'';position:absolute;left:0;top:0;width:1px;background:var(--sage);height:var(--fill,0%);transition:height 1.1s ease-out}
.tlrow{position:relative;padding:0 0 26px 32px}
.tlrow:last-child{padding-bottom:0}
.tlrow::before{content:'';position:absolute;left:-4px;top:7px;width:9px;height:9px;border-radius:50%;background:var(--paper-deep);border:1px solid var(--line-d)}
.blk-dark .tlrow::before{background:var(--ink);border-color:var(--line-l)}
.tlrow.in::before{background:var(--sage);border-color:var(--sage)}
.tlrow .w{font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--sage-d)}
.blk-dark .tlrow .w{color:var(--sage)}
.tlrow .t{margin-top:7px;font-size:.95rem;line-height:1.65;font-weight:300;color:var(--muted)}
.blk-dark .tlrow .t{color:var(--muted-l)}
.tlrow .t b{font-weight:500;color:var(--ink)}
.blk-dark .tlrow .t b{color:var(--paper)}

/* maandcyclus */
.cycle{margin-top:34px;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.cyc{border:1px solid var(--line-d);border-radius:4px;padding:20px 18px;position:relative;background:var(--paper)}
.blk-deep .cyc{background:var(--paper)}
.cyc .cn{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--terra)}
.cyc h4{margin-top:9px;font-weight:500;font-size:1rem}
.cyc p{margin-top:7px;font-size:.87rem;line-height:1.55;font-weight:300;color:var(--muted)}
.cyc::after{content:'';position:absolute;right:-6px;top:50%;width:11px;height:11px;margin-top:-5px;border-top:1px solid var(--sage-d);border-right:1px solid var(--sage-d);transform:rotate(45deg);z-index:2}
.cyc:last-child::after{display:none}

/* maandtrappen */
.tiers{margin-top:clamp(34px,3.6vw,46px);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,20px)}
.tiers.two{grid-template-columns:repeat(2,1fr)}
.cross.one{grid-template-columns:1fr}
.tiers.four{grid-template-columns:repeat(4,1fr);gap:12px}
.tiers.four .tier{padding:22px 19px}
.tiers.four .tier h4{font-size:1.32rem}
.tier{--tpy:clamp(26px,2.6vw,32px);--tpx:clamp(22px,2.3vw,28px);border:1px solid var(--line-d);border-radius:4px;padding:var(--tpy) var(--tpx);display:flex;flex-direction:column;background:var(--paper);overflow:hidden}

/* doorlooptijd-banner bovenin elk (sub)pad */
.durbar{margin:calc(-1 * var(--tpy)) calc(-1 * var(--tpx)) clamp(20px,2.2vw,26px);padding:12px var(--tpx);display:flex;align-items:center;gap:10px;background:var(--ink);color:var(--paper);font-size:.83rem;font-weight:500;line-height:1.3}
.durbar b{font-weight:600;white-space:nowrap}
.durbar span{color:var(--muted-l);font-weight:300}
.durbar svg{flex:0 0 15px;width:15px;height:15px;stroke:var(--sage);fill:none;stroke-width:1.7}
.tier.hi .durbar{background:var(--terra)}
.tier.hi .durbar svg{stroke:var(--paper)}
.tier.hi .durbar span{color:rgba(244,241,234,.72)}
.tier.hi{background:linear-gradient(165deg,var(--ink),var(--ink2));color:var(--paper);border-color:transparent}
.tier .tn{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--terra)}
.tier.hi .tn{color:var(--sage)}
.tier h4{margin-top:11px;font-weight:300;font-size:1.5rem;letter-spacing:-.02em}
.tier h4 small{display:block;font-size:.75rem;color:var(--muted-l);margin-top:7px;font-weight:300;letter-spacing:0;line-height:1.5}
.tier .who{margin-top:17px;font-size:.8rem;font-weight:500;color:var(--sage-d)}
.tier.hi .who{color:var(--sage)}
.tier ul{margin-top:13px;list-style:none;display:grid;gap:11px}
.tier li{display:flex;gap:10px;font-size:.89rem;line-height:1.58;font-weight:300;color:var(--muted)}
.tier.hi li{color:var(--muted-l)}
.tier li b{font-weight:500;color:var(--ink)}
.tier.hi li b{color:var(--paper)}
.tier li i{flex:0 0 5px;height:5px;border-radius:50%;background:var(--sage);margin-top:9px}

/* prijs met doorgestreepte was-prijs + kortingsbadge */
.pricerow{display:flex;align-items:baseline;gap:11px;flex-wrap:wrap}
.pnow{font-weight:300;font-size:clamp(1.6rem,2.4vw,1.95rem);letter-spacing:-.028em;line-height:1}
.pricerow .was{font-size:1rem}
.off{font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;padding:5px 10px;border-radius:999px;background:var(--terra);color:var(--paper);white-space:nowrap;position:relative;top:-2px}
.tier.hi .off,.blk-dark .off{background:var(--terra-l);color:var(--paper)}
.pmo{font-size:.9rem;font-weight:300;color:var(--muted)}
.tier.hi .pmo{color:var(--muted-l)}

/* volledige leveringslijst */
.deliv{margin-top:32px;display:grid;gap:0}
.dgrp{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--terra);margin:26px 0 4px}
.dgrp:first-child{margin-top:0}
.deliv .d{display:flex;gap:14px;padding:17px 0;border-bottom:1px solid var(--line-d)}
.deliv .d i{flex:0 0 6px;height:6px;border-radius:50%;background:var(--sage);margin-top:9px}
.deliv .d p{font-size:.94rem;line-height:1.65;font-weight:300;color:var(--muted)}
.deliv .d p b{font-weight:500;color:var(--ink)}

/* prijsladder */
.ladder{margin-top:32px;max-width:38rem;border:1px solid var(--line-d);border-radius:4px;padding:28px 26px;background:var(--paper)}
.blk-dark .ladder{background:var(--ink2);border-color:var(--line-l)}
.ladder .lh{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;font-weight:600;color:var(--terra)}
.rung{display:flex;align-items:baseline;gap:14px;padding:15px 2px;border-top:1px solid var(--line-d);font-size:.98rem}
.blk-dark .rung{border-top-color:var(--line-l)}
.rung:first-of-type{border-top:0;padding-top:20px}
.rung .spot{flex:0 0 auto;min-width:5.2em;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--muted)}
.blk-dark .rung .spot{color:var(--muted-l)}
.rung .dots{flex:1;border-bottom:1px dashed var(--line-d);position:relative;top:-4px}
.blk-dark .rung .dots{border-bottom-color:var(--line-l)}
.rung .price{font-weight:500;font-size:1.12rem;white-space:nowrap}
.rung .tag{font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;padding:4px 10px;border-radius:999px;white-space:nowrap}
.rung.reserved .tag{background:var(--sage-d);color:var(--paper)}
.rung.next .tag{background:var(--terra);color:var(--paper)}
.rung.next .price{color:var(--terra)}
.rung.after{border-top-style:dashed}
.rung.after .spot,.rung.after .price{color:var(--muted);font-weight:400}
.ladder .lnote{margin-top:20px;padding-top:18px;border-top:1px solid var(--line-d);font-size:.86rem;line-height:1.6;color:var(--muted);font-weight:300}
.blk-dark .ladder .lnote{border-top-color:var(--line-l);color:var(--muted-l)}
.ladders2{margin-top:32px;display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start;max-width:none}
.ladders2 .ladder{margin-top:0;max-width:none}
.ladder .lnote b{font-weight:500;color:var(--ink)}
.blk-dark .ladder .lnote b{color:var(--paper)}

/* faq */
.faq{margin-top:30px;max-width:48rem}
.faq details{border-bottom:1px solid var(--line-d)}
.faq summary{list-style:none;cursor:pointer;padding:18px 34px 18px 0;position:relative;font-size:1rem;font-weight:400}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'';position:absolute;right:6px;top:50%;width:9px;height:9px;margin-top:-7px;border-right:1px solid var(--muted);border-bottom:1px solid var(--muted);transform:rotate(45deg);transition:transform .22s}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-2px}
.faq .a{padding:0 0 20px;font-size:.94rem;line-height:1.7;font-weight:300;color:var(--muted);max-width:44rem}

/* kruislinks */
.cross{margin-top:34px;display:grid;grid-template-columns:1fr 1fr;gap:14px}
.crosscard{border:1px solid var(--line-d);border-radius:4px;padding:22px;text-decoration:none;display:block;transition:border-color .2s,transform .2s}
.crosscard:hover{border-color:var(--sage);transform:translateY(-3px)}
.crosscard .cl{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--terra)}
.crosscard h4{margin-top:10px;font-weight:400;font-size:1.05rem;color:var(--ink)}
.crosscard p{margin-top:7px;font-size:.87rem;line-height:1.55;font-weight:300;color:var(--muted)}
.blk-dark .crosscard{border-color:var(--line-l)}
.blk-dark .crosscard .cl{color:var(--sage)}
.blk-dark .crosscard h4{color:var(--paper)}
.blk-dark .crosscard p{color:var(--muted-l)}

/* sticky boekbalk */
.sticky{position:sticky;bottom:0;z-index:45;background:rgba(28,36,48,.97);backdrop-filter:blur(8px);color:var(--paper);border-top:1px solid var(--line-l)}
.sticky .wrap{display:flex;align-items:center;gap:16px;padding-top:12px;padding-bottom:12px;font-size:.86rem;font-weight:300}
.sticky .lbl b{font-weight:500}
.sticky .lbl span{color:var(--muted-l)}
.sticky .btn{margin-left:auto;background:var(--terra);color:var(--paper);padding:11px 24px;border-radius:3px;font-weight:500;text-decoration:none;font-size:.84rem;white-space:nowrap;transition:background .2s}
.sticky .btn:hover{background:var(--sage-d)}

/* footer */
.foot{border-top:1px solid var(--line-l);padding:28px 0;background:var(--ink);color:var(--muted-l)}
.foot .wrap{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;font-size:.8rem}
.foot .brand{display:flex;align-items:center;gap:11px}
.foot .orbit-mark{width:28px;height:28px;flex:0 0 28px}
.foot .wordmark{font-size:.8rem}
.foot a{color:inherit;text-decoration:none}
.foot a:hover{color:var(--paper)}

/* knop groot */
.btn-terra{cursor:pointer;text-decoration:none;background:var(--terra);color:var(--paper);display:inline-flex;align-items:center;gap:15px;padding:18px 34px;font-size:1rem;font-weight:500;border-radius:3px;transition:background .2s}
.btn-terra:hover{background:var(--sage-d)}
.btn-terra svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.6}

/* =====================================================
   scroll-choreografie
   ===================================================== */
.anim [data-rv]{opacity:0;transform:translateY(22px);transition:opacity .55s ease-out,transform .55s ease-out;transition-delay:var(--rd,0ms)}
.anim [data-rv].in{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion: reduce){
  .anim [data-rv]{opacity:1;transform:none;transition:none}
  .ring{animation:none !important}
  .tl::after{transition:none;height:100%}
  html{scroll-behavior:auto}
}

/* =====================================================
   responsive
   ===================================================== */
@media (max-width:1050px){
  .l1-hero h1{max-width:14ch}
  .l1-who .wrap{grid-template-columns:1fr}
  .whorow{grid-template-columns:1fr 1fr;padding-top:0;margin-top:clamp(26px,3vw,34px)}
  .l1-tiles{grid-template-columns:1fr 1fr}
  .l1-tiles .tile:last-child{grid-column:1 / -1}
  .l1-tiles .tile:last-child h2{max-width:16ch}
  .feelgrid{grid-template-columns:1fr}
  .bignums{grid-template-columns:1fr 1fr}
  .cycle{grid-template-columns:1fr 1fr}
  .cyc:nth-child(2)::after{display:none}
  .tiers,.tiers.four{grid-template-columns:1fr 1fr}
  .ladders2{grid-template-columns:1fr}
  .rhero .wrap{grid-template-columns:1fr}
}
@media (max-width:720px){
  .swap{grid-template-columns:1fr}
  .swaparr{padding:13px 0;border-left:0;border-top:1px solid var(--line-d)}
  .swaparr svg{transform:rotate(90deg)}
  .outcomes{grid-template-columns:1fr}
  .l1-hero{min-height:auto}
  .l1-hero h1{max-width:none}
  .l1-cue{display:none}
  .whorow{grid-template-columns:1fr}
  .l1-tiles{grid-template-columns:1fr}
  .l1-tiles .tile:last-child{grid-column:auto}
  .l1-tiles .tile:last-child h2{max-width:none}
  .tile h2,.t-one{min-height:0}
  .t-one{max-width:none}
  .bignums{grid-template-columns:1fr}
  .tiers,.tiers.four,.tiers.two{grid-template-columns:1fr}
  .cycle{grid-template-columns:1fr}
  .cyc::after{right:50%;top:auto;bottom:-6px;margin:0 -5px 0 0;transform:rotate(135deg)}
  .cross{grid-template-columns:1fr}
  .rnav .wrap{flex-wrap:wrap;gap:14px;font-size:.78rem}
  .rnav a.back{flex:0 0 100%;margin-right:0;padding-bottom:10px;border-bottom:1px solid var(--line-l)}
  .sticky .wrap{gap:11px}
  .sticky .lbl{font-size:.8rem}
  .sticky .btn{padding:11px 17px;font-size:.8rem}
  .btn-terra{width:100%;justify-content:center}
}


/* ============================================================
   HERZIENING 2026-08-02 — founding-tak gelijkgetrokken met de homepage.
   Was: h1 96px tegen 70,56px op home, body 17,6px/gewicht 300 tegen
   16,96px/400, eyebrows 10,56px tegen 12px en drie verschillende
   linkerkantlijnen (256 / 202 / 235px) tegen 145px op home.
   ============================================================ */
:root { --measure: 36rem; --terra-text: #A8481F; }

.wrap { max-width: 1294px; padding: 0 5vw; box-sizing: border-box; }
/* de hero-wrap is een flexitem met auto-marges en krimpt daardoor naar zijn
   inhoud in plaats van uit te rekken, waardoor de hero verder insprong */
.l1-hero > .wrap, .rhero > .wrap { width: 100%; }

.l1-hero h1, .rhero h1 { font-size: clamp(2.6rem, 4.9vw, 4.41rem);
  letter-spacing: -.025em; line-height: 1.02; max-width: 14em; text-wrap: balance; }
.l1-who h2, .tile h2, .rsec h2 { text-wrap: balance; }
.l1-hero .sub, .rhero .sub { font-size: 1.06rem; font-weight: 400; line-height: 1.75;
  max-width: var(--measure); }
.wholede { font-size: 1.06rem; font-weight: 400; line-height: 1.75; max-width: var(--measure); }
.offerbox p, .offerbox .ask, .l1-cond p, .rsec .intro { font-weight: 400; }
.rsec .intro { max-width: var(--measure); }
.t-one, .tile li, .wq { font-weight: 400; font-size: .95rem; }
.wq { text-wrap: balance; }

.kicker, .l1-cue, .l1-chips .q { font-size: .75rem; letter-spacing: .18em; }
.t-label b { font-size: .75rem; }
.t-sec { font-size: .68rem; }

.kicker, .wholink, .l1-cond .lab { color: var(--terra-text); }
.wholink { border-bottom-color: rgba(168,72,31,.35); }

.tile h2 { min-height: 2.4em; }
.t-one { max-width: none; min-height: 4.65em; }

/* route 03 (webshops) is een zijstap en krijgt een eigen tint met stippelkader */
.t-sub { margin-top: 8px; font-size: .8rem; font-style: italic; color: var(--muted); }
.tile.dark .t-sub { color: rgba(244,241,234,.6); }
.tile.zij { background: #E7E1D5; border: 1px dashed rgba(28,36,48,.34); }
.tile.zij .t-label { color: var(--muted); }
.t-badge { display: inline-block; align-self: flex-start; font-size: .62rem;
  letter-spacing: .16em; text-transform: uppercase; font-weight: 600; color: #6B5A46;
  border: 1px solid rgba(107,90,70,.4); border-radius: 999px; padding: 5px 10px;
  margin-bottom: 16px; }

/* de drie routepagina's draaien op dezelfde stylesheet en krijgen dus dezelfde
   leesmaat en bodymaat; ze stonden op 16,64px/300 tegen 16,96px/400 elders */
.blk .intro, .rhero .lede { font-size: 1.06rem; font-weight: 400; line-height: 1.75;
  max-width: var(--measure); }
.tier li, .oc p, .pickcard p, .swapcol li, .durbar span { font-weight: 400; }
.tier li, .oc p, .pickcard p { font-size: .95rem; }

/* Uitlijning drie tegels: zelfde skelet; badge zweeft op de rand rechtsboven */
.tile{position:relative}
.t-sub{font-style:normal}
.t-badge{position:absolute;top:-11px;right:14px;margin-bottom:0;background:#E7E1D5}

/* Vanaf-prijs per tegel en op de routekaart */
.t-price{margin-top:auto;padding-top:20px;font-size:1.3rem;font-weight:400;letter-spacing:-.02em;color:var(--ink)}
.t-price small{margin-right:7px;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--terra)}
.tile.dark .t-price{color:var(--paper)}
.tile.dark .t-price small{color:var(--terra-l)}
.t-price+.t-btn{margin-top:14px}
.pk-price{margin-top:16px;font-size:1.5rem;font-weight:300;letter-spacing:-.02em;color:var(--ink)}
.pk-price small{margin-right:7px;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--terra)}
.l1-tiles .t-label{min-height:3.5em}
.t-label b{white-space:nowrap}

/* Who-this-is-for: drie sfeer-kaartjes (vervangen de wq-quotes) */
.moments{position:relative;display:flex;flex-direction:column;align-items:stretch;padding:6px 2px}
.mcard{position:relative;width:calc(100% - 16px);border:1px solid var(--line-d);border-radius:6px;background:#fff;padding:20px 22px;box-shadow:0 14px 34px rgba(28,36,48,.09)}
.mcard .mlab{display:flex;align-items:center;gap:8px;font-size:.6rem;letter-spacing:.17em;text-transform:uppercase;font-weight:600;color:var(--muted)}
.mcard .mlab i{width:6px;height:6px;border-radius:50%;background:var(--sage)}
.mcard .mtime{margin-top:8px;font-weight:200;font-size:clamp(2rem,2.6vw,2.5rem);letter-spacing:-.04em;line-height:1;color:var(--ink)}
.mcard .mtime small{font-size:.42em;font-weight:300;letter-spacing:0;color:var(--muted);margin-left:8px}
.mcard .mq{margin-top:10px;font-size:.92rem;line-height:1.6;font-weight:400;color:var(--muted)}
.mcard.night{align-self:flex-start;transform:rotate(-1.8deg);background:linear-gradient(160deg,var(--ink) 55%,var(--ink2));border-color:transparent;overflow:hidden;z-index:3}
.mcard.night::after{content:'';position:absolute;right:-40px;top:-46px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,rgba(159,178,206,.28),rgba(159,178,206,0) 68%)}
.mcard.night .mlab{color:var(--muted-l)}
.mcard.night .mlab i{background:var(--terra-l)}
.mcard.night .mtime{color:var(--paper)}
.mcard.night .mq{color:var(--muted-l)}
.mcard.sunday{align-self:flex-end;margin-top:-12px;transform:rotate(1.4deg);background:#EDE6D8;overflow:hidden;z-index:2}
.mcard.sunday::after{content:'';position:absolute;left:-52px;bottom:-64px;width:210px;height:210px;border-radius:50%;background:radial-gradient(circle,rgba(192,85,43,.16),rgba(192,85,43,0) 70%)}
.mcard.inbox{align-self:flex-start;margin-top:-12px;transform:rotate(-.8deg);z-index:1}
.mrows{margin-top:14px;display:grid;gap:8px}
.mrow{display:flex;align-items:center;gap:10px;border:1px solid var(--line-d);border-radius:4px;padding:8px 11px}
.mrow i{width:6px;height:6px;border-radius:50%;background:var(--terra);flex:0 0 6px}
.mrow .bar{height:7px;border-radius:99px;background:var(--paper-deep);flex:1}
.mrow .bar.s{flex:0 0 34%}
.mrow em{font-style:normal;font-size:.56rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;color:var(--terra-text);white-space:nowrap}
.mcard.inbox .mq{margin-top:14px}
.morbit{position:absolute;top:16px;right:18px;width:22px;height:22px;z-index:4}
.morbit .ring{position:absolute;inset:0;border:1px solid var(--sage-d);border-radius:50%}
.morbit .core{position:absolute;top:50%;left:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:var(--terra)}
@media (max-width:1050px){
  .moments{padding:0;margin-top:clamp(20px,3vw,28px)}
  .mcard{width:100%;align-self:stretch;margin-top:14px}
  .mcard.night{transform:rotate(-.6deg)}
  .mcard.sunday{transform:rotate(.5deg)}
  .mcard.inbox{transform:rotate(-.3deg)}
}
