/* Crossing Corners — design tokens (één-op-één uit het design system, niet wijzigen) */
:root {
  /* Merkkleuren */
  --corner-black: #0D0D0D;
  --canvas-white: #F6F4F1;
  --copper: #BB7333;
  --copper-hover: #CB8B53;
  --copper-press: #97581F;
  --copper-text: #97581F;  /* kleine tekst op licht: haalt 5,1:1 op canvas (AA) */
  --copper-deep: #7D4919;  /* active-stand voor knoppen met --copper-text als basis */
  --ring-green: #2F4A38;

  /* Neutralen (warme inkt-naar-papier reeks) */
  --ink: #262625;
  --ink-body: #33302B;
  --ink-soft: #55524C;
  --ink-faint: #8A8680;
  --hairline: #D8D4CD;
  --hairline-soft: #E4E1DB;
  --hairline-dark: #3A3A38;
  --dark-muted: #B9B5AE;

  /* Hoekenkwartet — uitsluitend als compleet viertal */
  --disc-blue: #0057A8;
  --disc-red: #D62828;
  --disc-green: #2E7D32;
  --disc-yellow: #F2B705;

  /* Typografie */
  --font-display: 'Bebas Neue', sans-serif;
  --font-body: 'Montserrat', sans-serif;

  /* Vormtaal en motion */
  --radius: 2px;
  --ease: cubic-bezier(.22, 1, .36, 1);
  --container: 1200px;
  --pad-x: clamp(20px, 5vw, 64px);
  --pad-section: clamp(80px, 10vw, 140px);
}