:root { --navy:#16233D; --navy-deep:#0E1729; --coral:#E8957D; --coral-soft:#FBE7E0; --coral-ink:#9A3412; --cream:#F6F2EA; --ink:#16233D; --muted:#5A6478; --line:#ECE5D8;
  --t-letsel:#FBE7E0; --t-boete:#E3E8F2; --t-arbeid:#E7EDE4; --t-rijbewijs:#F4ECD8; --t-offline:#ECE6F4; }
* { box-sizing:border-box; margin:0; padding:0; }
body { font-family:'Manrope',-apple-system,sans-serif; background:var(--cream); color:var(--ink); line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
h1,h2 { font-family:'Fraunces',Georgia,serif; font-weight:600; color:var(--navy); letter-spacing:-0.01em; }
.wrap { max-width:820px; margin:0 auto; padding:0 24px; }
nav.top .wrap { max-width:1120px; }
.icon { width:1em; height:1em; flex-shrink:0; }
.logo { display:flex; align-items:center; gap:10px; font-weight:700; font-size:22px; color:var(--navy); }
.badge { width:56px; height:56px; border-radius:50%; background:var(--navy); padding:3px; display:flex; flex-shrink:0; }
.badge span { flex:1; border-radius:50%; border:2px solid var(--cream); display:flex; align-items:center; justify-content:center; }
.badge svg { width:38px; height:38px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 22px; border-radius:14px; font-weight:700; font-size:15.5px; transition:transform .12s, background .15s; }
.btn:hover { transform:translateY(-1px); }
.btn-navy { background:var(--navy); color:#fff; } .btn-navy:hover { background:var(--navy-deep); }
.btn-coral { background:var(--coral); color:var(--navy); } .btn-coral:hover { background:#DD8267; }
nav.top { position:sticky; top:0; z-index:20; background:rgba(246,242,234,0.92); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
nav.top .wrap { display:flex; align-items:center; justify-content:space-between; height:76px; gap:16px; }
.nav-right { display:flex; align-items:center; gap:18px; }
.nav-login { font-weight:700; font-size:15px; }
.nav-right .btn { padding:11px 18px; font-size:14.5px; border-radius:12px; }
.crumbs { font-size:13.5px; color:var(--muted); margin:18px 0 26px; }
.crumbs a { text-decoration:underline; } .crumbs span { margin:0 6px; }
.tile { width:48px; height:48px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:24px; color:var(--navy); flex-shrink:0; }
.tile.big { width:56px; height:56px; font-size:28px; margin-bottom:18px; }
.head h1 { font-size:46px; line-height:1.1; margin-bottom:16px; }
.lead { font-size:18px; color:var(--muted); margin-bottom:26px; }
.actions { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.chip { font-size:13px; font-weight:700; padding:6px 12px; border-radius:999px; background:#E7EDE4; color:#2F5A1A; }
.deadline { display:flex; gap:14px; align-items:flex-start; background:var(--coral-soft); color:var(--coral-ink); border-radius:18px; padding:18px 20px; margin:36px 0 18px; }
.deadline .icon { font-size:24px; margin-top:2px; }
.deadline b { display:block; font-size:15.5px; } .deadline p { font-size:15.5px; }
.card { background:#fff; border:1px solid var(--line); border-radius:22px; padding:26px; margin-bottom:18px; }
.card h2, .faq h2, .related h2 { font-size:26px; margin-bottom:14px; }
.card p { font-size:16px; color:var(--muted); }
.intro p + p { margin-top:12px; }
.ticks { list-style:none; display:grid; gap:10px; }
.ticks li { display:flex; gap:10px; align-items:flex-start; font-size:16px; }
.ticks .icon { color:#3F7A2A; font-size:19px; margin-top:3px; }
.steps { list-style:none; display:grid; gap:14px; }
.steps li { display:flex; gap:14px; align-items:flex-start; font-size:16px; }
.steps .n { width:30px; height:30px; border-radius:50%; background:var(--navy); color:#fff; font-weight:800; font-size:14px; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.steps li:nth-child(2) .n { background:var(--coral); color:var(--navy); }
.faq { margin:36px 0 18px; background:#fff; border:1px solid var(--line); border-radius:22px; padding:26px 26px 10px; }
.faq details { border-top:1px solid #F0EBE1; }
.faq summary { list-style:none; cursor:pointer; display:flex; justify-content:space-between; gap:16px; padding:16px 0; font-weight:700; font-size:16px; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:'+'; font-size:22px; color:var(--coral-ink); line-height:1; }
.faq details[open] summary::after { content:'\2212'; }
.faq details p { padding:0 0 16px; color:var(--muted); font-size:15.5px; }
.cta { background:var(--navy); border-radius:26px; padding:36px; display:flex; justify-content:space-between; align-items:center; gap:24px; margin:36px 0; }
.cta h2 { color:#fff; font-size:28px; margin-bottom:6px; } .cta p { color:rgba(255,255,255,0.72); }
.cta .btn { flex-shrink:0; }
.rels { display:grid; gap:10px; }
.rel { display:flex; align-items:center; gap:14px; background:#fff; border:1px solid var(--line); border-radius:16px; padding:12px 16px; font-weight:700; }
.rel .tile { width:40px; height:40px; font-size:20px; border-radius:12px; }
.rel .go { margin-left:auto; color:var(--muted); }
.rel:hover { border-color:#DCD3C3; }
.small { font-size:13px; color:var(--muted); margin:24px 0 8px; }
footer { padding:32px 0 40px; margin-top:24px; border-top:1px solid var(--line); }
footer .wrap { max-width:1120px; }
.legal { font-size:13px; color:var(--muted); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.legal a { text-decoration:underline; }
@media (max-width:620px) {
  .wrap { padding:0 16px; }
  nav.top .wrap { height:66px; }
  .logo { font-size:19px; gap:8px; } .badge { width:48px; height:48px; } .badge svg { width:33px; height:33px; }
  .nav-login { display:none; } .nav-right .btn { padding:10px 14px; font-size:13.5px; }
  .head h1 { font-size:34px; } .lead { font-size:16.5px; }
  .actions .btn { width:100%; }
  .card, .faq { padding:20px; } .card h2, .faq h2, .related h2 { font-size:22px; }
  .cta { flex-direction:column; align-items:flex-start; padding:26px 20px; } .cta .btn { width:100%; }
}
