/* ─────────────────────────────────────────────────────────────────
 * Ajaia Design System V2 — Fonts & Heading Type Scale
 * Local brand fonts + semantic type tokens, ported from the DS.
 * Linked BEFORE styles.css so the site's theme rules still win on
 * base elements; this file only contributes @font-face, :root type
 * tokens, and opt-in heading helper classes.
 * ───────────────────────────────────────────────────────────────── */

/* Brand fonts — local variable woff2 files. */
@font-face {
  font-family: "Poppins";
  src: url("fonts/Poppins.woff2") format("woff2-variations"),
       url("fonts/Poppins.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("fonts/Montserrat.woff2") format("woff2-variations"),
       url("fonts/Montserrat.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("fonts/Inter.woff2") format("woff2-variations"),
       url("fonts/Inter.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fragment Mono";
  src: url("fonts/Fragment_Mono.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ── Type · Family (DS) ── */
  --font-sans:    "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono:    "Fragment Mono", "Inter", "SF Mono", ui-monospace, Menlo, monospace;
  --font-alt:     "Montserrat", "Poppins", sans-serif;

  /* ── Type · Scale (DS, px on a 1920 frame) ── */
  --fs-display:  72px;
  --fs-h1:       52px;
  --fs-h2:       40px;
  --fs-h3:       30px;
  --fs-h4:       22px;
  --fs-h5:       18px;
  --fs-body-lg:  18px;
  --fs-body:     16px;
  --fs-body-sm:  14px;
  --fs-eyebrow:  13px;
  --fs-mono:     13px;

  /* ── Type · Leading (DS) ── */
  --lh-display:  1.06;
  --lh-h1:       1.10;
  --lh-h2:       1.18;
  --lh-h3:       1.26;
  --lh-h4:       1.36;
  --lh-body:     1.6;
  --lh-tight:    1.4;

  /* ── Type · Tracking (DS) ── */
  --tr-display:  -0.025em;
  --tr-h1:       -0.025em;
  --tr-h2:       -0.020em;
  --tr-h3:       -0.015em;
  --tr-h4:       -0.010em;
  --tr-h5:       -0.005em;
  --tr-body:     -0.002em;
  --tr-eyebrow:  0.12em;
}

/* ── Opt-in heading helpers (DS), available by class ── */
.ds-display {
  font-family: var(--font-display); font-weight: 700;
  font-size: var(--fs-display); line-height: var(--lh-display); letter-spacing: var(--tr-display); margin: 0;
}
.ds-h1 {
  font-family: var(--font-display); font-weight: 700;
  font-size: var(--fs-h1); line-height: var(--lh-h1); letter-spacing: var(--tr-h1); margin: 0;
}
.ds-h2 {
  font-family: var(--font-display); font-weight: 700;
  font-size: var(--fs-h2); line-height: var(--lh-h2); letter-spacing: var(--tr-h2); margin: 0;
}
.ds-h3 {
  font-family: var(--font-display); font-weight: 700;
  font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: var(--tr-h3); margin: 0;
}
.ds-h4 {
  font-family: var(--font-sans); font-weight: 600;
  font-size: var(--fs-h4); line-height: var(--lh-h4); letter-spacing: var(--tr-h4); margin: 0;
}
.ds-h5 {
  font-family: var(--font-sans); font-weight: 600;
  font-size: var(--fs-h5); line-height: var(--lh-h4); letter-spacing: var(--tr-h5); margin: 0;
}