/* marketingbuddy-site - funnel.css
   Alleen voor de funnelpagina's (template funnel.html): landingspagina's, quizzen, uitslag, bedank- en
   afspraakpagina's. Eigen, lichte stylesheet (geen site.css): twee lettertypes, telefoon eerst.
   Beeldtaal van de playbooks: diep navy met een groene gloed, accentgroen, limoen labels, Onest en Inter. */

@font-face{font-family:"Onest";font-weight:600;font-style:normal;font-display:swap;src:url("fonts/onest-600.woff2") format("woff2");}
@font-face{font-family:"Inter";font-weight:400;font-style:normal;font-display:swap;src:url("fonts/inter-400.woff2") format("woff2");}

:root{
  --nacht:#0D1325;--navy:#171B2B;--navy-2:#1C2436;--navy-3:#253049;--ink:#050505;--slate:#2E3648;--grijs:#5B6475;
  --accent:#00FFAB;--accent-hover:#00E69A;--accent-zacht:#E5FFF5;--limoen:#D0FF00;--lila:#DCC7E2;--lila-zacht:#F5EFF7;
  --offwit:#F7F8FA;--wit:#fff;--rand:#E3E6EC;--rood:#C62828;--rood-zacht:#FDECEC;--ster:#FFB400;
  --kop:"Onest",system-ui,-apple-system,"Segoe UI",sans-serif;
  --tekst:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --breed:1120px;
  --gloed:radial-gradient(60% 55% at 92% 0%,rgba(0,255,171,.20),rgba(0,255,171,0) 70%),radial-gradient(40% 40% at 0% 100%,rgba(208,255,0,.06),rgba(208,255,0,0) 70%);
}
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{margin:0;background:var(--wit);color:var(--ink);font:400 17px/1.55 var(--tekst);-webkit-font-smoothing:antialiased;overflow-wrap:break-word;}
img{display:block;max-width:100%;height:auto;}
a{color:inherit;}
h1,h2,h3,p,ul,ol,figure,blockquote{margin:0;}
ul,ol{padding:0;list-style:none;}
b,strong{font-family:var(--kop);font-weight:600;}
button,input,select,textarea{font:inherit;color:inherit;}
[hidden]{display:none!important;}
.fn-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.fn-in{width:100%;max-width:var(--breed);margin-inline:auto;padding-inline:20px;}
.fn-smal{max-width:760px;}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;}

/* ===== Typografie ===== */
.fn-h1,.fn-h2,.fn-h3{font-family:var(--kop);font-weight:600;letter-spacing:-.02em;text-wrap:balance;}
.fn-h1{font-size:35px;line-height:1.08;letter-spacing:-.035em;}
.fn-h2{font-size:28px;line-height:1.14;}
.fn-h3{font-size:20px;line-height:1.25;}
.fn-lead{font-size:18px;line-height:1.5;}
.fn-klein{font-size:14px;line-height:1.5;color:var(--grijs);}
.accent{color:var(--accent);}
.fn-chip{display:inline-flex;align-items:center;gap:8px;width:max-content;max-width:100%;margin-bottom:16px;padding:6px 11px;border-radius:6px;background:var(--limoen);color:#12161F;font:600 12.5px/1.2 var(--kop);letter-spacing:.07em;text-transform:uppercase;}
.fn-eyebrow{display:inline-flex;align-items:center;gap:8px;margin-bottom:12px;font:600 13px/1 var(--kop);letter-spacing:.08em;text-transform:uppercase;color:var(--accent);}
.fn-eyebrow::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--accent);}
.fn-sterren{color:var(--ster);letter-spacing:1px;}

/* ===== Knoppen ===== */
.fn-knop{position:relative;display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:56px;padding:14px 22px;border:0;border-radius:12px;background:var(--accent);color:var(--nacht);font:600 17.5px/1.2 var(--kop);text-align:center;text-decoration:none;cursor:pointer;box-shadow:0 10px 28px rgba(0,255,171,.28);transition:background-color .2s ease,transform .12s ease,box-shadow .2s ease;}
.fn-knop::after{content:"";width:9px;height:9px;border-top:2.4px solid currentColor;border-right:2.4px solid currentColor;transform:rotate(45deg);margin-left:2px;flex:none;}
.fn-knop:hover{background:var(--accent-hover);box-shadow:0 12px 32px rgba(0,255,171,.36);}
.fn-knop:active{transform:translateY(1px);}
.fn-knop[disabled]{opacity:.6;cursor:wait;}
.fn-knop--rand{background:transparent;color:var(--navy);box-shadow:inset 0 0 0 2px var(--navy);}
.fn-knop--rand:hover{background:var(--lila-zacht);box-shadow:inset 0 0 0 2px var(--navy);}
.fn-knop--licht{background:rgba(255,255,255,.08);color:var(--wit);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.35);}
.fn-knop--licht:hover{background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.6);}
.fn-knoppen{display:grid;gap:10px;margin-top:22px;}

/* ===== Kop (logo) en voet ===== */
.fn-kop{background:var(--nacht);}
.fn-kop .fn-in{display:flex;align-items:center;justify-content:space-between;height:60px;}
.fn-kop img{width:auto;height:22px;}
.fn-voet{background:var(--offwit);border-top:1px solid var(--rand);padding:28px 0 36px;color:var(--grijs);font-size:14px;line-height:1.7;}
.fn-voet p+p{margin-top:4px;}
.fn-voet a,.fn-voet button{color:var(--slate);text-decoration:underline;text-underline-offset:2px;background:none;border:0;padding:0;cursor:pointer;font-size:14px;}
.fn-voet-links{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:10px;}
body.fn-sticky-ruimte .fn-voet{padding-bottom:110px;}

/* ===== Donkere vlakken (hero, bedankt, uitslag, afsluiter) ===== */
.fn-donker{position:relative;overflow:hidden;background:var(--gloed),var(--nacht);color:var(--wit);}
.fn-donker .fn-h1,.fn-donker .fn-h2{color:var(--wit);}
.fn-donker .fn-lead,.fn-donker .fn-tekst{color:rgba(255,255,255,.82);}
.fn-donker .fn-klein{color:rgba(255,255,255,.65);}
.fn-donker a:not(.fn-knop){color:var(--wit);font-family:var(--kop);font-weight:600;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px;}

