/* _space — typography tokens
   Bitter (serif) — headings, display, big stat numbers, pull quotes, tagline.
   Inter (sans) — body, labels, buttons, UI. */

:root {
  --font-serif-display: 'Bitter', Georgia, 'Times New Roman', serif;
  --font-sans-body: 'Inter', -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;

  /* Skala. Overskrifterne er FLYDENDE (2026-08-28), broedteksten er det ikke.
     Rationalet: en h2 paa 40 px fyldte en tredjedel af en 360 px telefon, mens
     det samme tal er helt rigtigt paa en laptop. clamp loeser praecis det, uden
     at broedtekst og labels vokser paa store skaerme, hvilket Nikolaj afviste
     da vi proevede en global zoom.
     Bemaerk: kun --text-h2, --text-body og --text-label bruges faktisk i sitet
     (188, 234 og 151 steder). Resten staar som fundament til nyt indhold.
     Alt andet er raa px i inline styles, bl.a. Google- og Facebook-mockupsene,
     der efterligner rigtige brugerflader og SKAL beholde deres proportioner. */
  --text-stat-hero: clamp(96px, 14vw, 200px);  /* big-number graphic device */
  --text-display: clamp(48px, 6vw, 88px);      /* hero headline */
  --text-h1: clamp(34px, 4.4vw, 56px);
  --text-h2: clamp(27px, 3.1vw, 40px);
  --text-h3: clamp(22px, 2.2vw, 28px);
  --text-h4: clamp(18px, 1.6vw, 20px);
  --text-lead: clamp(17px, 1.6vw, 20px);
  --text-body: 17px;                           /* fast med vilje */
  --text-small: 14px;                          /* fast med vilje */
  --text-label: 13px;                          /* uppercase kicker/label, fast */

  /* Weights */
  --weight-display: 800;      /* Bitter headings / stat numbers */
  --weight-heading: 700;
  --weight-quote: 500;        /* Bitter pull quotes, often italic */
  --weight-body: 400;
  --weight-medium: 500;
  --weight-semibold: 600;     /* buttons, labels */

  /* Line heights & tracking */
  --leading-display: 1.02;
  --leading-heading: 1.1;
  --leading-body: 1.55;
  --tracking-display: -0.02em;
  --tracking-label: 0.12em;   /* uppercase labels */
}