/* ==========================================================================
   Haut „Grauskala" — Vorbild Kopfhörer-Seite (muster.md Nr. 9).

   Keine Akzentfarbe. Hierarchie entsteht ausschließlich aus Größe und
   Grauwert. Die Bühne ist hell: `--c-on-stage` kippt auf Tinte.

   Passt zu nüchternen Branchen mit schwachem Bildmaterial — Versicherung,
   Steuer, Technik, Sanitär.
   ========================================================================== */
:root {
  /* „Bühne" — hier hell statt dunkel */
  --c-green: #e7e7e6;
  --c-green-2: #ededec;
  --c-green-deep: #1b1b1a;   /* Fuß bleibt dunkel — der einzige dunkle Block */

  --c-paper: #f4f4f3;
  --c-paper-2: #eaeae8;
  --c-sand: #e0e0de;
  --c-white: #ffffff;

  --c-ink: #16161a;
  --c-muted: #6a6a6e;
  --c-faint: #a2a2a6;

  /* „Akzent" ist hier ein dunkles Grau — Betonung läuft über den Grauwert */
  --c-red: #16161a;

  --on-green: rgba(22, 22, 26, 0.62);
  --line: rgba(22, 22, 26, 0.13);
  --line-strong: rgba(22, 22, 26, 0.3);
  --line-light: rgba(22, 22, 26, 0.13);

  --font-display: "Jost", "Helvetica Neue", Arial, sans-serif;
  --font-sans: "Inter", "Helvetica Neue", Arial, sans-serif;

  /* Größensprung bewusst extrem, Mittelgrößen fehlen */
  --t-display: clamp(2.6rem, 1.4rem + 5.4vw, 6rem);     --lh-display: 1.02;
  --t-h2: clamp(1.7rem, 1.3rem + 2.1vw, 3rem);          --lh-h2: 1.1;
  --t-h3: clamp(1.05rem, 1rem + 0.4vw, 1.3rem);         --lh-h3: 1.3;
  --t-body: clamp(0.97rem, 0.94rem + 0.2vw, 1.03rem);   --lh-body: 1.7;
  --t-small: 0.875rem;
  --t-micro: 0.7rem;

  --sp-1: 0.5rem; --sp-2: 1rem; --sp-3: 1.5rem; --sp-4: 2rem; --sp-6: 3rem;
  --section-y: clamp(3.5rem, 2.5rem + 5.5vw, 8rem);
  --head-gap: clamp(2rem, 1.5rem + 3vw, 3.5rem);
  --wrap-max: 76rem;
  --wrap-x: clamp(1.25rem, 4vw, 3rem);

  /* weiche, flache Rundungen — die Bildkästen der Vorlage */
  --radius-s: 0.5rem;
  --radius-m: 0.75rem;
  --radius-l: clamp(0.75rem, 1.4vw, 1.1rem);
  --radius-pill: 999px;

  --duration-fast: 160ms;
  --duration-normal: 320ms;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);

  --papier-rgb: 244, 244, 243;
  --buehne-rgb: 231, 231, 230;
  --c-sand-text: #5f5f63;
  --c-on-stage: var(--c-ink);      /* helle Bühne — Text kippt auf Tinte */
  /* Der Fuß ist in dieser hellen Haut der einzige dunkle Block — dort
     kippt der Text zurück auf Hell. */
  --c-auf-fuss: #f4f4f3;
  --auf-fuss-leise: rgba(244, 244, 243, 0.66);
  --linie-fuss: rgba(244, 244, 243, 0.2);
  --schatten-rgb: 20, 20, 24;
}