/* SpearMind webfonts.
   Per client direction the system uses Arial — a system font, so there are no @font-face rules
   and nothing is fetched. Helvetica / Liberation Sans / sans-serif are the fallbacks. */
:root{
/* ── Brand blue — sampled from the SpearMind logo (#0049A0 dominant) ───────── */
--sm-blue-950:#061A33;
--sm-blue-900:#0A2A52;
--sm-blue-800:#0B3B77;
--sm-blue-700:#0049A0;
--sm-blue-600:#1257B8;
--sm-blue-500:#2470D6;
--sm-blue-300:#7FA9E6;
--sm-blue-200:#C2D6F2;
--sm-blue-100:#E4EDF9;
--sm-blue-050:#F2F7FD;

/* ── Signal cyan — the tagline / circuit-node colour ("with AI") ───────────── */
--sm-cyan-700:#0079AE;
--sm-cyan-600:#0090CE;
--sm-cyan-500:#00A0E0;
--sm-cyan-400:#35B8F0;
--sm-cyan-200:#A8DEF7;
--sm-cyan-100:#DCF1FC;

/* ── Neutrals — cool, blue-leaning greys ─────────────────────────────────── */
--sm-white:#FFFFFF;
--sm-grey-050:#F6F8FB;
--sm-grey-100:#EDF1F6;
--sm-grey-200:#E0E7EF;
--sm-grey-300:#C9D4E1;
--sm-grey-400:#A3B1C2;
--sm-grey-500:#7C8B9E;
--sm-grey-600:#5B6A7D;
--sm-grey-700:#3D4B5C;
--sm-grey-800:#26313F;
--sm-grey-900:#141C26;

/* ── Semantic status ─────────────────────────────────────────────────────── */
--sm-success-600:#12855F;
--sm-success-100:#DCF2EA;
--sm-warning-600:#B4720A;
--sm-warning-100:#FBEFD8;
--sm-danger-600:#BE3A2B;
--sm-danger-100:#FBE4E1;
--sm-info-600:var(--sm-cyan-600);
--sm-info-100:var(--sm-cyan-100);

/* ── Semantic aliases — always prefer these in components ────────────────── */
--brand:var(--sm-blue-700);
--brand-strong:var(--sm-blue-800);
--brand-deep:var(--sm-blue-900);
--accent:var(--sm-cyan-500);
--accent-strong:var(--sm-cyan-600);

--text-heading:var(--sm-blue-900);
--text-body:var(--sm-grey-700);
--text-muted:var(--sm-grey-500);
--text-link:var(--sm-blue-700);
--text-link-hover:var(--sm-cyan-600);
--text-on-brand:var(--sm-white);
--text-eyebrow:var(--sm-cyan-600);

--surface-page:var(--sm-white);
--surface-subtle:var(--sm-grey-050);
--surface-card:var(--sm-white);
--surface-tint:var(--sm-blue-050);
--surface-inverse:var(--sm-blue-900);
--surface-inverse-2:var(--sm-blue-950);

--border-subtle:var(--sm-grey-200);
--border-default:var(--sm-grey-300);
--border-strong:var(--sm-blue-700);
--border-on-inverse:rgba(255,255,255,.16);

--focus-ring:var(--sm-cyan-500);
--overlay-scrim:rgba(6,26,51,.62);

/* ── Brand gradients — the only two sanctioned in the system ──────────────── */
--gradient-deep:linear-gradient(160deg,var(--sm-blue-900) 0%,var(--sm-blue-950) 62%,#03101F 100%);
--gradient-edge:linear-gradient(90deg,var(--sm-blue-700) 0%,var(--sm-cyan-500) 100%);
}

/* Inverse scope: apply to any deep-navy section so nested components adapt. */
[data-theme="inverse"]{
--text-heading:var(--sm-white);
--text-body:rgba(255,255,255,.78);
--text-muted:rgba(255,255,255,.55);
--text-link:var(--sm-cyan-400);
--text-link-hover:var(--sm-white);
--surface-page:var(--sm-blue-900);
--surface-subtle:rgba(255,255,255,.05);
--surface-card:rgba(255,255,255,.06);
--surface-tint:rgba(0,160,224,.10);
--border-subtle:rgba(255,255,255,.12);
--border-default:rgba(255,255,255,.22);
}
:root{
--font-display:Arial,"Helvetica Neue",Helvetica,"Liberation Sans",sans-serif;
--font-body:Arial,"Helvetica Neue",Helvetica,"Liberation Sans",sans-serif;
--font-mono:Arial,"Helvetica Neue",Helvetica,"Liberation Sans",sans-serif;

/* weights — Arial ships Regular and Bold only, so 300/500/600/800 map to the nearest real weight */
--fw-light:400;/* @kind font */--fw-regular:400;/* @kind font */--fw-medium:400;/* @kind font */--fw-semibold:700;/* @kind font */--fw-bold:700;/* @kind font */--fw-extrabold:700;/* @kind font */

/* type scale (1.25 major-third-ish, rounded to real used values) */
--fs-hero:60px;
--fs-display:44px;
--fs-h1:36px;
--fs-h2:28px;
--fs-h3:22px;
--fs-h4:18px;
--fs-lead:20px;
--fs-body:17px;
--fs-small:15px;
--fs-caption:13px;
--fs-eyebrow:12px;

--lh-tight:1.08;/* @kind font */
--lh-heading:1.18;/* @kind font */
--lh-snug:1.35;/* @kind font */
--lh-body:1.62;/* @kind font */
--lh-loose:1.75;/* @kind font */

--ls-hero:-0.02em;/* @kind font */
--ls-heading:-0.01em;/* @kind font */
--ls-body:0em;/* @kind font */
--ls-eyebrow:0.14em;/* @kind font */   /* the tagline lockup tracking */
--ls-button:0.03em;/* @kind font */

/* ── Semantic roles ─────────────────────────────────────────────────────── */
--type-hero-font:var(--font-display);
--type-hero-weight:var(--fw-extrabold);/* @kind font */
--type-heading-font:var(--font-display);
--type-heading-weight:var(--fw-bold);/* @kind font */
--type-body-font:var(--font-body);
--type-eyebrow-font:var(--font-display);
--type-eyebrow-weight:var(--fw-bold);/* @kind font */
--type-data-font:var(--font-mono);
}
:root{
--space-0:0;
--space-1:4px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:20px;
--space-6:24px;
--space-8:32px;
--space-10:40px;
--space-12:48px;
--space-16:64px;
--space-20:80px;
--space-24:96px;
--space-32:128px;

/* layout */
--container-max:1180px;
--container-narrow:760px;
--container-pad:32px;
--section-pad-y:96px;
--section-pad-y-compact:64px;
--grid-gutter:28px;
--card-pad:28px;
--card-pad-compact:20px;
--control-pad-x:22px;
--control-h-sm:34px;
--control-h-md:44px;
--control-h-lg:54px;
}
:root{
--radius-xs:3px;
--radius-sm:6px;
--radius-md:10px;
--radius-lg:14px;
--radius-xl:20px;
--radius-pill:999px;
--radius-card:var(--radius-lg);
--radius-control:var(--radius-sm);
--radius-media:var(--radius-md);
/* Buttons are near-square: SpearMind reads engineered, not playful. */
--radius-button:var(--radius-sm);
}
:root{
/* Shadows are cool-tinted (navy, never black) and low-spread. */
--shadow-xs:0 1px 2px rgba(10,42,82,.06);
--shadow-sm:0 2px 6px rgba(10,42,82,.07);
--shadow-md:0 6px 18px rgba(10,42,82,.10);
--shadow-lg:0 16px 40px rgba(10,42,82,.14);
--shadow-xl:0 30px 70px rgba(6,26,51,.22);
--shadow-focus:0 0 0 3px rgba(0,160,224,.38);
--shadow-inset-hairline:inset 0 -1px 0 rgba(10,42,82,.06);
--shadow-card:var(--shadow-sm);
--shadow-card-hover:var(--shadow-md);
--border-hairline:1px solid var(--border-subtle);
--rule-accent:2px solid var(--accent);
}
:root{
--dur-instant:90ms;/* @kind other */
--dur-fast:150ms;/* @kind other */
--dur-base:220ms;/* @kind other */
--dur-slow:380ms;/* @kind other */
--dur-reveal:640ms;/* @kind other */
--ease-standard:cubic-bezier(.4,0,.2,1);/* @kind other */
--ease-out:cubic-bezier(.16,1,.3,1);/* @kind other */
--ease-in:cubic-bezier(.5,0,1,1);/* @kind other */
/* No bounce, no overshoot, no springs anywhere in this brand. */
--transition-control:background-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard);/* @kind other */
--transition-card:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),border-color var(--dur-base) var(--ease-out);/* @kind other */
--lift-hover:translateY(-3px);/* @kind other */
--press-scale:.985;/* @kind other */
}
@media (prefers-reduced-motion:reduce){:root{--dur-fast:1ms;/* @kind other */--dur-base:1ms;/* @kind other */--dur-slow:1ms;/* @kind other */--dur-reveal:1ms;/* @kind other */--lift-hover:none;/* @kind other */}}
/* Minimal element defaults so specimens, cards and kits share one baseline. */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--font-body);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4,h5{margin:0;font-family:var(--font-display);color:var(--text-heading);letter-spacing:var(--ls-heading);line-height:var(--lh-heading);font-weight:var(--fw-bold)}
h1{font-size:var(--fs-h1);font-weight:var(--fw-extrabold);letter-spacing:var(--ls-hero)}
h2{font-size:var(--fs-h2)}h3{font-size:var(--fs-h3)}h4{font-size:var(--fs-h4)}
p{margin:0}
a{color:var(--text-link);text-decoration:none;transition:color var(--dur-fast) var(--ease-standard)}
a:hover{color:var(--text-link-hover);text-decoration:underline;text-underline-offset:3px}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
img{max-width:100%;display:block}
code,kbd{font-family:var(--font-mono);font-size:.92em}
.sm-eyebrow{font-family:var(--type-eyebrow-font);font-weight:var(--type-eyebrow-weight);font-size:var(--fs-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--text-eyebrow)}

