@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700;800&family=Source+Sans+3:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap");
/* Webfonts. NOTE: no original font binaries were supplied with the brand assets.
   Montserrat is the nearest Google Fonts match to the wordmark's wide geometric caps;
   Source Sans 3 is the UI/body companion. Replace with licensed files when available. */


:root{
  /* Base — brand navy, sampled from the wordmark (rgb 8 48 112) */
  --blue-950:#041c42;--blue-900:#062454;--blue-800:#083070;--blue-700:#0d3f8f;--blue-600:#1854b5;
  --blue-500:#2a6fd6;--blue-400:#5b93e6;--blue-300:#9dbdf2;--blue-200:#cddef9;--blue-100:#e8f0fd;--blue-50:#f4f8ff;
  /* Base — cyan accent (clinical highlight, data viz, links on navy) */
  --cyan-700:#00758f;--cyan-600:#008fae;--cyan-500:#00a3c4;--cyan-400:#3fbcd6;--cyan-300:#8bd8e8;--cyan-100:#e0f5f9;
  /* Base — neutrals, cooled very slightly toward the navy */
  --neutral-0:#ffffff;--neutral-25:#fbfcfd;--neutral-50:#f6f8fa;--neutral-100:#eef1f5;--neutral-200:#e2e7ee;
  --neutral-300:#cbd3de;--neutral-400:#a3aebd;--neutral-500:#7b8798;--neutral-600:#5c6775;--neutral-700:#414b57;
  --neutral-800:#2a323c;--neutral-900:#151a20;--black:#000000;
  /* Base — semantic hues */
  --green-600:#0f8a5f;--green-500:#16a06f;--green-100:#e4f6ee;
  --amber-600:#b06a00;--amber-500:#d98600;--amber-100:#fdf1dc;
  --red-600:#c0392f;--red-500:#d9463a;--red-100:#fbeae8;

  /* Semantic — brand */
  --brand-primary:var(--blue-800);--brand-primary-hover:var(--blue-900);--brand-primary-active:var(--blue-950);
  --brand-accent:var(--cyan-500);--brand-accent-soft:var(--cyan-100);--brand-wordmark:var(--blue-800);

  /* Semantic — text */
  --text-strong:var(--neutral-900);--text-body:var(--neutral-700);--text-muted:var(--neutral-500);
  --text-inverse:var(--neutral-0);--text-on-brand:var(--neutral-0);--text-brand:var(--blue-800);
  --text-link:var(--blue-700);--text-link-hover:var(--blue-900);--text-disabled:var(--neutral-400);

  /* Semantic — surfaces */
  --surface-page:var(--neutral-0);--surface-subtle:var(--neutral-50);--surface-card:var(--neutral-0);
  --surface-raised:var(--neutral-0);--surface-brand:var(--blue-800);--surface-brand-subtle:var(--blue-50);
  --surface-accent-subtle:var(--cyan-100);--surface-disabled:var(--neutral-100);
  --surface-overlay:rgba(6,36,84,.55);

  /* Semantic — borders */
  --border-subtle:var(--neutral-200);--border-default:var(--neutral-300);--border-strong:var(--neutral-400);
  --border-brand:var(--blue-800);--border-focus:var(--cyan-500);

  /* Semantic — status */
  --status-success:var(--green-500);--status-success-surface:var(--green-100);--status-success-text:var(--green-600);
  --status-warning:var(--amber-500);--status-warning-surface:var(--amber-100);--status-warning-text:var(--amber-600);
  --status-danger:var(--red-500);--status-danger-surface:var(--red-100);--status-danger-text:var(--red-600);
  --status-info:var(--cyan-500);--status-info-surface:var(--cyan-100);--status-info-text:var(--cyan-700);

  /* Data viz — navy-to-cyan ramp, one warm outlier for contrast */
  --chart-1:var(--blue-800);--chart-2:var(--cyan-500);--chart-3:var(--blue-400);
  --chart-4:var(--cyan-300);--chart-5:var(--neutral-400);--chart-6:var(--amber-500);
}

