:root {
  /* Brand palette — see docs brand guidelines. Gradient reserved for the
     logo, primary CTAs, and key numerals/accents only (~10% of any screen). */
  --pink: #FF3B82;
  --magenta: #C82DD7;
  --violet: #7B2FF3;
  --deep-violet: #4E17B8;
  --void: #120A1F;
  --ink: #14121A;
  --paper: #FAF8FB;
  --fog: #6B6675;
  --hairline: #E7E2ED;
  --gradient: linear-gradient(135deg, #FF3B82 0%, #C82DD7 38%, #7B2FF3 72%, #4E17B8 100%);

  /* Secondary/tertiary body text on dark (--fog reads low-contrast at body
     size directly on --void); hairline-on-dark border tint. */
  --mist: #C9C4D2;
  --hairline-dark: rgba(250, 248, 251, 0.12);

  /* Admin-only semantic status colors (not part of the public brand system) */
  --status-positive: #4ADE9A;
  --status-negative: #FF6B6B;
  --status-warning: #FFB84A;

  /* Type scale, per brand guidelines vol. 01 section 05 */
  --font-display: "Montserrat", sans-serif;
  /* Was Fraunces (serif) — switched to italic Montserrat so pull-quotes,
     package taglines, and legal-page intros share the same two-typeface
     system instead of a third, clashing serif. */
  --font-editorial: "Montserrat", sans-serif;
  /* "Google Sans" isn't a public Google Fonts release (Google keeps it for
     their own products), so Roboto — Google's actual open, public sans — is
     the closest honest substitute and pairs cleanly with Montserrat. */
  --font-body: "Roboto", sans-serif;
  --font-kicker: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;

  --fs-h1: clamp(2.5rem, 5vw + 1rem, 4.5rem);   /* 48–72px */
  --fs-h2: clamp(1.75rem, 2.5vw + 1rem, 2.25rem); /* 28–36px */
  --fs-quote: clamp(1.375rem, 1.5vw + 1rem, 1.75rem); /* 22–28px */
  --fs-body: 1.0625rem;   /* ~17px, within 16–18px range */
  --fs-caption: 0.75rem;  /* 12px */

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6rem;

  --radius: 12px;
  --container-width: 1200px;
}