/* Breakthru Ventures AI — design tokens
   Extracted from the Claude Design standalone bundle, 11 Sept 2026.
   Styling authority referenced by Section 3 of the build spec.
   Copy into the theme as assets/css/tokens.css, unmodified. */

:root{
  --font-display:"Newsreader",Georgia,"Times New Roman",serif;
  --font-serif:"Newsreader",Georgia,"Times New Roman",serif;
  --font-ui:"Public Sans","Helvetica Neue",Arial,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}

:root{
  /* ── Brand core (sampled from the Breakthru Ventures AI logo + lockup) ── */
  --bv-blue-900:#00294A;
  --bv-blue-800:#00477A;
  --bv-blue-700:#005A96;
  --bv-blue-600:#0070B8; /* wordmark blue — primary brand colour */
  --bv-blue-500:#2A8FD0;
  --bv-blue-300:#8DCCFF; /* logo lower face / sky */
  --bv-blue-100:#D0E0F8;
  --bv-blue-50:#EEF4FC;

  --bv-navy-900:#061428; /* dark ground of the brand imagery */
  --bv-navy-800:#0B1E38;
  --bv-navy-700:#12314F;

  --bv-red-600:#D92D3C;
  --bv-red-500:#ED4B4B; /* logo left face */
  --bv-red-100:#FBE0E0;

  --bv-green-600:#4FAF2C;
  --bv-green-500:#73D34B; /* logo right face */
  --bv-green-100:#E4F7DA;

  /* ── Neutrals (cool-leaning paper, editorial ink) ── */
  --neutral-000:#FFFFFF;
  --neutral-025:#FAFBFC;
  --neutral-050:#F4F6F9;
  --neutral-100:#EAEDF2;
  --neutral-200:#DDE2E9;
  --neutral-300:#C3CAD4;
  --neutral-400:#9BA4B1;
  --neutral-500:#68727E;
  --neutral-600:#4E5763;
  --neutral-700:#343C47;
  --neutral-800:#1F262F;
  --neutral-900:#12161C;
  --neutral-950:#0A0D12;

  /* ── Semantic: text ── */
  --text-primary:var(--neutral-900);
  --text-secondary:var(--neutral-600);
  --text-muted:var(--neutral-500);
  --text-faint:var(--neutral-400);
  --text-inverse:var(--neutral-000);
  --text-inverse-muted:#A9B7C7;
  --text-link:var(--bv-blue-700);
  --text-link-hover:var(--bv-blue-900);
  --text-accent:var(--bv-red-600);

  /* ── Semantic: surfaces ── */
  --surface-page:var(--neutral-050);
  --surface-card:var(--neutral-000);
  --surface-raised:var(--neutral-000);
  --surface-sunken:var(--neutral-100);
  --surface-inverse:var(--bv-navy-900);
  --surface-inverse-alt:var(--bv-navy-800);
  --surface-brand:var(--bv-blue-600);
  --surface-brand-soft:var(--bv-blue-50);

  /* ── Semantic: borders + rules ── */
  --border-hairline:var(--neutral-200);
  --border-subtle:var(--neutral-200);
  --border-strong:var(--neutral-500);
  --border-ink:var(--neutral-900);
  --border-inverse:#1E3555;
  --rule-editorial:var(--neutral-900);

  /* ── Semantic: interactive ── */
  --accent-primary:var(--bv-blue-600);
  --accent-primary-hover:var(--bv-blue-700);
  --accent-primary-active:var(--bv-blue-800);
  --accent-editorial:var(--bv-red-600);
  --focus-ring:var(--bv-blue-500);

  /* ── Status ── */
  --status-positive:var(--bv-green-600);
  --status-positive-soft:var(--bv-green-100);
  --status-negative:var(--bv-red-600);
  --status-negative-soft:var(--bv-red-100);
  --status-info:var(--bv-blue-600);
  --status-info-soft:var(--bv-blue-50);

  /* ── AMP desk colours (AI · Money · Power, mapped to the three logo faces) ── */
  --amp-ai:var(--bv-blue-600);
  --amp-ai-soft:var(--bv-blue-50);
  --amp-money:var(--bv-green-600);
  --amp-money-soft:var(--bv-green-100);
  --amp-power:var(--bv-red-600);
  --amp-power-soft:var(--bv-red-100);
  --amp-government:var(--bv-navy-700);
  --amp-government-on-dark:#A9C0DA;
  --amp-money-on-light:#38761D;
  --amp-cite-number:var(--neutral-500); /* citation numbers are content, not decoration */
  --amp-government-soft:var(--neutral-100);
}

