/* Lettertype Inter, op de eigen site in plaats van bij Google Fonts: zo gaat het IP-adres van bezoekers niet naar Google
   (in Duitsland leidde dat tot Abmahnungen). Licentie: fonts/OFL.txt. Variabel lettertype: één bestand voor gewicht 400-800,
   met de tekensets latin (Nederlands, Duits, €) en latin-ext. */
@font-face { font-family: Inter; font-style: normal; font-weight: 400 800; font-display: swap; src: url(fonts/inter-latin.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: Inter; font-style: normal; font-weight: 400 800; font-display: swap; src: url(fonts/inter-latin-ext.woff2) format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
:root {
  --ink: #0f172a;
  --text: #475569;
  --muted: #64748b;
  --nav: #334155;
  --line: #e2e8f0;
  --line-soft: #f1f5f9;
  --soft: #f8fafc;
  --brand: #003082;
  --brand-dark: #00256a;
  --brand-tint: #eff6ff;
  --navy: #0f2a44;
  --footer: #0f172a;
  --accent: #f97316;
  --accent-dark: #ea580c;
  --danger: #ef4444;
  /* Kleuren die eerder vast in de regels stonden; de Duitse site overschrijft ze in de/kleuren.css */
  --surface: #f8fafc;
  --subtle: #94a3b8;
  --ring: #bfdbfe;
  --ring-soft: #dbeafe;
  --brand-wash: #f8faff;
  --note-line: #c7d7f5;
  --sheet-line: #eef2f7;
  --dot: #cbd5e1;
  --plate: #f6c935;
  --plate-ink: #111827;
  --hero-blob-1: rgba(239,246,255,.7);
  --hero-blob-2: rgba(219,234,254,.4);
  --cta-bg: linear-gradient(135deg, #0f2a44 0%, #10305a 100%);
  --footer-text: #94a3b8;
  --footer-muted: #64748b;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
/* Schaal van de hele site op desktop: 1 = oorspronkelijke grootte, lager = verder uitgezoomd. */
@media (min-width: 1024px) { html { zoom: 0.85; } }
body {
  margin: 0;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--text);
  background: #fff;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4 { color: var(--ink); margin: 0; letter-spacing: -0.025em; line-height: 1.1; }
p { margin: 0; }
a { color: inherit; text-decoration: none; }
svg { flex: none; }
.wrap { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.inner { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.narrow { max-width: 1000px; margin: 0 auto; padding: 0 24px; }
section { padding: 104px 0; }
.soft { background: var(--soft); }

.eyebrow { font-size: 12px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--brand); margin-bottom: 14px; }
.section-head { margin-bottom: 56px; }
.section-head h2 { font-size: clamp(2rem, 4.2vw, 3rem); font-weight: 700; letter-spacing: -0.035em; line-height: 1.05; max-width: 780px; }
.section-head h2 + p { font-size: 18px; max-width: 900px; margin-top: 20px; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  background: var(--brand); color: #fff; font: inherit; font-weight: 600; font-size: 16px;
  padding: 16px 28px; border: 0; border-radius: 8px; cursor: pointer;
  transition: background .2s ease;
}
.btn:hover { background: var(--brand-dark); }
.btn.sm { padding: 11px 20px; font-size: 16px; border-radius: 6px; }
.btn.block { width: 100%; border-radius: 12px; }
.btn.white { background: #fff; color: var(--ink); }
.btn.white:hover { background: var(--line-soft); }

/* Meldingsbalk + navigatie */
.notice { background: var(--navy); color: rgba(255,255,255,.8); font-size: 13.5px; text-align: center; padding: 8px 24px; }
header.nav { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid var(--line-soft); }
.nav .wrap { display: flex; align-items: center; justify-content: space-between; height: 72px; }
.logo { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 18px; color: var(--ink); letter-spacing: -0.01em; }
.logo-mark { width: 32px; height: 32px; border-radius: 8px; background: var(--brand); color: #fff; display: grid; place-items: center; }
.nav-links { display: flex; gap: 36px; font-size: 16.5px; font-weight: 500; color: var(--nav); }
.nav-links a:hover { color: var(--ink); }
.nav-right { display: flex; align-items: center; gap: 12px; }
.nav-toggle { display: none; background: none; border: 0; padding: 8px; cursor: pointer; color: var(--nav); }

/* Hero */
.hero { position: relative; overflow: hidden; padding: 0; }
.hero::before, .hero::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.hero::before { top: -96px; left: -160px; width: 560px; height: 560px; background: var(--hero-blob-1); }
.hero::after { bottom: -128px; left: -96px; width: 420px; height: 420px; background: var(--hero-blob-2); }
.hero .wrap { position: relative; z-index: 1; display: grid; grid-template-columns: 1.05fr 1fr; gap: 64px; align-items: center; padding-top: 96px; padding-bottom: 128px; }
.hero h1 { font-size: clamp(2rem, 5.2vw, 3.75rem); font-weight: 700; line-height: 1.08; letter-spacing: -0.035em; margin-bottom: 28px; }
.hero h1 span { color: var(--brand); }
.hero .lead { font-size: 18px; max-width: 42rem; margin-bottom: 40px; }
.hero .lead strong { color: var(--ink); font-weight: 600; }

.doc-stack { position: relative; width: 100%; max-width: 500px; margin-left: auto; aspect-ratio: 1 / 1.06; }
.sheet { position: absolute; inset: 0; background: #fff; border: 1px solid var(--line-soft); border-radius: 18px; box-shadow: 0 30px 60px -30px rgba(15,23,42,.2); }
.sheet.back { transform: rotate(3deg) translate(16px, 14px); }
.sheet.front { transform: rotate(-1.5deg); padding: 64px 52px; }
.sheet .l { display: block; height: 6px; border-radius: 3px; background: var(--sheet-line); margin-bottom: 14px; }
.sheet .l.gap { margin-top: 34px; }
.sheet .stamp { position: absolute; right: 44px; bottom: 56px; width: 64px; height: 64px; border-radius: 50%; border: 2px solid var(--line); color: var(--dot); display: grid; place-items: center; }

/* Kenmerkenbalk */
.trust { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); padding: 0; }
.trust .wrap { display: grid; grid-template-columns: repeat(4, 1fr); padding: 0; }
.trust-item { display: flex; align-items: center; gap: 16px; padding: 30px 24px; border-left: 1px solid var(--line-soft); }
.trust-item:first-child { border-left: 0; }
.icon-box { width: 44px; height: 44px; border-radius: 10px; background: var(--brand-tint); color: var(--brand); display: grid; place-items: center; flex: none; }
.icon-box.orange { background: #fff7ed; color: var(--accent-dark); }
.trust-item strong { display: block; color: var(--ink); font-weight: 600; font-size: 16px; line-height: 1.3; }
.trust-item span { font-size: 14px; color: var(--muted); }

/* Stappen */
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; }
.step-num { font-size: 5.5rem; font-weight: 800; line-height: 1; letter-spacing: -0.04em; color: #f1f5f9; margin-bottom: 18px; }
.step h3 { font-size: 22px; font-weight: 600; margin-bottom: 14px; }

/* Wat je krijgt */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.split h2 { font-size: clamp(2rem, 4.2vw, 3rem); font-weight: 700; letter-spacing: -0.035em; line-height: 1.05; margin-bottom: 24px; }
.split .lead { font-size: 18px; margin-bottom: 36px; }
.checks { list-style: none; padding: 0; margin: 0; display: grid; gap: 16px; }
.checks li { display: flex; gap: 14px; align-items: flex-start; color: var(--nav); }
.checks .dot { width: 24px; height: 24px; border-radius: 50%; background: #e0e7f5; color: var(--brand); display: grid; place-items: center; margin-top: 1px; flex: none; }
.letter-wrap { position: relative; padding: 0 0 0 32px; }
.letter-wrap::before { content: ""; position: absolute; left: 0; top: 32px; bottom: -24px; right: 60px; background: var(--soft); border-radius: 20px; }
.letter { position: relative; overflow: hidden; background: #fff; border-top: 10px solid var(--brand); border-radius: 16px; box-shadow: 0 30px 70px -30px rgba(15,23,42,.3); padding: 40px 36px 36px; font-size: 13px; }
.letter .cap { font-size: 10.5px; font-weight: 600; letter-spacing: 0.2em; text-transform: uppercase; color: var(--subtle); }
.letter-top { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 32px; }
.letter-brand { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.letter-brand strong { display: block; color: var(--ink); font-size: 16px; line-height: 1.2; }
.letter-brand span { font-size: 11px; color: var(--muted); }
.letter-meta { text-align: right; }
.letter-meta code { display: block; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--ink); font-weight: 700; font-size: 12px; margin: 6px 0; }
.letter-meta span { font-size: 11px; color: var(--muted); }
.letter h4 { font-size: 14px; font-weight: 600; margin: 10px 0 8px; letter-spacing: 0; }
.letter .sub { font-size: 11.5px; color: var(--muted); }
.letter .l { display: block; height: 5px; border-radius: 3px; background: var(--sheet-line); margin-bottom: 11px; }
.letter hr { border: 0; border-top: 1px solid var(--line-soft); margin: 24px 0; }
.letter .block { margin-bottom: 26px; }
.letter .watermark { position: absolute; top: 46%; left: 50%; transform: translate(-50%, -50%) rotate(-24deg); font-size: 84px; font-weight: 800; letter-spacing: 0.08em; color: rgba(15,23,42,.045); pointer-events: none; white-space: nowrap; }

/* Vergelijking */
.table-scroll { overflow-x: auto; }
.compare { min-width: 640px; background: #fff; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.compare-row { display: grid; grid-template-columns: 1.4fr 1fr 1fr; border-top: 1px solid var(--line-soft); }
.compare-row:first-child { border-top: 0; }
.compare-row > div { padding: 22px 28px; display: flex; align-items: center; gap: 12px; }
.compare-row > div + div { border-left: 1px solid var(--line-soft); justify-content: center; text-align: center; }
.compare-row > div:first-child { color: var(--ink); font-weight: 500; font-size: 17px; }
.compare-row > div:last-child { color: var(--ink); font-weight: 500; }
.compare-head > div { font-size: 12px !important; font-weight: 600 !important; letter-spacing: 0.14em; text-transform: uppercase; color: var(--subtle) !important; padding-top: 28px; padding-bottom: 28px; }
.compare-head > div:last-child { color: var(--brand) !important; }
.no { color: var(--danger); }
.yes { color: var(--brand); }
.footnote { font-size: 14px; color: var(--muted); max-width: 980px; margin-top: 28px; }

/* Voordelen */
.benefits { display: grid; grid-template-columns: repeat(3, 1fr); background: #fff; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.benefit { padding: 36px 32px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.benefit h3 { font-size: 18px; font-weight: 600; margin-bottom: 12px; letter-spacing: -0.01em; }
.benefit p { font-size: 15px; }

/* Reviews */
.reviews-head { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 20px 48px; margin-bottom: 56px; }
.reviews-head h2 { font-size: clamp(2rem, 4.2vw, 3rem); font-weight: 700; letter-spacing: -0.035em; line-height: 1.05; }
.rating { display: flex; align-items: center; gap: 14px; margin: 0 0 4px; font-size: 17px; color: var(--muted); }
.rating strong { color: var(--ink); font-weight: 700; }
.stars { display: flex; gap: 3px; color: #fbbf24; }
.reviews { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.review { margin: 0; background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 32px; }
.review .stars { margin-bottom: 20px; }
.review blockquote { margin: 0; padding-bottom: 24px; border-bottom: 1px solid var(--line); color: var(--ink); font-size: 17px; line-height: 1.7; }
.review figcaption { padding-top: 20px; }
.review figcaption strong { display: block; color: var(--ink); font-weight: 600; font-size: 16px; margin-bottom: 2px; }
.review figcaption span { font-size: 14px; color: var(--muted); }
@media (max-width: 1023px) { .reviews { grid-template-columns: 1fr; } }

/* FAQ */
.faq { background: #fff; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; }
.faq details { border-top: 1px solid var(--line-soft); }
.faq details:first-child { border-top: 0; }
.faq summary { list-style: none; cursor: pointer; padding: 26px 32px; font-weight: 600; font-size: 17px; color: var(--ink); display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.faq summary::-webkit-details-marker { display: none; }
.faq details[open] summary { background: #fafafa; }
.faq-icon { width: 28px; height: 28px; border-radius: 50%; background: var(--line-soft); color: var(--muted); display: grid; place-items: center; flex: none; transition: transform .2s ease, background .2s ease; }
.faq details[open] .faq-icon { background: var(--brand); color: #fff; transform: rotate(45deg); }
.faq details p { padding: 8px 32px 30px; max-width: 980px; }

/* CTA + footer */
.cta { background: var(--cta-bg); text-align: center; padding: 112px 0; }
.cta h2 { color: #fff; font-size: clamp(2rem, 4.2vw, 3rem); font-weight: 700; letter-spacing: -0.035em; margin-bottom: 24px; }
.cta p { color: rgba(255,255,255,.7); font-size: 18px; max-width: 640px; margin: 0 auto 40px; }
footer { background: var(--footer); color: var(--footer-text); padding: 80px 0 0; font-size: 15px; }
.foot-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 48px; padding-bottom: 72px; }
footer .logo { color: #fff; margin-bottom: 22px; }
footer .logo-mark { background: #fff; color: var(--footer); }
footer .about { max-width: 320px; color: var(--footer-muted); }
footer h4 { color: #fff; font-size: 16px; font-weight: 600; margin-bottom: 22px; letter-spacing: 0; }
footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
footer a:hover { color: #fff; }
.foot-contact li { display: flex; gap: 14px; align-items: flex-start; }
.foot-contact svg { color: #60a5fa; margin-top: 3px; }
.foot-contact span { display: block; color: var(--footer-muted); line-height: 1.3; }
.foot-contact b { color: #fff; font-weight: 400; }
.foot-bottom { border-top: 1px solid rgba(255,255,255,.08); padding: 28px 0; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 14px; color: var(--footer-muted); }

/* Subpagina's */
.page-head { padding: 72px 0 64px; border-bottom: 1px solid var(--line-soft); }
.pill { display: inline-flex; align-items: center; gap: 8px; background: #e8edf7; color: var(--brand); font-size: 14px; font-weight: 500; padding: 8px 16px; border-radius: 999px; margin-bottom: 22px; }
.page-head h1 { font-size: clamp(2.2rem, 5vw, 3.25rem); font-weight: 800; letter-spacing: -0.03em; margin-bottom: 20px; }
.page-head p { font-size: 18px; max-width: 720px; }
.page-body { background: var(--soft); padding: 64px 0 96px; }
.card { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 36px; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.card > h2 { font-size: 24px; font-weight: 700; margin-bottom: 10px; }
.card > .sub { margin-bottom: 26px; }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
.stack { display: grid; gap: 32px; }
.info-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 340px)); gap: 24px; justify-content: center; margin-bottom: 56px; }
.info-card { padding: 26px; }
.info-card.blue { border-color: var(--ring); }
.info-card.orange { border-color: #fed7aa; }
.info-card .icon-box { margin-bottom: 20px; }
.info-card h3 { font-size: 17px; font-weight: 600; margin-bottom: 6px; letter-spacing: 0; }
.info-card p { font-size: 14px; color: var(--muted); margin-bottom: 8px; }
.info-card b { color: var(--ink); font-weight: 600; font-size: 17px; }
.cta-card { background: linear-gradient(135deg, #f97316, #ea580c); color: #fff; border-radius: 16px; padding: 36px; }
.cta-card h3 { color: #fff; font-size: 21px; font-weight: 700; margin: 14px 0 12px; }
.cta-card p { color: rgba(255,255,255,.92); margin-bottom: 24px; }
.cta-card .btn { background: #fff; color: var(--accent-dark); padding: 12px 22px; }
.card-title { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
.card-title strong { display: block; color: var(--ink); font-size: 17px; line-height: 1.3; }
.card-title span { font-size: 14px; color: var(--muted); }
.data-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 32px; }
.data-grid span { display: block; font-size: 14px; color: var(--muted); }
.data-grid b { color: var(--ink); font-weight: 500; }
.link-card { background: var(--line-soft); border-radius: 16px; padding: 26px 28px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.link-card strong { display: block; color: var(--ink); font-size: 17px; }
.link-card span { font-size: 14px; }
.link-card a { color: var(--brand); font-weight: 600; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }

/* Formulieren */
.field { margin-bottom: 20px; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
label { display: block; font-size: 14px; font-weight: 500; color: var(--ink); margin-bottom: 8px; }
input, select, textarea {
  width: 100%; font: inherit; font-size: 15px; color: var(--ink);
  padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; background: #fff;
}
textarea { min-height: 150px; resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--subtle); }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--brand); outline-offset: 1px; border-color: var(--brand); }
.hint { font-size: 13px; color: var(--muted); margin-top: 6px; }
.fineprint { font-size: 13px; color: var(--muted); margin-top: 14px; text-align: center; }
.fineprint a { text-decoration: underline; }
.result { display: none; margin-top: 18px; padding: 14px 16px; border-radius: 12px; font-size: 15px; }
.result.ok { display: block; background: var(--brand-tint); color: var(--brand-dark); }
.result.late { display: block; background: #fef2f2; color: #b91c1c; }
.result strong { display: block; margin-bottom: 2px; }

/* Tekstpagina's */
.prose { max-width: 820px; }
.prose h2 { font-size: 20px; font-weight: 600; margin: 34px 0 10px; letter-spacing: -0.01em; }
.prose h2:first-of-type { margin-top: 0; }
.prose p, .prose ul { margin: 0 0 14px; }
.prose ul { padding-left: 20px; }
.prose a { color: var(--brand); text-decoration: underline; }
.concept { background: #fffbeb; border: 1px solid #fde68a; color: #92400e; border-radius: 12px; padding: 14px 18px; font-size: 14.5px; margin-bottom: 28px !important; }

@media (max-width: 1023px) {
  section { padding: 72px 0; }
  .hero .wrap { grid-template-columns: 1fr; gap: 48px; padding-top: 56px; padding-bottom: 72px; }
  .doc-stack { margin: 0 auto; max-width: 380px; }
  .trust .wrap { grid-template-columns: 1fr 1fr; }
  .trust-item:nth-child(3) { border-left: 0; }
  .trust-item:nth-child(n+3) { border-top: 1px solid var(--line-soft); }
  .steps { grid-template-columns: 1fr; gap: 36px; }
  .split, .two-col { grid-template-columns: 1fr; gap: 48px; }
  .benefits { grid-template-columns: 1fr; }
  .foot-grid { grid-template-columns: 1fr 1fr; }
  .nav-toggle { display: block; }
  .nav-links { display: none; position: absolute; top: 72px; left: 0; right: 0; flex-direction: column; gap: 0; background: #fff; border-bottom: 1px solid var(--line); padding: 8px 24px 16px; }
  .nav-links.open { display: flex; }
  .nav-links a { padding: 12px 0; }
}
@media (max-width: 600px) {
  .trust .wrap, .info-cards, .field-row, .data-grid { grid-template-columns: 1fr; }
  .trust-item { border-left: 0; border-top: 1px solid var(--line-soft); }
  .trust-item:first-child { border-top: 0; }
  .nav-right .btn { display: none; }
  .foot-grid { grid-template-columns: 1fr; }
  .letter-wrap { padding-left: 0; }
  .letter-wrap::before { display: none; }
  .card { padding: 24px; }
  .faq summary { padding: 20px; }
  .faq details p { padding: 4px 20px 22px; }
}

/* Meer info-link in de meldingsbalk */
.notice a { color: #fff; font-weight: 500; margin-left: 12px; white-space: nowrap; }
.notice a:hover { text-decoration: underline; text-underline-offset: 2px; }

/* Over ons */
.hero.simple .wrap { grid-template-columns: 1fr; padding-top: 104px; padding-bottom: 104px; }
.hero.simple h1 { max-width: 900px; }
.hero.simple .lead { max-width: 760px; font-size: 19px; margin-bottom: 0; }
.stats { border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); padding: 0; }
.stats .wrap { display: grid; grid-template-columns: repeat(4, 1fr); padding: 0; }
.stat { text-align: center; padding: 44px 24px; border-left: 1px solid var(--line-soft); }
.stat:first-child { border-left: 0; }
.stat strong { display: block; color: var(--ink); font-size: 2.5rem; font-weight: 700; letter-spacing: -0.03em; line-height: 1.15; }
.stat span { font-size: 15px; color: var(--muted); }
.split.top { align-items: start; }
.split .lead.tight { margin-bottom: 20px; }
.reasons h3 { font-size: 22px; font-weight: 700; margin-bottom: 10px; }
.reason { display: flex; gap: 18px; padding: 22px 0; border-top: 1px solid var(--line-soft); }
.reason:first-of-type { border-top: 0; }
.reason:last-of-type { padding-bottom: 0; }
.reason strong { display: block; color: var(--ink); font-weight: 600; font-size: 17px; }
.reason small { font-size: 15px; color: var(--muted); }
.benefits.four { grid-template-columns: repeat(4, 1fr); }
.benefit .icon-box { margin-bottom: 22px; }
@media (max-width: 1023px) {
  .hero.simple .wrap { padding-top: 64px; padding-bottom: 64px; }
  .stats .wrap { grid-template-columns: 1fr 1fr; }
  .stat:nth-child(3) { border-left: 0; }
  .stat:nth-child(n+3) { border-top: 1px solid var(--line-soft); }
  .benefits.four { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .stats .wrap, .benefits.four { grid-template-columns: 1fr; }
  .stat { border-left: 0; border-top: 1px solid var(--line-soft); }
  .stat:first-child { border-top: 0; }
  .notice a { display: block; margin: 2px 0 0; }
}

/* Juridische pagina's: voorwaarden en privacybeleid */
.legal-page { background: var(--soft); padding: 80px 0 104px; }
.legal-wrap { max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.legal-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 1px 3px rgba(15,23,42,.06); padding: 56px; color: var(--nav); font-size: 17px; line-height: 1.65; }
.back-link { display: inline-flex; align-items: center; gap: 10px; color: var(--brand); font-weight: 500; margin-bottom: 30px; }
.back-link:hover { text-decoration: underline; }
.legal-card h1 { font-size: clamp(2rem, 3.6vw, 2.5rem); font-weight: 700; margin-bottom: 12px; }
.legal-meta { color: var(--muted); font-size: 16px; }
.legal-card h2 { font-size: 21px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; margin: 40px 0 16px; }
.legal-card p { margin: 0 0 12px; }
.legal-card ul, .legal-card ol { margin: 0 0 12px; padding-left: 26px; }
.legal-card li { padding-left: 4px; }
.legal-card li + li { margin-top: 8px; }
.legal-card strong { color: var(--ink); font-weight: 600; }
.legal-card h3 { font-size: 18px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.3; margin: 28px 0 10px; }
.legal-table-wrap { overflow-x: auto; margin: 4px 0 16px; }
.legal-table { width: 100%; border-collapse: collapse; font-size: 15px; table-layout: fixed; min-width: 460px; }
.legal-table th:nth-child(1) { width: 34%; }
.legal-table th:nth-child(2) { width: 40%; }
.legal-table th, .legal-table td { text-align: left; padding: 10px 14px; border: 1px solid var(--line); }
.legal-table th { background: var(--surface); color: var(--ink); font-weight: 600; }
.legal-table code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 14px; color: var(--ink); }
.legal-note { background: #fff7ed; border: 1px solid #fed7aa; border-radius: 12px; padding: 18px 22px; margin-top: 28px; }
.legal-note strong { display: block; color: #9a3412; margin-bottom: 4px; }
@media (max-width: 600px) {
  .legal-page { padding: 32px 0 64px; }
  .legal-card { padding: 28px 22px; font-size: 16px; }
}

/* Logo Finerase: loket met rolluik en afgehandeld document + woordmerk met onderschrift */
.logo { gap: 12px; }
.logo-mark { width: auto; height: auto; border-radius: 0; background: none; color: var(--brand); --mark-ink: #fff; display: block; line-height: 0; }
footer .logo-mark { background: none; color: #fff; --mark-ink: var(--footer); }
.lm .lm-ink-stroke { fill: none; stroke: var(--mark-ink); }
.lm .lm-ink-fill { fill: var(--mark-ink); }
.logo-words { display: flex; flex-direction: column; }
.logo-text { font-size: 21px; font-weight: 400; color: var(--navy); letter-spacing: -0.015em; line-height: 1.1; }
.logo-text b, .letter-brand strong b { font-weight: 700; color: inherit; }
.letter-brand strong { font-weight: 400; color: var(--navy); }
footer .logo-text { color: #fff; }
.logo-tag { font-size: 8.5px; font-weight: 600; letter-spacing: 0.17em; text-transform: uppercase; color: var(--muted); line-height: 1; margin-top: 5px; }
footer .logo-tag { color: var(--footer-text); }
.letter-brand .lm { width: 34px; height: 34px; }
.letter-brand .logo-mark { color: var(--brand); }

[hidden] { display: none !important; }

/* Funnel: gratis controle in zes stappen (check.html) */
.funnel-page { background: var(--soft); }
.fn-head { background: #fff; border-bottom: 1px solid var(--line); }
.fn-head-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 78px; }
.fn-progress { display: flex; align-items: center; gap: 14px; font-size: 15px; color: var(--muted); }
.fn-dots { display: flex; gap: 6px; }
.fn-dots span { width: 8px; height: 8px; border-radius: 99px; background: var(--dot); transition: all .25s; }
.fn-dots span.done { background: #22c55e; }
.fn-dots span.now { width: 22px; background: var(--brand); }
.fn-bar { height: 4px; background: var(--line-soft); }
.fn-bar span { display: block; height: 100%; width: 0; background: var(--brand); transition: width .35s ease; }
.fn-main { padding: 44px 0 96px; }
.fn-grid { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 28px; align-items: start; }
.fn-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 1px 3px rgba(15,23,42,.06); padding: 44px 48px 36px; }
.fn-step h1 { font-size: clamp(1.7rem, 3vw, 2.3rem); font-weight: 700; letter-spacing: -0.03em; line-height: 1.15; margin-bottom: 10px; }
.fn-sub { font-size: 17px; margin-bottom: 30px; }
.fn-options { display: grid; gap: 14px; }
.fn-options.two { grid-template-columns: 1fr 1fr; }
.fn-option { position: relative; display: flex; align-items: center; gap: 18px; padding: 20px 22px; border: 1.5px solid var(--line); border-radius: 12px; background: #fff; cursor: pointer; transition: border-color .15s, background .15s; }
.fn-option:hover { border-color: var(--subtle); }
.fn-option input { position: absolute; opacity: 0; pointer-events: none; }
.fn-option strong { display: block; color: var(--ink); font-size: 17px; font-weight: 600; }
.fn-option small { display: block; font-size: 14.5px; color: var(--muted); margin-top: 2px; }
.fn-ico { width: 50px; height: 50px; border-radius: 10px; background: var(--line-soft); color: var(--nav); display: grid; place-items: center; flex: none; transition: background .15s, color .15s; }
.fn-tick { position: absolute; top: 14px; right: 14px; width: 24px; height: 24px; border-radius: 50%; background: var(--brand); color: #fff; display: none; place-items: center; }
.fn-option:has(input:checked) { border-color: var(--brand); background: var(--brand-wash); }
.fn-option:has(input:checked) .fn-ico { background: var(--brand); color: #fff; }
.fn-option:has(input:checked) .fn-tick { display: grid; }
.fn-option:has(input:focus-visible) { outline: 3px solid var(--ring); outline-offset: 2px; }
.fn-trust { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px 28px; margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--line-soft); font-size: 15px; color: var(--nav); }
.fn-trust span { display: inline-flex; align-items: center; gap: 8px; }
.fn-trust svg, .fn-next-steps svg, .fn-side-card li svg { color: var(--brand); flex: none; }
.fn-plate { display: flex; height: 78px; border: 2px solid var(--line); border-radius: 10px; overflow: hidden; }
.fn-plate:focus-within { border-color: var(--brand); }
.fn-plate-nl { width: 68px; flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #003399; color: #fff; font-weight: 700; font-size: 17px; line-height: 1.2; }
.fn-plate-nl i { font-style: normal; font-size: 10px; letter-spacing: 1px; color: #fde047; }
.fn-plate input { flex: 1; min-width: 0; border: 0; outline: none; background: var(--plate); color: var(--plate-ink); text-align: center; text-transform: uppercase; font: 700 30px ui-monospace, 'Courier New', monospace; letter-spacing: .14em; }
.fn-plate input::placeholder { color: rgba(17,24,39,.3); }
.fn-plate-ok { width: 76px; flex: none; display: grid; place-items: center; background: #fff; color: var(--brand); }
.fn-note { display: flex; align-items: center; gap: 14px; margin-top: 16px; padding: 16px 18px; border: 1px solid var(--note-line); border-radius: 12px; background: var(--brand-wash); }
.fn-note strong { display: block; color: var(--ink); }
.fn-note small { display: block; font-size: 14.5px; color: var(--muted); margin-top: 2px; }
.fn-badge { width: 42px; height: 42px; flex: none; border-radius: 50%; background: var(--brand); color: #fff; display: grid; place-items: center; }
.fn-note.warn { background: #fff7ed; border-color: #fed7aa; }
.fn-note.warn .fn-badge { background: var(--accent-dark); }
.fn-note.late { background: #fef2f2; border-color: #fecaca; }
.fn-note.late .fn-badge { background: var(--danger); }
.fn-nav { display: flex; align-items: center; gap: 14px; margin-top: 28px; }
.fn-back { display: inline-flex; align-items: center; gap: 8px; padding: 14px 18px; border: 0; background: none; font: inherit; font-size: 16px; color: var(--nav); cursor: pointer; }
.fn-back:hover { color: var(--ink); }
.fn-next, .fn-submit { flex: 1; justify-content: center; border: 0; cursor: pointer; font-family: inherit; }
.fn-next:disabled, .fn-submit:disabled { background: var(--line); color: var(--subtle); cursor: not-allowed; }
.fn-foot { display: flex; justify-content: center; align-items: center; gap: 8px; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--line-soft); font-size: 14px; color: var(--muted); }
.fn-check { display: flex; align-items: flex-start; gap: 12px; margin-top: 14px; padding: 16px 18px; border: 1.5px dashed var(--line); border-radius: 12px; cursor: pointer; }
.fn-check input, .fn-consent input { width: 21px; height: 21px; flex: none; margin-top: 2px; accent-color: var(--brand); }
.fn-check strong { display: block; color: var(--ink); }
.fn-check small { display: block; font-size: 14.5px; color: var(--muted); }
.fn-tip { margin-top: 14px; padding: 14px 18px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); font-size: 15px; }
.fn-field label { display: block; margin-bottom: 8px; font-size: 15px; font-weight: 600; color: var(--ink); }
.fn-field input { width: 100%; height: 54px; padding: 0 16px; border: 1.5px solid var(--line); border-radius: 10px; background: #fff; font: inherit; font-size: 16px; color: var(--ink); }
.fn-field input:focus { outline: none; border-color: var(--brand); box-shadow: 0 0 0 3px var(--ring-soft); }
.fn-field small { display: block; margin-top: 6px; font-size: 13.5px; color: var(--muted); }
.fn-opt { font-weight: 400; color: var(--muted); }
.fn-fields { display: grid; gap: 18px; }
.fn-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.fn-group { display: flex; align-items: center; gap: 12px; margin: 30px 0 16px; padding-top: 26px; border-top: 1px solid var(--line-soft); font-size: 17px; font-weight: 600; color: var(--ink); }
.fn-group .icon-box { width: 38px; height: 38px; border-radius: 9px; }
.fn-step > .fn-group:first-of-type { margin-top: 0; padding-top: 0; border-top: 0; }
.fn-consent { display: flex; gap: 14px; margin-top: 12px; padding: 18px 20px; border: 1.5px solid var(--line); border-radius: 12px; cursor: pointer; font-size: 14.5px; color: var(--muted); }
.fn-consent:has(input:checked) { border-color: var(--brand); background: var(--brand-wash); }
.fn-consent strong { display: block; margin-bottom: 4px; font-size: 16px; color: var(--ink); }
.fn-consent a { color: var(--brand); text-decoration: underline; }
.fn-price { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 18px; padding: 16px 20px; border-radius: 12px; background: var(--brand-tint); color: var(--ink); font-size: 15px; }
.fn-price strong { font-size: 20px; white-space: nowrap; }
.fn-summary { padding: 18px 22px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.fn-summary-head { display: flex; align-items: center; gap: 14px; padding-bottom: 16px; border-bottom: 1px solid var(--line); font-weight: 600; color: var(--ink); }
.fn-minplate { display: inline-flex; overflow: hidden; border: 1px solid #e5b80b; border-radius: 5px; }
.fn-minplate i { display: grid; place-items: center; padding: 0 6px; background: #003399; color: #fff; font: 700 10px Inter, sans-serif; font-style: normal; }
.fn-minplate b { padding: 4px 10px; background: var(--plate); color: var(--plate-ink); font: 700 15px ui-monospace, monospace; letter-spacing: .08em; }
.fn-summary dl { display: grid; grid-template-columns: auto 1fr; gap: 10px 16px; margin: 14px 0 0; }
.fn-summary dt { color: var(--muted); }
.fn-summary dd { margin: 0; text-align: right; font-weight: 600; color: var(--ink); }
.fn-next-steps { margin-top: 18px; padding: 18px 22px; border: 1px solid var(--line); border-radius: 12px; }
.fn-next-steps h3 { margin-bottom: 12px; font-size: 16px; }
.fn-next-steps ul, .fn-side-card ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.fn-next-steps li, .fn-side-card li { display: flex; gap: 10px; }
.fn-next-steps li svg, .fn-side-card li svg { margin-top: 4px; }
.fn-side { display: grid; gap: 20px; }
.fn-side-step { display: grid; gap: 20px; }
.fn-side-card { padding: 26px 28px; border: 1px solid var(--line); border-radius: 16px; background: #fff; font-size: 15.5px; }
.fn-side-card h3 { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; font-size: 18px; letter-spacing: -0.01em; }
.fn-side-card h4 { margin: 14px 0 6px; font-size: 15.5px; letter-spacing: 0; }
.fn-side-card h3 + h4 { margin-top: 0; }
.fn-side-card ol { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; counter-reset: stap; }
.fn-side-card ol li::before { counter-increment: stap; content: counter(stap); width: 24px; height: 24px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--brand-tint); color: var(--brand); font-size: 13px; font-weight: 700; }
.fn-done { padding: 24px 0 8px; text-align: center; }
.fn-done-icon { width: 86px; height: 86px; margin: 0 auto 24px; display: grid; place-items: center; border: 2px solid var(--ring); border-radius: 50%; background: var(--brand-tint); color: var(--brand); }
.fn-done .fn-sub { max-width: 560px; margin-left: auto; margin-right: auto; }
@media (max-width: 1023px) { .fn-grid { grid-template-columns: 1fr; } }
@media (max-width: 600px) {
  .fn-card { padding: 28px 20px; }
  .fn-options.two, .fn-row { grid-template-columns: 1fr; }
  .fn-dots { display: none; }
  .fn-plate { height: 66px; }
  .fn-plate input { font-size: 24px; }
  .fn-head .logo-tag { display: none; }
}
.fn-step { padding: 0; }

/* Alleen op de homepage: hero (en de kop erboven) breder over de pagina */
.home .nav .wrap, .home .hero .wrap { max-width: 1440px; }

.fn-inline { display: inline; color: var(--ink); }
.fn-note > div { color: var(--nav); }
.fn-guarantee { display: flex; gap: 16px; margin-top: 16px; padding: 22px 24px; border: 1px solid var(--line); border-radius: 12px; }
.fn-guarantee .eyebrow { margin-bottom: 4px; }
.fn-guarantee h3 { font-size: 18px; margin-bottom: 14px; letter-spacing: -0.01em; }
.fn-guarantee ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.fn-guarantee li { display: flex; gap: 10px; }
.fn-guarantee li svg { color: var(--brand); flex: none; margin-top: 4px; }
.fn-side-foot { display: flex; justify-content: center; align-items: center; gap: 8px; font-size: 14px; color: var(--muted); }
.fn-side-foot svg { color: var(--brand); }
.fn-note strong.fn-inline { display: inline; }
.funnel-page .wrap { max-width: 1440px; }
.fn-grid { grid-template-columns: minmax(0, 1fr) 440px; }
@media (max-width: 1023px) { .fn-grid { grid-template-columns: 1fr; } }
.fn-side-card p + ul { margin-top: 14px; }
.fn-plate input { border-radius: 0; }
.fn-cta { margin-top: 28px; }
.fn-cta .btn { justify-content: center; padding-top: 18px; padding-bottom: 18px; font-size: 17px; }
.fn-backwrap { margin-top: 14px; text-align: center; }
.fn-checkbox { margin-top: 18px; padding: 20px 22px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.fn-checkbox strong { display: block; margin-bottom: 12px; color: var(--ink); }
.fn-checklist { display: flex; flex-wrap: wrap; gap: 10px 32px; color: var(--nav); }
.fn-checklist span { display: inline-flex; align-items: center; gap: 10px; }
.fn-checklist svg { color: var(--brand); flex: none; }
.fn-avg { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line-soft); text-align: center; font-size: 14px; color: var(--muted); }
.letter-brand .letter-mark { width: 34px; height: 34px; flex: none; border-radius: 8px; background: var(--brand); color: #fff; display: grid; place-items: center; font-size: 18px; font-weight: 800; line-height: 1; }

/* Vergelijking: tekst iets donkerder voor meer contrast */
#vergelijk .section-head h2 + p { color: var(--nav); }
#vergelijk .compare-row > div:nth-child(2) { color: #1e293b; }
#vergelijk .compare-head > div { color: var(--muted) !important; }
#vergelijk .compare-head > div:last-child { color: var(--brand) !important; }
#vergelijk .footnote { color: var(--text); }
#vergelijk .compare-row > div:last-child { background: #edf3ff; border-left-color: #dbe6fb; }
#vergelijk .compare-row + .compare-row { border-top-color: #e8eef8; }

/* Contactpagina: iets grotere hero */
.page-head.big { padding: 96px 0 84px; }
.page-head.big .pill { font-size: 15px; padding: 9px 18px; margin-bottom: 26px; }
.page-head.big h1 { font-size: clamp(2.6rem, 6vw, 4.1rem); margin-bottom: 24px; }
.page-head.big p { font-size: 20.5px; max-width: 820px; }

/* Contactpagina: breder en groter formulier */
.contact-cols { grid-template-columns: 1.35fr 1fr; gap: 40px; }
#contactform { padding: 48px 48px 44px; }
#contactform h2 { font-size: 30px; letter-spacing: -0.02em; margin-bottom: 10px; }
#contactform .sub { font-size: 17.5px; margin-bottom: 30px; }
#contactform .field { margin-bottom: 24px; }
#contactform label { font-size: 16px; margin-bottom: 10px; }
#contactform input, #contactform select, #contactform textarea { font-size: 17px; padding: 17px 18px; }
#contactform textarea { min-height: 200px; }
#contactform .btn { padding-top: 19px; padding-bottom: 19px; font-size: 17.5px; justify-content: center; }
@media (max-width: 1023px) { .contact-cols { grid-template-columns: 1fr; } }
@media (max-width: 600px) { #contactform { padding: 28px 22px; } }

/* Contactpagina: oranje vlak iets groter */
.contact-cols .cta-card { padding: 44px 44px 46px; }
.contact-cols .cta-card > svg { width: 36px; height: 36px; }
.contact-cols .cta-card h3 { font-size: 26px; margin: 18px 0 14px; letter-spacing: -0.015em; }
.contact-cols .cta-card p { font-size: 17.5px; line-height: 1.6; margin-bottom: 28px; }
.contact-cols .cta-card .btn { padding: 15px 26px; font-size: 16.5px; }

/* FAQ-pagina (faq.html) */
.faqp-hero { padding: 92px 0 72px; background: #fff; text-align: center; }
.faqp-hero h1 { font-size: clamp(2.4rem, 5.5vw, 3.9rem); font-weight: 800; letter-spacing: -0.03em; margin-bottom: 20px; }
.faqp-hero p { font-size: 20px; margin-bottom: 36px; }
.faqp-search { display: flex; align-items: center; gap: 14px; max-width: 820px; margin: 0 auto; padding: 0 22px; height: 66px; border: 1px solid var(--line); border-radius: 14px; background: #fff; color: #94a3b8; cursor: text; }
.faqp-search:focus-within { border-color: var(--brand); box-shadow: 0 0 0 3px var(--ring-soft); }
.faqp-search input { border: 0; padding: 0; height: 100%; font-size: 18px; outline: none; background: none; }
.faqp-search input:focus { outline: none; }
.faqp-filters { background: #fff; border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); padding: 22px 0; }
.faqp-filters .wrap { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.faqp-chip { display: inline-flex; align-items: center; gap: 9px; padding: 12px 22px; border: 0; border-radius: 999px; background: var(--line-soft); color: var(--nav); font: 500 16px Inter, system-ui, sans-serif; cursor: pointer; transition: background .15s, color .15s; }
.faqp-chip:hover { background: var(--line); }
.faqp-chip.active { background: var(--brand); color: #fff; }
.faqp-body { padding: 56px 0 80px; background: var(--soft); }
.faqp-list { max-width: 1100px; margin: 0 auto; padding: 0 24px; display: grid; gap: 18px; }
.faqp-item { background: #fff; border: 1px solid var(--line); border-radius: 14px; }
.faqp-item summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 26px 34px; font-size: 18px; font-weight: 600; color: var(--ink); cursor: pointer; }
.faqp-item summary::-webkit-details-marker { display: none; }
.faqp-chev { color: var(--subtle); flex: none; display: grid; transition: transform .2s; }
.faqp-item[open] .faqp-chev { transform: rotate(180deg); color: var(--brand); }
.faqp-item p { padding: 0 34px 28px; font-size: 16.5px; line-height: 1.7; max-width: 900px; }
.faqp-item p a, .faqp-empty a { color: var(--brand); text-decoration: underline; }
.faqp-empty { text-align: center; padding: 24px; color: var(--muted); }
.faqp-cta { padding: 72px 0 84px; background: #fff; text-align: center; }
.faqp-cta h2 { font-size: clamp(1.7rem, 3vw, 2.2rem); font-weight: 700; letter-spacing: -0.025em; margin-bottom: 14px; }
.faqp-cta p { font-size: 18px; margin-bottom: 32px; }
.faqp-buttons { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px; }
.faqp-buttons .btn { padding: 17px 30px; font-size: 17px; }
.btn.orange { background: var(--accent); }
.btn.orange:hover { background: var(--accent-dark); }
@media (max-width: 600px) {
  .faqp-hero { padding: 56px 0 44px; }
  .faqp-item summary { padding: 20px; font-size: 16.5px; }
  .faqp-item p { padding: 0 20px 22px; }
}
.fn-price.fn-price-2 { display: grid; gap: 10px; }
.fn-price-2 > div { display: flex; justify-content: space-between; align-items: center; gap: 16px; }

/* Contactpagina in de verhoudingen van het voorbeeld: twee even brede kolommen */
.contact-page .nav .wrap, .contact-page .page-head .wrap, .contact-page .page-body .wrap { max-width: 1440px; }
.contact-cols { grid-template-columns: 1fr 1fr; gap: 56px; }
#contactform { padding: 46px 46px 44px; }
#contactform h2 { font-size: 33px; }
#contactform .sub { font-size: 17px; }
#contactform textarea { min-height: 170px; }
#contactform .btn { padding-top: 20px; padding-bottom: 20px; font-size: 18.5px; }
.contact-cols .stack { gap: 36px; }
.contact-cols .cta-card { padding: 46px 46px 48px; }
.contact-cols .cta-card > svg { width: 40px; height: 40px; }
.contact-cols .cta-card h3 { font-size: 25px; }
.contact-cols .cta-card p { font-size: 18px; }
.contact-cols .cta-card .btn { padding: 18px 30px; font-size: 18px; }
.contact-cols .card:not(#contactform) { padding: 40px 46px; }
.contact-cols .card-title { gap: 18px; margin-bottom: 30px; }
.contact-cols .card-title .icon-box { width: 56px; height: 56px; border-radius: 12px; }
.contact-cols .card-title strong { font-size: 20px; }
.contact-cols .card-title span { font-size: 16.5px; }
.contact-cols .data-grid { column-gap: 0; row-gap: 0; }
.contact-cols .data-grid > div { padding: 0 16px 22px 0; }
.contact-cols .data-grid > div:nth-child(n+3) { border-top: 1px solid var(--line); padding-top: 22px; padding-bottom: 0; }
.contact-cols .data-grid span { font-size: 16px; margin-bottom: 4px; }
.contact-cols .data-grid b { font-size: 17.5px; }
.contact-cols .link-card { padding: 30px 34px; }
.contact-cols .link-card strong { font-size: 20px; margin-bottom: 4px; }
.contact-cols .link-card span { font-size: 16.5px; }
.contact-cols .link-card a { font-size: 19px; }
#contactform .sub { font-size: 16px; }
.faqp-list { max-width: 860px; }
.faqp-item p { max-width: none; }

/* Over ons: hero breder over de pagina (kop erboven even breed, zodat het logo erboven blijft staan) */
.over-page .nav .wrap, .over-page .hero .wrap { max-width: 1440px; }
.over-page .hero.simple h1 { max-width: 1200px; font-size: clamp(2.2rem, 5.6vw, 4.1rem); }
.over-page .hero.simple .lead { max-width: 1040px; font-size: 20.5px; }
.rating-block { text-align: right; margin-bottom: 4px; }
.rating-block .rating { justify-content: flex-end; margin: 0; }
.rating-note { margin: 6px 0 0; font-size: 14px; color: var(--muted); }
.rating-source { font-size: 13.5px; color: var(--muted); margin-top: 8px; }
@media (max-width: 1023px) { .rating-block { text-align: left; } .rating-block .rating { justify-content: flex-start; } }
.review-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.review .review-top .stars { margin-bottom: 0; }

/* Reviewkaarten iets groter */
.reviews { gap: 28px; }
.review { padding: 42px 40px 38px; }
.review .stars svg { width: 22px; height: 22px; }
.review-top { margin-bottom: 24px; }
.review blockquote { font-size: 18.5px; line-height: 1.7; padding-bottom: 28px; }
.review figcaption { padding-top: 22px; }
.review figcaption strong { font-size: 17px; }
.review figcaption span { font-size: 15px; }
@media (max-width: 600px) { .review { padding: 28px 24px; } }
/* Reviewblok weer even breed als de rest, kaarten iets compacter */
#reviews .inner { max-width: 1280px; }
.reviews { gap: 26px; }
.review { padding: 34px 36px 32px; }
.review .stars svg { width: 20px; height: 20px; }
.review-top { margin-bottom: 20px; }
.review blockquote { font-size: 17px; line-height: 1.65; padding-bottom: 24px; }
.review figcaption { padding-top: 18px; }
.review figcaption strong { font-size: 16.5px; }
.review figcaption span { font-size: 14.5px; }
.fn-progress { margin-right: 64px; }
@media (max-width: 600px) { .fn-progress { margin-right: 0; } }

/* Funnel in de verhoudingen van het voorbeeld: kop smaller dan de inhoud, iets grotere keuzekaarten */
.fn-head .wrap { max-width: 1440px; }
.fn-head-inner .logo { margin-left: 70px; }
.fn-head-inner { height: 84px; }
.fn-progress { margin-right: 160px; }
@media (max-width: 1023px) { .fn-head-inner .logo { margin-left: 0; } .fn-progress { margin-right: 0; } }
.fn-option { padding: 24px 26px; gap: 20px; }
.fn-ico { width: 58px; height: 58px; border-radius: 11px; }
.fn-option strong { font-size: 18.5px; }
.fn-option small { font-size: 15.5px; }
.fn-backwrap { text-align: left; }
.fn-backwrap .fn-back { padding-left: 0; }

/* Stap 3 in de indeling van het voorbeeld */
.fn-options:not(.two) .fn-option { padding: 26px 28px; }
.fn-options:not(.two) .fn-tick { top: 50%; right: 28px; transform: translateY(-50%); width: 28px; height: 28px; }
.fn-check { padding: 20px 24px; gap: 14px; }
.fn-check strong { display: flex; align-items: center; gap: 9px; font-size: 16.5px; }
.fn-check strong svg { color: var(--subtle); flex: none; }
.fn-check small { font-size: 14.5px; margin-top: 3px; }
.fn-tip { padding: 18px 22px; font-size: 16px; }
.fn-step[data-step="3"] .fn-backwrap { border-top: 1px solid var(--line-soft); margin-top: 28px; padding-top: 22px; }
.fn-side-card .icon-box.outline { background: #fff; border: 1px solid var(--line); color: var(--ink); }
.fn-quote .stars { display: flex; gap: 3px; color: #fbbf24; margin-bottom: 16px; }
.fn-quote p { color: var(--ink); font-size: 16.5px; line-height: 1.65; margin-bottom: 14px; }
.fn-quote span { font-size: 15px; color: var(--muted); }

/* Funnel stap 4: verwerkingsstap met draaiende ring en voortgangsbalk */
.fn-proc { text-align: center; padding: 18px 0 8px; }
.fn-proc-spinner { position: relative; width: 132px; height: 132px; margin: 0 auto 26px; display: grid; place-items: center; color: var(--brand); }
.fn-proc-ring { position: absolute; inset: 0; border-radius: 50%; border: 4px solid #f1f5f9; border-right-color: var(--brand); animation: fn-spin 1.1s linear infinite; }
@keyframes fn-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .fn-proc-ring { animation: none; } }
.fn-proc-status { font-size: 18px; color: var(--nav); margin-bottom: 30px; min-height: 1.6em; }
/* Op de telefoon lopen sommige statusteksten over twee regels: altijd ruimte voor twee, zodat de balk niet verspringt */
@media (max-width: 600px) { .fn-proc-status { min-height: 3.3em; display: grid; align-content: center; } }
.fn-proc-bar { height: 8px; border-radius: 99px; background: var(--line-soft); overflow: hidden; }
.fn-proc-bar span { display: block; height: 100%; width: 0; background: var(--brand); border-radius: 99px; transition: width .07s linear; }
.fn-proc-meta { display: flex; justify-content: space-between; margin-top: 10px; font-size: 15px; color: var(--subtle); }
.fn-step[data-step="4"] .fn-checkbox { margin-top: 26px; }
.fn-step[data-step="5"] .fn-backwrap { text-align: center; margin-top: 16px; }
.fn-cta .fn-contact { display: flex; }
.fn-cta .fn-contact[hidden] { display: none; }
.fn-step[data-step="6"] .fn-backwrap { text-align: center; margin-top: 16px; }
.fn-terms { margin-top: 20px; font-size: 14.5px; line-height: 1.6; color: var(--muted); }
.fn-terms a { color: var(--brand); text-decoration: underline; }
.fn-terms strong { color: var(--ink); font-weight: 600; }

/* Stap 6 in de opmaak van het voorbeeld */
.fn-step[data-step="6"] .fn-consent { align-items: flex-start; gap: 18px; margin-top: 16px; padding: 22px 26px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); font-size: 15.5px; line-height: 1.65; color: #94a3b8; }
.fn-step[data-step="6"] .fn-consent:has(input:checked) { background: #fff; border-color: var(--line); }
.fn-step[data-step="6"] .fn-consent strong { font-size: 18px; margin-bottom: 6px; }
.fn-step[data-step="6"] .fn-consent a { text-decoration: none; font-weight: 500; }
.fn-step[data-step="6"] .fn-consent input { appearance: none; -webkit-appearance: none; width: 26px; height: 26px; margin: 2px 0 0; border: 2px solid var(--brand); border-radius: 6px; background: #fff; cursor: pointer; }
.fn-step[data-step="6"] .fn-consent input:checked { background: var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 16px no-repeat; }
.fn-step[data-step="6"] .fn-consent input:focus-visible { outline: 3px solid var(--ring); outline-offset: 2px; }
.fn-cost { margin-top: 20px; font-size: 15px; color: var(--muted); }
.fn-cost strong { color: var(--ink); font-weight: 600; }
.fn-step[data-step="6"] .fn-cta { margin-top: 22px; }
.fn-step[data-step="6"] .fn-submit { gap: 12px; padding-top: 21px; padding-bottom: 21px; font-size: 18.5px; }
.fn-step[data-step="6"] .fn-submit:disabled { background: var(--brand); color: #fff; opacity: .5; }
.fn-step[data-step="6"] .fn-backwrap { margin-top: 22px; }
.fn-step[data-step="6"] .fn-backwrap .fn-back { font-size: 17px; }
.fn-foot-2 { border-top: 0; gap: 14px; margin-top: 18px; }
.fn-foot-2 span { display: inline-flex; align-items: center; gap: 8px; }
.fn-foot-2 svg { color: var(--brand); }
.fn-progress { font-size: 16px; }
/* Stap 6: tekst in de bevestigingsvakken kleiner */
.fn-step[data-step="6"] .fn-consent { gap: 14px; padding: 18px 22px; font-size: 14px; line-height: 1.6; }
.fn-step[data-step="6"] .fn-consent strong { font-size: 16px; margin-bottom: 4px; }
.fn-step[data-step="6"] .fn-consent input { width: 22px; height: 22px; margin-top: 0; border-radius: 5px; }
.fn-step[data-step="6"] .fn-consent input:checked { background-size: 14px; }
.fn-step[data-step="6"] .fn-consent, .fn-step[data-step="6"] .fn-consent:has(input:checked) { background: #fff; }
/* Verwerkingsstap en bedankpagina: kaart in het midden van de pagina */
.fn-grid.solo { grid-template-columns: minmax(0, 860px); justify-content: center; }
.fn-grid.solo.proc { grid-template-columns: minmax(0, 740px); }
/* Stap 6: bevestigingsvakken compacter */
.fn-step[data-step="6"] .fn-consent { gap: 12px; margin-top: 12px; padding: 14px 18px; font-size: 13.5px; line-height: 1.55; }
.fn-step[data-step="6"] .fn-consent strong { font-size: 15px; margin-bottom: 2px; }
/* Stap 6: kleine vinkvakjes (het hele vak blijft aanklikbaar) */
.fn-step[data-step="6"] .fn-consent { gap: 10px; }
.fn-step[data-step="6"] .fn-consent input { width: 13px; height: 13px; padding: 0; min-width: 0; border-width: 1px; border-radius: 3px; margin-top: 5px; }
.fn-step[data-step="6"] .fn-consent input:checked { background-size: 9px; }
/* Stap 6 op de telefoon: knoptekst in twee regels, zonder icoontjes */
@media (max-width: 600px) {
  .fn-step[data-step="6"] .fn-submit { padding: 16px 18px; font-size: 16.5px; line-height: 1.35; }
  .fn-step[data-step="6"] .fn-submit svg { display: none; }
}
/* Zijkaarten in de funnel, ook de review: tekst iets lichter grijs */
.fn-side-card p, .fn-side-card li { color: var(--muted); }
.fn-side-card.fn-side-grijs { background: var(--line-soft); }
/* Lange samengestelde woorden in koppen (Geschwindigkeitsverstoß, verkeersrechtspraak) afbreken op de telefoon,
   anders wordt de pagina te breed */
@media (max-width: 600px) {
  h1, h2, h3 { -webkit-hyphens: auto; hyphens: auto; hyphenate-limit-chars: 12 4 4; }
}
/* Duitse site: "Schritt 1 von 6" is langer dan "Stap 1 van 6" en loopt op de smalste telefoons (onder 360px) naast het
   logo over twee regels. Daar laten we het weg; de stap staat ook boven elke vraag en in de voortgangsbalk. */
@media (max-width: 359px) {
  #fn-label:lang(de) { display: none; }
}
/* Duitse site: een kenteken is daar tot 11 tekens lang (ESB-AB 1234), in Nederland 6. Op de telefoon
   daarom een kleinere letter en smallere zijvakken, zodat het hele kenteken in beeld blijft. */
@media (max-width: 600px) {
  .fn-plate-nl:lang(de) { width: 46px; }
  .fn-plate-ok:lang(de) { width: 44px; }
  .fn-plate input:lang(de) { padding: 0 6px; font-size: 20px; letter-spacing: .06em; }
}

/* Telefoon en tablet: geen enkele pagina mag zijwaarts schuiven.
   - Een kolom van 1fr groeit mee met de breedste inhoud; minmax(0, 1fr) houdt hem binnen het scherm.
   - .contact-cols kreeg hierboven, na de eerdere regel voor mobiel, op elk scherm weer twee kolommen. */
@media (max-width: 1023px) {
  .two-col, .split, .contact-cols, .fn-grid { grid-template-columns: minmax(0, 1fr); }
  .contact-cols { gap: 40px; }
}
/* Een woord dat niet op de regel past (www.autoriteitpersoonsgegevens.nl) mag afbreken in plaats van uit te steken. */
body { overflow-wrap: break-word; }
/* Het verborgen keuzerondje kreeg via input { width: 100% } de volle breedte, maar begon pas naast het icoon. */
.fn-option input { top: 0; left: 0; width: 1px; height: 1px; padding: 0; }
.stack { grid-template-columns: minmax(0, 1fr); }
/* Overzicht in stap 5: op de telefoon staat het label boven de waarde in plaats van ernaast, anders past een lang
   woord als Geschwindigkeitsverstoß er niet naast. */
.fn-summary dd { overflow-wrap: anywhere; -webkit-hyphens: auto; hyphens: auto; }
/* Het kenteken in het overzicht houdt zijn volle breedte (het kromp en werd afgekapt: 05LJ in plaats van 05LJVH);
   merk of regio gaat zo nodig naar de volgende regel. */
.fn-minplate { flex: none; }
.fn-minplate b { white-space: nowrap; }
.fn-summary-head { flex-wrap: wrap; }
@media (max-width: 600px) {
  .fn-summary dl { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .fn-summary dd { margin-bottom: 10px; text-align: left; }
  .fn-summary dd:last-child { margin-bottom: 0; }
}
@media (max-width: 600px) {
  .link-card { flex-wrap: wrap; }
  .contact-cols .cta-card, .contact-cols .card:not(#contactform), .contact-cols .link-card { padding: 26px 22px; }
}
/* De smalste telefoons (320-400px): compactere keuzekaarten in de controle en kleinere iconen bij de bedrijfsgegevens,
   zodat lange woorden (Geschwindigkeit, trajectcontroles, Unternehmensdaten) naast het icoon passen. */
@media (max-width: 400px) {
  .fn-card { padding: 24px 16px; }
  .fn-option, .fn-options:not(.two) .fn-option { padding: 16px 14px; gap: 12px; }
  .fn-ico { width: 44px; height: 44px; }
  .fn-option strong { font-size: 16.5px; }
  .fn-option small { font-size: 14px; }
  .fn-option > span:not(.fn-ico):not(.fn-tick) { min-width: 0; }
  .contact-cols .card-title { gap: 12px; }
  .contact-cols .card-title .icon-box { width: 44px; height: 44px; }
  .contact-cols .card-title strong { font-size: 17px; }
}
/* Telefoon: tikdoelen van zo'n 40px of meer, en invulvelden van 16px. Bij een kleinere letter zoomt de iPhone in
   zodra u in het veld tikt. */
.nav-toggle { padding: 10px; }
@media (max-width: 1023px) {
  input, select, textarea { font-size: 16px; }
  footer ul:not(.foot-contact) { gap: 0; }
  footer ul:not(.foot-contact) a { display: block; padding: 9px 0; }
  .back-link { padding: 8px 0; margin-bottom: 22px; }
  .link-card a { padding: 8px 0; }
}
@media (max-width: 600px) {
  .notice a { padding: 9px 0; margin: -7px 0 -9px; }
}
/* Vergelijkingstabel op de telefoon: de tabel was minstens 640px breed, waardoor de kolom "Via Finerase" (met de vinkjes)
   buiten beeld viel. Nu staat per regel het onderwerp bovenaan en staan "Zelf indienen" en "Via Finerase" eronder naast
   elkaar. */
@media (max-width: 600px) {
  .compare { min-width: 0; }
  .compare-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .compare-row > div { padding: 10px 12px 16px; gap: 8px; font-size: 14.5px; }
  .compare-row > div:first-child { grid-column: 1 / -1; padding: 16px 16px 6px; font-size: 16px; font-weight: 600; }
  .compare-row > div:nth-child(2) { border-left: 0; }
  .compare-head > div:first-child { display: none; }
  .compare-head > div { padding-top: 16px; padding-bottom: 16px; }
}
/* Contactformulier: de regel voor mobiel (hierboven) werd door een latere regel overschreven, waardoor het formulier
   ook op de telefoon 46px opvulling had en de velden te smal werden. Op de smalste schermen valt het onderschrift onder
   het logo weg; dat liep daar over twee krappe regels. */
@media (max-width: 600px) {
  #contactform { padding: 26px 22px; }
  #contactform h2 { font-size: 26px; }
}
@media (max-width: 360px) {
  .nav .logo-tag { display: none; }
}

/* Compactere indeling op telefoons (NL en DE) */
@media (max-width: 600px) {
  section { padding: 52px 0; }
  .section-head { margin-bottom: 28px; }
  .section-head h2 { font-size: 1.75rem; }
  .section-head h2 + p { font-size: 16px; margin-top: 12px; }
  .hero .wrap { gap: 0; padding-top: 32px; padding-bottom: 36px; }
  .hero h1 { margin-bottom: 16px; }
  .hero .lead { font-size: 16.5px; margin-bottom: 24px; }
  .hero .btn { width: 100%; justify-content: center; }
  .doc-stack { display: none; }
  .trust .wrap { grid-template-columns: 1fr 1fr; }
  .trust-item { padding: 16px 12px; gap: 10px; align-items: flex-start; border-top: 1px solid var(--line-soft); }
  .trust-item:nth-child(-n+2) { border-top: 0; }
  .trust-item:nth-child(even) { border-left: 1px solid var(--line-soft); }
  .trust-item .icon-box { display: none; }
  .trust-item strong { font-size: 14.5px; }
  .trust-item span { font-size: 12.5px; }
  .steps { gap: 22px; }
  .step { display: grid; grid-template-columns: 44px 1fr; column-gap: 12px; }
  .step-num { grid-row: span 2; font-size: 1.9rem; margin: 0; color: var(--brand); }
  .step h3 { font-size: 18px; margin-bottom: 6px; }
  .letter-wrap { display: none; }
  .benefit { padding: 20px; }
  .benefit h3 { font-size: 16.5px; margin-bottom: 6px; }
  .benefit p { font-size: 14.5px; }
  .mobiel-cta { display: flex; }
  body.heeft-mobiel-cta { padding-bottom: 76px; }
}
.mobiel-cta { display: none; position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: rgba(255,255,255,.96); border-top: 1px solid var(--line); box-shadow: 0 -6px 20px rgba(15,23,42,.06); }
.mobiel-cta .btn { width: 100%; justify-content: center; }