/* ── Ogleby typography ─────────────────────────────────────────────
   Space Grotesk = primary voice (UI, headings, body).
   Instrument Serif = editorial display for lookbook / hero moments.
   Space Mono = kickers, metadata, technical labels. */
:root {
  --font-sans: 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --font-display: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  --font-mono: 'Space Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* Weights (Space Grotesk) */
  --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 */

  /* Type scale — display uses serif, everything else grotesk */
  --fs-display-2xl: 132px;  --lh-display-2xl: 0.92; /* @kind font */
  --fs-display-xl: 96px;    --lh-display-xl: 0.94;  /* @kind font */
  --fs-display-lg: 68px;    --lh-display-lg: 0.98;  /* @kind font */
  --fs-display-md: 48px;    --lh-display-md: 1.02;  /* @kind font */

  --fs-heading-xl: 40px;    --lh-heading-xl: 1.05;  /* @kind font */
  --fs-heading-lg: 32px;    --lh-heading-lg: 1.08;  /* @kind font */
  --fs-heading-md: 24px;    --lh-heading-md: 1.15;  /* @kind font */
  --fs-heading-sm: 20px;    --lh-heading-sm: 1.2;   /* @kind font */

  --fs-body-lg: 19px;       --lh-body-lg: 1.55;     /* @kind font */
  --fs-body-md: 16px;       --lh-body-md: 1.55;     /* @kind font */
  --fs-body-sm: 14px;       --lh-body-sm: 1.5;      /* @kind font */

  --fs-label: 13px;         --lh-label: 1.3;        /* @kind font */
  --fs-mono: 13px;          --lh-mono: 1.4;         /* @kind font */
  --fs-caption: 12px;       --lh-caption: 1.35;     /* @kind font */

  /* Tracking — grotesk tight on display, mono labels wide + upper */
  --tracking-display: -0.02em; /* @kind font */
  --tracking-heading: -0.01em; /* @kind font */
  --tracking-body: 0em;        /* @kind font */
  --tracking-mono: 0.14em;     /* @kind font */
}

/* Utility type classes (optional; consumers may use tokens directly) */
.og-display   { font-family: var(--font-display); font-weight: 400; letter-spacing: var(--tracking-display); line-height: var(--lh-display-lg); }
.og-heading   { font-family: var(--font-sans); font-weight: var(--fw-bold); letter-spacing: var(--tracking-heading); }
.og-body      { font-family: var(--font-sans); font-weight: var(--fw-regular); font-size: var(--fs-body-md); line-height: var(--lh-body-md); }
.og-kicker    { font-family: var(--font-mono); font-weight: 700; font-size: var(--fs-mono); letter-spacing: var(--tracking-mono); text-transform: uppercase; }