/* ============================================================
   Noctua — Typography scale
   Display = Verdana Bold, tight tracking. Body = Poppins.
   Editorial rhythm: big confident headlines, airy body.
   ============================================================ */

:root {
  /* Font families resolved in fonts.css: --font-display, --font-body, --font-mono */

  /* ---- Weights ---- */
  --fw-regular: 400; /* @kind other */
  --fw-medium: 500; /* @kind other */
  --fw-semibold: 600; /* @kind other */
  --fw-bold: 700; /* @kind other */

  /* ---- Type scale (rem, 16px base) ---- */
  --text-2xs: 0.6875rem;  /* 11px — eyebrow / legal */
  --text-xs:  0.75rem;    /* 12px */
  --text-sm:  0.875rem;   /* 14px */
  --text-base:1rem;       /* 16px — body */
  --text-md:  1.125rem;   /* 18px — lead body */
  --text-lg:  1.375rem;   /* 22px — subhead */
  --text-xl:  1.75rem;    /* 28px */
  --text-2xl: 2.25rem;    /* 36px */
  --text-3xl: 3rem;       /* 48px — section headline */
  --text-4xl: 3.75rem;    /* 60px */
  --text-5xl: 4.75rem;    /* 76px — hero */
  --text-6xl: 6rem;       /* 96px — oversized display */

  /* ---- Line heights ---- */
  --lh-tight: 1.02; /* @kind other */ /* display headlines */
  --lh-snug: 1.18; /* @kind other */ /* subheads */
  --lh-normal: 1.55; /* @kind other */ /* body */
  --lh-relaxed: 1.7;      /* @kind other */

  /* ---- Letter spacing ---- */
  --ls-tighter: -0.03em;  /* big Verdana headlines need negative tracking @kind other */
  --ls-tight: -0.015em;   /* @kind other */
  --ls-normal: 0;         /* @kind other */
  --ls-wide: 0.04em;      /* @kind other */
  --ls-wider: 0.14em;     /* eyebrows / overlines, uppercase @kind other */

  /* ---- Semantic role tokens ---- */
  --role-display: var(--fw-bold) var(--text-5xl)/var(--lh-tight) var(--font-display);
  --role-h1: var(--fw-bold) var(--text-3xl)/var(--lh-tight) var(--font-display);
  --role-h2: var(--fw-bold) var(--text-2xl)/var(--lh-snug) var(--font-display);
  --role-subhead: var(--fw-bold) var(--text-lg)/var(--lh-snug) var(--font-body);
  --role-lead: var(--fw-regular) var(--text-md)/var(--lh-normal) var(--font-body);
  --role-body: var(--fw-regular) var(--text-base)/var(--lh-normal) var(--font-body);
  --role-small: var(--fw-regular) var(--text-sm)/var(--lh-normal) var(--font-body);
  --role-eyebrow: var(--fw-semibold) var(--text-xs)/1.4 var(--font-mono);
}

/* ---- Optional helper classes (consumers may use tokens directly) ---- */
.cb-eyebrow {
  font: var(--role-eyebrow);
  letter-spacing: var(--ls-wider);
  text-transform: uppercase;
  color: var(--text-accent);
}
.cb-display { font: var(--role-display); letter-spacing: var(--ls-tighter); color: var(--text-strong); }
.cb-h1 { font: var(--role-h1); letter-spacing: var(--ls-tighter); color: var(--text-strong); }
.cb-h2 { font: var(--role-h2); letter-spacing: var(--ls-tight); color: var(--text-strong); }
.cb-subhead { font: var(--role-subhead); letter-spacing: var(--ls-tight); color: var(--text-strong); }
.cb-lead { font: var(--role-lead); color: var(--text-body); }
.cb-body { font: var(--role-body); color: var(--text-body); }
.cb-mono { font-family: var(--font-mono); }