/* Eintracht Hildesheim von 1861 e. V. – Design Tokens
   Quelle: eihi.de (Stand 21.10.2026). Details: ../../references/DESIGN.md */

@import url("../fonts/fonts.css"); /* lokale OFL-Fonts – bewusst kein Google-Fonts-Hotlink (DSGVO, offline-fähig) */

:root {
  /* Farben – Kern */
  --eihi-green: #006150;        /* Primär: Navigation, Footer, Badges */
  --eihi-green-dark: #004a3d;   /* Hover auf Grün */
  --eihi-green-mid: #2d7634;    /* Sekundär */
  --eihi-lime: #a2c617;         /* Akzent: CTA, Hero-Headline */
  --eihi-lime-dark: #8fb013;    /* Hover auf Lime */
  --eihi-navy: #101838;         /* Fließtext */
  --eihi-ink: #222428;          /* Headlines auf Hell */
  --eihi-bg: #fbfbfb;           /* Seitenhintergrund */
  --eihi-white: #ffffff;
  --eihi-mist: #f6f7fb;
  --eihi-fog: #ebedf2;
  --eihi-line: #dcdee5;
  --eihi-slate: #9196a5;
  --eihi-label: #bcbcbc;        /* Eyebrow (nur dekorativ) */
  --eihi-meta: #adadad;
  --eihi-btn-neutral-text: #33373d;

  /* Logo-Farben (nur zur Referenz, nicht als UI-Farben nutzen) */
  --eihi-logo-green: #009749;
  --eihi-logo-gold: #aa9257;

  /* Signalfarben (sparsam) */
  --eihi-red: #c01b2d;
  --eihi-red-dark: #a52336;
  --eihi-orange: #f39200;
  --eihi-blue: #4090ce;
  --eihi-blue-dark: #004a8b;

  /* Transparenzen */
  --eihi-lime-frame: rgba(162, 198, 23, 0.18);
  --eihi-overlay-dark: rgba(8, 24, 20, 0.6);
  --eihi-glass: rgba(255, 255, 255, 0.06);

  /* Schriften */
  --font-body: "Avenir LT", "Avenir Next", "Avenir", "Nunito Sans", system-ui, sans-serif;
  --font-display: Arial, "Helvetica Neue", Helvetica, sans-serif;
  --font-ui: Karla, system-ui, sans-serif;
  --font-accent: Stafford, Rokkitt, "Roboto Slab", Georgia, serif;
  --font-meta: Hind, system-ui, sans-serif;

  /* Typo-Skala */
  --fs-hero: clamp(2.75rem, 6vw, 5.1rem);   /* 82px */
  --fs-h2: clamp(2rem, 4vw, 2.8rem);        /* 45px */
  --fs-h3: 2.06rem;                          /* 33px */
  --fs-card-title: 1.31rem;                  /* 21px */
  --fs-body: 1.0625rem;                      /* 17px */
  --fs-small: 0.8125rem;                     /* 13px */
  --fs-meta: 0.75rem;                        /* 12px */
  --ls-hero: -3px;
  --ls-h2: -2px;
  --ls-eyebrow: 0.6px;
  --ls-cta: 1.5px;

  /* Radien */
  --radius-btn: 10px;
  --radius-cta: 0;
  --radius-image: 10px;
  --radius-card: 4px;

  /* Schatten */
  --shadow-card: 0 4px 20px rgba(16, 24, 56, 0.08);
  --shadow-card-hover: 0 10px 30px rgba(16, 24, 56, 0.14);
  --shadow-label: 0 8px 30px rgba(16, 24, 56, 0.12);

  /* Layout */
  --container: 1180px;
  --gutter: 24px;
  --section-y: clamp(64px, 8vw, 112px);
  --header-top-h: 76px;
  --header-nav-h: 60px;
}