/* ===== Hero ===== */
.fn-hero{padding:22px 0 40px;}
.fn-hero .fn-in{position:relative;z-index:1;}
.fn-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 112px;column-gap:18px;grid-template-areas:"e e" "k k" "s c" "b b" "a a";}
.fn-hero-grid.zonder-cover{grid-template-columns:minmax(0,1fr);grid-template-areas:"e" "k" "s" "b" "a";}
.fn-hero-eyebrow{grid-area:e;}
.fn-hero-titel{grid-area:k;}
.fn-hero-sub{grid-area:s;margin-top:14px;}
.fn-hero-bullets{grid-area:b;}
.fn-hero-cover{grid-area:c;margin-top:12px;align-self:start;}
.fn-hero-acties{grid-area:a;}
.fn-cover-img{width:100%;border-radius:4px 8px 8px 4px;transform:rotate(4deg);box-shadow:0 18px 40px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.08);}
.fn-hero-knop{margin-top:24px;}
.fn-hero-noot{margin-top:12px;font-size:15px;color:rgba(255,255,255,.72);text-align:center;}
.fn-hero-trust{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;font-size:14px;color:rgba(255,255,255,.72);}
.fn-bullets:empty,.fn-genummerd:empty,.fn-kaarten:empty,.fn-team:empty,.fn-cijfers:empty,.fn-inkijk:empty,.fn-logos:empty{display:none;}
.fn-bullets{display:grid;gap:10px;margin-top:18px;}
.fn-bullets li{position:relative;padding-left:32px;font-size:17px;line-height:1.45;}
.fn-bullets li::before{content:"";position:absolute;left:0;top:2px;width:22px;height:22px;border-radius:50%;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%230D1325' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat;}
.fn-donker .fn-bullets li{color:rgba(255,255,255,.9);}
/* typografische cover als er (nog) geen beeld is */
.fn-cover{width:100%;aspect-ratio:3/4;border-radius:6px 12px 12px 6px;padding:12px 10px;background:linear-gradient(155deg,#27304a 0%,var(--navy) 55%,#0d1019 100%);box-shadow:0 18px 40px rgba(0,0,0,.45);display:flex;flex-direction:column;justify-content:space-between;transform:rotate(4deg);border:1px solid rgba(255,255,255,.14);}
.fn-cover span{font:600 8px/1.2 var(--kop);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);}
.fn-cover strong{font-size:15px;line-height:1.05;color:var(--wit);}
.fn-cover em{font-style:normal;font:400 8px/1.3 var(--tekst);color:rgba(255,255,255,.7);}

/* ===== Secties ===== */
.fn-sectie{padding:46px 0;}
.fn-sectie--offwit{background:var(--offwit);}
.fn-sectie--lila{background:var(--lila-zacht);}
.fn-sectie--navy,.fn-sectie--nacht{background:var(--gloed),var(--nacht);color:var(--wit);}
.fn-sectie--navy .fn-h2,.fn-sectie--nacht .fn-h2{color:var(--wit);}
.fn-sectie--nacht .fn-tekst,.fn-sectie--nacht p{color:rgba(255,255,255,.82);}
.fn-sectie .fn-h2+p,.fn-sectie .fn-h2+.fn-tekst{margin-top:12px;}
.fn-tekst p+p{margin-top:12px;}
.fn-sectie .fn-bullets{margin-top:20px;}
.fn-sectie .fn-knop{margin-top:26px;}
.fn-kaarten{display:grid;gap:14px;margin-top:22px;}
.fn-kaart{background:var(--wit);border:1px solid var(--rand);border-radius:16px;padding:20px;}
.fn-kaart .fn-h3+p{margin-top:8px;color:var(--slate);}
.fn-kaart--plus{border-top:4px solid var(--accent);}
.fn-kaart--min{background:transparent;border-style:dashed;}
.fn-genummerd{counter-reset:stap;display:grid;gap:12px;margin-top:22px;}
.fn-genummerd li{counter-increment:stap;position:relative;padding:16px 16px 16px 60px;background:var(--wit);border:1px solid var(--rand);border-radius:14px;}
.fn-genummerd li::before{content:counter(stap);position:absolute;left:16px;top:14px;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:var(--nacht);color:var(--accent);font:600 15px/1 var(--kop);}
.fn-team{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:24px;max-width:540px;}
.fn-team:has(> figure:nth-child(3)){grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 12px;max-width:none;}
.fn-team figure{margin:0;}
.fn-team img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:16px;background:var(--lila-zacht);}
.fn-team figcaption{margin-top:10px;font:600 16px/1.3 var(--kop);}
.fn-team figcaption span{display:block;margin-top:2px;font:400 14px/1.35 var(--tekst);color:var(--grijs);}
.fn-team:has(> figure:nth-child(3)) figcaption{font-size:14px;}
.fn-team:has(> figure:nth-child(3)) figcaption span{font-size:12.5px;}
/* inkijk in het playbook: pagina's naast elkaar, op telefoon veegbaar */
.fn-inkijk{display:flex;gap:14px;margin:26px -20px 0;padding:6px 20px 16px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
.fn-inkijk figure{flex:0 0 58%;scroll-snap-align:start;}
.fn-inkijk img{width:100%;aspect-ratio:595/842;object-fit:cover;border-radius:8px;box-shadow:0 12px 30px rgba(13,19,37,.18),0 0 0 1px var(--rand);background:var(--wit);}
.fn-inkijk figcaption{margin-top:8px;font-size:13.5px;color:var(--grijs);}

/* ===== Cijfers (case) ===== */
.fn-cijfers{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px;}
.fn-cijfer{background:var(--nacht);color:var(--wit);border-radius:14px;padding:18px 14px;}
.fn-cijfer b{display:block;font-size:25px;line-height:1.1;letter-spacing:-.02em;color:var(--accent);}
.fn-cijfer span{display:block;margin-top:6px;font-size:14px;line-height:1.35;color:rgba(255,255,255,.78);}
.fn-sectie--nacht .fn-cijfer{background:var(--navy-2);box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);}
.fn-quote{margin:22px 0 0;padding:18px 20px;border-left:4px solid var(--accent);background:var(--wit);border-radius:0 12px 12px 0;font-size:17px;}
.fn-quote footer{margin-top:8px;font-size:14px;color:var(--grijs);}

/* ===== Reviews en klantlogo's ===== */
.fn-reviews{display:grid;gap:14px;margin-top:22px;}
.fn-review{background:var(--wit);border:1px solid var(--rand);border-radius:16px;padding:20px;}
.fn-review blockquote{font-size:16.5px;line-height:1.5;color:var(--slate);}
.fn-review blockquote::before{content:"★★★★★";display:block;margin-bottom:8px;color:var(--ster);letter-spacing:2px;font-size:15px;}
.fn-review figcaption{display:flex;align-items:center;gap:12px;margin-top:14px;}
.fn-review figcaption img{width:42px;height:42px;border-radius:50%;object-fit:cover;}
.fn-review figcaption b{display:block;font-size:15px;}
.fn-review figcaption span{font-size:13.5px;color:var(--grijs);}
.fn-review--video{padding:0;overflow:hidden;display:flex;flex-direction:column;}
.fn-review--video video{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:var(--nacht);}
.fn-review--video figcaption{margin:0;padding:14px 20px 18px;}
.fn-review--video .fn-sterren{display:block;margin-bottom:4px;color:var(--ster);letter-spacing:2px;font-size:15px;}
.fn-logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:18px 28px;margin-top:26px;}
.fn-logos img{height:30px;width:auto;max-width:110px;object-fit:contain;filter:grayscale(1);opacity:.65;}
.fn-trust{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 14px;margin-top:20px;font-size:14.5px;color:var(--slate);}

