/* ============================================
   KAYJAH DESIGN STUDIO — Typography System
   ============================================ */

/* Display — hero-level, cinematic */
.t-display {
  font-family: var(--serif);
  font-size: clamp(3.5rem, 8vw, 9rem);
  font-weight: 300;
  line-height: 0.92;
  letter-spacing: -0.03em;
  color: var(--ink);
}

/* Headline 1 — page section titles */
.t-h1 {
  font-family: var(--serif);
  font-size: clamp(2.5rem, 5vw, 5rem);
  font-weight: 300;
  line-height: 1.0;
  letter-spacing: -0.02em;
}

/* Headline 2 — subsections */
.t-h2 {
  font-family: var(--serif);
  font-size: clamp(1.6rem, 3vw, 2.8rem);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.01em;
}

/* Headline 3 — cards, features */
.t-h3 {
  font-family: var(--serif);
  font-size: clamp(1.2rem, 2vw, 1.6rem);
  font-weight: 500;
  line-height: 1.2;
}

/* Body — primary reading */
.t-body {
  font-family: var(--sans);
  font-size: clamp(0.95rem, 1.1vw, 1.05rem);
  font-weight: 400;
  line-height: 1.75;
}

/* Body large — intro paragraphs, featured text */
.t-body-lg {
  font-family: var(--sans);
  font-size: clamp(1.05rem, 1.3vw, 1.2rem);
  font-weight: 400;
  line-height: 1.8;
}

/* Overline — eyebrow labels */
.t-overline {
  font-family: var(--sans);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--accent);
}

/* Caption — metadata */
.t-caption {
  font-family: var(--sans);
  font-size: 0.75rem;
  font-weight: 400;
  letter-spacing: 0.05em;
  color: var(--ink-muted);
}

/* Pull quote — editorial accent */
.t-pullquote {
  font-family: var(--serif);
  font-size: clamp(1.4rem, 2.5vw, 2.2rem);
  font-weight: 300;
  font-style: italic;
  line-height: 1.45;
}

/* Oversized stat number */
.t-stat {
  font-family: var(--serif);
  font-size: clamp(4rem, 8vw, 7rem);
  font-weight: 300;
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--accent);
}

/* Italic emphasis within serif context */
em, .t-italic {
  font-style: italic;
}