/* ============================================================
   Portaalsite Keuringsinbox — wereld: de keuringssticker.
   Raakt uitsluitend laag-2-tokens uit brand/tokens.css.
   Nul hexwaarden: elke kleur komt uit config/theme.tokens.json.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0; background: var(--surface-canvas); color: var(--text-body);
  font-family: var(--font-body); font-size: var(--fs-base); line-height: var(--lh-body);
  font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { margin: 0; font-family: var(--font-display); font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.005em; color: var(--text-strong); }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; }
main:focus { outline: none; }
/* Geen mono-familie: die staat niet in de type-ramp, en een bestandsnaam in
   lopende tekst heeft er geen nodig. */
code { font-family: inherit; font-weight: 600; }

:focus-visible { outline: var(--focus-ring-width) solid var(--ring); outline-offset: var(--focus-ring-offset); }
.op-donker:focus-visible { outline-color: var(--ring-on-inverse); }
.op-sticker:focus-visible { outline-color: var(--ring-on-sticker); }

.overslaan { position: absolute; left: -9999px; top: 0; z-index: 10; min-height: var(--target-min);
  display: inline-flex; align-items: center; padding: 0 var(--space-6);
  background: var(--color-action-on-inverse); color: var(--text-on-action-inverse);
  font-family: var(--font-display); font-weight: 700; text-transform: uppercase; text-decoration: none; }
.overslaan:focus { left: var(--space-6); top: var(--space-6); }

.wrap { max-width: var(--container-max); margin-inline: auto; }
.wrap--smal { max-width: var(--container-narrow); margin-inline: 0; }

/* ---------------------------------------------------------- knoppen */
.knop { display: inline-flex; align-items: center; justify-content: center;
  min-height: var(--target-min); padding: 0 var(--space-7);
  border: var(--rule-strong) solid var(--color-action);
  background: var(--color-action); color: var(--text-on-action);
  font-family: var(--font-display); font-weight: 700; font-size: var(--fs-base);
  text-transform: uppercase; letter-spacing: 0.06em; text-decoration: none; cursor: pointer;
  transition: background var(--motion-state) var(--motion-ease), color var(--motion-state) var(--motion-ease); }
.knop:hover { background: transparent; color: var(--color-action); }
.knop--leeg { background: transparent; color: var(--color-action); }
.knop--leeg:hover { background: var(--color-action); color: var(--text-on-action); }
.knop--op-donker { background: var(--color-action-on-inverse); color: var(--text-on-action-inverse);
  border-color: var(--color-action-on-inverse); }
.knop--op-donker:hover { background: var(--color-action-on-inverse-hover, var(--text-on-inverse));
  border-color: var(--color-action-on-inverse-hover, var(--text-on-inverse)); color: var(--text-on-action-inverse); }

/* ---------------------------------------------------------- de balk */
.balk { background: var(--surface-inverse-deep); color: var(--text-on-inverse);
  padding: var(--space-4) var(--space-7); }
.balk__rij { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: var(--space-4) var(--space-6); }
.merk { display: inline-flex; align-items: center; gap: var(--space-5); text-decoration: none;
  min-height: var(--target-min); }
.merk svg { display: block; }
.merk__woord { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-lg);
  text-transform: uppercase; letter-spacing: 0.04em; }
.balk__nav { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4) var(--space-6); }
.balk__nav a:not(.knop) { display: inline-flex; align-items: center; min-height: var(--target-min);
  font-size: var(--fs-sm); font-weight: 600; text-decoration: none;
  border-bottom: var(--rule-strong) solid transparent;
  transition: border-color var(--motion-state) var(--motion-ease); }
.balk__nav a:not(.knop):hover { border-bottom-color: var(--color-action-on-inverse); }

/* ------------------------------------------------------- de sticker */
.sticker { background: var(--surface-sticker); color: var(--text-on-sticker);
  border-bottom: var(--die-width) solid var(--border-die);
  padding: var(--space-9) var(--space-7) var(--space-8); }
.sticker__grid { display: grid; gap: var(--space-8); }
@media (min-width: 62rem) {
  .sticker { padding-block: var(--space-10); }
  .sticker__grid { grid-template-columns: minmax(0, 20rem) minmax(0, 1fr);
    column-gap: var(--space-10); align-items: center; }
}
.stempel { display: grid; justify-items: center; gap: var(--space-6); }
.stempel svg { display: block; width: min(17rem, 60vw); height: auto; }
.stempel__bijschrift { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xs);
  text-transform: uppercase; letter-spacing: 0.14em; }
