/* Rekenstrook · «de kassa». Oranje toonbank, grafiet kasregister met amber LED-display, thermisch bonnetje, gele meetlint.
   Harde regel: nooit border-left of border-top. Scheiden met vlakken, schaduw, radius en ruimte. */
@font-face{font-family:"Bricolage Grotesque";src:url(/static/fonts/bricolage-latin.woff2) format("woff2");font-weight:400 800;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(/static/fonts/plexmono-500.woff2) format("woff2");font-weight:500;font-display:swap}

:root{
  --oranje:#FF5F1F;--oranje-d:#C9420B;--inkt:#16171B;--zacht:#5A5E69;--papier:#F3EFE6;--vel:#FFFEFA;--regel:#E3DCCE;
  --kassa:#22252C;--kassa-d:#17191E;--toets:#363A45;--led:#FFB23F;--lcd:#0E0B06;--netto:#0B7A4E;--rood:#D22A1E;--tape:#FFD23F;
  --bon:#FFFDF6;--bon-inkt:#1C1C1C;--bon-regel:#D9D3C4;
  --sans:"Bricolage Grotesque",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --schaduw:0 1px 2px rgb(22 23 27/.06),0 12px 32px -12px rgb(22 23 27/.18);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--inkt:#F0EBE1;--zacht:#A9AEB9;--papier:#101115;--vel:#1A1C21;--regel:#2B2E36;--netto:#3DD598;--schaduw:0 12px 32px -12px rgb(0 0 0/.6);color-scheme:dark}}
:root[data-theme=dark]{--inkt:#F0EBE1;--zacht:#A9AEB9;--papier:#101115;--vel:#1A1C21;--regel:#2B2E36;--netto:#3DD598;--schaduw:0 12px 32px -12px rgb(0 0 0/.6);color-scheme:dark}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:120px}
body{margin:0;background:var(--papier);color:var(--inkt);font-family:var(--sans);font-size:17px;line-height:1.85;-webkit-font-smoothing:antialiased;overflow-x:hidden;counter-reset:h2}
a{color:inherit;text-decoration:none;background:linear-gradient(var(--oranje),var(--oranje)) 0 100%/100% 2px no-repeat;transition:background-size .15s,color .15s}
a:hover{background-size:100% 100%;color:#16171B}
:focus-visible{outline:3px solid var(--oranje);outline-offset:3px;border-radius:6px}
img,svg{max-width:100%;height:auto}
h1,h2,h3{line-height:1.08;letter-spacing:-.03em;font-weight:800;text-wrap:balance;overflow-wrap:break-word;hyphens:auto;-webkit-hyphens:auto}
h1{font-size:clamp(32px,8.4vw,64px);margin:.1em 0 .3em}
h2{font-size:clamp(24px,5.4vw,34px);margin:2.4em 0 .6em}
h3{font-size:20px;margin:1.8em 0 .4em;letter-spacing:-.015em}
p,li{max-width:68ch}p{margin:0 0 1.15em}
.num,.mono{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:500}
.wrap{max-width:1180px;margin:0 auto;padding:0 16px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:8px;background:#fff;color:#000;padding:8px 12px;z-index:99}

/* ---------- kop + ticker ---------- */
.kop{position:sticky;top:0;z-index:30;background:#16171B;color:#F3EFE6}
.kopbalk{display:flex;align-items:center;justify-content:space-between;height:56px;gap:12px}
.logo{display:flex;align-items:center;gap:10px;font-weight:800;font-size:21px;letter-spacing:-.03em;background:none;color:#F3EFE6}
.logo:hover{color:#fff;background:none}
.logo svg{width:30px;height:30px;color:#F3EFE6}
.menu{display:flex;gap:2px}
.menu a{background:none;font-weight:650;font-size:15px;padding:8px 12px;border-radius:999px;color:#E9E4DA}
.menu a:hover,.menu a[aria-current=page]{background:#2B2D34;color:#fff}
.burger{display:none;background:none;border:0;color:#fff;width:48px;height:48px;border-radius:12px;cursor:pointer}
.burger svg{width:26px;height:26px}
@media (max-width:860px){.burger{display:inline-grid;place-items:center}
  .menu{display:none;position:absolute;left:0;right:0;top:56px;flex-direction:column;background:#16171B;padding:6px 16px 18px;box-shadow:0 20px 30px rgb(0 0 0/.35)}
  .menu.open{display:flex}.menu a{padding:13px 14px;font-size:18px}}
.ticker{background:var(--bon);color:#1C1C1C;overflow:hidden;height:34px;font:500 13px/34px var(--mono);white-space:nowrap;
  -webkit-mask:linear-gradient(90deg,#0000,#000 24px,#000 calc(100% - 24px),#0000);mask:linear-gradient(90deg,#0000,#000 24px,#000 calc(100% - 24px),#0000)}
.ticker-rail{display:inline-flex;animation:tik 38s linear infinite}
.ticker:hover .ticker-rail,.ticker:focus-within .ticker-rail{animation-play-state:paused}
.ticker a{background:none;padding:0 22px;color:#1C1C1C}
.ticker a::after{content:"✂";margin-left:22px;color:#BDB6A6}
.ticker a b{color:var(--oranje-d);font-weight:500;margin-right:4px}
.ticker .kopie{display:inline-flex}
@keyframes tik{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker{overflow-x:auto;-webkit-mask:none;mask:none}.ticker-rail{animation:none}.ticker .kopie{display:none}}

/* ---------- oranje toonbank (volle breedte) ---------- */
.kruimels,.hero,.snel,.lint{box-shadow:0 0 0 100vmax var(--oranje);clip-path:inset(0 -100vmax);background:var(--oranje);color:#16171B}
.kruimels{font:500 13px/1.5 var(--mono);padding:16px 0 0;margin:0;text-transform:uppercase;letter-spacing:.04em}
.kruimels ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 8px}
.kruimels li{max-width:none}.kruimels li+li::before{content:"/";margin-right:8px;opacity:.5}
.kruimels a{background:none;opacity:.8}.kruimels a:hover{opacity:1;color:#16171B}
.hero{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start;padding:10px 0 34px;position:relative}
.hero>*{min-width:0}
.hero .lead,.hero p{font-size:18px;line-height:1.65;max-width:52ch}
.hero a{background-image:linear-gradient(#16171B,#16171B)}
.hero a:hover{color:var(--oranje)}
.hero.enkel{padding-bottom:40px}
@media (max-width:899px){.hero>div:first-child{display:contents}.hero>div:first-child>h1{order:1}.hero>.kassa,.hero>.kassa-vak{order:2}.hero>div:first-child>*:not(h1){order:3}.hero>div:first-child>.tarieven{order:1}}
@media (min-width:900px){.hero{grid-template-columns:minmax(0,1fr) minmax(380px,480px);gap:56px;padding:26px 0 56px}.hero.enkel{grid-template-columns:minmax(0,860px)}
  .hero>div:first-child{position:sticky;top:120px}}
.lucht{height:50px}
.vandaag{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0;font:500 13.5px/1.4 var(--mono)}
.vandaag span{background:#16171B;color:#F3EFE6;border-radius:999px;padding:8px 14px}
.vandaag b{color:var(--led);font-weight:500}

/* snel naar */
.snel{display:flex;gap:8px;overflow-x:auto;padding:0 0 22px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.snel::-webkit-scrollbar{display:none}
.snel::before{content:"SNEL NAAR";font:500 12px/40px var(--mono);letter-spacing:.08em;flex:none;opacity:.7}
.snel a{flex:none;background:#16171B;color:#F3EFE6;border-radius:999px;padding:0 16px;min-height:40px;display:inline-flex;align-items:center;font-weight:650;font-size:15px}
.snel a:hover{background:#fff;color:#16171B}

/* meetlint (bedragpagina's) */
.lint{padding:0 0 26px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.lint::-webkit-scrollbar{display:none}
.lint-rail{display:inline-flex;background:var(--tape);border-radius:10px;box-shadow:0 10px 24px -10px rgb(0 0 0/.45),inset 0 -3px 0 rgb(0 0 0/.12);
  background-image:repeating-linear-gradient(90deg,#16171B 0 1.5px,#0000 1.5px 10px);background-size:100% 12px;background-repeat:repeat-x;background-position:0 0}
.lint a{background:none;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:78px;height:74px;padding:0 6px 8px;position:relative;color:#16171B}
.lint a::before{content:"";position:absolute;top:0;left:50%;width:2px;height:22px;background:#16171B}
.lint a b{font:500 16px/1.1 var(--mono)}
.lint a small{font:500 11.5px/1.3 var(--mono);opacity:.65}
.lint a:hover{background:rgb(0 0 0/.07)}
.lint a[aria-current]{background:#16171B;color:var(--tape);border-radius:8px}
.lint a[aria-current]::before{background:var(--rood);width:4px;height:26px}

/* ---------- DE KASSA ---------- */
.kassa{position:relative;background:linear-gradient(180deg,#2C3038 0%,var(--kassa) 38%,var(--kassa-d) 100%);border-radius:26px 26px 20px 20px;padding:14px 14px 0;color:#E9E4DA;
  box-shadow:0 34px 60px -26px rgb(0 0 0/.65),0 0 0 1px #0C0D10,inset 0 1px 0 rgb(255 255 255/.10);transition:transform .25s ease-out;transform-style:preserve-3d;min-width:0}
.kassa-kop{display:flex;align-items:center;gap:10px;padding:2px 4px 12px}
.lampje{width:10px;height:10px;border-radius:50%;background:#46E08C;box-shadow:0 0 0 3px rgb(70 224 140/.18),0 0 12px #46E08C;flex:none;animation:puls 2.4s ease-in-out infinite}
@keyframes puls{50%{box-shadow:0 0 0 5px rgb(70 224 140/.08),0 0 4px #46E08C}}
.kassa .kopje{margin:0;font:500 12.5px/1.3 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:#C9C3B6;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.merk::before{content:attr(data-c);font:500 11px var(--mono);letter-spacing:.08em;text-transform:uppercase;background:var(--oranje);color:#16171B;border-radius:6px;padding:3px 7px}

/* LED-display */
.display{position:relative;background:var(--lcd);border-radius:14px;padding:26px 14px 12px;min-height:96px;display:flex;align-items:flex-end;justify-content:flex-end;gap:10px;overflow:hidden;
  box-shadow:inset 0 3px 10px rgb(0 0 0/.85),inset 0 0 0 1px rgb(255 178 63/.08),0 1px 0 rgb(255 255 255/.06);
  --h:clamp(40px,12.2vw,62px);--w:calc(var(--h)*.5);--t:calc(var(--h)*.105)}
.display::before{content:attr(data-l);position:absolute;top:9px;left:14px;font:500 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--led);opacity:.75}
.display::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgb(255 255 255/.025) 0 1px,#0000 1px 3px);pointer-events:none}
.eur::before{content:attr(data-c);font:500 calc(var(--h)*.42)/1 var(--mono);color:var(--led);text-shadow:0 0 12px rgb(255 160 40/.6);display:block;padding-bottom:calc(var(--h)*.04)}
.seg{display:inline-flex;align-items:flex-end;gap:calc(var(--h)*.09);transform:skewX(-7deg);min-width:0}
.seg .d{position:relative;width:var(--w);height:var(--h);flex:none}
.seg b{position:absolute;background:var(--led);opacity:.07;border-radius:2px}
.seg b.on{opacity:1;filter:drop-shadow(0 0 5px rgb(255 150 30/.75))}
.seg .sa,.seg .sd,.seg .sg{left:calc(var(--t)*.55);right:calc(var(--t)*.55);height:var(--t);clip-path:polygon(calc(var(--t)/2) 0,calc(100% - var(--t)/2) 0,100% 50%,calc(100% - var(--t)/2) 100%,calc(var(--t)/2) 100%,0 50%)}
.seg .sa{top:0}.seg .sd{bottom:0}.seg .sg{top:calc(50% - var(--t)/2)}
.seg .sb,.seg .sc,.seg .se,.seg .sf{width:var(--t);height:calc(50% - var(--t)*.35);clip-path:polygon(50% 0,100% calc(var(--t)/2),100% calc(100% - var(--t)/2),50% 100%,0 calc(100% - var(--t)/2),0 calc(var(--t)/2))}
.seg .sb{right:0;top:calc(var(--t)*.4)}.seg .sc{right:0;bottom:calc(var(--t)*.4)}.seg .se{left:0;bottom:calc(var(--t)*.4)}.seg .sf{left:0;top:calc(var(--t)*.4)}
.seg .p{width:var(--t);height:var(--t);background:var(--led);border-radius:50%;filter:drop-shadow(0 0 5px rgb(255 150 30/.75));margin:0 calc(var(--h)*-.02)}
.seg .p{position:relative}.seg .p.k::after{content:"";position:absolute;left:15%;top:75%;width:55%;height:120%;background:var(--led);border-radius:0 0 40% 60%;transform:skewX(-25deg)}
.seg .sp{width:calc(var(--w)*.4)}
.seg .y::before{content:attr(data-c);font:500 calc(var(--h)*.5)/1 var(--mono);color:var(--led)}
@media (max-width:380px){.display{--h:clamp(34px,11vw,48px)}}

/* bediening */
.bediening{padding:14px 2px 4px}
.kassa .veld{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;margin:0 0 12px;min-width:0;border:0;padding:0}
.kassa .veld label,.kassa .veld .lbl,.kassa legend{font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#A8A294}
.kassa .veld label input[type=checkbox]{accent-color:var(--oranje);width:20px;height:20px}
.kassa .veld label:has(input[type=checkbox]){font:600 15px var(--sans);letter-spacing:0;text-transform:none;color:#E9E4DA;display:flex;align-items:center;gap:10px;min-height:44px}
.invoer{display:flex;align-items:center;background:#0F1013;border-radius:12px;box-shadow:inset 0 2px 6px rgb(0 0 0/.7),0 1px 0 rgb(255 255 255/.06);transition:box-shadow .12s}
.invoer:focus-within{box-shadow:inset 0 2px 6px rgb(0 0 0/.7),0 0 0 2px var(--oranje)}
.invoer span{padding:0 2px 0 14px;font:500 20px var(--mono);color:#7E786C}
.invoer input,.invoer select{flex:1;min-width:0;width:100%;height:56px;border:0;background:transparent;color:#FFF7E8;font:500 24px var(--mono);padding:0 14px 0 8px}
.invoer select{font:650 16px var(--sans);padding:0 40px 0 14px;cursor:pointer;color:#FFF7E8;-webkit-appearance:none;appearance:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23FFB23F' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat right 16px center}
.invoer select option{background:#1C1E24;color:#FFF7E8}
.invoer input:focus,.invoer select:focus{outline:none}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips label{position:relative;flex:1 1 0;min-width:64px}
.chips input{position:absolute;opacity:0;inset:0;cursor:pointer;margin:0}
.chips span{text-transform:none;letter-spacing:0;display:grid;place-items:center;min-height:54px;padding:0 12px;border-radius:12px;background:linear-gradient(180deg,#434856,var(--toets));color:#F3EEE2;font:500 17px var(--mono);cursor:pointer;user-select:none;text-align:center;line-height:1.2;
  box-shadow:0 5px 0 #0B0C0F,0 8px 14px rgb(0 0 0/.35),inset 0 1px 0 rgb(255 255 255/.14);transition:transform .06s,box-shadow .06s}
.chips label:active span{transform:translateY(4px);box-shadow:0 1px 0 #0B0C0F,inset 0 1px 0 rgb(255 255 255/.14)}
.chips input:checked+span{background:linear-gradient(180deg,#FF7A3D,var(--oranje));color:#16171B;box-shadow:0 5px 0 #8E300A,0 8px 18px rgb(255 95 31/.35),inset 0 1px 0 rgb(255 255 255/.35)}
.chips input:focus-visible+span{outline:3px solid #fff;outline-offset:3px}
.opties{margin:2px 0 10px;background:#2A2D35;border-radius:12px;padding:0 14px;box-shadow:inset 0 1px 0 rgb(255 255 255/.05)}
.opties summary{cursor:pointer;min-height:46px;display:flex;align-items:center;font:500 12.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:#C9C3B6;list-style:none}
.opties summary::-webkit-details-marker{display:none}
.opties summary::after{content:"+";margin-left:auto;font:500 20px var(--mono);color:var(--led)}
.opties[open] summary::after{content:"−"}
.opties .binnen{padding:4px 0 10px}
.fregels{width:100%;border-collapse:collapse;margin:0 0 6px}
@media (max-width:560px){.fregels,.fregels tbody{display:block}.fregels tr{display:grid;grid-template-columns:minmax(0,1fr) 92px 40px;gap:6px;margin:0 0 12px;background:#2A2D35;border-radius:12px;padding:8px}
  .fregels td{padding:0}.fregels td:first-child{grid-column:1/-1}.fregels td[style]{width:auto!important}}
.fregels td{padding:4px 3px;vertical-align:middle}
.fregels input,.fregels select{width:100%;height:48px;border:0;border-radius:10px;background:#0F1013;box-shadow:inset 0 2px 6px rgb(0 0 0/.7);color:#FFF7E8;padding:0 10px;font:500 15.5px var(--mono);min-width:0}
.fregels select{font:600 15px var(--sans)}
.fregels .x{width:40px}.fregels .x button{width:40px;height:40px;border:0;border-radius:10px;background:transparent;color:#8D877A;cursor:pointer;font-size:22px}
.kassa .knoppen{display:flex;flex-wrap:wrap;gap:8px}
.kassa .knop{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 16px;border-radius:12px;border:0;cursor:pointer;
  background:linear-gradient(180deg,#434856,var(--toets));color:#F3EEE2;font:600 15px var(--sans);box-shadow:0 4px 0 #0B0C0F}
.kassa .knop:active{transform:translateY(3px);box-shadow:0 1px 0 #0B0C0F}
.kassa .knop.hoofd{background:linear-gradient(180deg,#FF7A3D,var(--oranje));color:#16171B;box-shadow:0 4px 0 #8E300A}
.knop svg{width:18px;height:18px}
.gleuf{height:14px;margin:12px -2px 0;background:#050506;border-radius:8px;box-shadow:inset 0 3px 6px #000,0 1px 0 rgb(255 255 255/.08)}

/* het bonnetje */
.papier{position:relative;margin:-7px 10px 0;background:var(--bon);color:var(--bon-inkt);padding:14px 14px 34px;z-index:1;
  box-shadow:inset 0 10px 10px -8px rgb(0 0 0/.35);
  -webkit-mask:linear-gradient(#000 0 0) top/100% calc(100% - 10px) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/14px 10px repeat-x;
  mask:linear-gradient(#000 0 0) top/100% calc(100% - 10px) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/14px 10px repeat-x}
.papier:empty{display:none}
.papier.print{animation:print .5s steps(10,end)}
@keyframes print{from{clip-path:inset(0 0 100% 0);transform:translateY(-18px)}to{clip-path:inset(0 0 0 0);transform:none}}
@media (prefers-reduced-motion:reduce){.papier.print,.lampje{animation:none}}
.bon{width:100%;border-collapse:separate;border-spacing:0;font-size:15px}
.bon th{text-align:left;font-weight:500;font-size:14.5px;padding:8px 10px 8px 0;border-bottom:1px dashed var(--bon-regel);line-height:1.35;hyphens:manual;overflow-wrap:break-word}
.bon td{width:1%;text-align:right;padding:8px 0;border-bottom:1px dashed var(--bon-regel);white-space:nowrap;font:500 clamp(14.5px,4.3vw,16.5px) var(--mono)}
.bon tr.min td::before{content:"− "}
.bon tr.klein th,.bon tr.klein td{font-size:13.5px;color:#5E5A52}
.bon tr.tot th,.bon tr.tot td{border:0;background:#16171B;color:#FFF7E8;padding:12px 12px;font-weight:700}
.bon tr.tot th{border-radius:8px 0 0 8px;font:500 12px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.bon tr.tot td{border-radius:0 8px 8px 0;font-size:clamp(19px,5.6vw,26px);color:#7CF0B0}
.bon tr.tot.btw td{color:var(--led)}
.bon tr.tot+tr th,.bon tr.tot+tr td{padding-top:12px}
.bon tr[hidden]{display:none}
.formule{font:500 13.5px/1.6 var(--mono);color:#4B4840;background:#F1ECDF;border-radius:8px;padding:8px 12px;margin:12px 0 0;overflow-x:auto;white-space:nowrap}
.papier .knoppen{margin-top:14px;display:flex;gap:8px}
.papier .knop{display:inline-grid;place-items:center;border:0;cursor:pointer;background:#EEE8DA;color:#1C1C1C;box-shadow:0 3px 0 #C9C1AE;min-height:46px}
.knop.rond{width:46px;padding:0;border-radius:50%}
.melding{font:500 13px var(--mono);color:var(--rood);min-height:1.2em;margin:6px 0 0}
footer.bron{display:block;font:500 11.5px/1.6 var(--mono);color:#6D685E;margin:14px 0 0;letter-spacing:.01em}
footer.bron a{background-image:linear-gradient(#6D685E,#6D685E);background-size:100% 1px}
.uitkomst .totaal{display:flex;justify-content:space-between;gap:10px;background:#16171B;color:#FFF7E8;border-radius:8px;padding:12px;font-weight:700;flex-wrap:wrap}
.uitkomst .totaal.btw{color:var(--led)}

/* home-schakelaar */
.tabs{display:flex;gap:6px;background:#16171B;padding:6px;border-radius:16px;margin:0 0 12px;box-shadow:0 12px 24px -12px rgb(0 0 0/.5)}
.tabs button{flex:1;min-height:48px;border:0;background:transparent;border-radius:11px;font:650 16px var(--sans);color:#C9C3B6;cursor:pointer}
.tabs button[aria-selected=true]{background:var(--oranje);color:#16171B;box-shadow:0 3px 0 #8E300A}

/* btw-op: tariefstempels */
.tarieven{display:flex;gap:14px;flex-wrap:wrap;margin:4px 0 14px}
.tarief{display:grid;place-items:center;width:104px;height:104px;border-radius:50%;box-shadow:inset 0 0 0 4px #16171B,inset 0 0 0 8px var(--oranje),inset 0 0 0 10px #16171B;color:#16171B;font:500 32px var(--mono);transform:rotate(-8deg)}
.tarief.neutraal{font:700 13px/1.2 var(--sans);text-align:center;padding:10px;text-transform:uppercase}
.grondslag{display:block;font:500 12.5px/1.6 var(--mono);margin:0 0 10px;opacity:.85}

/* ---------- inhoud ---------- */
.prose{max-width:760px}
.prose h2{counter-increment:h2}
.prose h2::before{content:counter(h2,decimal-leading-zero);display:block;font:500 13px var(--mono);letter-spacing:.1em;color:var(--oranje-d);margin-bottom:10px}
.faq h2::before{content:"FAQ";display:block;font:500 13px var(--mono);letter-spacing:.1em;color:var(--oranje-d);margin-bottom:10px}
.prose ul,.prose ol{padding-left:1.2em}.prose li{margin:.4em 0}.prose li::marker{color:var(--oranje)}
.letop{background:color-mix(in srgb,var(--tape) 45%,var(--vel));border-radius:16px;padding:18px 20px;margin:1.6em 0;color:var(--inkt)}
.letop strong:first-child{display:block;font:500 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;margin-bottom:4px}
.letop ul{margin:0}
.tabel-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1.4em 0;border-radius:16px;background:var(--vel);box-shadow:var(--schaduw)}
table.data{width:100%;border-collapse:collapse;font-size:15.5px;line-height:1.5}
table.data caption{text-align:left;font:500 12px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--zacht);padding:14px 16px 10px;caption-side:top}
table.data th,table.data td{padding:12px 16px;border-bottom:1px solid var(--regel);text-align:left;white-space:nowrap}
table.data td.r,table.data th.r{text-align:right}
table.data td.num,table.data td .num{font-family:var(--mono)}
table.data thead th{font:500 11.5px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:#F3EFE6;background:#16171B}
table.data tbody tr:last-child td,table.data tbody tr:last-child th{border-bottom:0}
table.data tbody tr:hover td,table.data tbody tr:hover th{background:color-mix(in srgb,var(--oranje) 7%,transparent)}
table.data tr.hier td{background:color-mix(in srgb,var(--tape) 55%,transparent);font-weight:700}
table.data th[scope=row]{font-weight:700;position:sticky;left:0;background:var(--vel)}
table.data td.wrap{white-space:normal;min-width:190px}
.links2{display:grid;gap:0 28px;grid-template-columns:1fr;padding:0;list-style:none;margin:1.4em 0}
@media (min-width:700px){.links2{grid-template-columns:1fr 1fr}}
.links2 li{max-width:none;padding:12px 0;border-bottom:1px solid var(--regel);display:flex;justify-content:space-between;gap:10px;font-weight:650}
.links2 li span{color:var(--zacht);font:500 13.5px var(--mono);white-space:nowrap}
.faq{counter-reset:q;margin-top:2.4em;max-width:760px}
.faq details{background:var(--vel);border-radius:16px;margin:10px 0;box-shadow:var(--schaduw);counter-increment:q}
.faq summary{cursor:pointer;padding:16px 18px;font-weight:750;font-size:17px;line-height:1.4;display:flex;align-items:center;gap:14px;list-style:none;min-height:56px}
.faq summary::before{content:"Q" counter(q,decimal-leading-zero);font:500 12px var(--mono);color:var(--oranje-d);flex:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";margin-left:auto;font:500 22px var(--mono);color:var(--oranje)}
.faq details[open] summary::after{content:"−"}
.faq .antwoord{padding:0 18px 8px 60px}
.bron{font:500 12.5px/1.6 var(--mono);color:var(--zacht)}

/* voet */
.voet{margin-top:80px;background:#16171B;color:#CFC9BC;padding:48px 0 30px;font-size:15px;line-height:1.75}
.voet .kol{display:grid;gap:28px;grid-template-columns:1fr 1fr}
.voet .kol>div:first-child{grid-column:1/-1}
@media (min-width:860px){.voet .kol{grid-template-columns:1.5fr 1fr 1fr 1fr}.voet .kol>div:first-child{grid-column:auto}}
.voet h2{font:500 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;margin:0 0 10px;color:var(--oranje)}
.voet ul{list-style:none;padding:0;margin:0}.voet a{color:#EDE7DA;background-image:linear-gradient(#3A3D46,#3A3D46)}
.voet a:hover{color:#16171B;background-image:linear-gradient(var(--oranje),var(--oranje))}
.voet .klein{font:500 12px/1.7 var(--mono);color:#8F897D;margin-top:30px;max-width:none}
.thema{background:#2B2D34;border:0;color:#EDE7DA;cursor:pointer;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;font:600 14px var(--sans)}
.thema svg{width:18px;height:18px}