/* overwinquitter.nl v4.0 | 24 september 2026. Basis v1.3 (Anthonie), design v3 (Max), aanpassingen onderaan per versie. */
:root{
  --coverfront:url("cover-front.png");
  --coverspine:url("cover-spine.png");
  --ink:#111111;
  --gold:#C9A24B;
  --cream:#F7F2E7;
  --paraat:#2B636D;
  --afspreken:#92322D;
  --toeslaan:#B5731B;
  --handhaven:#647C39;
  --line:rgba(247,242,231,.14);
  --dim:rgba(247,242,231,.74);
  --surface:#111111;
  --serif:'Instrument Serif',Georgia,serif;
  --sans:'Work Sans',-apple-system,BlinkMacSystemFont,sans-serif;
  --wrap:1180px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--cream);font-family:var(--sans);font-weight:400;font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
section{padding:104px 0;border-top:1px solid var(--line)}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.06;letter-spacing:-.01em}
h1{font-size:clamp(44px,7vw,80px)}
h2{font-size:clamp(32px,4.4vw,52px)}
h3{font-size:22px;line-height:1.2}
em{font-style:italic;color:var(--gold)}
a{color:inherit}
.eyebrow{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.19em;text-transform:uppercase;color:var(--gold)}
.lead{font-size:19px;line-height:1.68;color:var(--dim);max-width:58ch}
.small{font-size:14px;color:var(--dim)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:.01em;padding:15px 28px;border-radius:2px;border:1px solid var(--gold);background:var(--gold);color:var(--ink);text-decoration:none;cursor:pointer;transition:.18s}
.btn:hover{background:#d8b263;border-color:#d8b263}
.btn.ghost{background:transparent;color:var(--cream);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--gold);color:var(--gold);background:transparent}

/* nav */
nav{position:sticky;top:0;z-index:60;background:rgba(17,17,17,.9);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:70px;gap:28px}
.brand{font-family:var(--serif);font-size:21px;text-decoration:none;white-space:nowrap}
.brand span{color:var(--gold);font-style:italic}
.navlinks{display:flex;gap:30px;font-size:14px}
.navlinks a{text-decoration:none;color:var(--dim);transition:.15s}
.navlinks a:hover{color:var(--cream)}
nav .btn{padding:11px 20px;font-size:14px}
@media(max-width:940px){.navlinks{display:none}}
@media(max-width:520px){nav .btn{display:none}}

/* hero */
.hero{border-top:0;padding:76px 0 96px}
.hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}
.hero h1{margin:18px 0 22px}
.herocta{display:flex;flex-wrap:wrap;gap:12px;margin:32px 0 14px}
@media(max-width:900px){.hero .wrap{grid-template-columns:1fr;gap:52px}}

/* phones */
.phones{position:relative;height:560px}
.phone{position:absolute;width:236px;background:#0a0a0a;border:1px solid rgba(247,242,231,.2);border-radius:32px;padding:11px 9px;box-shadow:0 30px 70px rgba(0,0,0,.65)}
.phone .screen{background:#141414;border-radius:23px;padding:16px 13px 13px;height:452px;overflow:hidden;position:relative}
.notch{width:64px;height:4px;border-radius:4px;background:rgba(247,242,231,.22);margin:0 auto 14px}
.p1{left:0;top:44px;transform:rotate(-4deg);z-index:2}
.p2{left:168px;top:0;z-index:3}
.p3{left:330px;top:64px;transform:rotate(4deg);z-index:1}
@media(max-width:1120px){.p3{display:none}.p2{left:150px}}
@media(max-width:900px){.phones{height:520px;transform:scale(.92);transform-origin:top left}}
@media(max-width:560px){.phones{height:470px;transform:scale(.72)}.p3{display:block}}

.scr-h{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:12px}
.bubble{font-size:11.5px;line-height:1.5;padding:10px 12px;border-radius:12px;margin-bottom:9px}
.bubble.coach{background:rgba(201,162,75,.13);border:1px solid rgba(201,162,75,.28);border-bottom-left-radius:3px}
.bubble.me{background:rgba(247,242,231,.08);border-bottom-right-radius:3px;margin-left:34px}
.flame{font-size:44px;font-family:var(--serif);color:var(--gold);line-height:1;text-align:center;margin:26px 0 2px}
.flamelbl{text-align:center;font-size:10.5px;color:var(--dim);letter-spacing:.1em;text-transform:uppercase}
.week{display:flex;justify-content:space-between;margin:24px 4px 0}
.dot{width:23px;height:23px;border-radius:50%;border:1px solid rgba(247,242,231,.18);display:flex;align-items:center;justify-content:center;font-size:9px;color:var(--dim)}
.dot.on{background:var(--handhaven);border-color:var(--handhaven);color:var(--cream)}
.glad{display:flex;gap:8px;align-items:flex-start;margin-top:15px;font-size:11px;color:var(--dim);line-height:1.4}
.glad b{font-family:var(--serif);font-size:15px;color:var(--gold);line-height:1;width:12px;flex:none}
.beh{display:flex;justify-content:space-between;font-size:11px;padding:7px 0;border-bottom:1px solid rgba(247,242,231,.08)}
.beh span:last-child{color:var(--gold);font-weight:500}


.webwrap{padding:2px 2px 0}
.webnote{font-size:9.5px;color:var(--dim);text-align:center;margin-top:8px;line-height:1.4}
.streakbar{display:flex;gap:12px;align-items:center;margin-top:16px;padding-top:14px;border-top:1px solid rgba(247,242,231,.1)}
.flamesm{font-family:var(--serif);font-size:32px;color:var(--gold);line-height:1}
.streaklbl{font-size:9.5px;color:var(--dim);letter-spacing:.1em;text-transform:uppercase}
.streakbar .week{margin-top:6px;gap:4px}
.streakbar .dot{width:18px;height:18px;font-size:8px}
.qname{font-family:var(--serif);font-size:23px;color:var(--gold);line-height:1.1;margin-top:2px}
.qsub{font-size:9.5px;color:var(--dim);margin-bottom:14px}
.qbars{margin-bottom:14px}
.qbar{margin-bottom:7px}
.qbar span{font-size:9.5px;color:var(--dim);display:block;margin-bottom:3px}
.qbar i{display:block;height:4px;background:var(--gold);opacity:.85}
.qfact{font-size:9.5px;color:var(--dim);line-height:1.45;padding:8px 0;border-top:1px solid rgba(247,242,231,.08)}
.qfact b{display:block;font-weight:500;color:var(--cream);font-size:9px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:3px}

/* reader strip */
.readerstrip{background:#0b0b0b}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:38px}
.card{border:1px solid var(--line);padding:30px 26px 28px;display:flex;flex-direction:column;gap:12px;transition:.18s;text-decoration:none;background:rgba(247,242,231,.015)}
.card:hover{border-color:var(--gold);background:rgba(201,162,75,.05)}
.card .num{font-family:var(--serif);font-size:15px;color:var(--gold)}
.card p{font-size:15px;color:var(--dim);flex:1}
.card .go{font-size:13px;color:var(--gold);font-weight:500}
@media(max-width:820px){.cards3{grid-template-columns:1fr}}

/* features */
.feat{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;margin-top:46px;background:var(--line)}
.feat > div{background:var(--ink);padding:38px 34px}
.feat h3{margin-bottom:10px}
.feat p{font-size:15.5px;color:var(--dim)}
.feat .tag{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:600;display:block;margin-bottom:14px}
@media(max-width:760px){.feat{grid-template-columns:1fr}}

/* pricing */
.prices{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:44px}
.plan{border:1px solid var(--line);padding:38px 34px}
.plan.hl{border-color:var(--gold);position:relative}
.plan.hl:before{content:"Aanbevolen";position:absolute;top:-11px;left:34px;background:var(--gold);color:var(--ink);font-size:10.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;padding:4px 12px}
.price{font-family:var(--serif);font-size:56px;line-height:1;margin:16px 0 4px}
.price sub{font-family:var(--sans);font-size:15px;font-weight:300;color:var(--dim);vertical-align:baseline}
.plan ul{list-style:none;margin-top:24px;border-top:1px solid var(--line);padding-top:20px}
.plan li{font-size:15px;padding:8px 0 8px 24px;position:relative;color:var(--dim)}
.plan li:before{content:"";position:absolute;left:0;top:15px;width:9px;height:1px;background:var(--gold)}
.plan li.off{opacity:.4}
.plan li.off:before{background:var(--dim)}
.trial{margin-top:34px;border:1px solid var(--line);padding:26px 30px;display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
@media(max-width:820px){.prices{grid-template-columns:1fr}}

/* model */
.modelgrid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;margin-top:44px}
.pathmodel{width:100%;height:auto;display:block;max-width:620px;margin:0 auto}
.steps{display:flex;flex-direction:column;gap:2px;background:var(--line)}
.step{background:var(--ink);padding:22px 26px;display:grid;grid-template-columns:56px 1fr;gap:18px;align-items:baseline;border-left:3px solid}
.step .n{font-family:var(--serif);font-size:30px;opacity:.9}
.step h3{margin-bottom:4px}
.step p{font-size:15px;color:var(--dim)}
.behchips{display:flex;flex-wrap:wrap;gap:9px;margin-top:26px}
.chip{border:1px solid var(--line);padding:8px 15px;font-size:13.5px;color:var(--dim);border-radius:2px;font-weight:400}
@media(max-width:900px){.modelgrid{grid-template-columns:1fr;gap:44px}}

/* quitter */
.gedaanten{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line);margin-top:40px}
.gedaanten > div{background:var(--ink);padding:34px 30px}
.gedaanten h3{color:var(--gold);margin-bottom:10px}
.gedaanten p{font-size:15px;color:var(--dim)}
.momenten{margin-top:2px;background:var(--line);display:grid;grid-template-columns:repeat(5,1fr);gap:2px}
.momenten > div{background:var(--ink);padding:26px 22px;font-size:14.5px;color:var(--dim)}
.momenten b{display:block;font-family:var(--serif);font-size:26px;color:var(--gold);font-weight:400;margin-bottom:8px}
@media(max-width:900px){.gedaanten{grid-template-columns:1fr}.momenten{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.momenten{grid-template-columns:1fr}}

/* book */
.bookgrid{display:grid;grid-template-columns:.85fr 1.15fr;gap:60px;align-items:center;margin-top:42px}
.specs{list-style:none;margin-top:26px;border-top:1px solid var(--line)}
.specs li{display:flex;justify-content:space-between;gap:20px;padding:11px 0;border-bottom:1px solid var(--line);font-size:15px}
.specs li span:first-child{color:var(--dim)}
@media(max-width:820px){.bookgrid{grid-template-columns:1fr;gap:40px}}


/* book mockup */
.bookshot{position:relative;padding:34px 0 44px}
.bookshot .halo{position:absolute;left:54%;top:46%;transform:translate(-50%,-50%);width:130%;max-width:600px;height:112%;z-index:1;pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%,rgba(252,220,138,.86),rgba(232,188,96,.44) 42%,rgba(201,162,75,.12) 62%,transparent 78%);
  filter:blur(50px)}
.bookshot .floor{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);width:96%;max-width:440px;height:70px;z-index:1;pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%,rgba(201,162,75,.18),transparent 70%);filter:blur(22px)}
.bookstage{perspective:1600px;perspective-origin:50% 46%;position:relative;z-index:2}
.book{position:relative;width:100%;max-width:300px;aspect-ratio:170/244;transform-style:preserve-3d;margin:0 auto;
  transform:rotateY(-22deg) rotateX(3deg)}
.book .front{position:absolute;inset:0;background-image:var(--coverfront);background-size:cover;background-position:center;
  box-shadow:0 26px 44px rgba(0,0,0,.7)}
.book .front:after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(255,255,255,.10),rgba(255,255,255,0) 30%,rgba(0,0,0,.30))}
.book .spine{position:absolute;top:0;right:100%;width:15%;height:100%;transform-origin:100% 50%;transform:rotateY(-90deg);
  background-image:var(--coverspine);background-size:cover;background-position:center;filter:brightness(.7)}
