/* ════════════════════════════════════════════════════════════════
   TYPOGRAPHY
   ════════════════════════════════════════════════════════════════ */

body {
  font-family: var(--font-body);
  font-weight: var(--weight-light);
  font-size: var(--text-body);
  letter-spacing: 0.01em;
}

/* ── DISPLAY (Cormorant) ── */
.font-display {
  font-family: var(--font-display);
  font-weight: var(--weight-light);
  letter-spacing: var(--tracking-tight);
  line-height: var(--leading-tight);
}

/* ── HERO MEGA NAME ── */
.text-mega {
  font-family: var(--font-display);
  font-size: var(--text-mega);
  font-weight: var(--weight-light);
  line-height: 0.88;
  letter-spacing: -0.04em;
  text-transform: uppercase;
}

.text-hero {
  font-family: var(--font-display);
  font-size: var(--text-hero);
  font-weight: var(--weight-light);
  line-height: 0.95;
  letter-spacing: var(--tracking-tight);
}

.text-h1 {
  font-family: var(--font-display);
  font-size: var(--text-h1);
  font-weight: var(--weight-light);
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-tight);
}

.text-h2 {
  font-family: var(--font-display);
  font-size: var(--text-h2);
  font-weight: var(--weight-light);
  line-height: var(--leading-snug);
  letter-spacing: -0.015em;
}

.text-h3 {
  font-family: var(--font-display);
  font-size: var(--text-h3);
  font-weight: var(--weight-regular);
  line-height: var(--leading-snug);
}

.text-h4 {
  font-family: var(--font-display);
  font-size: var(--text-h4);
  font-weight: var(--weight-regular);
  line-height: var(--leading-snug);
}

/* ── BODY ── */
.text-body-lg {
  font-size: var(--text-body-lg);
  line-height: var(--leading-relaxed);
  font-weight: var(--weight-light);
}

.text-body {
  font-size: var(--text-body);
  line-height: var(--leading-relaxed);
  font-weight: var(--weight-light);
}

/* ── LABELS / EYEBROW / META ── */
.eyebrow,
.label,
.text-label {
  font-family: var(--font-body);
  font-size: var(--text-label);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-ultra);
  text-transform: uppercase;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 14px;
}

.eyebrow::before {
  content: '';
  display: inline-block;
  width: 32px;
  height: 1px;
  background: currentColor;
  opacity: 0.6;
}

.text-caption {
  font-size: var(--text-caption);
  font-weight: var(--weight-light);
  line-height: var(--leading-normal);
}

.text-meta {
  font-size: var(--text-micro);
  font-weight: var(--weight-medium);
  letter-spacing: var(--tracking-ultra);
  text-transform: uppercase;
}

/* ── ITALIC PHILOSOPHY QUOTES ── */
.text-italic-display {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: var(--weight-light);
}

/* ── EMPHASIS ── */
.text-muted-light  { color: var(--text-muted-on-black); }
.text-muted-dark   { color: var(--text-muted-on-white); }
.text-on-dark      { color: var(--color-white); }
.text-on-light     { color: var(--color-black); }