/* =============================================================================
   I-Run-Achim – Design-Tokens  (Figma: "Homepage — v5 (Warm)")
   Einzige Quelle der Wahrheit fuer Farben, Typografie, Abstaende.
   Werte 1:1 aus get_design_context der einzelnen Sektionen.
   ========================================================================== */

:root {
  /* --- Marken-Farben ------------------------------------------------- */
  --irun-navy:   #173f2c;   /* dunkles I-Run-Grün – Footer, Text, Rahmen    */
  --irun-cream:  #f7f4ed;   /* ruhiger, warmer Sektions-Hintergrund         */
  --irun-white:  #fffcf8;   /* color/white                                */
  --irun-orange: #ef7d23;   /* Signalfarbe: Anmeldung / Handlungsaufruf     */

  --irun-lime:   #8cc63f;   /* I-Run-Grün: primäre Markenfarbe              */
  --irun-olive:  #4d7934;   /* dunkler Grün-Akzent                          */
  --irun-green-pale: #e8f2d8; /* helle Grünfläche                             */

  /* --- Neutrale Toene ---------------------------------------------- */
  --irun-ink:      #173f2c; /* Ueberschriften                              */
  --irun-black:    #102b20; /* Karten-Fuss, harte Schatten, Body dunkel     */
  --irun-muted:    #506257; /* Fliesstext auf hell                         */
  --irun-grey:     #cccccc; /* sekundaerer Text auf dunkel                */
  --irun-grey-blue:#bfccdb; /* Footer-Adresse                             */
  --irun-line:     #d9d9d9; /* Trennlinien / gestrichelte Divider hell     */
  --irun-line-dk:  #474747; /* Trennlinie im Footer                       */

  /* --- Semantik --------------------------------------------------- */
  --irun-bg:          var(--irun-white);
  --irun-bg-alt:      var(--irun-cream);
  --irun-bg-invert:   var(--irun-navy);
  --irun-text:        var(--irun-ink);
  --irun-text-muted:  var(--irun-muted);
  --irun-text-invert: var(--irun-white);
  --irun-accent:      var(--irun-lime);

  /* --- Typografie ----------------------------------------------- */
  --irun-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, sans-serif;
  --irun-fw-regular: 400;
  --irun-fw-medium:  500;
  --irun-fw-semibold: 600;
  --irun-fw-bold:    700;
  --irun-fw-black:   800;

  /* Type-Scale (Desktop px aus Figma) */
  --irun-fs-eyebrow: 0.8125rem; /* 13px */
  --irun-fs-body:    1rem;      /* 16px */
  --irun-fs-meta:    0.9375rem; /* 15px */
  --irun-fs-h3:      1.25rem;   /* 20px – Footer "Spenden & Helfen" */
  --irun-fs-h2:      clamp(1.75rem, 3.4vw, 2.625rem); /* 30–42px */
  --irun-fs-hero:    clamp(3.25rem, 10.3vw, 9.25rem); /* bis 148px */
  --irun-fs-stat:    2.25rem;   /* 36px */
  --irun-fs-bib-km:  2rem;      /* 32px */

  --irun-lh-tight:  0.88;
  --irun-lh-snug:   1.15;
  --irun-lh-normal: 1.6;

  /* --- Layout & Abstaende ------------------------------------- */
  --irun-container: 1440px;
  --irun-gutter:    clamp(1.25rem, 4.4vw, 64px); /* Figma-Inset = 64px */
  --irun-section-y: clamp(3.5rem, 8vw, 96px);
  --irun-gap:       clamp(1.5rem, 5vw, 80px);

  /* --- Radien & Schatten ------------------------------------- */
  --irun-radius-card:  24px;
  --irun-radius-bib:   16px;
  --irun-radius-pill:  999px;
  --irun-radius-badge: 10px;
  --irun-shadow-hard:  5px 5px 0 0 var(--irun-black);   /* Buttons */
  --irun-shadow-bib:   6px 6px 0 0 var(--irun-olive);   /* Startnummer-Karten */

  /* --- Sticky-Header ---------------------------------------- */
  --irun-utilitybar-h: 33px;
  --irun-header-h: 78px;
}