.book .pages{position:absolute;top:0;left:100%;width:15%;height:100%;transform-origin:0 50%;transform:rotateY(90deg);
  background:linear-gradient(90deg,#FEFCF5,#F3ECDA 42%,#CFC6AC)}
.book .edge{position:absolute;top:-1%;right:-4px;width:9px;height:102%;z-index:4;pointer-events:none;
  background:linear-gradient(90deg,rgba(255,236,180,0),rgba(255,238,186,.92) 45%,rgba(232,190,110,.55) 70%,rgba(201,162,75,0))}

/* author */
.authgrid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;margin-top:40px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line);margin-top:34px}
.stats > div{background:var(--ink);padding:24px 20px}
.stats b{display:block;font-family:var(--serif);font-size:38px;color:var(--gold);font-weight:400;line-height:1}
.stats span{font-size:13px;color:var(--dim)}
.portrait{width:100%;aspect-ratio:4/5;object-fit:cover;border:1px solid var(--line);display:block}
@media(max-width:820px){.authgrid{grid-template-columns:1fr}}

/* signup */
.signup{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px;max-width:520px}
.signup input{flex:1;min-width:220px;background:transparent;border:1px solid var(--line);color:var(--cream);font-family:var(--sans);font-size:15px;padding:14px 16px;border-radius:2px}
.signup input:focus{outline:none;border-color:var(--gold)}
.msg{font-size:14px;color:var(--gold);margin-top:12px;display:none}


