/* ============================================================
   LGS Ellwangen 2026 — Typography tokens
   Brand: Avenir LT Pro (Black / Medium / Roman / Oblique).
   Web substitute: Mulish. Stack prefers Avenir first.
   Rules from CD-Manual:
   - Headlines: Avenir Black / Medium  (here: 800 / 900)
   - Body: Avenir Roman               (here: 400)
   - No serif primary type, no decorative/handwritten fonts.
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-sans: "Avenir LT Pro", "Avenir Next", Avenir, "Mulish", Arial, Helvetica, sans-serif;
  --font-display: var(--font-sans); /* same family, heavier weight */
  --font-mono: "SFMono-Regular", ui-monospace, Menlo, Consolas, monospace;

  /* ---- Weights (mapped to Avenir cuts) ---- */
  --weight-regular: 400;  /* Roman */
  --weight-medium: 500;   /* Medium */
  --weight-semibold: 700;
  --weight-bold: 800;
  --weight-black: 900;    /* Black */

  /* ---- Type scale (rem, 16px base) ---- */
  --text-2xs: 0.6875rem;  /* 11px */
  --text-xs: 0.75rem;     /* 12px */
  --text-sm: 0.875rem;    /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-md: 1.125rem;    /* 18px */
  --text-lg: 1.375rem;    /* 22px */
  --text-xl: 1.75rem;     /* 28px */
  --text-2xl: 2.25rem;    /* 36px */
  --text-3xl: 3rem;       /* 48px */
  --text-4xl: 4rem;       /* 64px */
  --text-5xl: 5.25rem;    /* 84px — hero display */

  /* ---- Line heights ---- */
  --leading-tight: 1.05;  /* large display */
  --leading-snug: 1.18;   /* headlines */
  --leading-normal: 1.5;  /* body */
  --leading-relaxed: 1.65;

  /* ---- Letter spacing ---- */
  --tracking-tight: -0.02em;  /* big display */
  --tracking-normal: 0;
  --tracking-wide: 0.04em;
  --tracking-caps: 0.12em;    /* uppercase eyebrows / labels */

  /* =========================================================
     SEMANTIC TYPE ROLES
     ========================================================= */
  --type-display-size: var(--text-5xl);
  --type-display-weight: var(--weight-black);
  --type-display-leading: var(--leading-tight);
  --type-display-tracking: var(--tracking-tight);

  --type-h1-size: var(--text-3xl);
  --type-h1-weight: var(--weight-black);
  --type-h2-size: var(--text-2xl);
  --type-h2-weight: var(--weight-bold);
  --type-h3-size: var(--text-xl);
  --type-h3-weight: var(--weight-bold);

  --type-body-size: var(--text-base);
  --type-body-weight: var(--weight-regular);
  --type-body-leading: var(--leading-normal);

  --type-lead-size: var(--text-md);   /* intro paragraph */

  --type-eyebrow-size: var(--text-sm);
  --type-eyebrow-weight: var(--weight-bold);
  --type-eyebrow-tracking: var(--tracking-caps);

  --type-label-size: var(--text-sm);
  --type-label-weight: var(--weight-bold);
}
