/* ================================================================
   DESIGN TOKENS — KortingscodeHub
   Edit hier → upload-css.mjs → live. Verandert kleur/spacing/typografie
   overal in de site in één keer.

   Twee tokensets bestonden naast elkaar (legacy --neo-* + V2 --yellow).
   Nu zijn de legacy namen aliases die doorverwijzen naar V2 — dus één
   plek om een kleur te wijzigen. Voor nieuwe code: gebruik V2 namen.
   ================================================================ */

/* Reset + base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";font-size:16px;line-height:1.55;color:#0a0a0a;background:#fffde7;-webkit-font-smoothing:antialiased;text-rendering:optimizeSpeed}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%;height:auto}
button{font:inherit;cursor:pointer;background:none;border:0;color:inherit}
h1,h2,h3,h4{margin:0 0 .5em;line-height:1.15;font-weight:700;color:#000;font-family:"Space Grotesk",Inter,system-ui,sans-serif;letter-spacing:-.01em}
p{margin:0 0 1em}
ul{margin:0;padding:0;list-style:none}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

:root{
  /* === Kleuren (V2 — semantische namen, gebruik deze) === */
  --yellow:#fde047;
  --green:#4ade80;
  --pink:#f472b6;
  --blue:#38bdf8;
  --red:#f87171;
  --paper:#fff;
  --cream:#fefcf3;
  --ink:#000;
  --text:#1a1a1a;
  --muted:#525252;
  --line:#000;

  /* === Spacing (4px-grid) === */
  --s-1:4px;
  --s-2:8px;
  --s-3:12px;
  --s-4:16px;
  --s-5:24px;
  --s-6:32px;
  --s-7:48px;
  --s-8:64px;

  /* === Borders + shadows (neo-brutalist) === */
  --bd:3px;
  --bd-2:2px;
  --shadow:4px 4px 0 0 #000;
  --shadow-sm:2px 2px 0 0 #000;
  --shadow-lg:7px 7px 0 0 #000;
  --shadow-hover:2px 2px 0 0 #000;

  /* === Typografie === */
  --f-display:"Space Grotesk","Helvetica Neue",Inter,sans-serif;
  --f-body:Inter,-apple-system,BlinkMacSystemFont,sans-serif;
  --f-mono:ui-monospace,"SF Mono",Menlo,monospace;

  /* === Layout === */
  --maxw:1180px;

  /* === Legacy aliases (--neo-*) — wijzen door naar V2 hierboven.
     Bestaande classes blijven werken, één plek om kleur te wijzigen. === */
  --neo-yellow:var(--yellow);
  --neo-green:var(--green);
  --neo-pink:var(--pink);
  --neo-blue:var(--blue);
  --neo-red:var(--red);
  --neo-card:#fffbf0;
}