/* ============================================================
  InVaal [016] — Typography
  File: css/typography.css

  Purpose:
  - Headings, body copy, and link styles
  - Consistent, readable editorial hierarchy
============================================================ */

h1, h2, h3, h4 {
  font-family: var(--font-body);
  color: var(--text);
  line-height: 1.15;
  letter-spacing: 0.2px;
}

h1 { font-size: clamp(2rem, 4.2vw, 3rem); }
h2 { font-size: clamp(1.4rem, 2.6vw, 2rem); }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.1rem; }

p {
  color: rgba(17, 24, 39, 0.86);
}

a {
  color: var(--brand-700);
  text-decoration: none;
  transition: color var(--t-fast) var(--ease);
}

a:hover {
  color: var(--accent-600);
  text-decoration: underline;
  text-underline-offset: 6px;
}