/* ============================================================
   goeksmedia.li — Design Tokens
   Einzige Quelle für Farben, Typografie und Rhythmus.
   Markenorange = Logo-Orange #f3961c (NICHT das alte #f5772e).

   Kontrastbudget auf --bg (#09090b):
     --text   17.9:1   --text-2  7.7:1   --brand  8.7:1
     --text-3  4.1:1 → NUR für grosse oder dekorative Labels
   Buttons: dunkler Text auf Orange (--on-brand ≈ 9.2:1);
   weisser Text auf Orange wäre 2.3:1 → verboten.
   ============================================================ */
:root {
  /* Marke */
  --brand: #f3961c;
  --brand-hover: #ffa93e;
  --brand-tint: rgba(243, 150, 28, .12);
  --on-brand: #101013;

  /* Bühne (Zinc-Neutrale, dunkel) */
  --bg: #09090b;
  --bg-elev: #101013;
  --bg-elev-2: #17171b;
  --line: rgba(250, 250, 250, .09);
  --line-strong: rgba(250, 250, 250, .22);
  --text: #fafafa;
  --text-2: #a1a1aa;
  --text-3: #71717a;

  /* Typografie */
  --font: 'Urbanist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: ui-monospace, 'Cascadia Mono', 'Segoe UI Mono', Consolas, monospace;
  --step--1: clamp(.83rem, .8rem + .15vw, .94rem);
  --step-0: clamp(1rem, .96rem + .2vw, 1.125rem);
  --step-1: clamp(1.25rem, 1.15rem + .5vw, 1.5rem);
  --step-2: clamp(1.56rem, 1.35rem + 1vw, 2.1rem);
  --step-3: clamp(1.95rem, 1.6rem + 1.8vw, 3rem);
  --step-4: clamp(2.44rem, 1.8rem + 3.2vw, 4.2rem);
  --step-5: clamp(3rem, 2rem + 5vw, 5.6rem);

  /* Rhythmus */
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2.5rem;
  --space-6: 4rem;
  --space-7: 6rem;
  --space-8: 8rem;
  --container: 72.5rem;
  --header-h: 4.5rem;
  --radius-s: 6px;
  --radius-m: 12px;
  --radius-l: 20px;

  /* Bewegung */
  --ease: cubic-bezier(.4, 0, .2, 1);
  --dur: 250ms;
  --dur-slow: 650ms;
}