/* ── Production responsive overrides (tokens first — inline styles resolve vars) ── */
@media (max-width: 1024px){
  :root{--container-pad:24px;--section-pad-y:72px;--section-pad-y-compact:48px;--fs-hero:46px;--fs-h1:32px;--space-16:40px;--space-20:48px;}
}
@media (max-width: 1024px) and (min-width: 761px){
  main div[style*="repeat(5,1fr)"]{grid-template-columns:repeat(2,1fr) !important;}
  main div[style*="repeat(4,1fr)"]{grid-template-columns:repeat(2,1fr) !important;}
  main div[style*="repeat(3,1fr)"]{grid-template-columns:repeat(2,1fr) !important;}
  footer > div[style*="grid-template-columns"]{grid-template-columns:1fr 1fr !important;}
}
@media (max-width: 760px){
  :root{--fs-hero:34px;--fs-display:30px;--fs-h1:27px;--fs-h2:23px;--fs-h3:20px;--fs-lead:18px;--section-pad-y:52px;--section-pad-y-compact:40px;--container-pad:18px;--grid-gutter:16px;--space-16:28px;--space-20:36px;}
  main div[style*="grid-template-columns"]{grid-template-columns:1fr !important;}
  footer > div[style*="grid-template-columns"]{grid-template-columns:1fr !important;}
  main div[style*="display: flex"][style*="gap: var(--grid-gutter)"]{flex-wrap:wrap;}
  main div[style*="flex-direction: row"]{flex-direction:column !important;}
  main img[style*="width: 360px"]{width:100% !important;}
  main nav[style*="sticky"]{position:static !important;}
  header nav{overflow-x:auto;scrollbar-width:none;}
  header nav::-webkit-scrollbar{display:none;}
  /* Keep nav items on one scrollable line — without these the links shrink and wrap into clipped fragments. */
  header nav span, header nav a, header nav button{flex:none;}
  header nav a{white-space:nowrap;}
  header > div{gap:var(--space-4);}
  header img{height:34px !important;}
  main section > div[style*="112px"]{padding-top:64px !important;padding-bottom:52px !important;}
}