/* ===== Formulier ===== */
.fn-form-sectie{padding:34px 0 46px;background:var(--offwit);}
.fn-form{background:var(--wit);border:1px solid var(--rand);border-radius:20px;padding:22px 18px;box-shadow:0 16px 40px rgba(13,19,37,.08);}
.fn-form .fn-h2{font-size:24px;}
.fn-velden{display:grid;gap:16px;margin-top:18px;}
.fn-veld label{display:block;margin-bottom:6px;font:600 15px/1.3 var(--kop);color:var(--navy);}
.fn-veld label span{font:400 14px/1.3 var(--tekst);color:var(--grijs);}
.fn-veld input{display:block;width:100%;height:54px;padding:0 14px;border:1.5px solid #C9CFDA;border-radius:10px;background:var(--wit);font-size:17px;color:var(--ink);transition:border-color .15s ease,box-shadow .15s ease;}
.fn-veld input:focus{outline:0;border-color:var(--nacht);box-shadow:0 0 0 3px rgba(0,255,171,.45);}
.fn-veld .fn-hulp{margin-top:6px;font-size:14px;color:var(--grijs);}
.fn-veld.is-fout input{border-color:var(--rood);background:#FFFBFB;}
.fn-fout{display:none;margin-top:6px;font-size:14px;line-height:1.4;color:var(--rood);}
.fn-veld.is-fout .fn-fout{display:block;}
.fn-vink{display:flex;align-items:flex-start;gap:12px;margin-top:18px;cursor:pointer;font-size:16px;line-height:1.45;}
.fn-vink input{flex:none;width:24px;height:24px;margin:0;accent-color:var(--nacht);cursor:pointer;}
.fn-form .fn-knop{margin-top:20px;}
.fn-privacy{margin-top:14px;font-size:13.5px;line-height:1.5;color:var(--grijs);}
.fn-privacy a{color:var(--slate);}
.fn-form-fout{display:none;margin-top:14px;padding:12px 14px;border-radius:10px;background:var(--rood-zacht);color:var(--rood);font-size:15px;}
.fn-form-fout.is-zichtbaar{display:block;}
.fn-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden;}
.fn-form-kop{display:flex;align-items:center;gap:14px;}
.fn-form-kop img{width:54px;flex:none;border-radius:3px 6px 6px 3px;box-shadow:0 6px 16px rgba(13,19,37,.25);}

/* ===== FAQ ===== */
.fn-faq{margin-top:20px;border-top:1px solid var(--rand);}
.fn-faq details{border-bottom:1px solid var(--rand);}
.fn-faq summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:14px 0;cursor:pointer;list-style:none;font:600 17px/1.35 var(--kop);color:var(--navy);}
.fn-faq summary::-webkit-details-marker{display:none;}
.fn-faq summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;background:var(--lila-zacht) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 5v14M5 12h14' fill='none' stroke='%23171B2B' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat;transition:transform .2s ease;}
.fn-faq details[open] summary::after{transform:rotate(45deg);}
.fn-faq details>div{padding:0 0 18px;color:var(--slate);}

/* ===== Afsluiter en vaste knop ===== */
.fn-afsluiter{padding:48px 0;text-align:center;}
.fn-afsluiter .fn-knop{margin:24px auto 0;max-width:420px;}
.fn-sticky{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);border-top:1px solid var(--rand);box-shadow:0 -8px 24px rgba(13,19,37,.08);transform:translateY(110%);transition:transform .25s ease;}
.fn-sticky.is-zichtbaar{transform:none;}
.fn-sticky .fn-knop{min-height:52px;box-shadow:none;}

/* ===== Bedankpagina ===== */
.fn-bedankt{padding:30px 0 42px;}
.fn-bedankt-grid{display:grid;gap:22px;}
.fn-bedankt .fn-h1{font-size:32px;}
.fn-bedankt .fn-lead{margin-top:12px;}
.fn-vinkje{width:52px;height:52px;border-radius:50%;margin-bottom:18px;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%230D1325' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/26px no-repeat;box-shadow:0 0 0 8px rgba(0,255,171,.15);}
.fn-bedankt-cover{width:150px;}

/* ===== Agenda ===== */
.fn-agenda{margin-top:20px;background:var(--wit);border:1px solid var(--rand);border-radius:18px;overflow:hidden;box-shadow:0 16px 40px rgba(13,19,37,.08);}
.fn-agenda-start{display:grid;place-items:center;gap:14px;padding:26px 18px;text-align:center;}
.fn-agenda-start p{color:var(--grijs);font-size:15px;}
.fn-agenda-start p:empty{display:none;}
.fn-agenda iframe{display:block;width:100%;height:760px;border:0;}
.fn-agenda.is-geladen .fn-agenda-start{display:none;}
.fn-met-wie{display:flex;align-items:center;gap:12px;margin-top:16px;}
.fn-met-wie img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid var(--wit);box-shadow:0 2px 6px rgba(13,19,37,.2);}
.fn-met-wie img+img{margin-left:-22px;}
.fn-met-wie p{font-size:15px;line-height:1.35;color:var(--slate);}
.fn-donker .fn-met-wie p{color:rgba(255,255,255,.8);}
.fn-donker .fn-met-wie img{border-color:var(--nacht);}

