/* ==========================================================================
   TALEA — Typography
   Serif carries thought. Sans carries system. Neither is decoration.
   ========================================================================== */

body {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  font-weight: 400;
  color: var(--ink);
  letter-spacing: 0.005em;
}

h1, h2, h3, h4 {
  font-family: var(--font-serif);
  font-weight: 400;
  line-height: 1.08;
  letter-spacing: -0.01em;
  color: currentColor;
}

.eyebrow {
  font-family: var(--font-sans);
  font-size: var(--fs-caption);
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--bronze-deep);
}

.on-dark .eyebrow,
[data-ground="dark"] .eyebrow { color: var(--bronze); }

.lede {
  font-family: var(--font-serif);
  font-size: var(--fs-lede);
  font-weight: 400;
  line-height: 1.5;
  max-width: var(--text-max);
  color: var(--ink-soft);
}

[data-ground="dark"] .lede { color: var(--paper-soft); }

p {
  max-width: var(--text-max);
  color: var(--ink-soft);
}

[data-ground="dark"] p { color: var(--paper-soft); }

.caption {
  font-size: var(--fs-caption);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ink-soft);
}

[data-ground="dark"] .caption { color: var(--paper-faint); }

.numeral {
  font-family: var(--font-serif);
  font-variant-numeric: oldstyle-nums;
  color: var(--bronze);
}

.text-serif { font-family: var(--font-serif); }
.text-sans  { font-family: var(--font-sans); }

.display {
  font-family: var(--font-serif);
  font-size: var(--fs-display);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.015em;
}

.h1 { font-size: var(--fs-h1); }
.h2 { font-size: var(--fs-h2); }
.h3 { font-size: var(--fs-h3); }

.small { font-size: var(--fs-small); }