/* ============================================================
   SISTEMA TIPOGRÁFICO — PANOX
   ============================================================ */

/* ── Utilitarios de jerarquía ─────────────────────────────── */

.text-overline {
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: var(--tracking-widest);
  text-transform: uppercase;
  line-height: var(--leading-normal);
}

.text-caption {
  font-family: var(--font-sans);
  font-size: var(--text-sm);
  font-weight: 400;
  color: var(--neutral-500);
  line-height: var(--leading-relaxed);
}

.text-body {
  font-family: var(--font-sans);
  font-size: var(--text-base);
  font-weight: 400;
  line-height: var(--leading-relaxed);
  color: var(--neutral-600);
}

.text-body-lg {
  font-family: var(--font-sans);
  font-size: var(--text-lg);
  font-weight: 400;
  line-height: var(--leading-relaxed);
  color: var(--neutral-600);
}

/* ── Display (headings de sección) ──────────────────────────── */

.display-xs {
  font-family: var(--font-serif);
  font-size: clamp(var(--text-2xl), 4vw, var(--text-3xl));
  font-weight: 400;
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-tight);
}

.display-sm {
  font-family: var(--font-serif);
  font-size: clamp(var(--text-3xl), 5vw, var(--text-4xl));
  font-weight: 400;
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-tight);
}

.display-md {
  font-family: var(--font-serif);
  font-size: clamp(var(--text-4xl), 6vw, var(--text-5xl));
  font-weight: 400;
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tighter);
}

.display-lg {
  font-family: var(--font-serif);
  font-size: clamp(var(--text-5xl), 8vw, var(--text-6xl));
  font-weight: 400;
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tighter);
}

.display-xl {
  font-family: var(--font-serif);
  font-size: clamp(var(--text-5xl), 10vw, var(--text-7xl));
  font-weight: 400;
  line-height: 1.05;
  letter-spacing: -0.03em;
}

/* ── Monoespaciado para datos médicos/legales ───────────────── */

.text-mono {
  font-family: var(--font-mono);
  font-size: var(--text-sm);
  font-weight: 400;
  letter-spacing: 0.02em;
}

/* ── Color utilities ─────────────────────────────────────────── */

.text-brand     { color: var(--brand-primary); }
.text-white     { color: var(--white); }
.text-dark      { color: var(--dark-900); }
.text-muted     { color: var(--neutral-500); }
.text-secondary { color: var(--neutral-600); }

/* ── Weight utilities ────────────────────────────────────────── */

.font-normal  { font-weight: 400; }
.font-medium  { font-weight: 500; }
.font-semibold{ font-weight: 600; }
.font-bold    { font-weight: 700; }

/* ── Alignment utilities ─────────────────────────────────────── */

.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-right  { text-align: right; }