@font-face{font-family:B;src:url(fonts/BricolageGrotesque-Variable.woff2) format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:F;src:url(fonts/Figtree-Variable.woff2) format("woff2");font-weight:300 900;font-display:swap}
:root{--g:#12161C;--g2:#1E242C;--kalk:#EEF0EC;--room:#F7F7F3;--steen:#E4E7E1;--lijn:#D6DAD3;--lei:#5A6472;--groen:#1F9D55;--groenL:#3DD07F;--oranje:#E8A317;--rood:#C2412D;--tg:#1A6B3D;--tr:#B23A27}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--kalk);color:var(--g);font-family:F,system-ui,sans-serif;font-size:17px;line-height:1.55}
.wrap{max-width:760px;margin:0 auto;padding:0 20px}
.dot{display:inline-block;width:10px;height:10px;border-radius:999px;flex-shrink:0;vertical-align:middle}
.dot.g{background:var(--groen)} .dot.o{background:var(--oranje)} .dot.r{background:var(--rood)}
.cover{background:var(--g);color:var(--room);padding:30px 0 34px;border-radius:0 0 28px 28px}
.cover .dot.g{background:var(--groenL)}
.top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:30px}
.logo{width:210px;height:auto;display:block}
.dots{display:flex;gap:6px} .dots .dot{width:13px;height:13px}
.eyebrow{display:flex;align-items:center;gap:8px;margin:0;font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--groenL)}
h1{font-family:B,"Arial Black",sans-serif;font-weight:800;letter-spacing:-.03em;line-height:1.05;font-size:clamp(32px,6vw,46px);margin:12px 0 12px}
.lead{margin:0;color:#C9CFD5;font-size:16px;max-width:600px}
main{padding-top:22px;padding-bottom:40px}
.privacy{display:flex;gap:10px;align-items:flex-start;background:var(--room);border-radius:14px;padding:12px 16px;font-size:14px;color:var(--lei)}
.privacy p{margin:0} .privacy .dot{margin-top:7px}
.progress{position:sticky;top:0;z-index:5;background:var(--kalk);padding:12px 0;display:flex;align-items:center;gap:12px;font-size:13px;color:var(--lei)}
.bar{flex:1;height:8px;background:var(--steen);border-radius:999px;overflow:hidden}
.bar span{display:block;height:100%;width:0;background:var(--groen);transition:width .3s}
.sec{margin-top:18px}
.sech{display:flex;align-items:center;gap:10px;margin:8px 0 12px}
.secn{min-width:30px;height:30px;padding:0 8px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font:800 14px B,sans-serif}
h2{font-family:B,sans-serif;font-weight:800;letter-spacing:-.02em;font-size:24px;margin:0}
fieldset.q{border:2px solid transparent;background:var(--room);border-radius:18px;padding:16px 18px;margin:0 0 12px}
fieldset.q.missing{border-color:var(--rood)}
legend{float:left;width:100%;padding:0;display:flex;gap:10px;margin-bottom:4px}
legend + *{clear:both}
.qn{font:800 16px B,sans-serif;color:var(--tg);min-width:22px}
.qt{font-weight:700;font-size:16px;line-height:1.35}
.hint{clear:both;margin:0 0 4px 32px;font-size:13px;color:var(--lei)}
.opts{clear:both;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;margin-top:10px}
.opt{display:flex;align-items:center;gap:10px;min-height:46px;padding:8px 12px;border:1.5px solid var(--lijn);border-radius:12px;background:var(--kalk);cursor:pointer;font-size:15px;line-height:1.3}
.opt input{width:20px;height:20px;margin:0;accent-color:var(--g);flex-shrink:0}
.opt:has(input:checked){border-color:var(--g);background:var(--steen)}
.andere,textarea,.fld input,.kort{width:100%;font:inherit;font-size:16px;padding:11px 12px;border:1.5px solid var(--lijn);border-radius:12px;background:var(--kalk);color:var(--g);margin-top:8px}
.kort{max-width:180px;margin-top:10px}
textarea{clear:both;display:block;resize:vertical}
.scale{clear:both;display:flex;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap}
.sl{font-size:13px;color:var(--lei);min-width:90px}
.sbtn{display:flex;gap:8px}
.sc input{position:absolute;opacity:0;pointer-events:none}
.sc span{display:inline-flex;width:46px;height:46px;align-items:center;justify-content:center;border-radius:999px;border:1.5px solid var(--lijn);background:var(--kalk);font-weight:800;cursor:pointer}
.sc input:checked + span{background:var(--g);color:var(--room);border-color:var(--g)}
.sc input:focus-visible + span{outline:3px solid var(--tg);outline-offset:2px}
.pitch{background:var(--steen);border-radius:16px;padding:14px 16px;font-size:15px;margin-bottom:12px}
.pitch .i{display:inline-flex;align-items:center;gap:5px;margin-right:4px;white-space:nowrap}
.grid3{clear:both;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
@media (max-width:640px){.grid3{grid-template-columns:1fr}.sl{min-width:auto;width:100%}}
.fld span{font-size:13px;color:var(--lei)}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--lei);margin-top:14px}
.consent input{width:20px;height:20px;margin:1px 0 0;accent-color:var(--g);flex-shrink:0}
.err{color:var(--tr);font-weight:700;font-size:14px;margin:10px 0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.knop{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;border-radius:999px;border:0;background:var(--g);color:var(--room);font:700 16px F,sans-serif;cursor:pointer;margin-top:8px;width:100%}
.knop:hover{background:#000}
:focus-visible{outline:3px solid var(--tg);outline-offset:3px}
footer{border-top:1px solid var(--lijn);padding:18px 0 28px;font-size:12px;color:var(--lei)}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 20px}
.bedankt{min-height:100vh;display:flex;align-items:center;background:var(--g);color:var(--room)}
.bedankt .wrap{padding-top:40px;padding-bottom:40px}
.bedankt p{color:#C9CFD5;font-size:17px;max-width:560px}
.bedankt a{color:var(--room)}