/* ==========================================================================
   BHIVE — Typography tokens
   Display: Archivo (heavy weights, uppercase, tight tracking) — mimics wordmark.
   For the compressed wordmark feel, headline styles use font-stretch + weight.
   ========================================================================== */
:root {
  /* Families.
     --font-logo  = Knockout Featherweight — RESERVED for the wordmark/brand lockups
                    only, so the logos stay unique (Hoefler&Co, commercial; upload
                    the file per fonts.css — Archivo Expanded renders until then).
     --font-display = Archivo Expanded — headlines/display (weight 800–900).
                    Wide, heavy grotesque that contrasts the condensed logo.
     --font-sans  = Archivo — body & UI. --font-mono = Space Mono. */
  --font-logo: 'Knockout Featherweight', 'Archivo Expanded', system-ui, sans-serif;
  --font-display: 'Archivo Expanded', 'Archivo', system-ui, sans-serif;
  --font-sans: 'Archivo', system-ui, -apple-system, sans-serif;
  --font-mono: 'Space Mono', ui-monospace, 'SFMono-Regular', monospace;

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

  /* Fluid display scale (headline / hero) */
  --fs-display-1: clamp(3rem, 7vw, 6rem); /* @kind font */
  --fs-display-2: clamp(2.4rem, 5vw, 4rem); /* @kind font */
  --fs-display-3: clamp(1.9rem, 3.6vw, 2.75rem); /* @kind font */

  /* Static type scale */
  --fs-h1: 2.5rem;
  --fs-h2: 2rem;
  --fs-h3: 1.5rem;
  --fs-h4: 1.25rem;
  --fs-lg: 1.125rem;
  --fs-base: 1rem;
  --fs-sm: 0.875rem;
  --fs-xs: 0.75rem;
  --fs-2xs: 0.6875rem;

  /* Line heights */
  --lh-tight: 1.02; /* @kind other */
  --lh-snug: 1.15; /* @kind other */
  --lh-heading: 1.2; /* @kind other */
  --lh-body: 1.6; /* @kind other */
  --lh-relaxed: 1.75; /* @kind other */

  /* Letter spacing */
  --ls-mega: -0.02em; /* @kind other */
  --ls-tight: -0.01em; /* @kind other */
  --ls-normal: 0; /* @kind other */
  --ls-wide: 0.04em; /* @kind other */
  --ls-label: 0.14em; /* @kind other */
  --ls-kicker: 0.3em; /* @kind other */
}

/* Reusable text roles */
.bh-eyebrow {
  font-family: var(--font-sans);
  font-weight: var(--fw-bold);
  font-size: var(--fs-xs);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--text-brand);
}
.bh-kicker {
  font-family: var(--font-sans);
  font-weight: var(--fw-semibold);
  font-size: var(--fs-2xs);
  letter-spacing: var(--ls-kicker);
  text-transform: uppercase;
}
.bh-display {
  font-family: var(--font-display);
  font-weight: var(--fw-black);
  letter-spacing: var(--ls-mega);
  line-height: var(--lh-tight);
  text-transform: uppercase;
}