/* Teams KB marketing site — design tokens
   Source: Calvary Tech Ops design guide (brief §5), with the weight change agreed in design review:
   display and heading weights are 500 (Medium), not 900/700. */
:root {
  /* brand primitives */
  --to-cyan:#00bae5; --to-cyan-600:#0098bd; --to-cyan-700:#017a99; --to-cyan-100:#d6f3fb; --to-cyan-50:#eefafe;
  --to-ink:#001519; --to-ink-800:#0a2229; --to-ink-700:#153039;
  /* neutrals */
  --grey-0:#ffffff; --grey-50:#f6f8f9; --grey-100:#eceff1; --grey-200:#dde3e6; --grey-300:#c4ced2; --grey-400:#94a3aa;
  --grey-500:#697c84; --grey-600:#4c5d64; --grey-700:#33434a; --grey-800:#1e2c31; --grey-900:#001519;
  /* status */
  --success:#1f9d55; --success-100:#dcf3e6; --warning:#d98315; --warning-100:#fbeed6;
  --danger:#d64545; --danger-100:#f8dede; --info:#00bae5; --info-100:#d6f3fb;
  /* semantic aliases */
  --brand:var(--to-cyan); --brand-hover:var(--to-cyan-600); --brand-active:var(--to-cyan-700); --brand-tint:var(--to-cyan-50);
  --bg-page:var(--grey-50); --bg-surface:var(--grey-0); --bg-sunken:var(--grey-100); --bg-inverse:var(--to-ink);
  --text-strong:var(--to-ink); --text-body:var(--grey-800); --text-muted:var(--grey-600); /* grey-600, not grey-500: 4.5:1 at small sizes */
  --text-on-brand:var(--to-ink); /* ink on cyan = 8.2:1; white on cyan fails (2.3:1) */
  --text-on-inverse:#ffffff; --text-link:var(--to-cyan-700);
  --border:var(--grey-200); --border-strong:var(--grey-300); --focus-ring:var(--to-cyan);
  /* type — Metropolis is the public-domain Gotham-alike the Teams KB app already ships; Gotham stays as a local fallback */
  --font-sans:"Metropolis","Gotham","Helvetica Neue",Arial,system-ui,sans-serif;
  --font-mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  --fw-book:400; --fw-medium:500;
  --font-display:500; --font-heading:500; --font-label:500; --font-body:400;
  --text-xs:12px; --text-sm:14px; --text-base:16px; --text-lg:18px; --text-xl:22px; --text-2xl:28px; --text-3xl:36px; --text-4xl:48px; --text-5xl:64px;
  --lh-tight:1.1; --lh-snug:1.3; --lh-normal:1.5; --tracking-tight:-0.02em; --tracking-normal:0; --tracking-wide:0.08em;
  /* spacing, containers, radius */
  --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;
  --container-sm:640px; --container-md:960px; --container-lg:1200px;
  --radius-sm:4px; --radius-md:8px; --radius-lg:12px; --radius-xl:16px; --radius-pill:999px;
  /* shadows (ink-tinted) & motion */
  --shadow-xs:0 1px 2px rgba(0,21,25,.06);
  --shadow-sm:0 1px 3px rgba(0,21,25,.08),0 1px 2px rgba(0,21,25,.04);
  --shadow-md:0 4px 12px rgba(0,21,25,.08),0 2px 4px rgba(0,21,25,.04);
  --shadow-lg:0 12px 28px rgba(0,21,25,.12),0 4px 8px rgba(0,21,25,.05);
  --shadow-focus:0 0 0 3px rgba(0,186,229,.35);
  --border-width:1px; --transition-fast:120ms cubic-bezier(.4,0,.2,1); --transition:180ms cubic-bezier(.4,0,.2,1);
}

/* Metropolis webfont — add the files under /fonts and uncomment. Only 400 and 500 are used. */
/*
@font-face { font-family: "Metropolis"; font-weight: 400; font-display: swap; src: url("../fonts/Metropolis-Regular.woff2") format("woff2"); }
@font-face { font-family: "Metropolis"; font-weight: 500; font-display: swap; src: url("../fonts/Metropolis-Medium.woff2") format("woff2"); }
*/