/* ============================================================
   Typography — EV Site Planner
   Space Grotesk for display & numerals, Hanken Grotesk for UI/body.
   Tight tracking on headings; numbers feel engineered via Space Grotesk.
   ============================================================ */
:root {
  /* Families */
  --font-display: "Bricolage Grotesque", "Hanken Grotesk", ui-sans-serif, system-ui, sans-serif;
  --font-sans:    "Hanken Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  /* Numbers/data use Space Grotesk (engineered, tabular feel) */
  --font-data:    "Space Grotesk", ui-monospace, monospace;

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

  /* Type scale */
  --text-2xs:  0.6875rem;  /* 11px */
  --text-xs:   0.75rem;    /* 12px */
  --text-sm:   0.875rem;   /* 14px */
  --text-base: 1rem;       /* 16px */
  --text-lg:   1.125rem;   /* 18px */
  --text-xl:   1.25rem;    /* 20px */
  --text-2xl:  1.5rem;     /* 24px */
  --text-3xl:  1.875rem;   /* 30px */
  --text-4xl:  2.25rem;    /* 36px */
  --text-5xl:  3rem;       /* 48px */
  --text-6xl:  4rem;       /* 64px */

  /* Line heights */
  --leading-none:    1;
  --leading-tight:   1.14;
  --leading-snug:    1.3;
  --leading-normal:  1.5;
  --leading-relaxed: 1.62;

  /* Letter spacing */
  --tracking-tighter: -0.025em;
  --tracking-tight:   -0.015em;
  --tracking-normal:  0;
  --tracking-wide:    0.03em;
  --tracking-wider:   0.06em;   /* eyebrows / labels */
  --tracking-widest:  0.10em;   /* uppercase micro-labels */

  /* ---- Semantic roles ---- */
  /* Display / hero — Bricolage Grotesque */
  --display-font:    var(--font-display);
  --display-weight:  var(--fw-bold);
  --display-spacing: var(--tracking-tight);
  --display-leading: var(--leading-tight);

  /* Headings */
  --heading-font:    var(--font-display);
  --heading-weight:  var(--fw-bold);
  --heading-spacing: var(--tracking-tight);

  /* Body */
  --body-font:    var(--font-sans);
  --body-weight:  var(--fw-regular);
  --body-leading: var(--leading-normal);

  /* Eyebrow / micro-label — uppercase, tracked out */
  --label-font:    var(--font-sans);
  --label-weight:  var(--fw-bold);
  --label-spacing: var(--tracking-widest);
  --label-size:    var(--text-2xs);

  /* Data / numeric — Space Grotesk */
  --data-font:   var(--font-data);
  --data-weight: var(--fw-medium);
}