.sticker h1 { font-size: var(--fs-3xl); line-height: var(--lh-tight); letter-spacing: -0.015em;
  max-width: 14ch; text-wrap: balance; }
.sticker__lead { margin-top: var(--space-6); max-width: 46ch; font-size: var(--fs-lg); line-height: 1.35; }
.beloftes { display: grid; gap: var(--space-4); margin-top: var(--space-7); max-width: 46ch; }
.beloftes li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-5);
  align-items: baseline; font-size: var(--fs-sm); font-weight: 500;
  padding-top: var(--space-4); border-top: var(--rule-width) solid var(--border-die); }
.beloftes li::before { content: ""; width: 0.75rem; height: 0.75rem; border-radius: var(--radius-full);
  background: var(--color-action); }
.acties { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-5); margin-top: var(--space-8); }

/* --------------------------------------------------------- de banden */
.band { padding: var(--space-9) var(--space-7); }
.band--tint { background: var(--surface-tint); }
@media (min-width: 62rem) { .band { padding-block: var(--space-10); } }
.band h2 { font-size: var(--fs-2xl); line-height: var(--lh-snug); }
.band__kop { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
  gap: var(--space-5); }
.band__intro { margin-top: var(--space-5); max-width: 62ch; font-size: var(--fs-lg); line-height: 1.4;
  color: var(--text-body); }
.voetnoot { margin-top: var(--space-6); max-width: 70ch; font-size: var(--fs-sm); color: var(--text-muted); }
.merkje { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xs);
  text-transform: uppercase; letter-spacing: 0.12em; color: var(--text-strong);
  background: var(--surface-card); border: var(--rule-strong) solid var(--border-die);
  padding: 3px var(--space-4); white-space: nowrap; }

