/* Tokens wiso-Gergen / Para Games Trier 2028.
   Quelle der Wahrheit: ../../design.md. Werte hier und dort muessen identisch sein,
   design-drift.js prueft das. */
:root {
  /* Farben */
  --obsidian: #0F141C;
  --obsidian-2: #151C27;
  --obsidian-3: #131A24;
  --obsidian-4: #1A2331;
  --volt: #D4FF00;
  --coral: #FF4D36;
  --coral-hover: #E23C26;
  --offwhite: #F4F5F7;
  --mist: #A8B0BC;
  --slate: #3A4454;

  /* Schriften */
  /* Stacks 1:1 aus dem Claude-Design-Export. Dort wurde Syne nie geladen, das
     freigegebene Design lief in der Helvetica-Ersatzschrift. Deshalb wird hier
     Archivo (zweite Wahl im Stack, Helvetica-nah) selbst gehostet, nicht Syne. */
  --font-display: 'Syne', 'Archivo', 'Helvetica Neue', Helvetica, sans-serif;
  --font-body: 'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;

  /* Dauern, aus dem Design: 140 Tap, 160 UI, 220 Karte, 380 Eintritt */
  --t-tap: 140ms;
  --t-ui: 160ms;
  --t-karte: 220ms;
  --t-auf: 380ms;

  /* Raster */
  --breite: 1280px;
  --rand: 20px;
  --kopf-hoehe: 73px;

  /* Abstandsleiter, die clamp-Werte des Designs */
  --abst-klein: clamp(16px, 2vw, 24px);
  --abst-karte: clamp(24px, 3vw, 40px);
  --abst-block: clamp(28px, 3.5vw, 48px);
  --abst-sektion: clamp(48px, 7vw, 104px);
  --abst-sektion-gross: clamp(56px, 8vw, 120px);
  --abst-hero: clamp(56px, 9vw, 140px);

  /* Diagonale des Designs */
  --schraeg: -9deg;
}
