/* HumbleBear type. NOTE: the app sets `html { font-size: 14px }` (atom.css), so every
   rem-based size below renders 14/16 of its nominal px value inside the product. The
   px values here are the RENDERED sizes at that 14px root. */

:root{
  --font-sans:"Inter",ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji";
  --font-brand:"Outfit",var(--font-sans);       /* logo lockups, merch, campaign headlines — 900 matches the old brand bold */
  --font-script:"Cookie",cursive;               /* rare hand-written accent */
  --font-mono:ui-monospace,SFMono-Regular,Menlo,monospace;

  --root-font-size:14px;   /* product root — not 16px */

  /* rendered UI sizes (Tailwind name → px at 14px root) */
  --text-xs:10.5px;    /* text-xs   — kbd caps, table sub-labels */
  --text-sm:12.25px;   /* text-sm   — captions, badges, filters */
  --text-base:14px;    /* text-base — body default */
  --text-lg:15.75px;   /* text-lg   — heading size="lg" */
  --text-xl:17.5px;    /* text-xl   — page heading (atom:heading size="xl") */
  --text-2xl:21px;
  --text-3xl:26.25px;  /* stats-card figure, pricing amount */
  --text-5xl:42px;     /* marketing h2 */
  --text-6xl:52.5px;   /* marketing hero h1 */

  --leading-none:1;
  --leading-tight:1.25;   /* headings, marketing display */
  --leading-normal:1.5;
  --leading-relaxed:1.625; /* marketing body */
  --leading-6:1.5rem;     /* labels + table column heads */

  --weight-normal:400;
  --weight-medium:500;   /* the workhorse: buttons, labels, nav, table numbers */
  --weight-semibold:600; /* callout headings, nav group headings */
  --weight-bold:700;     /* marketing headlines, stats figures */
  --weight-extrabold:800;/* hero h1 only */

  --tracking-wider:.05em; /* uppercase table heads + nav group headings */
}