/* -------------------------------------------------------- de stappen */
.stappen { display: grid; gap: var(--space-6); margin-top: var(--space-7); }
@media (min-width: 48rem) { .stappen { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 76rem) { .stappen { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.stap { background: var(--surface-card); border-top: var(--die-width) solid var(--border-die);
  padding: var(--space-6); box-shadow: var(--elevation-applied); border-radius: var(--card-radius); }
.stap--geel { background: var(--surface-sticker); border-top-color: var(--border-die); }
.stap__nr { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xs);
  text-transform: uppercase; letter-spacing: 0.14em; color: var(--text-muted); }
.stap--geel .stap__nr { color: var(--text-on-sticker); }
.stap h3 { margin: var(--space-4) 0 var(--space-4); font-size: var(--fs-lg); line-height: var(--lh-snug); }
.stap p { font-size: var(--fs-sm); color: var(--text-muted); }
.stap--geel p { color: var(--text-on-sticker); }

/* ---------------------------------------------------------- de route */
.route { display: grid; gap: var(--space-5); margin-top: var(--space-7); counter-reset: r; }
@media (min-width: 62rem) { .route { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.route li { counter-increment: r; padding-top: var(--space-5);
  border-top: var(--rule-strong) solid var(--border-die); }
.route li::before { content: counter(r); display: block; font-family: var(--font-display);
  font-weight: 700; font-size: var(--fs-2xs); letter-spacing: 0.14em; color: var(--text-muted); }
.route b { display: block; margin-top: var(--space-3); font-family: var(--font-display);
  font-weight: 700; font-size: var(--fs-base); text-transform: uppercase; color: var(--text-strong); }
.route span { display: block; margin-top: var(--space-3); font-size: var(--fs-sm); color: var(--text-muted); }

/* ------------------------------------------- keuringen, functies, regels */
.keuringen, .functies, .regels { display: grid; gap: var(--space-5); margin-top: var(--space-7); }
@media (min-width: 48rem) { .keuringen, .functies, .regels { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 76rem) { .keuringen { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .functies, .regels { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.keuringen li, .functies li, .regels li { background: var(--surface-card);
  border-radius: var(--card-radius); padding: var(--space-6);
  border-left: var(--die-width) solid var(--categorie-brand); }
/* De keuringen dragen hun eigen etiket uit de stickerfamilie. */
.keuringen li { display: grid; grid-template-columns: auto minmax(0, 1fr);
  gap: var(--space-6); align-items: start; border-left: 0; padding-left: var(--space-5); }
.keuringen img { display: block; width: 4.375rem; height: 4.375rem; }
.band--tint .keuringen li, .band--tint .functies li, .band--tint .regels li { box-shadow: var(--elevation-applied); }
.keuringen b, .functies b, .regels b { display: block; font-family: var(--font-display); font-weight: 700;
  font-size: var(--fs-lg); color: var(--text-strong); line-height: 1.25; }
.keuringen span, .functies span, .regels span { display: block; margin-top: var(--space-4);
  font-size: var(--fs-sm); color: var(--text-muted); }

/* ---------------------------------------------------------- de regio's */
.regios { display: flex; flex-wrap: wrap; gap: var(--space-4); margin-top: var(--space-7); }
.regios li { display: inline-flex; align-items: center; min-height: var(--target-min);
  padding: 0 var(--space-6); background: var(--surface-card);
  border: var(--rule-strong) solid var(--border-die); border-radius: var(--card-radius);
  font-family: var(--font-display); font-weight: 700; font-size: var(--fs-sm);
  text-transform: uppercase; letter-spacing: 0.04em; color: var(--text-strong); }

/* ----------------------------------------------------------- de tiers */
.tiers { display: grid; gap: var(--space-6); margin-top: var(--space-7); }
@media (min-width: 62rem) { .tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; } }
.tier { background: var(--surface-card); border-radius: var(--card-radius); padding: var(--space-7);
  border-top: var(--die-width) solid var(--border-hairline); }
.tier--hoofd { background: var(--surface-sticker); border-top-color: var(--border-die);
  box-shadow: var(--elevation-applied); }
.tier__rol { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xs);
  text-transform: uppercase; letter-spacing: 0.14em; color: var(--text-muted); }
.tier--hoofd .tier__rol { color: var(--text-on-sticker); }
.tier h3 { margin: var(--space-4) 0 var(--space-5); font-size: var(--fs-lg); line-height: var(--lh-snug); }
.tier p { font-size: var(--fs-sm); color: var(--text-muted); }
.tier--hoofd p { color: var(--text-on-sticker); }
.tier__prijs { margin-top: var(--space-6); font-family: var(--font-display); font-weight: 700;
  font-size: var(--fs-lg); color: var(--text-strong); }
.tier__uitleg { margin-top: var(--space-4); font-size: var(--fs-sm); }

/* ------------------------------------------------------- prijzen: gratis */

/* -------------------------------------------------- prijzen: de staffels */
.niveaus { display: grid; gap: var(--space-5); margin-top: var(--space-5); }
@media (min-width: 60rem) { .niveaus { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.niveau { display: flex; flex-direction: column; background: var(--surface-card);
  border-radius: var(--card-radius); padding: var(--space-6);
  border-top: var(--border-thick) solid var(--border-hairline); }
.niveau--uit { border-top-color: var(--categorie-brand); box-shadow: var(--elevation-applied); }
.niveau__naam { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xs);
  letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--text-muted); }
.niveau__prijs { margin-top: var(--space-3); }
.niveau__bedrag { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xl);
  line-height: var(--lh-snug); letter-spacing: var(--ls-tight); }
.niveau__eenheid { font-size: var(--fs-sm); color: var(--text-muted); }
.niveau__rol { margin-top: var(--space-4); font-size: var(--fs-sm); color: var(--text-muted); }
.niveau__lijst { margin-top: var(--space-5); padding-top: var(--space-5);
  border-top: var(--border-hair) solid var(--border-hairline); display: grid; gap: var(--space-3); }
.niveau__lijst li { position: relative; padding-left: var(--space-6); font-size: var(--fs-sm); }
.niveau__lijst li::before { content: ""; position: absolute; left: 0; top: 0.55em;
  width: 0.7em; height: 0.35em; border-left: 2px solid var(--color-action);
  border-bottom: 2px solid var(--color-action); transform: rotate(-45deg); }
.niveau__jaar { margin-top: auto; padding-top: var(--space-5); font-size: var(--fs-xs);
  color: var(--text-muted); }

.prijs__kop { margin-top: var(--space-8); font-size: var(--fs-lg); line-height: var(--lh-snug); }
.staffels { width: 100%; border-collapse: collapse; margin-top: var(--space-5);
  background: var(--surface-card); border-radius: var(--card-radius); overflow: hidden; }
.staffels th { text-align: left; padding: var(--space-4) var(--space-6);
  font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xs);
  text-transform: uppercase; letter-spacing: 0.09em; color: var(--text-muted);
  border-bottom: var(--rule-strong) solid var(--border-die); }
.staffels th:last-child, .staffels td:last-child { text-align: right; }
.staffels td { padding: var(--space-5) var(--space-6); font-size: var(--fs-sm);
  border-bottom: var(--rule-width) solid var(--border-hairline); vertical-align: baseline; }
.staffels tr:last-child td { border-bottom: 0; }
.staffel__code { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-lg);
  color: var(--text-strong); width: 3rem; }
.staffel__naam { display: block; font-family: var(--font-display); font-weight: 700;
  font-size: var(--fs-base); color: var(--text-strong); }
.staffel__niches { display: block; margin-top: var(--space-3); color: var(--text-muted); }
.staffel__prijs { font-weight: 700; color: var(--text-strong); white-space: nowrap; }

/* -------------------------------------------------- prijzen: de bundels */
.bundels { display: grid; gap: var(--space-5); margin-top: var(--space-5); }
@media (min-width: 48rem) { .bundels { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.bundel { background: var(--surface-card); border-radius: var(--card-radius); padding: var(--space-6);
  border-top: var(--die-width) solid var(--border-hairline); }
.bundel--uit { border-top-color: var(--categorie-brand); box-shadow: var(--elevation-applied); }
.bundel__credits { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xs);
  text-transform: uppercase; letter-spacing: 0.12em; color: var(--text-muted); }
.bundel__prijs { display: block; margin-top: var(--space-3); font-family: var(--font-display);
  font-weight: 700; font-size: var(--fs-2xl); line-height: 1; color: var(--text-strong); }
.bundel__per { display: block; margin-top: var(--space-4); font-size: var(--fs-sm); color: var(--text-muted); }
.bundel p { margin-top: var(--space-5); padding-top: var(--space-4);
  border-top: var(--rule-width) solid var(--border-hairline);
  font-size: var(--fs-sm); color: var(--text-muted); }

/* ------------------------------------------------------------ de FAQ */
.vraag { border-top: var(--rule-width) solid var(--border-strong); }
.vraag:last-of-type { border-bottom: var(--rule-width) solid var(--border-strong); }
.vraag summary { display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-5); min-height: var(--target-min); padding-block: var(--space-4);
  font-family: var(--font-display); font-weight: 700; font-size: var(--fs-lg);
  color: var(--text-strong); cursor: pointer; list-style: none; }
.vraag summary::-webkit-details-marker { display: none; }
.vraag summary::after { content: "+"; font-size: var(--fs-lg); line-height: 1; }
.vraag[open] summary::after { content: "\2212"; }
.vraag p { padding-bottom: var(--space-6); max-width: 68ch; font-size: var(--fs-sm); color: var(--text-body); }
#faq h2 { margin-bottom: var(--space-6); }

/* ----------------------------------------------------------- het slot */
.slot { background: var(--surface-inverse); color: var(--text-on-inverse);
  padding: var(--space-9) var(--space-7); }
.slot h2 { color: var(--text-on-inverse); font-size: var(--fs-2xl); line-height: var(--lh-snug); max-width: 16ch; }
.slot p { margin-top: var(--space-5); max-width: 52ch; color: var(--text-muted-on-inverse); }
.slot__grid { display: grid; gap: var(--space-7); }
@media (min-width: 62rem) { .slot__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 24rem);
  column-gap: var(--space-10); align-items: center; } }
.terugval { display: block; margin-top: var(--space-5); font-size: var(--fs-sm);
  color: var(--text-muted-on-inverse); }
.klein { font-size: var(--fs-sm); max-width: 62ch; }
.sticker .klein { margin-top: var(--space-5); }

/* ----------------------------------------------------------- de voet */
.voet { background: var(--surface-inverse-deep); color: var(--text-muted-on-inverse);
  padding: var(--space-9) var(--space-7) var(--space-7); }
.voet__grid { display: grid; gap: var(--space-8); }
@media (min-width: 62rem) { .voet__grid { grid-template-columns: minmax(0, 2fr) repeat(2, minmax(0, 1fr));
  column-gap: var(--space-9); } }
.voet .merk__woord { color: var(--text-on-inverse); }
.voet__wat { margin-top: var(--space-5); max-width: 46ch; font-size: var(--fs-sm); }
.voet h3 { font-size: var(--fs-2xs); letter-spacing: 0.14em; color: var(--text-on-inverse);
  margin-bottom: var(--space-4); }
.voet ul { display: grid; gap: var(--space-2); }
.voet li a { display: inline-flex; align-items: center; min-height: var(--target-min);
  font-size: var(--fs-sm); text-decoration: none; border-bottom: var(--rule-width) solid transparent; }
.voet li a:hover { border-bottom-color: var(--color-action-on-inverse); }
.voet__nogniet li { padding-block: var(--space-3); font-size: var(--fs-sm);
  color: var(--icon-decorative); text-decoration: line-through; text-decoration-thickness: 1px; }
.voet__regel { margin-top: var(--space-8); padding-top: var(--space-5);
  border-top: var(--rule-width) solid var(--border-inverse); font-size: var(--fs-sm); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }
}