/* light surface, for reading pages: leesfragment, werkboek, kaart, voorwaarden, privacy */
.light{background:var(--cream);color:#1a1a1a;--surface:#F7F2E7;--dim:rgba(26,26,26,.72);--line:rgba(18,18,18,.14)}
.light .eyebrow{color:#8A6A21}
.light em{color:#8A6A21}
.light .btn{background:#8A6A21;border-color:#8A6A21;color:var(--cream)}
.light .btn.ghost{background:transparent;color:#1a1a1a;border-color:var(--line)}
.light .btn.ghost:hover{border-color:#8A6A21;color:#8A6A21}

/* teams */
.teams{background:#0b0b0b}
footer{border-top:1px solid var(--line);padding:56px 0 70px;font-size:14px;color:var(--dim)}
footer .fg{display:flex;justify-content:space-between;gap:34px;flex-wrap:wrap}
footer a{color:var(--dim)}
.claim{font-family:var(--serif);font-size:24px;color:var(--cream);margin-bottom:22px}

/* ---- quitter-coach page ---- */
.pagehero{border-top:0;padding:64px 0 84px}
.pagehero .wrap{display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:center}
@media(max-width:900px){.pagehero .wrap{grid-template-columns:1fr;gap:48px}}
.crumb{font-size:13px;color:var(--dim);margin-bottom:26px}
.crumb a{text-decoration:none}
.crumb a:hover{color:var(--gold)}

.rowfeat{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;margin-top:56px}
.rowfeat.flip .visual{order:-1}
@media(max-width:880px){.rowfeat{grid-template-columns:1fr;gap:36px}.rowfeat.flip .visual{order:0}}
.visual{border:1px solid var(--line);padding:34px 30px;background:rgba(247,242,231,.02)}
.numlist{list-style:none;margin-top:22px}
.numlist li{padding:11px 0 11px 34px;position:relative;color:var(--dim);border-bottom:1px solid var(--line);font-size:15.5px}
.numlist li:last-child{border-bottom:0}
.numlist li b{color:var(--cream);font-weight:500}
.numlist li:before{content:"";position:absolute;left:0;top:20px;width:14px;height:1px;background:var(--gold)}

table.cmp{width:100%;border-collapse:collapse;margin-top:38px;font-size:15px}
table.cmp th,table.cmp td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
table.cmp thead th{font-family:var(--sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);font-weight:600;border-bottom:1px solid var(--gold)}
table.cmp td:nth-child(2),table.cmp td:nth-child(3),table.cmp th:nth-child(2),table.cmp th:nth-child(3){width:24%;text-align:center}
table.cmp tr.grp td{padding-top:30px;font-family:var(--sans);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);border-bottom:1px solid var(--gold);font-weight:600}
table.cmp td:first-child{color:var(--cream);font-weight:400}
table.cmp .no{color:rgba(247,242,231,.3)}
table.cmp .yes{color:var(--gold)}
@media(max-width:700px){table.cmp{font-size:13.5px}table.cmp th,table.cmp td{padding:10px 6px}}

.tl{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line);margin-top:40px}
.tl > div{background:var(--ink);padding:30px 26px}
.tl b{display:block;font-family:var(--serif);font-size:15px;color:var(--gold);letter-spacing:.1em;text-transform:uppercase;font-weight:400;margin-bottom:12px}
.tl p{font-size:15px;color:var(--dim)}
@media(max-width:820px){.tl{grid-template-columns:1fr}}

.faq{margin-top:38px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;font-family:var(--serif);font-size:21px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";position:absolute;right:6px;top:19px;color:var(--gold);font-family:var(--sans);font-size:22px;font-weight:300}
.faq details[open] summary:after{content:"\2013"}
.faq p{padding:0 0 22px;color:var(--dim);font-size:15.5px;max-width:70ch}

.warn{border:1px solid var(--line);border-left:3px solid var(--afspreken);padding:26px 30px;margin-top:34px;max-width:74ch}
.warn h3{margin-bottom:10px}
.warn p{font-size:15.5px;color:var(--dim)}

.endcta{text-align:center;padding:104px 0}
.endcta h2{max-width:18ch;margin:16px auto 20px}
.endcta .lead{margin:0 auto}
.endcta .herocta{justify-content:center}

/* ---- shared page chrome ---- */
.pagehero{border-top:0;padding:64px 0 84px}
.pagehero .wrap{display:grid;grid-template-columns:1.02fr .98fr;gap:56px;align-items:center}
@media(max-width:900px){.pagehero .wrap{grid-template-columns:1fr;gap:48px}}
.crumb{font-size:13px;color:var(--dim);margin-bottom:26px}
.crumb a{text-decoration:none}
.crumb a:hover{color:var(--gold)}
.rowfeat{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;margin-top:56px}
.rowfeat.flip .visual{order:-1}
@media(max-width:880px){.rowfeat{grid-template-columns:1fr;gap:36px}.rowfeat.flip .visual{order:0}}
.visual{border:1px solid var(--line);padding:34px 30px;background:rgba(247,242,231,.02)}
.light .visual{background:rgba(18,18,18,.03)}
.numlist{list-style:none;margin-top:22px}
.numlist li{padding:11px 0 11px 34px;position:relative;color:var(--dim);border-bottom:1px solid var(--line);font-size:15.5px}
.numlist li:last-child{border-bottom:0}
.numlist li b{color:var(--cream);font-weight:500}
.light .numlist li b{color:#1a1a1a}
.numlist li:before{content:"";position:absolute;left:0;top:20px;width:14px;height:1px;background:var(--gold)}
.light .numlist li:before{background:#8A6A21}
.faq{margin-top:38px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;font-family:var(--serif);font-size:21px;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";position:absolute;right:6px;top:19px;color:var(--gold);font-family:var(--sans);font-size:22px;font-weight:300}
.light .faq summary:after{color:#8A6A21}
.faq details[open] summary:after{content:"\2013"}
.faq p{padding:0 0 22px;color:var(--dim);font-size:15.5px;max-width:70ch}
.endcta{text-align:center;padding:104px 0}
.endcta h2{max-width:20ch;margin:16px auto 20px}
.endcta .lead{margin:0 auto}
.endcta .herocta{justify-content:center}
.parts{display:grid;grid-template-columns:repeat(2,1fr);gap:2px;background:var(--line);margin-top:40px}
.parts > div{background:var(--ink);padding:32px 30px}
.light .parts > div{background:var(--cream)}
.parts b{display:block;font-family:var(--sans);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:12px}
.light .parts b{color:#8A6A21}
.parts h3{margin-bottom:8px}
.parts p{font-size:15px;color:var(--dim)}
@media(max-width:820px){.parts{grid-template-columns:1fr}}
.qbox{border:1px solid var(--line);padding:26px 30px;margin-top:14px}
.qbox .qn{font-family:var(--serif);font-size:15px;color:var(--gold);margin-bottom:6px}
.qbox p{font-size:16.5px}
.rule{border:0;border-top:1px solid var(--line);margin:56px 0}
.sheet{border:1px solid var(--line);padding:0;overflow:hidden;background:#fff;color:#111}
.sheetinner{padding:26px 24px}
.sheet .sh{font-family:var(--serif);font-size:19px;margin-bottom:4px}
.sheet .ss{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#8A6A21;font-weight:600;margin-bottom:16px}
.sheet .line{height:1px;background:rgba(0,0,0,.14);margin:13px 0}
.sheet .qq{font-size:12.5px;color:#333;margin-top:16px}
.foldbar{display:flex;gap:0;margin-top:6px}
.foldbar div{flex:1;border:1px dashed rgba(18,18,18,.3);padding:14px 12px;font-size:11px;color:#555;text-align:center}

/* ---- My New Behavior, zakelijke huisstijl ---- */
.mnb{
  --ink:#0E2340;
  --gold:#4FA3DC;
  --cream:#F4F7FB;
  --line:rgba(244,247,251,.16);
  --dim:rgba(244,247,251,.74);
  --surface:#0E2340;
  --navy:#12345B;
  --mnbblue:#2C7BB6;
  --mnbgold:#C9A24B;
  background:var(--ink);color:var(--cream)
}
.mnb .brand span{color:var(--gold)}
.mnb .btn{background:var(--mnbblue);border-color:var(--mnbblue);color:#fff}
.mnb .btn:hover{background:#3B8FCB;border-color:#3B8FCB}
.mnb .btn.ghost{background:transparent;color:var(--cream);border-color:var(--line)}
.mnb .btn.ghost:hover{border-color:var(--gold);color:var(--gold)}
.mnb nav{background:rgba(14,35,64,.92)}
.mnb section{border-top:1px solid var(--line)}
.mnb .band{background:var(--navy)}
.mnb .plan.hl{border-color:var(--mnbblue)}
.mnb .plan.hl:before{background:var(--mnbblue);color:#fff}
.mnb em{color:var(--gold)}
.mnbmark{display:flex;align-items:center;gap:16px;margin-bottom:30px}
.mnbmark img{height:44px;width:auto;display:block}
.mnbmark span{font-size:13px;color:var(--dim);border-left:1px solid var(--line);padding-left:16px}
.prices3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
@media(max-width:960px){.prices3{grid-template-columns:1fr}}
.prices3 .plan{padding:32px 28px}
.prices3 .price{font-size:42px}
.srcs{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--line);margin-top:38px}
.srcs > div{background:var(--ink);padding:28px 24px}
.srcs b{display:block;font-family:var(--serif);font-size:30px;color:var(--gold);font-weight:400;line-height:1;margin-bottom:12px}
.srcs h3{font-size:19px;margin-bottom:8px}
.srcs p{font-size:14.5px;color:var(--dim)}
@media(max-width:900px){.srcs{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.srcs{grid-template-columns:1fr}}
.quote{border-left:3px solid var(--gold);padding:6px 0 6px 26px;margin-top:34px;max-width:60ch}
.quote p{font-family:var(--serif);font-size:26px;line-height:1.25}
.quote cite{display:block;font-style:normal;font-size:14px;color:var(--dim);margin-top:12px}

/* lichte variant van de MNB-pagina */
.mnb.licht{
  --surface:#F4F7FB;
  --ink:#F4F7FB;
  --cream:#12345B;
  --gold:#1F6DA8;
  --line:rgba(18,52,91,.16);
  --dim:rgba(18,52,91,.76);
  background:#F4F7FB;color:#12345B
}
.mnb.licht nav{background:rgba(244,247,251,.93)}
.mnb.licht .band{background:#E6EDF5}
.mnb.licht .visual{background:rgba(18,52,91,.03)}
.mnb.licht .srcs > div,.mnb.licht .parts > div{background:#F4F7FB}
.mnb.licht .band .srcs > div,.mnb.licht .band .parts > div{background:#E6EDF5}
.mnb.licht .btn.ghost{color:#12345B}
.mnb.licht .brand span{color:#1F6DA8}

/* ---- waaier van werkboekpagina's ---- */
.fan{position:relative;width:100%;padding-top:76%;margin:8px 0 18px}
.fan img{position:absolute;width:60%;border:1px solid rgba(18,18,18,.14);box-shadow:0 18px 40px rgba(18,18,18,.22);background:#fff;border-radius:2px}
.fan img:nth-child(1){left:0;   top:6%;  transform:rotate(-9deg);z-index:1}
.fan img:nth-child(2){left:12%; top:2%;  transform:rotate(-4deg);z-index:2}
.fan img:nth-child(3){left:25%; top:0;   transform:rotate(1deg); z-index:3}
.fan img:nth-child(4){left:38%; top:4%;  transform:rotate(6deg); z-index:4}
.fancap{font-size:13.5px;color:var(--dim);text-align:center}
@media(max-width:560px){.fan{padding-top:88%}.fan img{width:64%}}

/* ---- kaartbeeld ---- */
.kaartshot{width:100%;height:auto;display:block;border:1px solid var(--line);box-shadow:0 22px 50px rgba(18,18,18,.2)}

/* ---- keynote, donkere band met foto die uitvloeit ---- */
.keynote{background:#12100D;color:#F7F2E7;--dim:rgba(247,242,231,.74);--line:rgba(247,242,231,.14);--gold:#C9A24B;position:relative;overflow:hidden}
.keynote .eyebrow{color:#C9A24B}
.keynote em{color:#C9A24B}
.keynote .btn{background:#C9A24B;border-color:#C9A24B;color:#12100D}
.keynote .btn:hover{background:#D8B263;border-color:#D8B263}
.keynote .btn.ghost{background:transparent;color:#F7F2E7;border-color:rgba(247,242,231,.22)}
.keynote .btn.ghost:hover{border-color:#C9A24B;color:#C9A24B}
.keynote .visual{border-color:rgba(247,242,231,.16);background:rgba(247,242,231,.03)}
.keynote .numlist li{border-bottom-color:rgba(247,242,231,.12)}
.keynote .numlist li b{color:#F7F2E7}
.keynote .numlist li:before{background:#C9A24B}
.knphoto{position:relative}
.knphoto img{width:100%;height:auto;display:block;
  -webkit-mask-image:radial-gradient(118% 96% at 40% 38%, #000 38%, rgba(0,0,0,.5) 64%, rgba(0,0,0,0) 84%);
  mask-image:radial-gradient(118% 96% at 40% 38%, #000 38%, rgba(0,0,0,.5) 64%, rgba(0,0,0,0) 84%)}
.knquote{font-family:var(--serif);font-size:clamp(22px,2.4vw,30px);line-height:1.2;color:#C9A24B;font-style:italic;margin-top:2%;position:relative;z-index:2;text-align:center;padding:0 8%}
.knmeta{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:rgba(247,242,231,.14);margin-top:34px}
.knmeta > div{background:#12100D;padding:22px 20px}
.knmeta b{display:block;font-family:var(--serif);font-size:28px;color:#C9A24B;font-weight:400;line-height:1;margin-bottom:8px}
.knmeta span{font-size:14px;color:rgba(247,242,231,.74)}
@media(max-width:700px){.knmeta{grid-template-columns:1fr}}
.behgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 30px;margin-top:18px}
.behgrid div{padding:10px 0;border-bottom:1px solid rgba(247,242,231,.12);font-size:15.5px}
@media(max-width:520px){.behgrid{grid-template-columns:1fr}}
/* ================= MOBIEL ================= */
html,body{overflow-x:hidden}
img,svg,table{max-width:100%}

/* navigatie met menuknop */
.navtoggle{display:none;background:none;border:1px solid var(--line);color:inherit;width:42px;height:38px;border-radius:2px;cursor:pointer;align-items:center;justify-content:center;padding:0}
.navtoggle span{display:block;width:18px;height:1px;background:currentColor;position:relative}
.navtoggle span:before,.navtoggle span:after{content:"";position:absolute;left:0;width:18px;height:1px;background:currentColor}
.navtoggle span:before{top:-6px}
.navtoggle span:after{top:6px}
@media(max-width:940px){
  .navtoggle{display:flex}
  nav .wrap{flex-wrap:wrap;height:auto;padding-top:14px;padding-bottom:14px}
  .navlinks{display:none;order:3;width:100%;flex-direction:column;gap:0;border-top:1px solid var(--line);margin-top:14px}
  .navlinks a{padding:14px 0;border-bottom:1px solid var(--line);font-size:16px}
  nav.open .navlinks{display:flex}
  nav .btn{display:inline-flex;padding:10px 16px;font-size:13px}
}
@media(max-width:420px){
  nav .btn{font-size:12px;padding:9px 12px}
  .brand{font-size:18px}
}

/* telefoonbeelden: geen overlap meer, maar zijwaarts schuiven */
@media(max-width:760px){
  .phones{position:static;height:auto;transform:none;display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;padding:4px 4px 18px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;margin:0 -28px;padding-left:28px;padding-right:28px}
  .phone{position:static !important;transform:none !important;flex:0 0 232px;scroll-snap-align:center;display:block !important}
  .phone .screen{height:436px}
  .phones::-webkit-scrollbar{height:0}
}

/* tabellen en tekst */
@media(max-width:520px){
  section{padding:72px 0}
  .wrap{padding:0 20px}
  h1{font-size:38px}
  table.cmp td:nth-child(2),table.cmp td:nth-child(3),table.cmp th:nth-child(2),table.cmp th:nth-child(3){width:22%;font-size:12.5px}
  table.cmp td:first-child{font-size:13.5px}
  .signup{flex-direction:column}
  .signup input,.signup .btn,.signup button{width:100%}
  .herocta .btn{width:100%;justify-content:center}
  .trial{flex-direction:column;align-items:flex-start;padding:22px 20px}
  .specs li{flex-direction:column;gap:2px}
  .stats{grid-template-columns:1fr}
  .price{font-size:44px}
  .fan{padding-top:96%}
  .fan img{width:66%}
  .knquote{font-size:20px;padding:0 4%}
}

/* menu-CTA: alleen zichtbaar in het uitgeklapte mobiele menu */
.navcta{display:none}
@media(max-width:940px){
  nav .wrap{flex-wrap:nowrap}
  .navlinks{position:absolute;left:0;right:0;top:100%;background:var(--surface);border-top:1px solid var(--line);padding:0 28px 20px;margin:0;box-shadow:0 24px 40px rgba(0,0,0,.35)}
  nav{position:sticky}
  nav .wrap{position:relative}
  .navlinks a.navcta{display:block;margin-top:16px;background:var(--gold);color:var(--ink);text-align:center;padding:14px 18px;border:0;font-weight:500;font-size:15px}
  .navlinks a.navcta:hover{color:var(--ink)}
}
@media(max-width:640px){
  nav .btn.navbtn{display:none}
}

/* lichte pagina's: navigatie en accenten */
.light nav{background:rgba(247,242,231,.93);border-bottom:1px solid var(--line)}
.light .brand span{color:#8A6A21}
.light .navlinks a:hover{color:#1a1a1a}
.light .navtoggle{border-color:var(--line)}
.light .readerstrip{background:rgba(18,18,18,.03)}
.light .card{background:rgba(18,18,18,.02)}
.light .card:hover{border-color:#8A6A21;background:rgba(138,106,33,.06)}
.light .card .num,.light .card .go{color:#8A6A21}
.light .signup input{color:#1a1a1a}
.light .signup input:focus{border-color:#8A6A21}
.light .claim{color:#1a1a1a}
.light .stats b{color:#8A6A21}


/* keynote staat in een eigen band, dus de knoppen daar volgen de boekkleuren */
.mnb .keynote .btn,.mnb.licht .keynote .btn{background:#C9A24B;border-color:#C9A24B;color:#12100D}
.mnb .keynote .btn:hover,.mnb.licht .keynote .btn:hover{background:#D8B263;border-color:#D8B263;color:#12100D}
.mnb .keynote .btn.ghost,.mnb.licht .keynote .btn.ghost{background:transparent;color:#F7F2E7;border-color:rgba(247,242,231,.24)}
.mnb .keynote .btn.ghost:hover,.mnb.licht .keynote .btn.ghost:hover{border-color:#C9A24B;color:#C9A24B;background:transparent}
.mnb .keynote .eyebrow,.mnb.licht .keynote .eyebrow{color:#C9A24B}
.mnb .keynote em,.mnb.licht .keynote em{color:#C9A24B}
.mnb .keynote .lead,.mnb.licht .keynote .lead{color:rgba(247,242,231,.76)}
.mnb .keynote h2,.mnb .keynote h3,.mnb.licht .keynote h2,.mnb.licht .keynote h3{color:#F7F2E7}
.mnb .keynote .visual,.mnb.licht .keynote .visual{border-color:rgba(247,242,231,.16);background:rgba(247,242,231,.03)}
.mnb .keynote .numlist li,.mnb.licht .keynote .numlist li{color:rgba(247,242,231,.76);border-bottom-color:rgba(247,242,231,.12)}
.mnb .keynote .numlist li b,.mnb.licht .keynote .numlist li b{color:#F7F2E7}
.mnb .keynote .numlist li:before,.mnb.licht .keynote .numlist li:before{background:#C9A24B}

/* ---- juridische pagina's ---- */
.legal{max-width:820px}
.legal h2{font-size:30px;margin:56px 0 6px;scroll-margin-top:100px}
.legal h3{font-size:20px;margin:30px 0 8px}
.legal p{margin-bottom:14px;color:var(--dim);font-size:16px;line-height:1.7}
.legal ul{margin:0 0 18px 20px}
.legal li{color:var(--dim);font-size:16px;line-height:1.7;margin-bottom:7px}
.legal .art{font-family:var(--sans);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:#8A6A21;font-weight:600;margin-top:56px;display:block}
.legal h2:first-of-type{margin-top:26px}
.legal table{width:100%;border-collapse:collapse;margin:8px 0 22px;font-size:15px}
.legal th,.legal td{text-align:left;padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top;color:var(--dim)}
.legal th{color:#1a1a1a;font-weight:500;font-size:13px;letter-spacing:.06em;text-transform:uppercase}
.legal td:first-child{color:#1a1a1a}
.legal .box{border:1px solid var(--line);border-left:3px solid #8A6A21;padding:22px 26px;margin:22px 0}
.legal .box p:last-child{margin-bottom:0}
.legal .box h3{margin-top:0}
.toc{border:1px solid var(--line);padding:26px 28px;margin:34px 0 10px}
.toc p{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#8A6A21;font-weight:600;margin-bottom:14px}
.toc ol{margin:0 0 0 18px}
.toc li{margin-bottom:6px;font-size:15px}
.toc a{color:#1a1a1a;text-decoration:none}
.toc a:hover{color:#8A6A21}
.stamp{font-size:14px;color:var(--dim);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;margin:26px 0 0}

/* ---- sport, TeamNL-oranje op bijna zwart ---- */
.sport{
  --ink:#101010;
  --surface:#101010;
  --gold:#F36C21;
  --cream:#F5F2EE;
  --line:rgba(245,242,238,.15);
  --dim:rgba(245,242,238,.76);
  background:var(--ink);color:var(--cream)
}
.sport .brand span{color:var(--gold)}
.sport .btn{background:var(--gold);border-color:var(--gold);color:#101010;font-weight:600}
.sport .btn:hover{background:#F5813C;border-color:#F5813C}
.sport .btn.ghost{background:transparent;color:var(--cream);border-color:var(--line);font-weight:500}
.sport .btn.ghost:hover{border-color:var(--gold);color:var(--gold)}
.sport nav{background:rgba(16,16,16,.92)}
.sport .band{background:#181818}
.sport .eyebrow{letter-spacing:.22em}
.sport h1,.sport h2,.sport h3{letter-spacing:-.015em}
.cred{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;background:var(--line);margin-top:44px}
.cred > div{background:var(--ink);padding:26px 22px}
.cred b{display:block;font-family:var(--serif);font-size:34px;color:var(--gold);font-weight:400;line-height:1;margin-bottom:10px}
.cred span{font-size:14px;color:var(--dim);line-height:1.5;display:block}
@media(max-width:900px){.cred{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.cred{grid-template-columns:1fr}}
.moments{margin-top:40px;border-top:1px solid var(--line)}
.moment{display:grid;grid-template-columns:70px 1fr;gap:24px;padding:24px 0;border-bottom:1px solid var(--line);align-items:baseline}
.moment .mn{font-family:var(--serif);font-size:34px;color:var(--gold);line-height:1}
.moment h3{font-size:21px;margin-bottom:6px}
.moment p{font-size:15.5px;color:var(--dim)}
@media(max-width:560px){.moment{grid-template-columns:44px 1fr;gap:16px}.moment .mn{font-size:26px}}
.sportgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line);margin-top:40px}
.sportgrid > div{background:var(--ink);padding:34px 30px;display:flex;flex-direction:column;gap:10px}
.sportgrid .tag{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600}
.sportgrid p{font-size:15px;color:var(--dim);flex:1}
@media(max-width:900px){.sportgrid{grid-template-columns:1fr}}
.sport .knphoto img{-webkit-mask-image:radial-gradient(118% 96% at 40% 38%, #000 38%, rgba(0,0,0,.5) 64%, rgba(0,0,0,0) 84%);mask-image:radial-gradient(118% 96% at 40% 38%, #000 38%, rgba(0,0,0,.5) 64%, rgba(0,0,0,0) 84%)}
.sport .quote{border-left:3px solid var(--gold);padding:6px 0 6px 26px;margin-top:34px;max-width:60ch}
.sport .quote p{font-family:var(--serif);font-size:26px;line-height:1.25}
.sport .quote cite{display:block;font-style:normal;font-size:14px;color:var(--dim);margin-top:12px}

/* ---- aftelling naar Los Angeles 2028 ---- */
.countdown{text-align:center;padding:96px 0}
.cdnum{font-family:var(--serif);font-size:clamp(76px,15vw,190px);line-height:.9;color:var(--gold);letter-spacing:-.02em}
.cdlbl{font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--dim);margin-top:14px}
.cdrow{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line);margin-top:48px;max-width:760px;margin-left:auto;margin-right:auto}
.cdrow > div{background:var(--ink);padding:22px 18px}
.cdrow b{display:block;font-family:var(--serif);font-size:30px;color:var(--cream);font-weight:400;line-height:1;margin-bottom:8px}
.cdrow span{font-size:13px;color:var(--dim)}
@media(max-width:620px){.cdrow{grid-template-columns:1fr}}

/* ================= BESTELLEN EN CADEAU ================= */
.form{max-width:760px}
.fstep{border-top:1px solid var(--line);padding:34px 0}
.fstep:first-of-type{border-top:0;padding-top:10px}
.fnum{font-family:var(--sans);font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600;display:block;margin-bottom:10px}
.fstep h2{font-size:28px;margin-bottom:8px}
.fstep .uitleg{font-size:15.5px;color:var(--dim);margin-bottom:20px;max-width:60ch}
.veld{margin-bottom:16px}
.veld label{display:block;font-size:13.5px;color:var(--dim);margin-bottom:6px}
.veld input,.veld select,.veld textarea{width:100%;background:transparent;border:1px solid var(--line);color:inherit;
  font-family:var(--sans);font-size:16px;padding:13px 14px;border-radius:2px}
.veld textarea{min-height:150px;line-height:1.55;resize:vertical}
.veld input:focus,.veld select:focus,.veld textarea:focus{outline:none;border-color:var(--gold)}
.veld select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);
  background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px;background-size:6px 6px;background-repeat:no-repeat}
.light .veld select option{background:#F7F2E7;color:#1a1a1a}
.rij2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.rij3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
.rijpc{display:grid;grid-template-columns:140px 1fr;gap:16px}
@media(max-width:560px){.rij2,.rij3,.rijpc{grid-template-columns:1fr}}
.teller{font-size:13px;color:var(--dim);text-align:right;margin-top:6px}
.teller.bijna{color:var(--gold)}
.teller.vol{color:var(--afspreken)}
.vink{display:flex;gap:12px;align-items:flex-start;margin:14px 0;cursor:pointer}
.vink input{width:18px;height:18px;flex:none;margin-top:3px;accent-color:var(--gold)}
.vink span{font-size:14.5px;color:var(--dim);line-height:1.55}
.keuze{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:8px}
@media(max-width:620px){.keuze{grid-template-columns:1fr}}
.keuze label{display:block;border:1px solid var(--line);padding:20px 20px;cursor:pointer;transition:.15s;position:relative}
.keuze label:hover{border-color:var(--gold)}
.keuze input{position:absolute;opacity:0;pointer-events:none}
.keuze input:checked + .kb{color:inherit}
.keuze label:has(input:checked){border-color:var(--gold);background:rgba(201,162,75,.07)}
.light .keuze label:has(input:checked){background:rgba(138,106,33,.07)}
.kb b{display:block;font-family:var(--serif);font-weight:400;font-size:21px;margin-bottom:4px}
.kb span{display:block;font-size:14px;color:var(--dim);line-height:1.5}
.kb .prijs{color:var(--gold);font-size:15px;margin-top:8px;display:block}
.totaal{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);padding-top:20px;margin-top:8px}
.totaal .lbl{font-size:15px;color:var(--dim)}
.totaal .bedrag{font-family:var(--serif);font-size:34px}
.verborgen{display:none}

/* cadeaukaart, voorbeeld */
.kaartvb{background:#FFFFFF;color:#1A1A1A;aspect-ratio:210/297;
  display:flex;flex-direction:column;padding:34px 30px 26px;position:relative;overflow:hidden;max-width:330px;
  box-shadow:0 18px 40px rgba(0,0,0,.45)}
.kaartvb .voor{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#8A6A21;font-weight:600;margin-bottom:8px}
.kaartvb .voornaam{font-family:var(--serif);font-size:21px;color:#1A1A1A;margin-bottom:14px}
.kaartvb .streep{width:44px;height:1px;background:#C9A24B;margin-bottom:16px}
.kaartvb .bood{font-family:var(--serif);font-size:13.5px;line-height:1.6;white-space:pre-wrap;word-break:break-word;flex:1;color:#2A2A2A}
.kaartvb .afz{font-family:var(--serif);font-style:italic;font-size:13px;color:#8A6A21;text-align:right;margin-top:10px}
.kaartvb .qmark{position:absolute;right:24px;top:26px;font-family:var(--serif);font-style:italic;font-size:24px;color:rgba(201,162,75,.55)}
.kaartvb .kvoet{margin-top:14px;padding-top:8px;border-top:1px solid rgba(26,26,26,.18);display:flex;justify-content:space-between;
  font-size:7.5px;letter-spacing:.14em;text-transform:uppercase;color:#8A8175}
.vblabel{font-size:12.5px;color:var(--dim);margin-top:12px;text-align:center}

/* sportboek */
.book.sportboek{--coverfront:url("sportboek-cover.jpg")}
.book.sportboek .spine{background-image:none;background:linear-gradient(90deg,#B8460F,#E86220 55%,#C24E13);filter:none}
.book.sportboek .pages{background:linear-gradient(90deg,#FEFCF5,#F3ECDA 42%,#CFC6AC)}
.spinetekst{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--sans);font-size:8px;letter-spacing:.12em;color:#2A1A0C;font-weight:600;
  writing-mode:vertical-rl;white-space:nowrap}
.bookshot.oranje .halo{background:radial-gradient(50% 50% at 50% 50%,rgba(255,150,80,.55),rgba(232,98,32,.24) 44%,transparent 74%)}
.bookshot.oranje .floor{background:radial-gradient(50% 50% at 50% 50%,rgba(232,98,32,.16),transparent 70%)}
.book.sportboek .edge{background:linear-gradient(90deg,rgba(255,236,200,0),rgba(255,240,212,.9) 45%,rgba(240,190,130,.5) 70%,rgba(232,140,60,0))}

/* twee boeken naast elkaar */
.boeken2{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--line);margin-top:42px}
.boeken2 > div{background:var(--ink);padding:34px 30px;display:flex;flex-direction:column;gap:12px}
.light .boeken2 > div{background:var(--cream)}
.boeken2 h3{font-size:24px}
.boeken2 .voorwie{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600}
.boeken2 p{font-size:15px;color:var(--dim);flex:1}
.boeken2 .go{font-size:13.5px;color:var(--gold);font-weight:500;text-decoration:none}
@media(max-width:820px){.boeken2{grid-template-columns:1fr}}

/* e-books */
.ebooks{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--line);margin-top:40px}
.ebooks > div{background:var(--ink);padding:34px 30px;display:flex;flex-direction:column;gap:12px}
.ebooks .voorwie{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:600}
.ebooks h3{font-size:23px}
.ebooks p{font-size:15px;color:var(--dim);flex:1}
.ebooks .paginas{font-size:13px;color:var(--dim)}
@media(max-width:820px){.ebooks{grid-template-columns:1fr}}
.zegtdoet{width:100%;border-collapse:collapse;margin-top:26px;font-size:15px}
.zegtdoet th,.zegtdoet td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.zegtdoet th{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);font-weight:600}
.zegtdoet td:first-child{width:46%}
.zegtdoet td:last-child{color:var(--dim);font-style:italic}
@media(max-width:620px){.zegtdoet,.zegtdoet tbody,.zegtdoet tr,.zegtdoet td,.zegtdoet th{display:block;width:100%}
  .zegtdoet thead{display:none}
  .zegtdoet tr{border-bottom:1px solid var(--line);padding:12px 0}
  .zegtdoet td{border:0;padding:4px 0}
  .zegtdoet td:first-child{width:100%}
  .zegtdoet td:last-child:before{content:"wordt: ";font-style:normal;color:var(--gold);font-size:12px;letter-spacing:.1em;text-transform:uppercase}}


/* clubblok en sportboekverwijzing op de zwart-gouden pagina's,
   accenten in het oranje van de sportwereld */
.sportaccent{--gold:#F36C21}
.sportaccent .btn{background:#F36C21;border-color:#F36C21;color:#101010;font-weight:600}
.sportaccent .btn:hover{background:#F5813C;border-color:#F5813C}
.sportaccent .btn.ghost{background:transparent;color:inherit;border-color:var(--line);font-weight:500}
.sportaccent .btn.ghost:hover{border-color:#F36C21;color:#F36C21}


/* de keuzekaart van het sportboek, oranje ook op een zwart-gouden pagina */
.keuze label.sportkeuze:hover{border-color:#F36C21}
.keuze label.sportkeuze:has(input:checked){border-color:#F36C21;background:rgba(243,108,33,.10)}
.light .keuze label.sportkeuze:has(input:checked){background:rgba(243,108,33,.08)}
.keuze label.sportkeuze .prijs{color:#F36C21}
.keuze label.sportkeuze .kb b:after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#F36C21;margin-left:9px;vertical-align:middle}

/* Overwin jouw Quitter, editorial edition v3, original assets and content. */
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url("manrope-700.ttf") format('truetype')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400;font-display:swap;src:url("dm-sans-400.ttf") format('truetype')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:500;font-display:swap;src:url("dm-sans-500.ttf") format('truetype')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:600;font-display:swap;src:url("dm-sans-600.ttf") format('truetype')}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:700;font-display:swap;src:url("dm-sans-700.ttf") format('truetype')}
:root,body.light,body.sport,body.mnb,body.mnb.licht{--ink:#fafaf8;--cream:#191b18;--dim:#60635d;--surface:#fafaf8;--line:#dedfd8;--gold:#8b6c1c;--highlight:#e7c76b;--sport-accent:#b54621;--sans:'DM Sans',Arial,sans-serif;--serif:'Manrope',Arial,sans-serif;--wrap:1400px;background:var(--ink);color:var(--cream);font-family:var(--sans);font-size:17px;line-height:1.7}
body.sport{--gold:#b54621;--highlight:#f2a278}body.mnb,body.mnb.licht{--gold:#244b61;--highlight:#a9c9d7;--mnbblue:#244b61;--navy:#153341}
*{box-sizing:border-box}html{scroll-padding-top:100px}body{margin:0;overflow-wrap:break-word}img{max-width:100%;height:auto}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}
.wrap{width:100%;padding-inline:24px;max-width:var(--wrap)}section{padding:78px 0;border-color:var(--line)}h1,h2,h3{font-family:var(--serif);font-weight:700;letter-spacing:-.055em;line-height:1.12;text-wrap:balance}h1{font-size:clamp(3rem,6vw,5.6rem)}h2{font-size:clamp(2rem,4vw,3.8rem);max-width:24ch}h3{font-size:1.45rem;letter-spacing:-.035em}p{text-wrap:pretty}em,.light em{font-style:normal;color:var(--gold)}.lead{font-size:1.0625rem;line-height:1.75;max-width:60ch;color:var(--dim)}.small{font-size:.875rem;line-height:1.6}.eyebrow,.light .eyebrow,.sport .eyebrow{font-family:var(--sans);font-size:.75rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--gold)}
::selection{color:#161813;background:var(--highlight)}a{text-underline-offset:5px}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #a07c23;outline-offset:5px}.skip-link{position:fixed;z-index:999;top:10px;left:10px;background:#fff;padding:14px;transform:translateY(-180%);border:2px solid var(--gold)}.skip-link:focus{transform:none}
.btn,.light .btn,.sport .btn,.mnb .btn{min-height:54px;display:inline-flex;gap:24px;align-items:center;justify-content:space-between;padding:16px 24px;border:1px solid #191b18;border-radius:3px;background:#191b18;color:#fff;font-family:var(--sans);font-size:15px;font-weight:500;letter-spacing:0;transition:background .25s,transform .25s}.btn:hover,.light .btn:hover,.sport .btn:hover,.mnb .btn:hover{background:#34372f;border-color:#34372f;transform:translateY(-2px)}.btn span{font-size:22px;line-height:1;transition:transform .25s}.btn:hover span{transform:translate(2px,-2px)}.btn.ghost,.light .btn.ghost,.sport .btn.ghost,.mnb .btn.ghost{color:var(--cream);background:transparent;border-color:var(--line)}.btn.ghost:hover{border-color:var(--cream);color:var(--cream);background:transparent}.text-link{display:inline-flex;align-items:center;gap:20px;font-size:15px;text-decoration:none;border-bottom:1px solid var(--cream);padding:12px 0}.herocta{align-items:center;gap:24px;margin:30px 0 16px}
nav.site-nav,body.light nav,body.sport nav,body.mnb nav,body.mnb.licht nav{position:sticky;top:0;background:#fafaf8f2;border-bottom:1px solid var(--line);backdrop-filter:blur(20px);z-index:80}.site-nav .wrap{height:88px;display:flex;gap:32px;align-items:center;justify-content:space-between}.brand{display:flex;gap:11px;align-items:center;text-decoration:none;color:inherit;white-space:nowrap;font-style:normal}.brand-q{font-family:var(--serif);font-size:44px;font-weight:700;letter-spacing:-.15em;line-height:1;color:var(--cream)!important;position:relative;padding-right:10px;font-style:normal!important}.brand-q>span{position:absolute;right:-1px;bottom:-2px;font-size:25px;color:var(--gold);font-style:normal}.brand-name{font-family:var(--sans);font-size:9px;font-weight:500;line-height:1.4;letter-spacing:.12em;color:var(--cream)!important;font-style:normal!important}.brand-name strong{font-family:var(--serif);font-size:21px;letter-spacing:-.045em;line-height:1.1}.navlinks{gap:25px;align-items:center;font-size:14px}.navlinks a{color:#52554e;font-weight:500}.navlinks a:hover,.navlinks a[aria-current=page]{color:#161813}.navbtn{display:inline-flex;gap:24px;align-items:center;border:1px solid #c9cbc2;border-radius:3px;padding:12px 18px;text-decoration:none;font-size:13px;white-space:nowrap}.navbtn span{font-size:20px}.mobile-resource{display:none}.navtoggle{width:44px;height:44px;border:1px solid var(--line);color:#191b18;border-radius:3px}.navtoggle span{background:currentColor}.navtoggle span:before,.navtoggle span:after{background:currentColor}
.editorial-hero{padding:0;border:0}.hero-layout{display:grid;grid-template-columns:1fr;gap:35px}.hero-copy{padding-top:44px}.editorial-hero h1{font-size:clamp(3rem,9.5vw,8.1rem);line-height:1.02;letter-spacing:-.075em;max-width:none;margin:28px 0}.editorial-hero h1 em{color:#977326;white-space:nowrap}.hero-intro{font-size:clamp(1.25rem,2vw,1.5rem);font-weight:500;letter-spacing:-.025em;line-height:1.4;margin-bottom:14px}.hero-copy .lead{max-width:42ch}.hero-author{display:flex;align-items:center;justify-content:space-between;max-width:370px;border-top:1px solid var(--line);padding-top:21px;margin-top:37px;font-size:13px;color:#60635d;text-decoration:none;line-height:1.5}.hero-author>span:last-child{font-size:23px}.hero-portrait{position:relative;margin:0;background:#20231f;overflow:hidden;min-width:0;isolation:isolate}.hero-portrait>img{width:100%;height:100%;object-fit:cover;object-position:50% 25%;display:block;min-height:380px}.hero-portrait:after{content:'';position:absolute;inset:38% 0 0;background:linear-gradient(#080b0900,#080b098c 50%,#080b09d1);pointer-events:none}.hero-portrait figcaption{position:absolute;z-index:2;bottom:32px;left:28px;color:white}.hero-portrait figcaption span{font-size:12px;display:block;letter-spacing:.02em}.hero-portrait figcaption strong{font-family:var(--serif);font-size:28px;letter-spacing:-.035em;display:block;margin-top:5px}.photo-index{position:absolute;z-index:2;top:26px;left:27px;font-size:10px;letter-spacing:.15em;color:#eeeee9}.hero-floor{display:flex;justify-content:space-between;gap:24px;padding-block:24px;font-size:12px;border-bottom:1px solid var(--line);color:#65685f}.hero-floor a{text-decoration:none;display:flex;gap:25px;color:#35392e}
.readerstrip{background:#edeee7;padding:34px 0}.readerstrip .wrap{display:grid;grid-template-columns:1fr;gap:10px}.readerstrip h2{font-size:24px!important;line-height:1.25;letter-spacing:-.04em;margin:0!important;max-width:20ch}.readerstrip .cards3{margin:10px 0 0;background:none;gap:0}.readerstrip .card{padding:20px;border:0;border-top:1px solid #cfd2c5;border-radius:0;background:transparent;gap:8px}.readerstrip .card .num{font-family:var(--sans);font-size:12px}.readerstrip .card h3{font-size:19px}.readerstrip .card p{font-size:14px;line-height:1.65}.readerstrip .card .go{font-size:13px}.card{border-color:var(--line)}
#boeken .lead{max-width:65ch}.boeken2.book-collection{gap:32px;background:none;margin-top:42px}.book-collection>div{background:transparent;padding:0;gap:14px}.book-collection .cover-stage{height:370px;background:#e9e9df;position:relative;display:grid;place-items:center;overflow:hidden;margin-bottom:10px;perspective:1000px}.book-collection .sport-stage{background:#eedbc9}.cover-stage img{width:auto;height:280px;box-shadow:14px 24px 30px #29251732;transform:rotate(-7deg) rotateY(-12deg);transition:transform .8s cubic-bezier(.2,.8,.2,1);object-fit:contain;will-change:transform}.sport-stage img{transform:rotate(6deg) rotateY(12deg)}.cover-stage:hover img{transform:rotate(0deg) rotateY(0deg) translateY(-8px)}.cover-caption{position:absolute;bottom:18px;left:20px;font-size:10px;letter-spacing:.12em;color:#5b5d51}.book-collection h3{font-size:27px;max-width:22ch}.book-collection .voorwie{font-size:12px}.book-collection p{font-size:16px;max-width:55ch}.book-collection .go{display:flex;justify-content:space-between;gap:20px;padding-top:15px;border-top:1px solid var(--line);margin-top:10px;color:var(--cream);font-size:14px}.book-collection .go span{white-space:nowrap}
.quitter-story{--ink:#1d211a;--cream:#fafbf5;--dim:#c7cbbc;--line:#fafbf530;--gold:#e7c76b;background:var(--ink);color:var(--cream)}.quitter-story h2{font-size:clamp(2.2rem,5.5vw,5.2rem);max-width:19ch}.quitter-story .lead{max-width:61ch}.gedaanten{background:none;gap:0;border-top:1px solid var(--line)}.quitter-voice{border-bottom:1px solid var(--line);padding:0 0 0 0}.quitter-voice summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;font-family:var(--serif);font-weight:700;letter-spacing:-.03em;font-size:clamp(1.3rem,2.6vw,2.3rem);padding:26px 0}.quitter-voice summary::-webkit-details-marker{display:none}.quitter-voice summary span{font-family:var(--sans);font-weight:400;color:var(--gold);transition:transform .25s}.quitter-voice[open] summary span{transform:rotate(45deg)}.quitter-voice p{font-size:17px;padding:0 0 28px;max-width:58ch;color:var(--dim)}.momenten{background:none;gap:20px;margin-top:40px}.momenten>div{background:transparent;border-top:1px solid var(--line);padding:20px 0;color:var(--dim);font-size:14px}.momenten b{font-size:32px;color:var(--gold)}
.path-section{background:#e7c76b;--ink:#e7c76b;--gold:#3b321c;--cream:#242217;--dim:#514832;--line:#28221930}.path-section h2{font-size:clamp(2.5rem,5vw,4.7rem);max-width:22ch}.modelgrid{gap:55px}.pathmodel{border-radius:50%;max-width:500px}.steps{background:transparent;gap:0}.step{background:transparent;border-left:0!important;border-top:1px solid var(--line);padding:28px 0;grid-template-columns:55px 1fr}.step .n{font-size:35px;opacity:.65}.step h3{font-size:27px}.step p{font-size:16px}.behchips{gap:8px}.chip{border-color:#675b3560;background:transparent;border-radius:100px;font-size:13px;padding:8px 14px}
.coach-intro{background:#f0f1ec;overflow:hidden}.coach-intro>.wrap{display:grid;grid-template-columns:1fr;gap:50px;align-items:center}.coach-intro h2{font-size:clamp(2.4rem,4.5vw,4.1rem);margin:20px 0;max-width:20ch}.coach-intro .phones,.pagehero .phones{min-width:0;position:relative;transform:none}.phone{--cream:#f7f7f0;--dim:#bdc2b5;--gold:#e7c76b;background:#161a14;border-color:#444d38;border-radius:30px;box-shadow:0 30px 40px #1c23132b}.phone .screen{background:#22281d}.bubble.coach{background:#e7c76b1c;border-color:#e7c76b33}.bubble.me{background:#ffffff10}.phones svg text{font-family:var(--sans)}.p3{display:none}.p1{left:10px;top:55px;transform:rotate(-7deg)}.p2{left:auto;right:5px;top:0;transform:rotate(7deg)}.scr-h{font-size:12px}.bubble{font-size:12px}.phone .screen{height:465px}.phones{height:550px}
#coach{padding-top:0;background:#f0f1ec}#coach h2{font-size:clamp(2rem,3.5vw,3rem)}.feat{gap:0;background:none;border-top:1px solid var(--line);margin-top:35px}.feat>div{background:transparent;padding:32px 30px 32px 0;border-bottom:1px solid var(--line)}.feat h3{font-size:23px}.feat p{font-size:16px}.feat .tag{font-size:12px}
#prijzen{background:#fff}.prices{gap:24px;margin-top:25px}.plan{padding:35px;border:1px solid var(--line);background:#fafaf8;border-radius:4px}.plan.hl{background:#f1eddc;border-color:#b29b56}.plan.hl:before{background:#e7c76b;color:#302b18;font-family:var(--sans);font-size:11px;letter-spacing:.05em;padding:6px 12px}.price{font-family:var(--serif);font-size:60px;letter-spacing:-.07em}.plan li{font-size:15px}.plan li.off{opacity:1;color:#707568}.plan li:before{background:var(--gold)}.pricing-disclosure{margin-top:35px;border-block:1px solid var(--line);padding:0 0 8px}.pricing-disclosure>summary{cursor:pointer;list-style:none;font-family:var(--serif);font-size:20px;padding:23px 0;display:flex;justify-content:space-between;align-items:center}.pricing-disclosure>summary::-webkit-details-marker{display:none}.pricing-disclosure>summary span{font-size:30px;font-family:var(--sans);font-weight:400}.pricing-disclosure[open]>summary span{transform:rotate(45deg)}.trial{background:#f3f3ec;border:0;border-left:3px solid #b49641;padding:30px;margin-top:35px}.trial h3{font-size:24px}
.author-section{background:#fff}.authgrid{gap:60px}.portrait{border:0;aspect-ratio:4/5;object-fit:cover;object-position:50% 25%}.author-section .portrait{border-radius:0}.stats{background:none;gap:25px}.stats>div{background:transparent;border-top:1px solid var(--line);padding:22px 0}.stats b{font-family:var(--serif);font-weight:700;font-size:38px;letter-spacing:-.065em;color:var(--cream)}.stats span{display:block;font-size:12px;margin-top:8px}.book-detail{background:#efefe7}.bookgrid{gap:65px}.bookshot{padding:40px 10px;background:transparent}.bookshot .halo,.bookshot .floor,.bookshot .edge{display:none}.book .front{box-shadow:12px 28px 38px #29251732}.book .pages{background:linear-gradient(90deg,#fff,#eee8d8)}.book .spine{filter:brightness(.9)}.book{max-width:280px}.specs li{font-size:15px;padding:12px 0}.teams{background:#e7c76b;--ink:#e7c76b;--gold:#3d331d;--dim:#54492f;--line:#2a251930}.teams h2{max-width:24ch}.teams .lead{max-width:75ch}.teams .btn.ghost{border-color:#7e7149}
footer{padding:0;background:#1b2019;--ink:#1b2019;--cream:#f1f3e9;--gold:#e7c76b;--line:#e8ebdc26;--dim:#bdc4b0;color:var(--cream);border:0;overflow:hidden}.footer-top{padding:60px 0 46px;border-bottom:1px solid var(--line)}.footer-top .eyebrow{color:var(--gold);margin-bottom:16px}.footer-invite{display:flex;justify-content:space-between;align-items:center;text-decoration:none;font-family:var(--serif);font-size:clamp(2.5rem,6vw,6rem);font-weight:700;letter-spacing:-.065em;color:var(--cream)}.footer-invite span{color:var(--gold)}.footer-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px;padding:45px 0}.footer-grid>.brand{align-self:start}.footer-grid>div>a{display:block;font-size:14px;text-decoration:none;color:var(--dim);padding:4px 0}.footer-grid p{font-size:14px;color:var(--dim);margin-top:10px}.footlabel{display:block;font-size:12px;color:#fff;margin-bottom:14px}.footer-bottom{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:28px;padding-block:24px;font-size:12px;color:var(--dim)}.footer-bottom a{margin-left:22px;text-decoration:none}.footer-word{font-family:var(--serif);font-size:clamp(3rem,12.1vw,10.5rem);letter-spacing:-.07em;line-height:1.05;color:#899a7180;white-space:nowrap;padding:5px 0 25px;text-wrap:nowrap}
/* Inner pages share a consistent editorial rhythm. */
.pagehero{padding:50px 0 80px;background:#f0f1eb;border-top:0}.pagehero .wrap{gap:65px;align-items:center}.pagehero h1{max-width:18ch;margin-block:20px!important}.crumb{font-size:13px;color:#707567;margin-bottom:32px}.pagehero .eyebrow{font-size:12px}.pagehero .bookshot{background:#e5e7dc;padding:45px 20px}.pagehero .lead{max-width:55ch}.pagehero .herocta{gap:12px}.pagehero .book{max-width:270px}.sport .pagehero{background:#f1e4d9}.sport .pagehero .bookshot{background:#e8c8af}.mnb .pagehero,.mnb.licht .pagehero{background:#e6eef0}.pagehero .sport-heading{font-size:clamp(2.5rem,4.5vw,4.3rem)}.band,.sport .band,.mnb .band,.mnb.licht .band{background:#eeefe9}.sport .band{background:#f4ece5}.mnb .band,.mnb.licht .band{background:#eaf0f2}.rowfeat{gap:65px}.rowfeat h2{max-width:21ch}.visual,.light .visual{background:#edeee6;border-color:#d8dcce;border-radius:3px;padding:35px}.mnb.licht .visual{background:#e7edf0}.numlist li{font-size:16px}.numlist li b{font-weight:600;color:var(--cream)}
.parts,.tl,.srcs,.sportgrid,.ebooks,.cred{background:none;gap:0;border-top:1px solid var(--line)}.parts>div,.light .parts>div,.tl>div,.srcs>div,.mnb.licht .srcs>div,.mnb.licht .parts>div,.sportgrid>div,.ebooks>div,.cred>div{background:transparent;padding:30px 28px 30px 0;border-bottom:1px solid var(--line)}.mnb.licht .band .srcs>div,.mnb.licht .band .parts>div{background:transparent}.parts p,.srcs p,.tl p,.sportgrid p,.ebooks p{font-size:16px}.parts h3,.srcs h3,.sportgrid h3{font-size:23px}.parts b,.tl b,.sportgrid .tag,.ebooks .voorwie{font-size:12px;color:var(--gold);font-family:var(--sans)}.cred b{font-weight:700;font-size:34px}.cred span{font-size:14px}.faq{border-top:1px solid var(--line)}.faq summary{font-family:var(--sans);font-weight:500;font-size:20px;letter-spacing:-.02em;padding-block:24px}.faq p{font-size:16px;padding-right:20px}.faq details[open]{border-left:2px solid var(--gold);padding-left:20px}.faq summary:after{top:22px}.endcta{background:#e8d39a;padding:80px 0}.endcta h2{max-width:22ch}.warn,.qbox{background:#f0f1e9;border:0;border-left:3px solid var(--gold);padding:25px}.qbox .qn{font-family:var(--sans);font-weight:600;font-size:13px}.quote p{font-family:var(--serif);font-size:26px;line-height:1.4}.sport .quote p{font-size:26px;line-height:1.4}.sport .knphoto img{-webkit-mask-image:none;mask-image:none}.knphoto img{object-fit:cover}.keynote{--ink:#161e21;--cream:#f5f5ef;--dim:#c6ced0;--line:#ffffff26;background:#161e21;color:var(--cream)}.mnbmark img{object-fit:contain}.countdown{background:#f0dbc8}.cdnum{font-family:var(--serif);font-weight:700;letter-spacing:-.07em}.cdrow{background:transparent;gap:20px}.cdrow>div{background:transparent;border-top:1px solid #c8b6a4}.cdlbl{font-size:12px}.moment h3{font-size:22px}.moment p{font-size:16px}
/* Forms: readable, tactile and honest about service availability. */
.form{max-width:900px}.fstep{padding:35px 0;border-top:1px solid var(--line)}.fstep h2{font-size:29px;max-width:none}.fnum{font-size:12px;letter-spacing:.12em}.fstep .uitleg{font-size:16px}.veld label{font-size:14px;color:#40473a;font-weight:500}.veld input,.veld textarea,.veld select,.signup input{font-family:var(--sans);font-size:16px;min-width:0;min-height:50px;border:1px solid #b9c0af;background:#fff;color:#20261a;border-radius:3px;padding:14px}.veld input:focus,.veld textarea:focus,.veld select:focus,.signup input:focus{outline:2px solid var(--gold);outline-offset:2px}.veld textarea{min-height:170px}.signup{max-width:650px;margin-top:18px}.signup input{flex:1;min-width:min(220px,100%)}.signup input::placeholder{color:#68715c}.keuze{gap:18px}.keuze label{border:1px solid #c5cbbb;background:#fff;padding:24px;border-radius:4px}.keuze label:has(input:checked),.light .keuze label:has(input:checked){background:#f1ebd8;border-color:#8b6c1c;box-shadow:inset 0 0 0 1px #8b6c1c}.keuze label:has(input:focus-visible){outline:3px solid var(--gold);outline-offset:4px}.keuze label.sportkeuze:has(input:checked){background:#f6e4d8;box-shadow:inset 0 0 0 1px #b54621;border-color:#b54621}.kb b{font-family:var(--serif);font-weight:700;font-size:20px}.kb span{font-size:14px}.kb .prijs{font-weight:600;color:var(--gold)}.vink span{font-size:14px}.vink{padding-block:6px}.vink input{width:22px;height:22px}.availability{border-left:2px solid #a08b4d;padding:8px 14px;font-size:13px;line-height:1.55;color:#65614b;background:#f3efdf;margin:22px 0 14px;max-width:650px}.msg{font-size:15px}.kaartvb{height:auto;min-height:466px;overflow:visible;box-shadow:0 14px 30px #17201224;border:1px solid #d8d8cd;--serif:Georgia,serif}.kaartvb .bood{font-family:Georgia,serif}.teller{font-size:13px}.totaal{padding-block:22px}.totaal .bedrag{font-weight:700;font-family:var(--serif);font-size:34px}.verborgen{display:none!important}
.legal{max-width:900px}.legal h1{font-size:clamp(2.4rem,5.5vw,4.3rem);max-width:none}.legal h2{max-width:none;font-size:28px;line-height:1.2}.legal h3{font-size:22px}.legal p,.legal li{font-size:17px;line-height:1.8}.legal .art{font-size:12px}.legal table{font-size:14px}.legal th,.legal td{padding:12px 8px}.toc{padding:28px;border-radius:3px;background:#fff}.toc p{font-size:12px}.legal .box{background:#f0f1e9}.sheet{border-color:var(--line)}.fancap{font-size:14px}.fan{max-width:600px}.fan img{border-radius:1px;box-shadow:0 16px 30px #1c261b26}
/* Motion is an enhancement; no hidden content or scroll hijacking. */
.reading-line{position:fixed;z-index:100;top:0;left:0;width:100%;height:3px;pointer-events:none;transform-origin:left;background:#b39447;transform:scaleX(0)}
@view-transition{navigation:auto}
@media(prefers-reduced-motion:no-preference){
 .arrived{animation:arrive .8s cubic-bezier(.2,.8,.2,1) both;animation-delay:var(--delay,0ms)}
 @keyframes arrive{from{opacity:.15;translate:0 35px}to{opacity:1;translate:0 0}}
 @keyframes scroll-progress{to{transform:scaleX(1)}}
 @supports(animation-timeline:scroll()){
  .reading-line{animation:scroll-progress linear both;animation-timeline:scroll(root)}
  .hero-portrait>img{animation:portrait-scroll linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
  @keyframes portrait-scroll{to{transform:scale(1.12);translate:0 35px}}
  .cover-stage img{animation:book-scroll linear both;animation-timeline:view();animation-range:entry 0% cover 45%}
  @keyframes book-scroll{from{transform:rotate(-12deg) rotateY(-18deg) translateY(38px)}to{transform:rotate(-4deg) rotateY(-5deg) translateY(0)}}
  .sport-stage img{animation-name:sport-book-scroll}
  @keyframes sport-book-scroll{from{transform:rotate(12deg) rotateY(18deg) translateY(38px)}to{transform:rotate(4deg) rotateY(5deg) translateY(0)}}
 }
 ::view-transition-old(root){animation:out .16s ease both}::view-transition-new(root){animation:in .32s ease both}
 @keyframes out{to{opacity:0}}@keyframes in{from{opacity:0;translate:0 10px}}
}
@media(min-width:760px){.wrap{padding-inline:40px}.hero-layout{grid-template-columns:1.12fr .88fr;gap:25px}.hero-copy{padding:55px 0 45px}.hero-portrait{margin-top:26px;margin-bottom:26px}.editorial-hero h1{font-size:clamp(3.8rem,7.2vw,7rem)}.hero-floor{padding-block:25px}.coach-intro>.wrap{grid-template-columns:1fr 1fr;gap:50px}.coach-intro .phones{height:550px}.gedaanten{grid-template-columns:1fr;max-width:850px;margin-left:auto}.footer-grid{grid-template-columns:1.2fr 1fr 1fr 1.1fr}.book-collection .cover-stage{height:420px}.cover-stage img{height:325px}}
@media(min-width:1100px){section{padding:110px 0}.wrap{padding-inline:55px}.editorial-hero{padding:0}.hero-layout{grid-template-columns:1.15fr .85fr;gap:35px}.hero-copy{padding-top:66px;padding-bottom:48px}.editorial-hero h1{font-size:clamp(5.6rem,7.5vw,7.7rem);margin-block:35px}.hero-portrait{margin-top:25px;margin-bottom:25px;max-height:690px}.hero-copy .herocta{margin-top:32px}.hero-author{margin-top:40px}.hero-floor{padding-block:27px}.readerstrip{padding:38px 0}.readerstrip>.wrap{grid-template-columns:.7fr 1.3fr;column-gap:60px}.readerstrip .eyebrow{grid-column:1}.readerstrip h2{grid-column:1;grid-row:2}.readerstrip .cards3{grid-column:2;grid-row:1/span 3;margin:0;grid-template-columns:1fr 1fr!important}.readerstrip .card{border-top:0;border-left:1px solid #cfd2c5;padding:0 25px}.readerstrip .card p{font-size:13px}.book-collection .cover-stage{height:450px}.cover-stage img{height:350px}.quitter-story>.wrap{display:grid;grid-template-columns:1.1fr 1fr;column-gap:90px}.quitter-story .eyebrow,.quitter-story h2,.quitter-story>.wrap>.lead{grid-column:1}.quitter-story .gedaanten{grid-column:2;grid-row:2/span 3;margin-top:16px;width:100%}.quitter-story .momenten{grid-column:1/-1;margin-top:60px}.path-section .modelgrid{grid-template-columns:1fr 1fr;align-items:start;gap:100px}.path-section .modelgrid>div:first-child{position:sticky;top:140px}.steps .step{padding-block:35px}.coach-intro .p1{left:0}.coach-intro .p2{right:0}.coach-intro .phone{width:248px}.coach-intro .phones{height:560px}#coach .feat{grid-template-columns:repeat(4,1fr)}#coach .feat>div{padding-right:30px}.author-section .authgrid{grid-template-columns:1.05fr .95fr}.author-section .portrait{max-height:650px}.book-detail .bookgrid{grid-template-columns:.7fr 1.3fr}}
@media(max-width:1100px){.navlinks{gap:18px}.site-nav .wrap{gap:20px}.navbtn{gap:12px;padding:10px 14px}.brand-q{font-size:38px}.brand-name strong{font-size:19px}.navlinks{font-size:13px}.coach-intro .phone{width:220px}.coach-intro .p1{left:0}.coach-intro .p2{right:0}.pagehero .wrap{gap:35px}}
@media(max-width:940px){.site-nav .wrap{height:76px;padding-top:0;padding-bottom:0;flex-wrap:nowrap}.navtoggle{display:flex;order:3;flex-shrink:0}.navlinks{display:none;position:absolute;top:100%;left:0;right:0;width:100%;margin:0;order:4;background:#fafaf8;box-shadow:0 20px 25px #13190e16;padding:20px 30px;align-items:stretch}.navlinks a{font-size:18px;padding:14px 0;color:#252b1e;border-bottom:1px solid var(--line)}nav.open .navlinks{display:flex;flex-direction:column}.navbtn{margin-left:auto;order:2}.navlinks .mobile-resource{display:block}.hero-layout{gap:25px}.editorial-hero h1{font-size:clamp(3.9rem,7.7vw,6rem)}.hero-copy .lead{font-size:16px}.hero-author{font-size:12px}.hero-portrait figcaption strong{font-size:23px}.hero-portrait figcaption{left:20px;bottom:25px}.hero-portrait .photo-index{left:20px;font-size:9px}.herocta{gap:15px}.editorial-hero .herocta{align-items:flex-start;flex-direction:column}.pagehero .wrap{grid-template-columns:1fr}.pagehero .wrap>div{min-width:0}.pagehero .phones{max-width:540px;width:100%;margin-inline:auto}.modelgrid{grid-template-columns:1fr}.modelgrid .pathmodel{max-width:430px}.quitter-story .gedaanten{grid-template-columns:1fr}.momenten{grid-template-columns:repeat(3,1fr)}.bookgrid,.authgrid{gap:35px}}
@media(max-width:759px){.site-nav .wrap{height:74px;padding-inline:22px}.navbtn{display:none}.navtoggle{margin-left:auto}.editorial-hero h1{font-size:clamp(3rem,11.3vw,5.2rem);margin:25px 0}.hero-copy{padding-top:37px;padding-bottom:0}.editorial-hero .herocta{flex-direction:row;align-items:center;gap:20px}.hero-copy .btn{padding:15px 20px;min-height:52px;font-size:14px;gap:20px;width:auto}.hero-copy .text-link{font-size:14px;gap:12px}.hero-author{max-width:none;margin-top:28px;padding-top:18px}.hero-portrait{aspect-ratio:5/4;max-height:480px}.hero-portrait>img{object-position:50% 29%;min-height:0}.hero-floor{padding-block:20px}.hero-floor>p{display:none}.hero-floor>a{width:100%;justify-content:space-between}.readerstrip{padding-block:28px}.readerstrip .cards3{grid-template-columns:1fr!important}.readerstrip h2{max-width:none}.readerstrip .card{padding:20px 0}.readerstrip .card p{font-size:15px}.book-collection .cover-stage{height:350px}.cover-stage img{height:270px}.boeken2.book-collection{grid-template-columns:1fr;gap:40px}.book-collection h3{font-size:25px}.home #boeken h2{font-size:2.8rem}.quitter-story h2{font-size:clamp(2.5rem,9vw,4rem)}.gedaanten{margin-top:32px}.quitter-voice summary{font-size:23px}.momenten{grid-template-columns:1fr 1fr}.momenten b{font-size:28px}.path-section h2{font-size:clamp(2.4rem,8vw,3.4rem)}.step{padding:24px 0;gap:12px;grid-template-columns:40px 1fr}.step h3{font-size:24px}.modelgrid{margin-top:32px;gap:32px}.coach-intro .phones,.pagehero .phones{position:relative;display:flex;overflow-x:auto;overflow-y:hidden;gap:20px;padding:15px 0 30px;margin:0;height:auto;width:100%;scroll-snap-type:x mandatory;scrollbar-width:thin}.phone,.coach-intro .phone{position:static!important;display:block!important;width:240px;flex:0 0 240px;transform:none!important;scroll-snap-align:center}.phone .screen{height:440px}.phones .p3{display:block!important}.coach-intro h2{font-size:2.6rem}.coach-intro>.wrap{gap:30px}.feat{grid-template-columns:1fr}.feat>div{padding:25px 0}.home #coach h2{font-size:2.2rem}#prijzen h2{font-size:2.3rem}.prices{grid-template-columns:1fr}.plan{padding:28px}.trial{padding:24px}.trial>div{max-width:100%!important}.authgrid{grid-template-columns:1fr;gap:35px}.authgrid .portrait{order:-1;max-height:450px;aspect-ratio:5/4;object-position:50% 25%}.stats{grid-template-columns:repeat(3,1fr);gap:18px}.stats b{font-size:32px}.stats span{font-size:12px}.bookgrid{grid-template-columns:1fr}.book-detail .bookshot{padding-block:20px}.book-detail .book{max-width:230px}.book-detail h2{font-size:2.6rem}.teams h2{font-size:2.5rem}.footer-top{padding-block:45px 35px}.footer-invite{font-size:clamp(2rem,8vw,3.8rem)}.footer-grid{grid-template-columns:1fr 1fr;gap:32px 22px}.footer-grid>.brand{grid-column:1/-1}.footer-grid>div:last-child{grid-column:1/-1}.footer-bottom{flex-direction:column;gap:16px}.footer-bottom a{margin-left:0;margin-right:20px}.footer-word{font-size:12vw;white-space:nowrap}.pagehero{padding:32px 0 55px}.pagehero h1{font-size:clamp(2.7rem,9vw,4.2rem)}.pagehero .wrap{gap:35px}.pagehero .bookshot{padding:35px 15px}.pagehero .book{max-width:220px}.pagehero .sport-heading{font-size:clamp(2.4rem,7.7vw,3.5rem)}.parts,.tl,.sportgrid,.ebooks{grid-template-columns:1fr}.parts>div,.tl>div,.sportgrid>div,.ebooks>div{padding:26px 0}.srcs{grid-template-columns:1fr 1fr}.srcs>div{padding:24px 20px 24px 0}.rowfeat{grid-template-columns:1fr;gap:30px}.rowfeat.flip .visual{order:0}.rowfeat h2{font-size:2.3rem}.visual{padding:24px}.faq summary{font-size:18px}.legal h1{font-size:clamp(2.1rem,7vw,3.4rem)}.legal table{font-size:13px}.legal td,.legal th{padding:9px 5px;overflow-wrap:anywhere}.legal p,.legal li{font-size:16px}.form{max-width:100%}.fstep h2{font-size:26px}.keuze{grid-template-columns:1fr}.rij2,.rij3,.rijpc{grid-template-columns:1fr}.kaartvb{max-width:100%;min-height:0;aspect-ratio:auto}.kaartvb .bood{min-height:190px}.herocta .btn{width:auto}.signup{flex-direction:column}.signup input,.signup .btn{width:100%;flex:auto}.specs li{flex-direction:row;gap:20px}.specs li span{max-width:65%}.vink span{font-size:14px}}
@media(max-width:420px){.wrap{padding-inline:20px}.hero-copy .herocta{flex-direction:column;gap:13px;align-items:stretch}.hero-copy .btn{width:100%}.hero-copy .text-link{align-self:flex-start}.hero-portrait{aspect-ratio:1/1}.editorial-hero h1{font-size:11.2vw}.hero-intro{font-size:19px}.hero-author{font-size:12px}.hero-portrait figcaption strong{font-size:25px}.book-collection .cover-stage{height:300px}.cover-stage img{height:235px}.book-collection .go{font-size:13px}.momenten{grid-template-columns:1fr}.momenten>div{display:flex;gap:20px;align-items:center;padding:16px 0}.momenten b{margin:0}.stats{grid-template-columns:1fr;gap:0}.stats>div{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 0}.stats span{text-align:right;max-width:16ch;margin:0}.srcs,.cred{grid-template-columns:1fr}.herocta{align-items:stretch}.herocta .btn{width:100%}.legal h1{font-size:2.1rem}.legal h2{font-size:25px}.footer-grid{column-gap:15px}.footer-grid a{overflow-wrap:anywhere}.footer-grid>div>a{font-size:13px}.pagehero .brand-q{font-size:34px}.specs li{flex-direction:column;gap:3px}.specs li span{max-width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.arrived{opacity:1;translate:none}.hero-portrait img{translate:none;transform:none}.cover-stage img{will-change:auto}}
/* Component refinements for the original forms and comparison tables. */
table.cmp .no{color:#717769}.sport h1,.sport h2,.sport h3{letter-spacing:-.055em}.light .btn.ghost:hover{color:var(--cream);border-color:var(--cream)}
.book-choice-thumb{height:90px!important;width:auto;display:block;margin-bottom:18px;box-shadow:4px 6px 10px #1820101a}.keuze label{transition:background .2s,border-color .2s}.form .herocta .btn{min-width:220px}.purchase-summary{position:relative;background:#edeee6;padding:26px;margin-top:20px;border-radius:4px}.purchase-summary .totaal{padding-top:0;border-top:0}.purchase-summary .herocta{margin-bottom:0}
.details-jump{display:flex;gap:20px;flex-wrap:wrap;padding:18px 0 0;margin-top:22px;border-top:1px solid var(--line);font-size:13px}.details-jump a{text-decoration:none;color:var(--dim)}.details-jump a:hover{color:var(--cream)}.phones{scrollbar-color:#a7ae9b transparent}.phones:focus-visible{outline:2px solid var(--gold);outline-offset:4px}
@media(min-width:940px){body:has(.form) .pagehero{padding-bottom:45px}.form{margin-inline:auto}.form>.fstep{padding-block:38px}.form>.purchase-summary{padding:30px}.book-choice-thumb{height:105px!important}.form .keuze label{padding:26px}}
@media(max-width:759px){.book-choice-thumb{float:right;height:75px!important;margin-left:18px;margin-bottom:8px}.keuze label:after{content:'';display:table;clear:both}.purchase-summary{padding:22px}.form .herocta .btn{width:100%;min-width:0}.details-jump{gap:15px}.modelgrid>*,.bookgrid>*,.authgrid>*,.rowfeat>*,.pagehero .wrap>*,.hero-layout>*{min-width:0}}

/* ================= v3.1, 23 september 2026: feedbackronde Anthonie + Max ================= */

/* Goud: echt goud in plaats van bruin. Klein (tekst) blijft leesbaar, groot en grafisch mag het boekgoud zijn. */
:root,body.light{--gold:#8F6D0C;--gold-display:#B8860B;--gold-true:#D6A02A}
h1 em,h2 em,.light h1 em,.light h2 em{color:var(--gold-display)}
.editorial-hero h1 em{color:var(--gold-display)}
.quitter-story,footer{--gold:#D6A02A;--gold-display:#D6A02A}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{outline-color:var(--gold-true)}
.keuze label:has(input:checked),.light .keuze label:has(input:checked){border-color:var(--gold-true);box-shadow:inset 0 0 0 1px var(--gold-true)}

/* Oranje: het oranje van het sportboek (#F26322). Kleine tekst iets dieper zodat hij leesbaar blijft. */
body.sport{--gold:#D24E17;--gold-display:#F26322;--highlight:#f7b08d}
:root{--sport-accent:#D24E17}
.sport h1 em,.sport h2 em,.sportaccent h1 em,.sportaccent h2 em{color:#F26322}
.keuze label.sportkeuze:has(input:checked){border-color:#F26322;box-shadow:inset 0 0 0 1px #F26322}

/* De methode: geen gele vlakte meer, het PATH-model staat scherp op wit */
.path-section{background:#ffffff;--ink:#ffffff;--gold:#8F6D0C;--gold-display:#B8860B;--cream:#191b18;--dim:#60635d;--line:#dedfd8}
.path-section .chip{border-color:#d6d7ce}
.pathmodel{image-rendering:auto;border-radius:0;box-shadow:none;background:transparent}

/* Het boek: gloed terug achter het boek, zodat het weer 3D oogt */
.book-detail .bookshot,.pagehero .bookshot{position:relative;overflow:visible;isolation:isolate}
.bookshot .halo,.bookshot .floor,.bookshot .edge{display:block}
.bookshot .halo{background:radial-gradient(50% 50% at 50% 50%,rgba(236,184,64,.95),rgba(226,170,52,.6) 40%,rgba(214,160,42,.22) 62%,transparent 78%);filter:blur(46px);opacity:.95}
.bookshot .floor{background:radial-gradient(50% 50% at 50% 50%,rgba(120,90,20,.28),transparent 70%);filter:blur(18px)}
.book-detail .book .front,.pagehero .book .front{box-shadow:0 26px 44px rgba(40,30,8,.45)}

/* Quitter Coach app-schermen: tekst lichter en beter leesbaar */
.phone{--cream:#fbfaf3;--dim:#dfe2d6;--gold:#E3B347}
.phone .screen{background:#20261c}
.bubble{color:#191b18;font-size:12.5px;line-height:1.5}
.bubble.coach{background:#f6e7b8;border:1px solid #e0c270}
.bubble.me{background:#ffffff;border:1px solid #e3e4dc;color:#191b18}
.phone .bubble{color:#fbfaf3}
.phone .bubble.coach{background:rgba(214,160,42,.24);border-color:rgba(227,179,71,.5)}
.phone .bubble.me{background:rgba(255,255,255,.14);border-color:transparent;color:#fbfaf3}
.phone .scr-h,.phone .small,.phone p,.phone span{color:inherit}
.phones svg text{fill:#f3f1e6;fill-opacity:.92}

/* Zakelijk: hero in dezelfde uitlijning als de rest, met het programma als beeld */
.zk-hero .mnbmark{margin-bottom:22px}
.zk-route{background:#fff;border:1px solid #d3dfe3;border-radius:6px;padding:34px 34px 28px;align-self:center;max-width:470px;width:100%;justify-self:end}
.zk-route ol{list-style:none;margin:18px 0 0;padding:0;counter-reset:zk}
.zk-route li{counter-increment:zk;display:grid;grid-template-columns:44px 1fr;column-gap:14px;padding:16px 0;border-top:1px solid #e1e8ea}
.zk-route li:before{content:counter(zk);grid-row:1/3;font-family:var(--serif);font-weight:700;font-size:28px;line-height:1;color:var(--mnbblue,#244b61)}
.zk-route li b{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#4d6a78}
.zk-route li span{font-size:17px;line-height:1.45;color:#191b18}
.zk-route-foot{margin-top:14px;padding-top:16px;border-top:1px solid #e1e8ea;font-size:14px;color:#4d6a78}
@media(max-width:940px){.zk-route{justify-self:stretch;max-width:none}}
.teams{--gold-display:#5a4300}
.mnb .endcta,.mnb.licht .endcta{background:#dde9ed}
.book-detail,.pagehero{overflow-x:clip}

/* v3.2, 24 september 2026 */
/* Sticky header: overflow-x:hidden op html/body maakte de body een scrollcontainer, daardoor bleef de navigatie niet staan */
html,body{overflow-x:clip!important;overflow-y:visible!important}
nav.site-nav,body.light nav,body.sport nav,body.mnb nav,body.mnb.licht nav{position:sticky;top:0;z-index:90}
/* PATH-model: nieuwe scherpe versie op wit */
.modelgrid .pathmodel{max-width:520px}
/* Diamond op de Quitter Coach-pagina: labels leesbaar op lichte achtergrond */
.diamond-light text{fill:#3a3c35;fill-opacity:1;font-family:var(--sans);font-size:10.5px;font-weight:500}
/* Actieve pagina in de navigatie */
.navlinks a{position:relative;text-decoration:none}
.navlinks a[aria-current=page]{color:#161813;font-weight:600}
.navlinks a[aria-current=page]:after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;border-radius:2px;background:var(--gold-true,#D6A02A)}
body.sport .navlinks a[aria-current=page]:after{background:#F26322}
body.mnb .navlinks a[aria-current=page]:after{background:var(--mnbblue,#244b61)}
@media(max-width:940px){.navlinks a[aria-current=page]:after{left:-12px;right:auto;top:50%;bottom:auto;width:3px;height:1.1em;transform:translateY(-50%)}}
/* Wachtlijst: optionele voornaam naast e-mail */
.signup .fn{flex:0 1 190px}
@media(max-width:759px){.signup .fn{flex:auto}}
/* Wachtlijst-teller */
.wl-count{display:flex;align-items:center;gap:10px;margin-top:14px;font-size:14px;font-weight:500;color:var(--cream)}
.wl-count[hidden]{display:none}
.wl-dot{width:8px;height:8px;border-radius:50%;background:#5f8f3a;box-shadow:0 0 0 0 rgba(95,143,58,.5);animation:wl-pulse 2s ease-out infinite;flex:none}
@keyframes wl-pulse{0%{box-shadow:0 0 0 0 rgba(95,143,58,.5)}70%{box-shadow:0 0 0 8px rgba(95,143,58,0)}100%{box-shadow:0 0 0 0 rgba(95,143,58,0)}}
@media(prefers-reduced-motion:reduce){.wl-dot{animation:none}}
/* Diamond op quitter-coach.html: nagebouwd uit het app-ontwerp, volgorde en namen van het boek */
.diamond-card{padding:28px 22px 22px!important;max-width:560px!important;width:100%;display:block!important}
.diamond-app{width:100%;height:auto;display:block}
.diamond-app .dl-n{font-family:var(--sans);font-size:34px;font-weight:600;fill:#191b18}
.diamond-app .dl-v{font-family:var(--sans);font-size:26px;font-weight:500;fill:#60635d}
.diamond-legend{display:flex;justify-content:center;gap:28px;margin-top:10px;font-size:14px;font-weight:600;color:#3a3c35}
.diamond-legend span{display:flex;align-items:center;gap:9px}
.diamond-legend i{width:14px;height:14px;border-radius:50%;display:block}
.dl-nu{background:#5E6157}.dl-gw{border:3px solid #5E6157;background:#fff}
.diamond-note{text-align:center;font-size:12.5px;color:#60635d;margin-top:10px}

/* v3.8: echte app-schermen (Claude Design export, webp) */
.appshots{display:grid;grid-template-columns:repeat(12,1fr);align-items:start;width:100%;max-width:560px;margin-inline:auto;padding:10px 0 20px}
.appshot{display:block;width:100%;height:auto;filter:drop-shadow(0 26px 34px rgba(24,28,18,.22))}
.appshots .front{grid-column:1/8;grid-row:1;z-index:2}
.appshots .back{grid-column:6/13;grid-row:1;margin-top:16%;z-index:1}
.appshot-panel{display:flex!important;justify-content:center;align-items:center;padding:44px 24px!important}
.appshot-panel .appshot{width:min(300px,80%)}
.printbox{margin-top:30px}
.diamond-app line,.diamond-app polygon[fill="none"][stroke="#E3E7E4"]{stroke:#d3d6ca}
@media(max-width:759px){.appshots{max-width:420px}.appshot-panel .appshot{width:min(260px,78%)}}
.appshot-panel.diamond-card{display:flex!important;flex-direction:column;justify-content:center;align-items:stretch;max-width:none!important}
.appshot-panel.diamond-card .diamond-app{max-width:520px;margin-inline:auto}

/* v3.9, 24 september 2026 */
/* App-schermen los, zonder vlak, met zachte schaduw */
.appshot{filter:drop-shadow(0 38px 44px rgba(24,28,18,.26)) drop-shadow(0 10px 16px rgba(24,28,18,.14))}
.appshot-panel{background:none!important;border:0!important;box-shadow:none!important}
.block-cta{margin-top:22px}
/* PATH-stappen: nummers op mobiel netjes op één regel */
.step .n{white-space:nowrap;font-variant-numeric:tabular-nums}
@media(max-width:759px){.step{grid-template-columns:52px 1fr}.step .n{font-size:30px}}
/* Bestellen op de boekpagina: boek boven de prijs op mobiel */
@media(max-width:820px){.bestelgrid .bookshot{order:-1}}
/* Werkboek: waaier hoog genoeg zodat het onderschrift er niet onder valt */
.fan{padding-top:98%}
@media(max-width:560px){.fan{padding-top:116%}}

/* v3.10: hero-slider alleen op smalle telefoons, compact, met zichtbaar tweede scherm en stipjes */
@media(max-width:560px){
 .appshots{display:flex;gap:18px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  padding:30px 24px 64px;margin:-10px calc(50% - 50vw) 0;width:auto;max-width:none;scrollbar-width:none;scroll-padding-inline:24px}
 .appshots::-webkit-scrollbar{display:none}
 .appshots .appshot{flex:0 0 212px;width:212px;margin-top:0!important;scroll-snap-align:start;filter:drop-shadow(0 18px 20px rgba(24,28,18,.24)) drop-shadow(0 4px 8px rgba(24,28,18,.12))}
 .appshot-dots{display:flex;justify-content:center;gap:8px;margin-top:-40px;margin-bottom:20px;position:relative}
 .appshot-dots i{width:7px;height:7px;border-radius:50%;background:#c9cbc0;transition:background .2s,width .2s}
 .appshot-dots i.on{background:#191b18;width:18px;border-radius:4px}
}
@media(min-width:561px){.appshot-dots{display:none}}
/* v3.12: "per maand" naast de prijs kreeg de krappe letterspatiëring van het bedrag mee */
.price sub{letter-spacing:0;font-size:15px;font-weight:400;margin-left:8px;white-space:nowrap}
/* v3.13: de pijl in het logo en bij "Begin vandaag." als SVG in plaats van het teken \2197.
   Manrope heeft dat teken niet; de browser pakte een ander lettertype, en op iOS was dat het
   emoji-lettertype (een blauw blokje). De SVG volgt de lange, dunne pijl van desktop en neemt
   kleur en grootte over van de span eromheen. De pijlen in DM Sans (knoppen) blijven tekst:
   DM Sans heeft het teken zelf. */
.pijl{display:inline-block;width:.9em;height:.9em;max-width:none;vertical-align:-.1em;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
/* In het logo: op de plek en in de maat van het oude teken (gemeten in WebKit en Chromium),
   vanaf de rechteronderhoek van de Q (de span staat daar, zonder eigen inhoud). */
.brand-q .pijl{position:absolute;left:-.74em;top:-.955em;width:.94em;height:.94em;max-width:none;stroke-width:1.3}
.footer-invite .pijl{width:.95em;height:.95em}