/* ============================================================
   TEN TENTHS — TYPOGRAPHY TOKENS
   ============================================================ */
:root {
  /* Families */
  --font-display: 'Anton', 'Arial Narrow', sans-serif;
  --font-sans:    'DM Sans', system-ui, -apple-system, sans-serif;
  --font-mono:    'DM Mono', ui-monospace, 'SF Mono', monospace;

  /* Weights */
  --weight-regular: 400;
  --weight-medium:  500;
  --weight-bold:    700;

  /* Fluid display sizes — Anton, set tight & uppercase */
  --text-display-xl: clamp(3.5rem, 8vw, 7rem);   /* hero */
  --text-display-l:  clamp(2.75rem, 5.5vw, 4.5rem);
  --text-display-m:  clamp(2rem, 3.5vw, 3rem);
  --text-display-s:  1.75rem;

  /* Body / UI scale */
  --text-2xl: 1.75rem;   /* 28 */
  --text-xl:  1.375rem;  /* 22 */
  --text-lg:  1.125rem;  /* 18 */
  --text-md:  1rem;      /* 16 — base */
  --text-sm:  0.875rem;  /* 14 */
  --text-xs:  0.75rem;   /* 12 */

  /* Line heights */
  --leading-display: 0.92;
  --leading-tight:   1.15;
  --leading-snug:    1.35;
  --leading-normal:  1.55;

  /* Letter spacing */
  --tracking-display: 0.01em;   /* Anton, near-zero */
  --tracking-tight:   -0.01em;
  --tracking-normal:  0;
  --tracking-wide:    0.04em;
  --tracking-eyebrow: 0.18em;   /* uppercase eyebrows / labels */

  /* Semantic */
  --eyebrow-size: var(--text-sm);
}

/* ---- Utility text styles (optional helpers for consumers) ---- */
.tt-display {
  font-family: var(--font-display);
  font-weight: 400;
  line-height: var(--leading-display);
  letter-spacing: var(--tracking-display);
  text-transform: uppercase;
}
.tt-eyebrow {
  font-family: var(--font-sans);
  font-weight: var(--weight-bold);
  font-size: var(--eyebrow-size);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
}
.tt-body {
  font-family: var(--font-sans);
  font-weight: var(--weight-regular);
  font-size: var(--text-md);
  line-height: var(--leading-normal);
  color: var(--text-body);
}
.tt-mono {
  font-family: var(--font-mono);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-wide);
}