/* ---------------------------------------------------------------- portaal
   Aanmelden en inloggen. Eén kolom, geen afleiding, en zolang het portaal
   dicht is staat de fieldset uit: een veld waar niets mee gebeurt vraagt
   nooit om een wachtwoord. scripts/check-site.mjs bewaakt dat koppel. */
.portaal { background: var(--surface-tint); padding: var(--space-8) var(--space-5) var(--space-10); }
.portaal__binnen { max-width: 40rem; margin: 0 auto; }
.portaal__binnen--smal { max-width: 30rem; }
.portaal h1 { margin-top: var(--space-7); font-size: var(--fs-2xl); line-height: var(--lh-tight);
  letter-spacing: var(--ls-tight, normal); }
.portaal__lead { margin-top: var(--space-4); font-size: var(--fs-base); color: var(--text-muted);
  max-width: 58ch; }
.portaal__voet { margin-top: var(--space-6); font-size: var(--fs-sm); color: var(--text-muted); }

.melding { background: var(--status-warn-wash); color: var(--text-body);
  border-left: var(--die-width) solid var(--status-warn-line);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  padding: var(--space-5) var(--space-6); font-size: var(--fs-sm); }
.melding b { display: block; font-family: var(--font-display); font-weight: 700;
  color: var(--text-strong); margin-bottom: var(--space-2); }

