/* OCTI design tokens — brand + motion system v2 */
:root{
  --primary:#2E2E84; --primary-light:#4A4AA8; --primary-dark:#1F1F5E;
  --secondary:#00D1FF; --secondary-deep:#0693B8;
  --dark:#211C2C; --ink-900:#0F0E1F; --ink-800:#171433;
  --text-main:#3D3D4E; --text-muted:#5E5E70; --on-dark:#E8E8F6; --on-dark-muted:#B8B8D9;
  --light:#F7F7FB; --white:#fff; --border:#E5E7EB; --border-soft:rgba(46,46,132,.12);

  --font-head:'Plus Jakarta Sans',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;

  /* Fluid type scale — UX mobile-first (WCAG readable, CWV-friendly) */
  --fs-xs:clamp(.75rem,.7rem + .2vw,.8125rem);
  --fs-sm:clamp(.875rem,.82rem + .25vw,.9375rem);
  --fs-base:clamp(1rem,.95rem + .2vw,1.0625rem);
  --fs-md:clamp(1.0625rem,1rem + .3vw,1.125rem);
  --fs-lg:clamp(1.125rem,1.05rem + .4vw,1.25rem);
  --fs-xl:clamp(1.25rem,1.1rem + .6vw,1.5rem);
  --fs-h3:clamp(1.15rem,1.05rem + .45vw,1.35rem);
  --fs-h2:clamp(1.75rem,1.35rem + 1.6vw,2.75rem);
  --fs-h1:clamp(2.15rem,1.6rem + 2.4vw,4.25rem);
  --fs-hero-lead:clamp(1.05rem,1rem + .45vw,1.2rem);
  --lh-tight:1.1;
  --lh-snug:1.35;
  --lh-body:1.65;
  --tracking-tight:-.025em;

  --container:1216px;
  --radius-sm:8px; --radius-md:16px; --radius-lg:24px; --radius-xl:32px; --radius-pill:9999px;

  --ease:cubic-bezier(.4,0,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --ease-soft:cubic-bezier(.22,1,.36,1);
  --dur-fast:180ms; --dur-med:420ms; --dur-slow:800ms;
  --dur-hl:900ms; --dur-draw:1.2s; --dur-pulse:2.4s;
  --rise:28px; --rise-sm:12px; --scale-hover:1.03;
  --motion-1:1; --motion-2:.85; --motion-3:.6;
  --hero-slide-ms:6500; --hero-video-ms:8000;
  --transition:opacity var(--dur-med) var(--ease-out), transform var(--dur-med) var(--ease-out);

  --header-h:72px;
  --bottom-nav-h:64px;
  --glass:rgba(255,255,255,.78);
  --glass-dark:rgba(15,14,31,.72);

  --shadow-sm:0 1px 2px rgba(33,28,44,.06),0 4px 12px rgba(33,28,44,.05);
  --shadow-md:0 12px 32px -12px rgba(46,46,132,.28);
  --shadow-lg:0 30px 60px -25px rgba(31,31,94,.45);
  --shadow-menu:0 24px 64px -16px rgba(15,14,31,.35);

  --grad-brand:linear-gradient(135deg,var(--primary) 0%,var(--primary-light) 60%,#2a7bd0 100%);
  --grad-hero:linear-gradient(105deg,rgba(15,14,31,.82) 0%,rgba(15,14,31,.55) 38%,rgba(15,14,31,.22) 62%,rgba(15,14,31,.35) 100%),linear-gradient(0deg,rgba(15,14,31,.55) 0%,transparent 42%);
  --space-section:clamp(72px,10vw,128px);
}