/* ============================================================
   S4SF — Typography scale
   Display: Poppins · Body: Mulish · Tagline/labels: Space Grotesk
   ============================================================ */
:root {
  /* Font-size scale (rem, 16px base) */
  --text-xs:   0.75rem;   /* 12 */
  --text-sm:   0.875rem;  /* 14 */
  --text-base: 1rem;      /* 16 */
  --text-md:   1.125rem;  /* 18 */
  --text-lg:   1.375rem;  /* 22 */
  --text-xl:   1.75rem;   /* 28 */
  --text-2xl:  2.25rem;   /* 36 */
  --text-3xl:  3rem;      /* 48 */
  --text-4xl:  3.75rem;   /* 60 */
  --text-5xl:  4.75rem;   /* 76 */

  /* Weights */
  --fw-regular: 400; /* @kind other */
  --fw-medium: 500; /* @kind other */
  --fw-semibold: 600; /* @kind other */
  --fw-bold: 700; /* @kind other */
  --fw-extra: 800; /* @kind other */

  /* Line heights */
  --lh-tight: 1.05; /* @kind other */
  --lh-snug: 1.2; /* @kind other */
  --lh-normal: 1.5; /* @kind other */
  --lh-relaxed: 1.65; /* @kind other */

  /* Letter spacing */
  --ls-tight: -0.02em; /* @kind other */
  --ls-normal: 0; /* @kind other */
  --ls-wide: 0.04em; /* @kind other */
  --ls-tagline: 0.06em; /* @kind other */

  /* Semantic type roles */
  --type-display-font: var(--font-display);
  --type-display-weight: var(--fw-bold);
  --type-display-ls: var(--ls-tight);

  --type-heading-font: var(--font-display);
  --type-heading-weight: var(--fw-semibold);

  --type-body-font: var(--font-body);
  --type-body-weight: var(--fw-regular);

  --type-eyebrow-font: var(--font-tagline);
  --type-eyebrow-weight: var(--fw-bold);
  --type-eyebrow-ls: var(--ls-tagline);
}