/* ============================================================
   TYPOGRAPHY
   Antic Didone — Headline 1 & 2 (editorial display serif)
   Hanken Grotesk — Headline 3, paragraph, nav/buttons, caption
                    (substitute for commercial TT Norms)
   Nav & buttons: letter-spaced uppercase. Captions: small, tracked.
   ============================================================ */

:root {
  /* --- Families ------------------------------------------- */
  --font-display: "Antic Didone", "Times New Roman", Georgia, serif;
  --font-sans:    "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
  /* alias kept for clarity — TT Norms maps to the sans above */
  --font-tt-norms: var(--font-sans);

  /* --- Weights --------------------------------------------- */
  --fw-regular: 400;   /* @kind font */
  --fw-medium:  500;   /* @kind font */
  --fw-semibold: 600;  /* @kind font */

  /* --- Type scale (rem; 1rem = 16px) ---------------------- */
  --fs-display: 4.5rem;   /* 72px — hero H1 */
  --fs-h1:      3.25rem;  /* 52px */
  --fs-h2:      2.25rem;  /* 36px */
  --fs-h3:      1.375rem; /* 22px — TT Norms Medium */
  --fs-lg:      1.1875rem;/* 19px — lead paragraph */
  --fs-body:    1rem;     /* 16px */
  --fs-sm:      0.875rem; /* 14px */
  --fs-caption: 0.75rem;  /* 12px */
  --fs-micro:   0.6875rem;/* 11px — eyebrow / overline */

  /* --- Line heights --------------------------------------- */
  --lh-tight:   1.06;   /* @kind font */
  --lh-snug:    1.22;   /* @kind font */
  --lh-body:    1.62;   /* @kind font */
  --lh-relaxed: 1.75;   /* @kind font */

  /* --- Tracking ------------------------------------------- */
  --ls-display: -0.01em;
  --ls-tight:   -0.005em;
  --ls-normal:  0;        /* @kind font */
  --ls-nav:     0.14em;   /* nav / buttons — letter-spaced */
  --ls-caption: 0.08em;   /* captions — tracked */
  --ls-eyebrow: 0.22em;   /* overline / eyebrow — widest */
}

/* ============================================================
   ELEMENT DEFAULTS
   ============================================================ */
.ds-h1, h1 {
  font-family: var(--font-display);
  font-weight: var(--fw-regular);
  font-size: var(--fs-h1);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-display);
  color: var(--text-primary);
}
.ds-h2, h2 {
  font-family: var(--font-display);
  font-weight: var(--fw-regular);
  font-size: var(--fs-h2);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-tight);
  color: var(--text-primary);
}
.ds-h3, h3 {
  font-family: var(--font-sans);
  font-weight: var(--fw-medium);
  font-size: var(--fs-h3);
  line-height: var(--lh-snug);
  letter-spacing: var(--ls-normal);
  color: var(--text-primary);
}
.ds-body, p {
  font-family: var(--font-sans);
  font-weight: var(--fw-regular);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--text-primary);
}
.ds-lead {
  font-family: var(--font-sans);
  font-weight: var(--fw-regular);
  font-size: var(--fs-lg);
  line-height: var(--lh-relaxed);
  color: var(--text-secondary);
}
.ds-nav {
  font-family: var(--font-sans);
  font-weight: var(--fw-medium);
  font-size: var(--fs-sm);
  letter-spacing: var(--ls-nav);
  text-transform: uppercase;
}
.ds-caption {
  font-family: var(--font-sans);
  font-weight: var(--fw-regular);
  font-size: var(--fs-caption);
  letter-spacing: var(--ls-caption);
  color: var(--text-caption);
}
.ds-eyebrow {
  font-family: var(--font-sans);
  font-weight: var(--fw-medium);
  font-size: var(--fs-micro);
  letter-spacing: var(--ls-eyebrow);
  text-transform: uppercase;
  color: var(--text-caption);
}