/* ADD Horizons — typography tokens
   Wotfard everywhere. Oversized display, tight tracking, confident weight jumps. */

:root {
  --font-sans: "Wotfard", -apple-system, "Segoe UI", sans-serif;

  /* weights */
  --fw-thin: 100; /* @kind font */
  --fw-extralight: 200; /* @kind font */
  --fw-light: 300; /* @kind font */
  --fw-regular: 400; /* @kind font */
  --fw-medium: 500; /* @kind font */
  --fw-semibold: 600; /* @kind font */
  --fw-bold: 700; /* @kind font */

  /* tracking — tight throughout, tighter as size increases */
  --tracking-tightest: -0.03em;
  --tracking-tight: -0.02em;
  --tracking-snug: -0.01em;
  --tracking-normal: 0em;
  --tracking-wide: 0.04em;

  /* fluid type scale */
  --text-display: clamp(3.5rem, calc(2.4rem + 4.5vw), 7.5rem);   /* oversized H1 */
  --text-h1: clamp(2.75rem, calc(2.1rem + 2.6vw), 4.5rem);
  --text-h2: clamp(2.25rem, calc(1.85rem + 1.7vw), 3.25rem);
  --text-h3: clamp(1.5rem, calc(1.3rem + 0.8vw), 2rem);
  --text-h4: clamp(1.25rem, calc(1.15rem + 0.4vw), 1.5rem);
  --text-lg: 1.25rem;
  --text-body: 1.0625rem;
  --text-sm: 0.9375rem;
  --text-xs: 0.8125rem;
  --text-label: 0.8125rem;

  --leading-tight: 1.02;
  --leading-snug: 1.15;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;
}

body {
  font-family: var(--font-sans);
  font-weight: var(--fw-regular);
  color: var(--text-primary);
  letter-spacing: var(--tracking-normal);
}

h1, .type-display {
  font-family: var(--font-sans);
  font-weight: var(--fw-bold);
  font-size: var(--text-display);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tightest);
}

h2 {
  font-family: var(--font-sans);
  font-weight: var(--fw-bold);
  font-size: var(--text-h2);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
}

h3 {
  font-family: var(--font-sans);
  font-weight: var(--fw-semibold);
  font-size: var(--text-h3);
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-snug);
}

p {
  font-weight: var(--fw-regular);
  font-size: var(--text-body);
  line-height: var(--leading-relaxed);
  color: var(--text-primary);
}