/* ===== Quiz ===== */
.fn-quiz{background:var(--offwit);min-height:calc(100vh - 60px);padding:0 0 44px;}
.fn-quiz-intro{padding:22px 0 36px;}
.fn-quiz-intro .fn-in{position:relative;z-index:1;}
.fn-quiz-intro-grid{display:grid;gap:8px;}
.fn-quiz-intro .fn-lead{margin-top:14px;}
.fn-quiz-intro .fn-knop{margin-top:24px;}
.fn-quiz-intro .fn-hero-noot{margin-top:12px;}
/* eerste vraag meteen in beeld (splittest quiz-1): de intro wordt een korte kop boven de vraag */
.fn-quiz--direct [data-quiz-start],.fn-quiz--direct .fn-quiz-intro .fn-bullets,.fn-quiz--direct .fn-quiz-intro .fn-hero-noot,.fn-quiz--direct .fn-meter{display:none;}
.fn-quiz--direct .fn-quiz-intro{padding:18px 0 22px;}
.fn-quiz--direct .fn-quiz-intro .fn-lead{margin-top:10px;font-size:16px;}
/* gegevens per stap (variant A): één veld tegelijk, het label als vraag */
.fn-stapsgewijs .fn-veld label{font:600 21px/1.25 var(--kop);color:var(--nacht);margin-bottom:10px;}
.fn-stapsgewijs .fn-velden{margin-top:14px;}
.fn-stap-nog{margin-top:6px;font-size:14px;color:var(--grijs);}
/* aanbod onder de uitslag (variant B) */
.fn-aanbod{padding-top:30px;}
.fn-aanbod .fn-form{margin:0;}
.fn-aanbod-klaar{text-align:center;}
.fn-aanbod-klaar .fn-vinkje{display:inline-block;}
.fn-aanbod-klaar p{margin-top:8px;color:var(--slate);}
.fn-meter{width:170px;margin:20px auto 0;}
.fn-meter svg{display:block;width:100%;height:auto;overflow:visible;}
.fn-quiz-scherm{padding-top:18px;}
.fn-quiz-kaart{background:var(--wit);border:1px solid var(--rand);border-radius:20px;padding:18px 16px 22px;box-shadow:0 16px 40px rgba(13,19,37,.07);}
.fn-voortgang{display:flex;align-items:center;gap:12px;}
.fn-voortgang-balk{flex:1;height:8px;border-radius:99px;background:#E6E8EE;overflow:hidden;}
.fn-voortgang-balk i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,var(--accent),#7CFFD1);transition:width .35s ease;}
.fn-voortgang span{flex:none;font:600 13.5px/1 var(--kop);color:var(--grijs);}
.fn-terug{display:inline-flex;align-items:center;gap:6px;min-height:40px;margin:8px 0 0 -4px;padding:0 4px;border:0;background:none;color:var(--slate);font:600 15px/1 var(--kop);cursor:pointer;}
.fn-terug::before{content:"";width:8px;height:8px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);}
.fn-vraag{margin-top:8px;font-size:24px;line-height:1.2;outline:0;}
.fn-vraag-hulp{margin-top:8px;font-size:15px;color:var(--grijs);}
.fn-antwoorden{display:grid;gap:10px;margin-top:18px;}
.fn-antwoord{display:flex;align-items:center;gap:14px;width:100%;min-height:58px;padding:12px 14px;border:1.5px solid #D5DAE3;border-radius:14px;background:var(--wit);text-align:left;font:400 17px/1.35 var(--tekst);color:var(--ink);cursor:pointer;transition:border-color .15s ease,background-color .15s ease,transform .1s ease;}
.fn-antwoord:active{transform:scale(.99);}
.fn-letter{flex:none;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:var(--offwit);border:1.5px solid #D5DAE3;font:600 14px/1 var(--kop);color:var(--slate);transition:all .15s ease;}
.fn-antwoord--meer .fn-letter{border-radius:7px;}
.fn-antwoord:hover{border-color:var(--nacht);}
.fn-antwoord.is-gekozen{border-color:var(--nacht);background:var(--accent-zacht);}
.fn-antwoord.is-gekozen .fn-letter{background:var(--nacht);border-color:var(--nacht);color:var(--accent);}
.fn-antwoord--meer.is-gekozen .fn-letter{font-size:0;background:var(--nacht) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%2300FFAB' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;}
.fn-quiz-verder{margin-top:18px;position:sticky;bottom:calc(12px + env(safe-area-inset-bottom));z-index:5;box-shadow:0 8px 24px rgba(13,19,37,.18);}  /* meerkeuzevraag: Volgende altijd in beeld op de telefoon */
.fn-quiz-verder[disabled]{opacity:1;background:#D5DAE3;color:#5B6478;cursor:default;box-shadow:none;}
.fn-quiz-scherm .fn-form{margin-top:12px;}
.fn-quiz-fout{margin-top:12px;color:var(--rood);font-size:15px;}
.fn-in-beeld{animation:fn-in .28s ease both;}
@keyframes fn-in{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
.fn-teaser{display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:14px;border-radius:14px;background:var(--gloed),var(--nacht);color:var(--wit);}
.fn-teaser b{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;font-size:22px;line-height:1;color:var(--nacht);background:var(--accent);}
.fn-teaser span{font-size:14.5px;line-height:1.4;color:rgba(255,255,255,.85);}

/* ===== Uitslag ===== */
.fn-uitslag-kop{padding:26px 0 36px;text-align:center;}
.fn-uitslag-kop .fn-in{position:relative;z-index:1;}
.fn-gauge{position:relative;width:250px;margin:4px auto 0;}
.fn-gauge svg{display:block;width:100%;height:auto;}
.fn-gauge-getal{position:absolute;left:0;right:0;bottom:4px;text-align:center;}
.fn-gauge-getal b{display:block;font-size:64px;line-height:.9;letter-spacing:-.04em;color:var(--wit);}
.fn-gauge-getal span{font-size:15px;color:rgba(255,255,255,.7);}
.fn-profiel{display:inline-block;margin-top:14px;padding:7px 14px;border-radius:8px;background:var(--limoen);color:#12161F;font:600 15px/1.2 var(--kop);}
.fn-zones{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:14px;}
.fn-zones span{padding:5px 10px;border-radius:99px;font-size:13px;color:rgba(255,255,255,.6);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);}
.fn-zones span.is-hier{color:var(--accent);box-shadow:inset 0 0 0 1.5px var(--accent);font-family:var(--kop);font-weight:600;}
.fn-uitslag-tekst{max-width:620px;margin:18px auto 0;font-size:17px;color:rgba(255,255,255,.88);text-align:left;}
.fn-boek{margin-top:22px;padding:18px;border-radius:18px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);text-align:left;}
.fn-boek .fn-h3{color:var(--wit);}
.fn-boek>p{margin-top:8px;font-size:16px;color:rgba(255,255,255,.82);}
.fn-boek .fn-knop{margin-top:16px;}
.fn-taken,.fn-bevindingen{display:grid;gap:12px;margin-top:18px;counter-reset:bev;}
.fn-taak,.fn-bevinding{position:relative;background:var(--wit);border:1px solid var(--rand);border-radius:16px;padding:16px 16px 16px 60px;}
.fn-taak::before{content:"";position:absolute;left:16px;top:16px;width:30px;height:30px;border-radius:8px;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='%230D1325' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat;}
.fn-bevinding{counter-increment:bev;}
.fn-bevinding::before{content:counter(bev);position:absolute;left:16px;top:16px;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:var(--lila-zacht);color:var(--navy);font:600 15px/1 var(--kop);}
.fn-taak b,.fn-bevinding b{display:block;font-size:17px;line-height:1.3;color:var(--navy);}
.fn-taak p,.fn-bevinding p{margin-top:6px;font-size:16px;color:var(--slate);}
.fn-laden{padding:60px 0;text-align:center;color:var(--grijs);}

/* ===== Playbook lezen ===== */
.fn-artikel{padding:32px 0 50px;}
.fn-artikel h1{font:600 32px/1.1 var(--kop);letter-spacing:-.03em;color:var(--navy);}
.fn-artikel h2{margin:40px 0 12px;font:600 25px/1.2 var(--kop);letter-spacing:-.02em;color:var(--navy);}
.fn-artikel h3{margin:28px 0 8px;font:600 19px/1.3 var(--kop);color:var(--navy);}
.fn-artikel p{margin:0 0 14px;}
.fn-artikel ul{margin:0 0 16px;display:grid;gap:8px;}
.fn-artikel li{position:relative;padding-left:22px;}
.fn-artikel li::before{content:"";position:absolute;left:2px;top:.62em;width:8px;height:8px;border-radius:2px;background:var(--accent);}
.fn-artikel blockquote{margin:16px 0;padding:14px 18px;border-left:4px solid var(--accent);background:var(--offwit);border-radius:0 10px 10px 0;}
.fn-tabel{margin:16px 0 20px;overflow-x:auto;border:1px solid var(--rand);border-radius:12px;}
.fn-tabel table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.4;}
.fn-tabel th,.fn-tabel td{padding:10px 12px;border-bottom:1px solid var(--rand);text-align:left;vertical-align:top;min-width:90px;}
.fn-tabel th{background:var(--offwit);font-family:var(--kop);font-weight:600;color:var(--navy);}
.fn-tabel tr:last-child td{border-bottom:0;}
.fn-artikel-cta{margin-top:40px;padding:24px 20px;border-radius:18px;background:var(--gloed),var(--nacht);color:var(--wit);}
.fn-artikel-cta h2{margin:0;color:var(--wit);}
.fn-artikel-cta p{margin:10px 0 0;color:rgba(255,255,255,.82);}
/* lezen: leesversie van een pdf (kop met beeld, kicker, genummerde lijsten, cijferkaarten, kaders, checklist, bronnen) */
.lz-kop{display:grid;gap:20px;}
.lz-beeld img{width:100%;max-width:280px;border-radius:12px;box-shadow:0 12px 30px rgba(13,19,37,.16);}
.fn-artikel .lz-eyebrow{margin:44px 0 0;font:600 13px/1.2 var(--kop);letter-spacing:.08em;text-transform:uppercase;color:#00A06B;}
.fn-artikel .lz-eyebrow+h2{margin-top:8px;}
.lz-nr{display:inline-grid;place-items:center;width:1.5em;height:1.5em;margin-right:.2em;border-radius:8px;background:var(--navy);color:var(--limoen);font-size:.85em;vertical-align:.08em;}
.fn-artikel sup{font-size:.68em;line-height:0;color:#00A06B;font-weight:600;}
.fn-artikel ol{margin:0 0 16px;display:grid;gap:10px;}
.fn-artikel ol>li{padding-left:36px;}
.fn-artikel ol>li::before{content:counter(list-item);left:0;top:.05em;width:26px;height:26px;border-radius:7px;display:grid;place-items:center;background:var(--limoen);color:var(--navy);font:600 14px/1 var(--kop);}
.fn-artikel ul.lz-vink{gap:0;border-top:1px solid var(--rand);}
.fn-artikel .lz-vink li{padding:10px 0 10px 32px;border-bottom:1px solid var(--rand);}
.fn-artikel .lz-vink li::before{top:12px;width:18px;height:18px;border:2px solid var(--navy);border-radius:5px;background:transparent;box-sizing:border-box;}
.lz-checklist ol{gap:0;border-top:2px solid var(--navy);}
.lz-checklist ol>li{padding:8px 0 8px 36px;border-bottom:1px solid var(--rand);}
.lz-checklist ol>li::before{top:8px;}
.lz-checklist h3{font-size:16px;letter-spacing:.04em;text-transform:uppercase;}
.lz-cijfers{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:4px 0 18px;}
.fn-artikel .lz-cijfers p{margin:0;padding:16px;border:1px solid var(--rand);border-radius:12px;background:var(--offwit);font-size:15px;line-height:1.4;}
.lz-cijfers b{display:block;margin-bottom:4px;font-size:28px;line-height:1.1;color:#00A06B;}
.lz-kaders{display:grid;gap:12px;margin:4px 0 16px;}
.fn-artikel .lz-kader{margin:0 0 16px;padding:16px 18px;border-radius:14px;border:1px solid #9FEFD2;background:var(--accent-zacht);}
.lz-kaders .lz-kader{margin:0;}
.fn-artikel .lz-kader p:last-child{margin-bottom:0;}
.fn-artikel .lz-kader--geel{border-color:#E4F28A;background:#F8FDE0;}
.fn-artikel .lz-kader--donker{border:0;background:var(--nacht);color:rgba(255,255,255,.85);}
.lz-kader--donker b{color:var(--wit);}
.fn-artikel .lz-kader .lz-kader-kop{margin-bottom:6px;font:600 13px/1.3 var(--kop);letter-spacing:.06em;text-transform:uppercase;color:#00704B;}
.lz-kader--geel .lz-kader-kop{color:var(--navy)!important;}
.lz-geel{color:#FFC400!important;margin-right:6px;text-transform:uppercase;letter-spacing:.04em;}
.lz-rood{color:var(--rood);}
.lz-bronnen{font-size:14.5px;line-height:1.45;}
.lz-bronnen a{overflow-wrap:anywhere;}
.lz-bronnen>li::before{background:var(--offwit);box-shadow:inset 0 0 0 1px var(--rand);font-size:12px;}
@media (min-width:760px){
  .lz-kop{grid-template-columns:minmax(0,1fr) 260px;align-items:center;gap:36px;}
  .lz-beeld{order:2;}
  .lz-kaders{grid-template-columns:1fr 1fr;}
}

/* ===== Cookiebalk ===== */
.fn-cookie{position:fixed;left:12px;right:12px;bottom:12px;z-index:60;max-width:560px;margin-inline:auto;padding:16px;border-radius:16px;background:var(--nacht);color:var(--wit);box-shadow:0 12px 40px rgba(0,0,0,.35);font-size:14.5px;line-height:1.45;border:1px solid rgba(255,255,255,.1);}
.fn-cookie p{color:rgba(255,255,255,.88);}
.fn-cookie a{color:var(--wit);}
.fn-cookie-knoppen{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;}
.fn-cookie-knoppen button{min-height:46px;border-radius:10px;border:2px solid var(--wit);background:transparent;color:var(--wit);font:600 16px/1 var(--kop);cursor:pointer;}
.fn-cookie-knoppen button:hover{background:rgba(255,255,255,.1);}

/* ===== Groter scherm ===== */
@media (min-width:760px){
  .fn-in{padding-inline:32px;}
  .fn-h1{font-size:52px;}
  .fn-h2{font-size:36px;}
  .fn-kop .fn-in{height:72px;}
  .fn-kop img{height:26px;}
  .fn-hero{padding:40px 0 72px;}
  .fn-hero-grid{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);grid-template-areas:"e c" "k c" "s c" "b c" "a c";grid-template-rows:auto auto auto auto 1fr;column-gap:64px;}
  .fn-hero-grid.zonder-cover{grid-template-columns:minmax(0,1fr);max-width:820px;}
  .fn-hero-cover{margin-top:0;align-self:center;justify-self:center;width:290px;}
  .fn-hero .fn-lead{font-size:20px;}
  .fn-hero-knop,.fn-hero-noot,.fn-hero-trust{max-width:430px;}
  .fn-hero-noot,.fn-hero-trust{text-align:left;justify-content:flex-start;}
  .fn-sectie{padding:76px 0;}
  .fn-form-sectie{padding:60px 0 68px;}
  .fn-form{padding:32px;max-width:620px;margin-inline:auto;}
  .fn-kaarten{grid-template-columns:1fr 1fr;}
  .fn-reviews{grid-template-columns:1fr 1fr;}
  .fn-team:has(> figure:nth-child(3)){gap:26px 20px;}
  .fn-team:has(> figure:nth-child(3)) figcaption{font-size:16px;}
  .fn-team:has(> figure:nth-child(3)) figcaption span{font-size:14px;}
  .fn-inkijk{margin:30px 0 0;padding:6px 0 10px;overflow:visible;}
  .fn-inkijk figure{flex:1;}
  .fn-inkijk figure:nth-child(2){transform:translateY(-10px);}
  .fn-cijfer b{font-size:30px;}
  .fn-afsluiter{padding:72px 0;}
  .fn-sticky{display:none;}
  body.fn-sticky-ruimte .fn-voet{padding-bottom:36px;}
  .fn-bedankt{padding:52px 0 64px;}
  .fn-bedankt .fn-h1{font-size:46px;}
  .fn-bedankt-grid{grid-template-columns:minmax(0,1fr) 200px;align-items:center;gap:48px;}
  .fn-bedankt-cover{width:200px;}
  .fn-knoppen{grid-template-columns:auto auto;justify-content:start;}
  .fn-knoppen .fn-knop{width:auto;}
  .fn-quiz-intro{padding:44px 0 60px;}
  .fn-quiz-intro-grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);align-items:center;gap:56px;}
  .fn-meter{width:100%;max-width:300px;margin:0 auto;}
  .fn-quiz-scherm{max-width:720px;padding-top:34px;}
  .fn-quiz-kaart{padding:28px 32px 32px;}
  .fn-vraag{font-size:30px;}
  .fn-uitslag-kop{padding:44px 0 60px;}
  .fn-gauge{width:320px;}
  .fn-gauge-getal b{font-size:84px;}
  .fn-boek{padding:24px;}
  .fn-artikel h1{font-size:44px;}
  .fn-cookie{left:24px;right:auto;bottom:24px;}
}
/* ===== Afspraak in stappen (fn-stappen): kaart direct onder een compacte hero, tijden als knoppen ===== */
.fn-hero--compact{padding:18px 0 56px;}
.fn-hero--compact .fn-h1{font-size:29px;line-height:1.12;}
.fn-hero--compact .fn-lead{font-size:16.5px;}
.fn-hero--compact .fn-hero-sub{margin-top:10px;}
.fn-hero--compact .fn-hero-trust{margin-top:12px;justify-content:flex-start;}
.fn-stappen-sectie{position:relative;z-index:2;margin-top:-40px;padding-bottom:40px;}
.fn-stappen{max-width:640px;margin-inline:auto;}
.fn-stappen .fn-voortgang{flex-direction:column-reverse;align-items:stretch;gap:8px;}   /* lange tekst ("Nog 3 korte vragen, ...") boven de balk */
.fn-stappen .fn-voortgang span{font-size:13.5px;line-height:1.3;}
.fn-stappen .fn-voortgang-balk{flex:none;}
.fn-st-gekozen{display:inline-flex;align-items:center;flex-wrap:wrap;gap:4px 10px;margin-top:12px;padding:6px 12px;border-radius:99px;background:var(--accent-zacht);font:600 14px/1.3 var(--kop);color:var(--navy);}
.fn-st-link{border:0;background:none;padding:4px 0;color:var(--slate);font:600 15px/1.4 var(--kop);text-align:left;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:3px;cursor:pointer;}
.fn-st-gekozen .fn-st-link{padding:0;font-size:13.5px;}
.fn-st-laden{margin-top:16px;color:var(--grijs);font-size:15px;}
.fn-st-melding{margin-top:14px;padding:10px 12px;border-radius:10px;background:var(--rood-zacht);color:var(--rood);font-size:15px;}
.fn-st-dagen{display:flex;gap:8px;margin:16px -16px 0;padding:0 16px 4px;overflow-x:auto;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.fn-st-dagen::-webkit-scrollbar{display:none;}
.fn-st-dagen.is-alles{flex-wrap:wrap;overflow:visible;}
.fn-st-dag{flex:none;min-width:78px;min-height:60px;padding:8px 10px;border:1.5px solid #D5DAE3;border-radius:12px;background:var(--wit);color:var(--ink);text-align:center;cursor:pointer;scroll-snap-align:start;transition:border-color .15s ease,background-color .15s ease;}
.fn-st-dag b{display:block;font:600 16px/1.2 var(--kop);text-transform:capitalize;}
.fn-st-dag small{display:block;margin-top:2px;font-size:13.5px;line-height:1.2;color:var(--grijs);}
.fn-st-dag.is-gekozen{border-color:var(--nacht);background:var(--nacht);color:var(--wit);}
.fn-st-dag.is-gekozen small{color:var(--accent);}
.fn-st-tijden{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px;}
.fn-st-tijd{min-height:52px;border:1.5px solid #D5DAE3;border-radius:12px;background:var(--wit);color:var(--ink);font:600 16.5px/1 var(--kop);cursor:pointer;transition:border-color .15s ease,background-color .15s ease;}
.fn-st-tijd:hover,.fn-st-dag:hover{border-color:var(--nacht);}
.fn-st-tijd.is-gekozen{border-color:var(--nacht);background:var(--accent-zacht);}
.fn-st-opties{display:grid;gap:8px;margin-top:4px;}
.fn-st-optie{min-height:52px;padding:12px 14px;border:1.5px solid #D5DAE3;border-radius:12px;background:var(--wit);color:var(--ink);font:600 16px/1.3 var(--kop);text-align:left;cursor:pointer;transition:border-color .15s ease,background-color .15s ease;}
.fn-st-optie:hover{border-color:var(--nacht);}
.fn-st-optie.is-gekozen{border-color:var(--nacht);background:var(--accent-zacht);}
.fn-st-form .fn-veld[data-st-veld="extra"] label{display:block;}
.fn-st-meer,.fn-st-verder{grid-column:1/-1;}
.fn-st-meer{justify-self:start;}
.fn-st-uitwegen{display:grid;gap:6px;margin-top:18px;padding-top:12px;border-top:1px solid var(--rand);}
.fn-st-avond{margin-top:16px;}
.fn-st-avond .fn-knop{margin-top:14px;}
.fn-st-form .fn-veld label{margin:10px 0 0;font:600 23px/1.2 var(--kop);letter-spacing:-.02em;color:var(--ink);}
.fn-st-form .fn-veld .fn-vraag-hulp{margin:6px 0 14px;}
.fn-st-form .fn-knop{margin-top:16px;}
.fn-st-klaar{padding:14px 0 6px;text-align:center;}
.fn-st-klaar .fn-vinkje{margin:0 auto 14px;}
.fn-st-klaar p{margin-top:8px;color:var(--slate);}
.fn-st-onder{margin-top:12px;text-align:center;font-size:14px;color:var(--grijs);}
.fn-afspraak{display:grid;grid-template-columns:72px minmax(0,1fr);gap:0 16px;align-items:center;margin-top:24px;padding:18px;border-radius:18px;background:var(--wit);color:var(--ink);box-shadow:0 20px 50px rgba(0,0,0,.28);}
.fn-afspraak.zonder-foto{grid-template-columns:minmax(0,1fr);}
.fn-afspraak-foto{width:72px;height:72px;border-radius:50%;object-fit:cover;object-position:50% 20%;background:var(--lila);}
.fn-afspraak-dag{font:600 13px/1.2 var(--kop);letter-spacing:.06em;text-transform:uppercase;color:var(--grijs);}
.fn-afspraak-tijd{margin-top:4px;font:600 26px/1.1 var(--kop);letter-spacing:-.02em;color:var(--ink);}
.fn-afspraak-met{margin-top:4px;font-size:15px;color:var(--slate);}
.fn-afspraak-voet{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;margin-top:16px;padding-top:14px;border-top:1px solid var(--rand);font-size:14.5px;color:var(--grijs);overflow-wrap:anywhere;}
.fn-donker .fn-afspraak-voet a{color:var(--navy);text-decoration-color:var(--accent);}
.fn-afspraak-stappen-kop{margin-top:28px;color:var(--wit);font-size:19px;}
.fn-afspraak-stappen{display:grid;gap:12px;margin-top:14px;counter-reset:afs;}
.fn-afspraak-stappen:empty{display:none;}
.fn-afspraak-stappen li{position:relative;padding-left:40px;color:rgba(255,255,255,.86);font-size:16px;line-height:1.45;counter-increment:afs;}
.fn-afspraak-stappen li::before{content:counter(afs);position:absolute;left:0;top:-1px;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:rgba(0,255,171,.14);color:var(--accent);font:600 14px/1 var(--kop);}
@media (min-width:760px){.fn-afspraak{padding:22px 24px;}.fn-afspraak-tijd{font-size:30px;}}
@media (min-width:760px){
  .fn-hero--compact{padding:32px 0 76px;}
  .fn-hero--compact .fn-h1{font-size:42px;}
  .fn-hero--compact .fn-lead{font-size:18px;}
  .fn-stappen-sectie{margin-top:-52px;padding-bottom:56px;}
  .fn-st-dagen{flex-wrap:wrap;overflow:visible;margin-inline:0;padding-inline:0;}
  .fn-st-tijden{grid-template-columns:repeat(4,minmax(0,1fr));}
}
@media (min-width:1100px){
  .fn-hero--compact .fn-h1{font-size:48px;}
}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important;}}
.fn-meter-boog{animation:fn-boog 1.4s .2s ease-out both;}
.fn-meter-naald{transform-box:view-box;transform-origin:100px 100px;animation:fn-naald 1.4s .2s ease-out both;}
@keyframes fn-boog{from{stroke-dashoffset:251.3;}to{stroke-dashoffset:88;}}
@keyframes fn-naald{from{transform:rotate(0deg);}to{transform:rotate(118deg);}}
.fn-knoppen:empty{display:none;}

/* aanvraag in twee schermen (fn-aanvraag, 19-10-2026) */
.fn-aanvraag{position:relative;}
.fn-aanvraag .fn-av-velden{margin-top:16px;}
@media (min-width:640px){.fn-aanvraag .fn-av-velden{grid-template-columns:1fr 1fr;}}
.fn-aanvraag .fn-knop{margin-top:18px;width:100%;}
.fn-av-plekken{margin:0 0 14px;}
.fn-aanvraag .fn-av-terug{display:block;margin:14px auto 0;}
.fn-av-agenda{margin-top:22px;padding-top:18px;border-top:1px solid rgba(23,27,43,.1);text-align:left;}
.fn-av-agenda-kop{margin:0 0 4px;font:600 19px/1.3 var(--kop);color:var(--navy);}
.fn-av-agenda .fn-st-melding{margin-top:12px;}

/* kale afspraakpagina's (21-10): alleen de H1 boven de kaart */
.fn-hero-sub:empty,.fn-hero-bullets:empty,.fn-hero-acties:empty{display:none}
.fn-aanvraag .fn-av-velden{margin-top:4px}
.fn-aanvraag .fn-av-plekken{margin-bottom:12px}

/* afspraakpagina's (21-10): kop + kaart + punten in één blok; telefoon gestapeld, vanaf 820 px twee kolommen */
.fn-av-sectie{margin-top:0;padding:18px 0 44px;}
.fn-av-grid{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"kop" "kaart" "meer";gap:16px;align-items:start;}
.fn-av-kop{grid-area:kop;}
.fn-av-kop .fn-chip{margin-bottom:12px;}
.fn-av-h1{margin:0;font-size:30px;line-height:1.1;}
.fn-aanvraag{grid-area:kaart;}
.fn-av-meer{grid-area:meer;display:flex;flex-direction:column;gap:12px;}
.fn-av-punten{margin-top:4px;}
.fn-av-punten li{font-size:16px;}
.fn-av-trust{display:flex;align-items:center;gap:8px;margin:0;font-size:14px;color:rgba(255,255,255,.75);}
.fn-av-onder{color:rgba(255,255,255,.65);}
@media (min-width:600px){.fn-av-h1{font-size:36px;}.fn-aanvraag{max-width:640px;width:100%;justify-self:center;}}
@media (min-width:820px){
  .fn-av-sectie{padding:40px 0 56px;}
  .fn-av-grid{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);grid-template-areas:"kop kaart" "meer kaart";column-gap:44px;row-gap:22px;}
  .fn-aanvraag{max-width:none;justify-self:stretch;}
  .fn-av-h1{font-size:40px;}
  .fn-av-kop{padding-top:8px;}
}
@media (min-width:1100px){.fn-av-h1{font-size:46px;}.fn-av-grid{column-gap:64px;}}

/* 21-10: kaart op de telefoon zo breed als de kolom, velden vullen de kaart */
.fn-av-grid > .fn-aanvraag{width:100%;max-width:640px;justify-self:center;margin:0;}
.fn-aanvraag .fn-veld input{width:100%;box-sizing:border-box;}
@media (min-width:820px){.fn-av-grid > .fn-aanvraag{max-width:none;justify-self:stretch;}}

/* CRO-ronde 21-10: labels in de aanvraagkaart lichter (23 -> 18 px), vertrouwensregel direct onder knop 1 */
.fn-aanvraag .fn-veld label{font-size:18px;margin-top:6px;}
.fn-aanvraag .fn-av-form .fn-st-onder{margin:12px 0 0;font-size:14px;line-height:1.4;text-align:center;}

/* 21-10 middag: kaart sterker, portret + belbelofte + sterren onder knop 1 */
.fn-aanvraag .fn-av-form .fn-av-tussen{display:flex;align-items:center;gap:12px;text-align:left;margin:14px 0 0;}
.fn-av-portret{width:44px;height:44px;border-radius:50%;object-fit:cover;flex:none;}
.fn-aanvraag .fn-av-trust{justify-content:center;margin:12px 0 0;color:var(--grijs);}
.fn-aanvraag .fn-av-trust .fn-sterren{font-size:15px;}