@font-face{font-family:'Fraunces';font-weight:500 700;font-display:swap;src:url(/assets/fraunces.woff2) format('woff2')}
@font-face{font-family:'Archivo';font-weight:400 800;font-display:swap;src:url(/assets/archivo.woff2) format('woff2')}
@font-face{font-family:'Garamond';font-weight:400 600;font-display:swap;src:url(/assets/garamond.woff2) format('woff2')}
@font-face{font-family:'Spectral';font-weight:300 600;font-display:swap;src:url(/assets/spectral.woff2) format('woff2')}
@font-face{font-family:'Figtree';font-weight:400 700;font-display:swap;src:url(/assets/figtree.woff2) format('woff2')}
@font-face{font-family:'PublicSans';font-weight:400 700;font-display:swap;src:url(/assets/publicsans.woff2) format('woff2')}
:root{color-scheme:light only;--kaart:#fff;--ink:#191C1F;--ink2:#474E54;--grijs:#7B828A;
--lijn:#E3E0DA;--lijn2:#F0EDE8}
*{box-sizing:border-box}
html{background:var(--papier);-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--papier);color:var(--ink);font-family:var(--tekst);
font-size:16.5px;line-height:1.66;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.w{max-width:1080px;margin:0 auto;padding:0 22px}
h1,h2,h3,h4{margin:0;font-family:var(--kop);font-weight:700;letter-spacing:-.022em;line-height:1.16;text-wrap:balance}
p{margin:0 0 1em}a{color:inherit}
.lbl{display:block;font-family:var(--tekst);font-size:.68rem;font-weight:700;letter-spacing:.2em;
text-transform:uppercase;color:var(--acc)}
.strook{background:var(--zacht);border-bottom:1px solid var(--lijn);font-size:.75rem;padding:9px 0;color:var(--ink2)}
.strook .w{display:flex;gap:12px;flex-wrap:wrap;justify-content:space-between}
.strook b{color:var(--acc)}
.nav{position:sticky;top:0;z-index:20;background:var(--papier);border-bottom:1px solid var(--lijn2)}
.nav .w{display:flex;align-items:center;gap:16px;min-height:72px}
.merk{font-family:var(--kop);font-weight:700;font-size:1.2rem;text-decoration:none;margin-right:auto}
.nav nav{display:flex;gap:3px}
.nav nav a{font-size:.85rem;text-decoration:none;color:var(--ink2);padding:9px 13px}
.nav nav a:hover{color:var(--acc)}
.bel{font-weight:700;font-size:.84rem;text-decoration:none;background:var(--acc);color:#fff;
padding:11px 18px;border-radius:6px;white-space:nowrap}
@media(max-width:820px){.nav nav{display:none}}
section{padding:clamp(52px,7vw,96px) 0}
.zand{background:var(--zacht)}
.hero{padding:clamp(46px,6vw,84px) 0}
.hero h1{font-size:clamp(2rem,4.8vw,3.4rem);margin:16px 0 18px;max-width:20ch}
.hero .ld{font-size:clamp(1rem,1.6vw,1.14rem);color:var(--ink2);max-width:54ch}
.acties{display:flex;gap:11px;flex-wrap:wrap;margin-top:26px}
.knop{font:inherit;font-family:var(--tekst);font-weight:700;font-size:.9rem;text-decoration:none;
padding:14px 26px;border:1.5px solid transparent;border-radius:6px;cursor:pointer;
display:inline-flex;align-items:center;justify-content:center;min-height:50px}
.knop.vol{background:var(--acc);color:#fff}
.knop.rand{border-color:var(--lijn);color:var(--ink);background:transparent}
.knop.breed{width:100%;margin-top:16px}
.doelen{margin-top:38px;padding-top:26px;border-top:1px solid var(--lijn)}
.dlbl{display:block;font-size:.68rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
color:var(--grijs);margin-bottom:12px}
.dr{display:flex;gap:9px;flex-wrap:wrap}
.doel{background:var(--kaart);border:1px solid var(--lijn);border-radius:22px;padding:10px 18px;
font-size:.89rem;text-decoration:none;color:var(--ink);transition:.16s;white-space:nowrap}
.doel:hover{border-color:var(--acc);color:var(--acc)}
.hero.met .w{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(28px,4vw,56px);align-items:center}
.hero.met .heroIn{min-width:0}
.heroFoto{border-radius:12px;overflow:hidden;aspect-ratio:4/3;background:var(--zacht)}
.heroFoto img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:900px){.hero.met .w{grid-template-columns:1fr}.heroFoto{aspect-ratio:16/10}}
.galerij{padding-top:0}
.gr{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,22px)}
@media(max-width:760px){.gr{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.gr{grid-template-columns:1fr}}
.gr figure{margin:0;border-radius:10px;overflow:hidden;aspect-ratio:4/3;background:var(--zacht)}
.gr img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.gr figure:hover img{transform:scale(1.03)}
@media(prefers-reduced-motion:reduce){.gr img{transition:none}.gr figure:hover img{transform:none}}
.kop{max-width:54ch;margin-bottom:clamp(28px,4vw,46px)}
.kop h2{font-size:clamp(1.7rem,3.6vw,2.5rem);margin:12px 0 12px}
.kop p{color:var(--grijs);margin:0}
.r4{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(18px,2.4vw,30px)}
.r2{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(26px,4vw,54px)}
@media(max-width:900px){.r4{grid-template-columns:1fr 1fr}.r2{grid-template-columns:1fr}}
@media(max-width:560px){.r4{grid-template-columns:1fr}}
.d{border-top:2px solid var(--lijn);padding-top:20px}
.d h3{font-size:1.14rem;margin-bottom:8px}
.d p{font-size:.9rem;color:var(--grijs);margin:0}
.kiezer{background:var(--kaart);border:1px solid var(--lijn);border-radius:12px;padding:clamp(20px,3vw,30px)}
.opts{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:22px}
@media(max-width:640px){.opts{grid-template-columns:1fr 1fr}}
.opts button{font:inherit;font-family:var(--tekst);font-size:.9rem;font-weight:600;padding:14px 12px;
background:var(--papier);border:1.5px solid var(--lijn);border-radius:7px;cursor:pointer;color:var(--ink);
min-height:50px;transition:.16s}
.opts button[aria-pressed="true"]{background:var(--acc);border-color:var(--acc);color:#fff}
.uitkomst{border-left:3px solid var(--acc);padding:4px 0 4px 18px}
.uitkomst h4{font-size:1.16rem;margin-bottom:7px}
.uitkomst p{font-size:.96rem;color:var(--ink2);margin:0;max-width:64ch}
.va details{border-bottom:1px solid var(--lijn)}
.va details:first-of-type{border-top:1px solid var(--lijn)}
.va summary{cursor:pointer;padding:19px 0;font-family:var(--kop);font-weight:700;font-size:1.06rem;
list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;min-height:48px}
.va summary::-webkit-details-marker{display:none}
.va summary::after{content:"+";color:var(--acc);font-family:var(--tekst);font-size:1.25rem;font-weight:400;flex:none}
.va details[open] summary::after{content:"\2013"}
.va .a{padding:0 0 20px;color:var(--ink2);font-size:.96rem;max-width:70ch}
.velden{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:18px}
.velden .vol{grid-column:1/-1}
@media(max-width:560px){.velden{grid-template-columns:1fr}}
.velden label{display:block;font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--grijs)}
.velden input,.velden textarea{width:100%;margin-top:8px;padding:13px 14px;font:inherit;font-size:.96rem;
color:var(--ink);background:var(--kaart);border:1px solid var(--lijn);border-radius:6px;
text-transform:none;letter-spacing:normal;font-weight:400;resize:vertical}
.velden input:focus,.velden textarea:focus{outline:none;border-color:var(--acc)}
.gelukt{background:var(--kaart);border-left:3px solid var(--acc);padding:14px 16px;margin-top:14px;
font-size:.92rem;color:var(--ink2)}
.kaart{background:var(--kaart);border:1px solid var(--lijn);border-radius:11px;padding:26px;height:fit-content}
.kaart .nr{font-family:var(--kop);font-size:clamp(1.7rem,3.6vw,2.2rem);font-weight:700;color:var(--acc);
text-decoration:none;display:block;margin-top:10px}
.kaart .fijn{font-size:.92rem;color:var(--grijs);margin:14px 0 0}
footer{background:var(--ink);color:#9AA2A8;padding:34px 0;font-size:.84rem}
footer .w{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px}