:root{
  /* Sizes — editorial scale, generous for long-form reading */
  --text-display-xl:64px;
  --text-display-l:48px;
  --text-h1:40px;
  --text-h2:30px;
  --text-h3:23px;
  --text-h4:19px;
  --text-body-lg:20px;  /* article body */
  --text-body:17px;     /* interface prose */
  --text-body-sm:15px;
  --text-caption:13px;
  --text-label:12px;    /* uppercase eyebrow / kicker */
  --text-micro:11px;

  /* Line heights */
  --leading-tight:1.04;
  --leading-snug:1.16;
  --leading-heading:1.24;
  --leading-normal:1.5;
  --leading-body:1.62;
  --leading-loose:1.72;

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

  /* Tracking */
  --tracking-display:-0.022em;
  --tracking-heading:-0.014em;
  --tracking-normal:0em;
  --tracking-wide:0.02em;
  --tracking-label:0.1em;
  --tracking-mono:0.01em;

  /* Measure */
  --measure-article:66ch;
  --measure-narrow:44ch;
  --measure-wide:78ch;
}

:root{
  --space-0:0px;
  --space-1:2px;
  --space-2:4px;
  --space-3:8px;
  --space-4:12px;
  --space-5:16px;
  --space-6:20px;
  --space-7:24px;
  --space-8:32px;
  --space-9:40px;
  --space-10:56px;
  --space-11:72px;
  --space-12:96px;
  --space-13:128px;
  --space-14:176px;

  --gutter-page:24px;
  --gutter-column:32px;
  --section-y:96px;
  --section-y-tight:56px;
}

:root{
  /* Print-derived: corners stay square. Radius is used sparingly and never above 8px
     except for pills (tags, avatars, the AI roundel in the logo). */
  --radius-none:0px;
  --radius-xs:2px;
  --radius-sm:3px;
  --radius-md:4px;
  --radius-lg:8px;
  --radius-pill:999px;
  --radius-circle:50%;
}

:root{
  /* Elevation is quiet. Rules and hairlines do most of the separating work. */
  --shadow-none:none;
  --shadow-hairline:0 0 0 1px var(--border-hairline);
  --shadow-xs:0 1px 2px rgba(6,20,40,.06);
  --shadow-sm:0 1px 3px rgba(6,20,40,.08),0 1px 2px rgba(6,20,40,.04);
  --shadow-md:0 4px 12px rgba(6,20,40,.09),0 1px 3px rgba(6,20,40,.05);
  --shadow-lg:0 12px 32px rgba(6,20,40,.12),0 2px 8px rgba(6,20,40,.06);
  --shadow-inset-top:inset 0 1px 0 rgba(255,255,255,.6);
  --shadow-focus:0 0 0 3px rgba(0,112,184,.28);
}

:root{
  --duration-instant:80ms; /* @kind other */
  --duration-fast:120ms; /* @kind other */
  --duration-base:180ms; /* @kind other */
  --duration-slow:260ms; /* @kind other */
  --duration-deliberate:420ms; /* @kind other */

  --ease-standard:cubic-bezier(.2,.6,.2,1); /* @kind other */
  --ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
  --ease-in:cubic-bezier(.5,0,.9,.4); /* @kind other */
  --ease-linear:linear; /* @kind other */

  --transition-color:color var(--duration-fast) var(--ease-standard),background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard); /* @kind other */
}
@media (prefers-reduced-motion:reduce){
  :root{--duration-instant:0ms; /* @kind other */--duration-fast:0ms; /* @kind other */--duration-base:0ms; /* @kind other */--duration-slow:0ms; /* @kind other */--duration-deliberate:0ms /* @kind other */}
}

:root{
  --container-max:1280px;
  --container-editorial:1160px;
  --container-text:720px;
  --container-narrow:560px;

  --grid-columns:12; /* @kind other */
  --grid-gap:32px;

  --header-height:72px;
  --header-height-compact:56px;

  --z-base:0; /* @kind other */
  --z-raised:10; /* @kind other */
  --z-sticky:100; /* @kind other */
  --z-header:200; /* @kind other */
  --z-overlay:300; /* @kind other */
  --z-modal:400; /* @kind other */
  --z-toast:500; /* @kind other */
}

/* Minimal element defaults so specimen cards, kits and consumer pages agree. */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--font-ui);font-size:var(--text-body);line-height:var(--leading-body);color:var(--text-primary);background:var(--surface-page);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:var(--weight-semibold);letter-spacing:var(--tracking-heading);line-height:var(--leading-heading);margin:0}
p{margin:0;text-wrap:pretty}
a{color:var(--text-link);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px;transition:var(--transition-color)}
a:hover{color:var(--text-link-hover);text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
::selection{background:var(--bv-blue-100);color:var(--neutral-900)}