/* Own2Run design tokens (phase 2). One source of truth for the site.
   Theme: "night and ice" (decision 1): deep navy for hero/lifecycle/CTA, ice blue for reading sections.
   Brand colours sampled from the final logo; contrast checked against WCAG AA. */

:root {
  /* brand */
  --navy-900: #012B5B;   /* logo letters; text on light (13:1 on ice-50) */
  --navy-700: #003C75;   /* logo gradient end; hover */
  --cyan-400: #00C3FD;   /* the cyan piece; data line, glow, accents on dark (6.8:1 on navy) */
  --cyan-300: #44DEFF;   /* gradient headline end, highlights on dark */
  --amber-400: #FFAC12;  /* the status dot; "live" spark only, <2% of any screen */

  /* night (dark sections) */
  --night-950: #030814;  /* hero, final CTA base */
  --night-900: #061226;  /* dark cards */
  --night-800: #0B1C36;  /* dark borders, raised */
  --on-night: #E8F1FB;   /* text on dark */
  --on-night-muted: #93A6C2;

  /* ice (light sections) */
  --ice-50: #F2F8FE;
  --ice-100: #E3F1FC;
  --white: #FFFFFF;
  --ink: #0A1B33;        /* body text on light */
  --ink-muted: #5B6B80;  /* 5.1:1 on ice-50 */
  --line: #D6E4F2;
  --sky-700: #0369A1;    /* links/buttons on light: 5.6:1 on ice-50 (pure cyan fails on light) */

  /* UI states (never decoration) */
  --ok: #16A34A; --warn: #F59E0B; --danger: #DC2626;

  /* gradients */
  --grad-deep-field: radial-gradient(120% 90% at 70% 30%, #0A2F5C 0%, #04142B 45%, #030814 75%);
  --grad-cyan-glow: radial-gradient(closest-side, rgba(0, 195, 253, .35), rgba(0, 195, 253, 0));
  --grad-headline: linear-gradient(95deg, #FFFFFF 0%, #FFFFFF 35%, #44DEFF 70%, #00C3FD 100%);
  --grad-button: linear-gradient(90deg, #00ABD1, #00C3FD);
  --grad-ice: linear-gradient(180deg, #F2F8FE 0%, #FFFFFF 100%);

  /* type */
  --font-display: "Sora", "Avenir Next", "Segoe UI", sans-serif;
  --font-body: "IBM Plex Sans", "Segoe UI", Roboto, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", Menlo, monospace;
  --fs-hero: clamp(2.5rem, 5.2vw, 4.25rem);
  --fs-h2: clamp(1.9rem, 3.4vw, 3rem);
  --fs-h3: clamp(1.25rem, 1.8vw, 1.5rem);
  --fs-lead: clamp(1.06rem, 1.3vw, 1.25rem);
  --fs-body: 1.0625rem;
  --fs-small: .875rem;
  --fs-eyebrow: .75rem;

  /* space, shape, depth */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px; --space-10: 128px;
  --radius-s: 8px; --radius-m: 12px; --radius-l: 20px; --radius-pill: 999px;
  --shadow-card: 0 1px 2px rgba(1, 43, 91, .06), 0 8px 24px rgba(1, 43, 91, .08);
  --shadow-lift: 0 2px 4px rgba(1, 43, 91, .08), 0 18px 40px rgba(1, 43, 91, .14);
  --glow-cyan: 0 0 0 1px rgba(0, 195, 253, .35), 0 8px 30px rgba(0, 195, 253, .35);
  --container: 1200px;

  /* motion */
  --dur-micro: 180ms; --dur-ui: 360ms; --dur-story: 900ms;
  --ease-out: cubic-bezier(.2, .8, .2, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
}