.formulier { margin-top: var(--space-7); background: var(--surface-card);
  border-radius: var(--card-radius); padding: var(--space-7) var(--space-6); }
.formulier fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.vgroep__kop { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xs);
  letter-spacing: var(--ls-label, 0.08em); text-transform: uppercase; color: var(--text-muted); }
.formulier > fieldset > .vgroep__kop + .veld { margin-top: var(--space-5); }
.formulier > fieldset > h2.vgroep__kop { margin-top: var(--space-8); padding-top: var(--space-6);
  border-top: var(--rule-width) solid var(--border-hairline); }
.formulier > fieldset > h2.vgroep__kop:first-child { margin-top: 0; padding-top: 0; border-top: 0; }

.veld { margin-top: var(--space-6); display: grid; gap: var(--space-2); }
.veld label { font-size: var(--fs-sm); font-weight: 600; color: var(--text-strong); }
.veld__uitleg { font-size: var(--fs-2xs); color: var(--text-muted); }
.veld input[type="text"], .veld input[type="email"], .veld input[type="password"] {
  min-height: var(--target-min); padding: var(--space-3) var(--space-4);
  font: inherit; font-size: var(--fs-base); color: var(--text-strong);
  background: var(--surface-canvas); border: var(--rule-width) solid var(--border-strong);
  border-radius: var(--input-radius); width: 100%; }
.veld input::placeholder { color: var(--text-muted); }

.formulier .vgroep { margin-top: var(--space-8); padding-top: var(--space-6);
  border-top: var(--rule-width) solid var(--border-hairline); }
.keuzes { margin-top: var(--space-4); display: grid; gap: var(--space-1); }
@media (min-width: 34rem) { .keuzes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.keuzes li, .veld--akkoord { display: flex; align-items: flex-start; gap: var(--space-3); }
.keuzes li label { font-weight: 400; font-size: var(--fs-sm);
  min-height: var(--target-min); display: flex; align-items: center; }
.veld--akkoord label { font-weight: 400; font-size: var(--fs-sm); line-height: var(--lh-body); }
.veld--akkoord { margin-top: var(--space-7); padding-top: var(--space-6);
  border-top: var(--rule-width) solid var(--border-hairline); }
input[type="checkbox"] { width: 1.25rem; height: 1.25rem; margin-top: 0.85rem;
  accent-color: var(--color-action); flex: none; }
.veld--akkoord input[type="checkbox"] { margin-top: 0.15rem; }

.formulier .knop { margin-top: var(--space-7); width: 100%; }

/* De dichte staat. Zichtbaar uit, niet stuk: het formulier is af, het staat
   alleen nog niet aan. Uitgeschakelde velden vallen buiten WCAG 1.4.3, maar
   ze blijven leesbaar zodat te zien is wat er straks gevraagd wordt. */
.formulier fieldset[disabled] { opacity: 0.72; }
.formulier fieldset[disabled] input { background: var(--surface-tint); cursor: not-allowed; }
.formulier fieldset[disabled] .knop { background: var(--vinyl-300); color: var(--ink-700);
  cursor: not-allowed; }

.voet--smal { padding: var(--space-7) 0; }
.voet__klein { font-size: var(--fs-sm); color: var(--text-muted-on-inverse); }
.voet__klein a { color: var(--text-on-inverse); }