/* ============================================================================
   Design-Tokens — robinklotz.com
   Abgeleitet (nicht kopiert) aus dem Gestaltungssystem "Typo im Web" (Sem 8).
   Gemeinsame Anker mit dem Lebenslauf (cv/build.py, Form "Wandtafel"):
     Schrift Geist · Band-Ton #2D2E30 · Akzent #2C6FEA
   Unterschied zum Prototyp: kein Glassmorphismus. Die Struktur trägt,
   nicht der Effekt — dieselbe Haltung wie der CV.
   ========================================================================= */

@font-face {
  font-family: "Geist";
  src: url("../fonts/Geist[wght].woff2") format("woff2-variations");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Geist";
  src: url("../fonts/Geist-Italic[wght].woff2") format("woff2-variations");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

:root {
  /* ---- Grund ---- */
  --ground:        #2D2E30;   /* identisch mit dem CV-Band */
  --ground-raised: #353639;
  --ground-sunk:   #262728;

  /* ---- Text ---- */
  --ink:      rgba(255, 255, 255, 0.96);
  --ink-mid:  rgba(255, 255, 255, 0.72);
  --ink-mut:  rgba(255, 255, 255, 0.54);   /* 5.13:1 — auch fuer 12px-Labels tragfaehig */

  /* ---- Linien ---- */
  --line:        rgba(255, 255, 255, 0.14);
  --line-strong: rgba(255, 255, 255, 0.30);

  /* ---- Akzent (Stand offen: Ticket 35 prüft das Akzent-Konzept) ---- */
  --accent:     #6699F5;      /* CV-Blau #2C6FEA auf dunklem Grund aufgehellt: 4.82:1 statt 2.96:1 */
  --accent-ink: #0F1012;

  /* ---- Raster & Rhythmus ---- */
  --col: 1120px;              /* Satzspiegel */
  --measure: 62ch;            /* Lesebreite Fließtext */
  --gap: clamp(20px, 2.4vw, 32px);
  --pad-x: clamp(20px, 6vw, 88px);
  --step: 8px;

  /* ---- Typo-Skala (fluid, 1.25er Terz) ---- */
  --t-display: clamp(2.5rem, 1.5rem + 3.6vw, 4.25rem);
  --t-h1:      clamp(2.25rem, 1.3rem + 4.0vw, 4.0rem);
  --t-h2:      clamp(1.75rem, 1.2rem + 2.2vw, 2.75rem);
  --t-h3:      clamp(1.25rem, 1.05rem + 0.8vw, 1.6rem);
  --t-body:    clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --t-small:   0.9375rem;
  --t-label:   0.75rem;

  --lh-tight: 1.02;
  --lh-head:  1.12;
  --lh-body:  1.6;

  --ls-display: -0.035em;
  --ls-head:    -0.02em;
  --ls-label:   0.12em;   /* Sperrung wie im CV */

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}