:root{
  --font-display:"Montserrat","Helvetica Neue",Arial,sans-serif;
  --font-sans:"Source Sans 3","Helvetica Neue",Arial,sans-serif;
  --font-mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;

  --weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;--weight-black:800;

  /* Type scale — 1.25 major third, rounded to whole px */
  --text-3xs:11px;--text-2xs:12px;--text-xs:13px;--text-sm:14px;--text-base:16px;--text-md:18px;
  --text-lg:20px;--text-xl:24px;--text-2xl:30px;--text-3xl:38px;--text-4xl:48px;--text-5xl:60px;--text-6xl:76px;

  --leading-tight:1.08;--leading-snug:1.22;--leading-normal:1.5;--leading-relaxed:1.65;

  /* Wide tracking is the wordmark's signature — used for eyebrows and small caps labels */
  --tracking-wordmark:.26em;--tracking-eyebrow:.16em;--tracking-label:.06em;
  --tracking-normal:0;--tracking-display:-.02em;

  /* Composite roles */
  --type-display:var(--weight-bold) var(--text-5xl)/var(--leading-tight) var(--font-display);
  --type-h1:var(--weight-bold) var(--text-4xl)/var(--leading-tight) var(--font-display);
  --type-h2:var(--weight-semibold) var(--text-2xl)/var(--leading-snug) var(--font-display);
  --type-h3:var(--weight-semibold) var(--text-lg)/var(--leading-snug) var(--font-display);
  --type-body-lg:var(--weight-regular) var(--text-md)/var(--leading-relaxed) var(--font-sans);
  --type-body:var(--weight-regular) var(--text-base)/var(--leading-normal) var(--font-sans);
  --type-body-sm:var(--weight-regular) var(--text-sm)/var(--leading-normal) var(--font-sans);
  --type-label:var(--weight-semibold) var(--text-xs)/1.2 var(--font-sans);
  --type-eyebrow:var(--weight-semibold) var(--text-2xs)/1.2 var(--font-display);
}

:root{
  /* 4px base grid */
  --space-0:0;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;
  --space-7:32px;--space-8:40px;--space-9:48px;--space-10:64px;--space-11:80px;--space-12:96px;--space-13:128px;
  /* Layout */
  --container-max:1200px;--container-narrow:720px;--gutter:24px;--gutter-lg:40px;
  --section-y:96px;--section-y-sm:56px;
  --control-h-sm:32px;--control-h-md:40px;--control-h-lg:48px;
  --sidebar-w:248px;--topbar-h:64px;
}

:root{
  --radius-none:0;--radius-xs:3px;--radius-sm:6px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;
  --radius-2xl:24px;--radius-pill:999px;
  --radius-control:var(--radius-sm);--radius-card:var(--radius-lg);--radius-modal:var(--radius-xl);
  --border-width:1px;--border-width-strong:2px;--focus-ring-width:3px;
  --focus-ring:0 0 0 var(--focus-ring-width) rgba(0,163,196,.35);
}

:root{
  /* Shadows are tinted with the navy, never neutral black — keeps the white surfaces cool */
  --shadow-none:none;
  --shadow-xs:0 1px 2px rgba(6,36,84,.06);
  --shadow-sm:0 1px 2px rgba(6,36,84,.06),0 2px 6px rgba(6,36,84,.05);
  --shadow-md:0 2px 4px rgba(6,36,84,.05),0 8px 20px rgba(6,36,84,.07);
  --shadow-lg:0 4px 8px rgba(6,36,84,.05),0 18px 44px rgba(6,36,84,.10);
  --shadow-focus:var(--focus-ring);
  --shadow-inset-top:inset 0 1px 0 rgba(255,255,255,.6);
  --backdrop-blur:12px;
}

:root{
  --duration-instant:80ms; /* @kind other */
  --duration-fast:140ms; /* @kind other */
  --duration-base:220ms; /* @kind other */
  --duration-slow:360ms; /* @kind other */
  --ease-standard:cubic-bezier(.2,0,.2,1); /* @kind other */
  --ease-out:cubic-bezier(.16,.84,.44,1); /* @kind other */
  --ease-in-out:cubic-bezier(.4,0,.2,1); /* @kind other */
  --transition-control:background-color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);
}

/* Minimal element defaults. Components style themselves; this only sets the page ground. */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font:var(--type-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--text-link);text-decoration:none}
a:hover{color:var(--text-link-hover);text-decoration:underline;text-underline-offset:2px}
h1,h2,h3,h4{color:var(--text-strong);margin:0}
h1{font:var(--type-h1);letter-spacing:var(--tracking-display)}
h2{font:var(--type-h2)}
h3{font:var(--type-h3)}
p{margin:0}
:focus-visible{outline:none;box-shadow:var(--focus-ring)}
::selection{background:var(--blue-100);color:var(--blue-900)}