/* ============================================================
   Go Auto — Typography tokens
   Display/headings: Poppins (friendly geometric, echoes logo).
   Body/UI: Mulish (clean humanist). Mono: JetBrains Mono.
   Headings on the brand site read fairly light — default
   heading weight is 500/600, with a 300 "thin display" option.
   ============================================================ */
:root {
  /* Families */
  --font-display: 'Averta', 'Poppins', 'Segoe UI', system-ui, sans-serif;
  --font-body:    'Averta', 'Mulish', 'Segoe UI', system-ui, sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, 'SFMono-Regular', monospace;

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

  /* Type scale (1.250 major-third-ish, tuned) */
  --text-2xs:  11px;
  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-md:   18px;
  --text-lg:   20px;
  --text-xl:   24px;
  --text-2xl:  30px;
  --text-3xl:  38px;
  --text-4xl:  48px;
  --text-5xl:  62px;
  --text-6xl:  80px;

  /* Line heights */
  --leading-tight:   1.1;
  --leading-snug:    1.25;
  --leading-normal:  1.5;
  --leading-relaxed: 1.65;

  /* Letter spacing */
  --tracking-tight:  -0.02em;
  --tracking-normal: 0;
  --tracking-wide:   0.04em;
  --tracking-caps:   0.10em; /* eyebrows / overlines */

  /* Semantic roles */
  --display-font:   var(--font-display);
  --display-weight: var(--fw-light);
  --heading-font:   var(--font-display);
  --heading-weight: var(--fw-semibold);
  --eyebrow-font:   var(--font-body);
  --body-font:      var(--font-body);
}