/* Wollongong Web Design Co — Typography Tokens */

:root {
  /* ── Font Sizes ─────────────────────────────────────────────────── */
  --text-2xs:  0.625rem;   /* 10px */
  --text-xs:   0.75rem;    /* 12px */
  --text-sm:   0.875rem;   /* 14px */
  --text-base: 1rem;       /* 16px */
  --text-lg:   1.125rem;   /* 18px */
  --text-xl:   1.25rem;    /* 20px */
  --text-2xl:  1.5rem;     /* 24px */
  --text-3xl:  1.875rem;   /* 30px */
  --text-4xl:  2.25rem;    /* 36px */
  --text-5xl:  3rem;       /* 48px */
  --text-6xl:  3.75rem;    /* 60px */
  --text-7xl:  4.5rem;     /* 72px */

  /* ── Line Heights ───────────────────────────────────────────────── */
  --leading-none:    1;
  --leading-tight:   1.2;
  --leading-snug:    1.375;
  --leading-normal:  1.5;
  --leading-relaxed: 1.65;
  --leading-loose:   2;

  /* ── Font Weights ───────────────────────────────────────────────── */
  --weight-light:     300;
  --weight-regular:   400;
  --weight-medium:    500;
  --weight-semibold:  600;
  --weight-bold:      700;
  --weight-extrabold: 800;

  /* ── Letter Spacing ─────────────────────────────────────────────── */
  --tracking-tighter: -0.04em;
  --tracking-tight:   -0.025em;
  --tracking-normal:  0em;
  --tracking-wide:    0.025em;
  --tracking-wider:   0.05em;
  --tracking-widest:  0.12em;

  /* ── Semantic Type Roles ────────────────────────────────────────── */
  --type-display-size:    var(--text-5xl);
  --type-display-weight:  var(--weight-extrabold);
  --type-display-leading: var(--leading-tight);
  --type-display-tracking: var(--tracking-tight);

  --type-h1-size:    var(--text-4xl);
  --type-h1-weight:  var(--weight-bold);
  --type-h1-leading: var(--leading-tight);

  --type-h2-size:    var(--text-3xl);
  --type-h2-weight:  var(--weight-bold);
  --type-h2-leading: var(--leading-snug);

  --type-h3-size:    var(--text-2xl);
  --type-h3-weight:  var(--weight-semibold);
  --type-h3-leading: var(--leading-snug);

  --type-h4-size:    var(--text-xl);
  --type-h4-weight:  var(--weight-semibold);
  --type-h4-leading: var(--leading-normal);

  --type-body-size:    var(--text-base);
  --type-body-weight:  var(--weight-regular);
  --type-body-leading: var(--leading-relaxed);

  --type-body-lg-size:    var(--text-lg);
  --type-body-lg-weight:  var(--weight-regular);
  --type-body-lg-leading: var(--leading-relaxed);

  --type-body-sm-size:    var(--text-sm);
  --type-body-sm-weight:  var(--weight-regular);
  --type-body-sm-leading: var(--leading-normal);

  --type-label-size:    var(--text-sm);
  --type-label-weight:  var(--weight-semibold);
  --type-label-leading: var(--leading-normal);

  --type-caption-size:    var(--text-xs);
  --type-caption-weight:  var(--weight-regular);
  --type-caption-leading: var(--leading-normal);

  --type-overline-size:    var(--text-xs);
  --type-overline-weight:  var(--weight-semibold);
  --type-overline-tracking: var(--tracking-widest);
  --type-overline-transform: uppercase;

  --type-code-size:   var(--text-sm);
  --type-code-family: var(--font-mono);
}