/* ============ TOKENS ============ */
:root{
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  --text-sm: clamp(0.875rem, 0.8rem + 0.35vw, 1rem);
  --text-base: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
  --text-lg: clamp(1.125rem, 1rem + 0.75vw, 1.5rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.25rem);
  --space-1:0.25rem; --space-2:0.5rem; --space-3:0.75rem; --space-4:1rem;
  --space-5:1.25rem; --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem;
  --space-12:3rem; --space-16:4rem;
  --font-display:'Cabinet Grotesk','Trebuchet MS',sans-serif;
  --font-body:'Satoshi','Segoe UI',sans-serif;
  /* EV-fiscaal palet: koel groen-blauw */
  --color-bg:#f2f5f3;
  --color-surface:#ffffff;
  --color-surface-2:#f7faf8;
  --color-surface-offset:#e9efec;
  --color-divider:#dde4e0;
  --color-border:#c8d3cd;
  --color-text:#182420;
  --color-text-muted:#5b6a62;
  --color-text-faint:#93a098;
  --color-primary:#001532;
  --color-primary-hover:#062650;
  --color-primary-highlight:#e0f8ff;
  --color-accent:#0e7490;
  --color-warning:#96591b;
  --color-warning-highlight:#f3e6d3;
  --color-error:#a13544;
  --color-success:#2e6b1e;
  --radius-sm:0.375rem; --radius-md:0.5rem; --radius-lg:0.75rem; --radius-xl:1rem;
  --shadow-sm:0 1px 2px rgba(24,36,32,.06);
  --shadow-md:0 4px 12px rgba(24,36,32,.08);
  --shadow-lg:0 12px 32px rgba(24,36,32,.12);
  --transition-interactive:180ms cubic-bezier(0.16,1,0.3,1);
}
/* ============ BASE ============ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:none;text-size-adjust:none;-webkit-font-smoothing:antialiased;scroll-behavior:smooth;scroll-padding-top:var(--space-16)}
body{min-height:100dvh;line-height:1.6;font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text);background:var(--color-bg)}
img,svg{display:block;max-width:100%;height:auto}
input,button,textarea,select{font:inherit;color:inherit}
h1,h2,h3,h4{text-wrap:balance;line-height:1.15;font-family:var(--font-display)}
p,li{text-wrap:pretty;max-width:78ch}
a,button,input,select{transition:color var(--transition-interactive),background var(--transition-interactive),border-color var(--transition-interactive),box-shadow var(--transition-interactive)}
:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm)}
button{cursor:pointer;background:none;border:none}
table{border-collapse:collapse;width:100%}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
/* ============ LAYOUT ============ */
.wrap{max-width:1080px;margin-inline:auto;padding-inline:var(--space-5)}
header.topbar{position:sticky;top:0;z-index:50;background:rgba(242,245,243,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--color-divider)}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-3)}
.brand{display:flex;align-items:center;gap:var(--space-3);font-family:var(--font-display);font-weight:800;font-size:var(--text-lg);color:var(--color-text);text-decoration:none}
.brand .bolt{width:34px;height:34px;border-radius:10px;background:var(--color-primary);display:grid;place-items:center;color:#fff;flex-shrink:0}
nav.main{display:flex;gap:var(--space-2);flex-wrap:wrap}
nav.main a{font-size:var(--text-sm);font-weight:500;color:var(--color-text-muted);text-decoration:none;padding:var(--space-2) var(--space-3);border-radius:var(--radius-full,var(--radius-md));white-space:nowrap}
nav.main a:hover{color:var(--color-text);background:var(--color-surface-offset)}
section{padding-block:clamp(var(--space-10),6vw,var(--space-16))}
.section-head{margin-bottom:var(--space-6)}
.kicker{font-size:var(--text-xs);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--color-primary);margin-bottom:var(--space-2)}
.section-head h2{font-size:var(--text-xl);max-width:24ch}
.section-head p{color:var(--color-text-muted);margin-top:var(--space-2)}
.hero{padding-block:clamp(var(--space-12),7vw,var(--space-16));background:linear-gradient(in oklab,var(--color-surface-offset),var(--color-bg))}
.hero h1{font-size:var(--text-xl);max-width:20ch}
.hero .lede{font-size:var(--text-lg);color:var(--color-text-muted);margin-top:var(--space-4);max-width:60ch}
.hero .meta{display:flex;gap:var(--space-4);flex-wrap:wrap;margin-top:var(--space-6)}
.badge{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-full,9999px);padding:var(--space-2) var(--space-4);font-size:var(--text-sm);color:var(--color-text-muted)}
.badge strong{color:var(--color-text)}
/* ============ CARDS / GRIDS ============ */
.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-6);box-shadow:var(--shadow-sm)}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));gap:var(--space-6)}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:var(--space-5)}
/* ============ TABLES ============ */
.tbl-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.rules{font-size:var(--text-sm);border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;background:var(--color-surface)}
table.rules th{background:var(--color-surface-offset);text-align:left;padding:var(--space-3) var(--space-4);font-weight:700;font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.04em;color:var(--color-text-muted)}
table.rules td{padding:var(--space-3) var(--space-4);border-top:1px solid var(--color-divider);vertical-align:top}
table.rules tr.hl td{background:var(--color-primary-highlight)}
table.rules .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
caption.caption{caption-side:bottom;text-align:left;font-size:var(--text-xs);color:var(--color-text-faint);padding-top:var(--space-2)}
/* ============ CALC FORM ============ */
.calc{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:var(--space-4)}
.field label{display:block;font-size:var(--text-xs);font-weight:700;color:var(--color-text-muted);margin-bottom:var(--space-1)}
.field .hint{font-size:var(--text-xs);color:var(--color-text-faint);margin-top:var(--space-1)}
.field input,.field select{width:100%;background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-2) var(--space-3);font-size:var(--text-sm)}
.field input:focus,.field select:focus{border-color:var(--color-primary);background:#fff}
.results{margin-top:var(--space-6);display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:var(--space-4)}
.kpi{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4)}
.kpi .lbl{font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted)}
.kpi .val{font-family:var(--font-display);font-size:var(--text-lg);font-weight:800;margin-top:var(--space-1);font-variant-numeric:tabular-nums}
.kpi .sub{font-size:var(--text-xs);color:var(--color-text-faint);margin-top:var(--space-1)}
.kpi.big{background:var(--color-primary);border-color:var(--color-primary);color:#fff}
.kpi.big .lbl{color:rgba(255,255,255,.8)}
.kpi.big .sub{color:rgba(255,255,255,.75)}
.note{font-size:var(--text-xs);color:var(--color-text-muted);background:var(--color-surface-offset);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);margin-top:var(--space-4)}
.note.warn{background:var(--color-warning-highlight)}
/* ============ BREAKDOWN BARS ============ */
.bars{margin-top:var(--space-6);display:grid;gap:var(--space-3)}
.bar-row{display:grid;grid-template-columns:minmax(120px,200px) 1fr minmax(90px,auto);align-items:center;gap:var(--space-3);font-size:var(--text-sm)}
.bar-row .bar{height:14px;border-radius:var(--radius-full,9999px);background:var(--color-surface-offset);overflow:hidden;min-width:0}
.bar-row .fill{height:100%;border-radius:var(--radius-full,9999px);background:var(--color-primary)}
.bar-row .fill.alt{background:var(--color-accent)}
.bar-row .fill.warn{background:var(--color-warning)}
.bar-row .num{text-align:right;font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
/* ============ TIMELINE ============ */
.timeline{display:grid;gap:var(--space-4)}
.tl-item{display:grid;grid-template-columns:64px 1fr;gap:var(--space-4)}
.tl-year{font-family:var(--font-display);font-weight:800;font-size:var(--text-lg);color:var(--color-primary);padding-top:2px}
.tl-body h3{font-size:var(--text-base);font-weight:700}
.tl-body p{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-1)}
/* ============ CHECKLIST ============ */
.checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:var(--space-4)}
.check{display:flex;gap:var(--space-3);align-items:flex-start;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4)}
.check .tick{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:var(--color-primary);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:800}
.check h4{font-size:var(--text-sm);font-weight:700}
.check p{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:var(--space-1)}
/* ============ SOURCES ============ */
ul.sources{list-style:none;display:grid;gap:var(--space-2)}
ul.sources li{font-size:var(--text-sm);padding-left:var(--space-2)}
ul.sources a{color:var(--color-accent);text-decoration:underline;text-underline-offset:2px}
footer{border-top:1px solid var(--color-divider);padding-block:var(--space-8);color:var(--color-text-muted);font-size:var(--text-sm)}
/* ============ MISC ============ */
.pill{display:inline-block;font-size:var(--text-xs);font-weight:700;padding:2px 10px;border-radius:999px;background:var(--color-surface-offset);color:var(--color-text-muted)}
.pill.ok{background:var(--color-primary-highlight);color:var(--color-primary)}
.pill.warn{background:var(--color-warning-highlight);color:var(--color-warning)}
/* ============ KNOPPEN & SCENARIO'S ============ */
.btn{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--color-primary);color:#fff;border-radius:var(--radius-md);padding:var(--space-2) var(--space-4);font-size:var(--text-sm);font-weight:700}
.btn:hover{background:var(--color-primary-hover)}
.btn.ghost{background:var(--color-surface-2);color:var(--color-text);border:1px solid var(--color-border)}
.btn.ghost:hover{border-color:var(--color-primary);color:var(--color-primary)}
.preset-grid{display:flex;flex-wrap:wrap;gap:var(--space-3)}
.preset-btn{display:flex;flex-direction:column;gap:var(--space-1);align-items:flex-start;background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);font-size:var(--text-sm);font-weight:700;min-width:210px;flex:1}
.preset-btn:hover{border-color:var(--color-primary);background:#fff}
.preset-btn small{font-weight:500;color:var(--color-text-muted);font-size:var(--text-xs)}
#save-status{font-size:var(--text-sm);color:var(--color-success);font-weight:700}
.divider{height:1px;background:var(--color-divider);margin-block:var(--space-8)}
/* ============ PRINT ============ */
.print-btn{display:inline-flex;align-items:center;gap:var(--space-2);background:var(--color-primary);color:#fff;border-radius:var(--radius-md);padding:var(--space-2) var(--space-4);font-size:var(--text-sm);font-weight:700;flex-shrink:0;white-space:nowrap}
.print-btn:hover{background:var(--color-primary-hover)}
#print-rapport{display:none}
@media print{
  html{scroll-padding-top:0}
  body{background:#fff;font-size:11pt;line-height:1.45}
  header.topbar,.print-btn,.hero .meta,.bars{display:none!important}
  section{padding-block:var(--space-4)}
  .hero{padding-block:var(--space-4);background:#fff}
  .card{box-shadow:none;border:1px solid #ccc;break-inside:avoid}
  .wrap{max-width:100%;padding-inline:0}
  .tbl-scroll{overflow:visible}
  table.rules{border:1px solid #999}
  a{color:inherit;text-decoration:none}
  ul.sources a::after{content:" — " attr(href);font-size:8pt;color:#444;word-break:break-all}
  #print-rapport{display:block;break-before:page}
  #print-rapport .rp-sub{color:#444;font-size:9pt;margin-bottom:var(--space-4)}
}
.scroll-hint{display:none;font-size:var(--text-xs);color:var(--color-text-faint);margin-bottom:var(--space-2)}
/* ============ MOBIEL ============ */
@media (max-width:720px){
  html{scroll-padding-top:var(--space-24)}
  .scroll-hint{display:block}
  nav.main{-webkit-mask-image:linear-gradient(to right,#000 90%,transparent);mask-image:linear-gradient(to right,#000 90%,transparent)}
  .topbar-inner{flex-direction:column;align-items:flex-start;gap:var(--space-2);padding-block:var(--space-3)}
  nav.main{width:100%;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:var(--space-1);scrollbar-width:none}
  nav.main::-webkit-scrollbar{display:none}
  nav.main a{padding:var(--space-1) var(--space-2);flex-shrink:0}
  .calc{grid-template-columns:1fr}
  table.rules{font-size:var(--text-xs)}
  table.rules th,table.rules td{padding:var(--space-2) var(--space-3)}
}

/* VOLTKOMPAS independent identity */
:root{--color-bg:#f2f5f8;--color-surface:#ffffff;--color-surface-2:#f7f9fc;--color-surface-offset:#eaf1f5;--color-divider:#dbe4eb;--color-border:#cbd9e1;--color-text:#162c3d;--color-text-muted:#4d6372;--color-text-faint:#718494;--color-primary:#001532;--color-primary-hover:#062650;--color-primary-highlight:#e0f8ff;--color-accent:#326de6;--color-success:#0874a0;--radius-lg:1.25rem;--radius-xl:1.75rem;--shadow-sm:0 8px 28px rgba(15,43,58,.045);--shadow-md:0 18px 44px rgba(15,43,58,.12)}
body{background:radial-gradient(circle at 85% 0%,#e5f8ff 0,transparent 38%),var(--color-bg)}
header.topbar{background:rgba(249,252,253,.88);backdrop-filter:blur(16px)}
.brand{letter-spacing:-.04em;font-size:1.45rem}.brand .bolt{background:linear-gradient(140deg,#001532,#00c9ed);box-shadow:0 8px 22px #067a8355}
.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 88% 26%,#256c89 0,transparent 28%),linear-gradient(120deg,#102d42,#15495a);color:white;min-height:370px}
.hero:after{content:"";position:absolute;right:-80px;top:5%;width:340px;height:340px;border-radius:50%;border:65px solid rgba(114,228,198,.10);pointer-events:none;animation:floatRing 10s ease-in-out infinite}
.hero .kicker{color:#53ddff}.hero h1{font-size:clamp(2.6rem,6vw,5.4rem);line-height:1.03;max-width:14ch;letter-spacing:-.055em}.hero .lede{color:#d8e8ef;max-width:65ch}.hero .badge{background:#ffffff17;color:#ecffff;border-color:#ffffff50}.hero .badge strong{color:white}
@keyframes floatRing{50%{transform:translate(-35px,25px) rotate(18deg)}}
.card{border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
@media(hover:hover){.card:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}}
.kpi.big{background:linear-gradient(135deg,#001532,#087cb8);box-shadow:0 12px 30px #047c802a}
.btn,.print-btn{border-radius:999px;padding:12px 19px}.preset-btn{border-radius:15px;transition:transform .25s,background .25s,border-color .25s}.preset-btn:hover{transform:translateY(-3px)}
section{scroll-margin-top:95px}.section-head h2{letter-spacing:-.035em}.tl-year{color:#0874a0}
.reveal-v{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}.reveal-v.show{opacity:1;transform:none}
.donation-launch{position:fixed;bottom:22px;right:22px;z-index:70;border-radius:999px;background:#132f42;color:#fff;padding:13px 19px;box-shadow:0 10px 35px #17344755;font-weight:700}
.donation-dialog{position:fixed;inset:0;z-index:150;background:#102936a8;backdrop-filter:blur(7px);display:none;place-items:center;padding:18px}.donation-dialog.open{display:grid}
.donation-panel{width:min(100%,480px);background:white;border-radius:24px;padding:clamp(24px,5vw,38px);box-shadow:0 20px 60px #081d3155;color:#19364a}
.donation-panel h2{font-size:clamp(1.6rem,4vw,2.2rem);margin-bottom:14px}.donation-panel p{color:#4d6471;line-height:1.6;margin-bottom:20px}
.donation-row{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:16px}.donation-row button{padding:10px 17px;border:1px solid #bad2d9;border-radius:999px;font-weight:700}.donation-row button:hover,.donation-row button:focus{background:#e6f7ff}
.donation-panel .skip{margin-top:12px;text-decoration:underline;color:#476070;font-size:.94rem}.donation-note{font-size:.85rem!important;margin-top:10px!important}
@media(prefers-reduced-motion:reduce){.hero:after{animation:none}.reveal-v{opacity:1;transform:none;transition:none}}
@media print{.donation-launch,.donation-dialog{display:none!important}.reveal-v{opacity:1!important;transform:none!important}}

/* Audience-specific start and navigation */
.audience-choice{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:28px;max-width:860px}
.audience-card{display:flex;flex-direction:column;gap:8px;text-align:left;padding:24px;border:1px solid #ffffff55;border-radius:20px;background:#ffffff14;color:#fff;backdrop-filter:blur(8px);transition:transform .25s,background .25s,box-shadow .25s;cursor:pointer}
.audience-card:hover{transform:translateY(-4px);background:#ffffff25}.audience-card.selected{background:#f8ffff;color:#16364a;box-shadow:0 10px 40px #071b3840;border-color:#71dfc5}
.audience-card .aud-icon{font-size:1.8rem}.audience-card strong{font-size:1.25rem;font-family:var(--font-display);line-height:1.15}.audience-card span:last-child{font-size:.91rem;line-height:1.5;opacity:.84}
.route-banner{background:#e3f5f1;border:1px solid #afdcd5;border-radius:16px;padding:18px 22px;margin-top:20px;display:none;align-items:center;justify-content:space-between;gap:12px}
.route-banner.visible{display:flex}.route-banner p{font-size:.92rem}.route-banner button{font-size:.9rem;text-decoration:underline;color:#046d79;font-weight:700}
body[data-audience="private"] #bijtelling,body[data-audience="private"] #keuze,body[data-audience="private"] #rechtsvorm{display:none}
body[data-audience="private"] #regels{display:none}
body[data-audience="private"] #scenarios .preset-grid{display:none}
body[data-audience="private"] #v-load-ev,body[data-audience="private"] #v-load-benz{display:none}
body[data-audience="private"] nav.main a[href="https://rijvanta.nl/#bijtelling"],body[data-audience="private"] nav.main a[href="https://rijvanta.nl/#keuze"],body[data-audience="private"] nav.main a[href="https://rijvanta.nl/#rechtsvorm"],body[data-audience="private"] nav.main a[href="https://rijvanta.nl/#regels"]{display:none}
body[data-audience="private"] #lease .section-head p{max-width:70ch}
body[data-audience="private"] .for-business{display:none}
body[data-audience="business"] .for-private{display:none}
@media(max-width:650px){.audience-choice{grid-template-columns:1fr}.audience-card{padding:17px}.route-banner{align-items:flex-start;flex-direction:column}}
@media print{.audience-choice,.route-banner{display:none!important}}

/* Single-value entry. Model-specific offers are intentionally excluded to avoid stale data. */
#scenarios>.wrap>.card:nth-of-type(2){display:none}
#scenarios>.wrap>.card:first-of-type .preset-grid{display:none}
#scenarios>.wrap>.card:first-of-type{display:none}
#startberekening{scroll-margin-top:110px}
@media(max-width:720px){#startberekening .btn{width:100%;justify-content:center}}

.knowledge-hub{padding:72px 0;background:var(--color-surface-offset)}.knowledge-hub .hub-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.knowledge-hub .hub-article{display:flex;flex-direction:column;gap:12px}.knowledge-hub .hub-article a{margin-top:auto;color:var(--color-primary);font-weight:700}.knowledge-hub details{border-bottom:1px solid var(--color-divider);padding:14px 2px}.knowledge-hub summary{cursor:pointer;font-weight:700}.knowledge-hub details p{padding-top:10px}.hub-links{padding-left:20px;line-height:1.9}.hub-links a{color:var(--color-primary);text-decoration:underline}@media(max-width:760px){.knowledge-hub .hub-grid{grid-template-columns:1fr}.knowledge-hub{padding:48px 0}}