/* startsichtbar.de – einzige Quelle für das Design. Wird vom Bau-Skript nach app/assets/css/tokens.css kopiert.
   Die Namen der Farben stammen aus dem Grundgerüst (pitaya = Signalfarbe, hier Koralle; tinte = Tannengrün; butter = Sonne). */
:root {
  /* Farben (OKLCH, Neutrale leicht zur Markenfarbe getönt) */
  --pitaya: oklch(0.70 0.18 32);          /* Koralle: Hauptfarbe, Flächen mit dunkler Schrift */
  --pitaya-tief: oklch(0.50 0.17 30);     /* Links und Schrift auf hellem Grund, Knöpfe mit heller Schrift */
  --pitaya-hauch: oklch(0.955 0.03 40);   /* zarte Fläche */
  --tinte: oklch(0.27 0.05 165);          /* Tanne: Text, dunkle Abschnitte */
  --tinte-weich: oklch(0.42 0.035 165);   /* Nebentext */
  --tinte-fern: oklch(0.54 0.025 165);    /* Hinweise (nur groß oder auf Papier) */
  --papier: oklch(0.975 0.012 95);        /* Kalk: Grund */
  --papier-tief: oklch(0.945 0.02 95);    /* abgesetzte Fläche */
  --linie: oklch(0.87 0.02 100);
  --butter: oklch(0.92 0.12 95);          /* Sonne: zweite Fläche */
  --minze: oklch(0.90 0.06 165);          /* Erfolg, „läuft“ */
  --minze-tief: oklch(0.40 0.08 165);
  --glut: oklch(0.52 0.19 28);            /* Fehler */
  --glut-hauch: oklch(0.95 0.035 28);
  --bernstein-tief: oklch(0.46 0.1 80);   /* Warnung, Text */
  --hell: oklch(0.995 0.004 95);

  /* Schrift */
  --schrift-titel: "Fraunces", Georgia, "Times New Roman", serif;
  --schrift-text: "Figtree", system-ui, -apple-system, "Segoe UI", sans-serif;
  --gr-xs: 0.8125rem;
  --gr-s: 0.9375rem;
  --gr-m: 1.0625rem;
  --gr-l: 1.3125rem;
  --gr-xl: clamp(1.6rem, 1.2rem + 1.6vw, 2.25rem);
  --gr-2xl: clamp(2.1rem, 1.3rem + 3.6vw, 3.75rem);
  --gr-3xl: clamp(2.7rem, 1.2rem + 7vw, 6.5rem);

  /* Abstände */
  --a-1: 0.25rem; --a-2: 0.5rem; --a-3: 0.75rem; --a-4: 1rem; --a-5: 1.5rem;
  --a-6: 2rem; --a-7: 3rem; --a-8: 4.5rem; --a-9: 7rem;
  --rand: clamp(1.125rem, 4vw, 3rem);
  --breite: 76rem;
  --lesebreite: 42rem;

  /* Form */
  --r-s: 0.5rem; --r-m: 0.875rem; --r-l: 1.5rem; --r-xl: 2.25rem; --r-rund: 999px;
  --schatten-s: 0 1px 2px oklch(0.27 0.05 165 / 0.06), 0 4px 14px oklch(0.27 0.05 165 / 0.05);
  --schatten-l: 0 2px 6px oklch(0.27 0.05 165 / 0.05), 0 28px 60px -18px oklch(0.27 0.05 165 / 0.22);

  /* Bewegung */
  --weich: cubic-bezier(0.22, 1, 0.36, 1);
  --dauer: 420ms;
}