/* General Power — design tokens
   Derived from logo (cobalt blue + red-orange lightning) + corporate deep-navy per brief.
   Do not use raw hex in components; reference these variables. */

:root {
  /* Brand */
  --brand-blue: #1E40AF;
  --brand-blue-vivid: #2A46C9;
  --brand-blue-dark: #172E7C;
  --brand-red: #E53935;
  --brand-red-deep: #C62828;

  /* Neutrals */
  --ink: #0A1628;           /* deep navy — dark sections */
  --ink-2: #0F1E36;         /* slightly lifted dark */
  --graphite: #1F2937;
  --charcoal: #374151;
  --slate: #475569;
  --steel: #64748B;
  --mist: #94A3B8;
  --stone: #E2E8F0;
  --stone-2: #EDF1F6;
  --paper: #F5F7FA;
  --white: #FFFFFF;

  /* Semantic */
  --bg: var(--white);
  --bg-alt: var(--paper);
  --bg-dark: var(--ink);
  --bg-dark-2: var(--ink-2);
  --text: var(--ink);
  --text-body: var(--charcoal);
  --text-muted: var(--steel);
  --text-on-dark: #E8EDF5;
  --text-on-dark-muted: #94A3B8;
  --border: var(--stone);
  --border-dark: rgba(255,255,255,0.08);
  --primary: var(--brand-red);
  --primary-hover: var(--brand-red-deep);
  --link: var(--brand-blue);
  --link-hover: var(--brand-blue-vivid);
  --ring: rgba(42,70,201,.55);

  /* Type */
  --font-display: 'Lexend', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-body: 'Source Sans 3', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  --fs-xs: .75rem;      /* 12 */
  --fs-sm: .875rem;     /* 14 */
  --fs-base: 1rem;      /* 16 */
  --fs-md: 1.125rem;    /* 18 */
  --fs-lg: 1.25rem;     /* 20 */
  --fs-xl: 1.5rem;      /* 24 */
  --fs-2xl: 2rem;       /* 32 */
  --fs-3xl: 2.5rem;     /* 40 */
  --fs-4xl: 3.25rem;    /* 52 */
  --fs-5xl: 4.5rem;     /* 72 */
  --fs-hero: clamp(2.5rem, 6vw + 1rem, 5.25rem);
  --fs-display: clamp(2rem, 4vw + 1rem, 3.75rem);

  --lh-tight: 1.05;
  --lh-snug: 1.2;
  --lh-normal: 1.55;
  --lh-relaxed: 1.7;

  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide: 0.02em;
  --tracking-wider: 0.06em;
  --tracking-widest: 0.14em;   /* eyebrow labels */

  /* Space (density 4/10 standard) */
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* Container */
  --container: 1280px;
  --container-narrow: 960px;
  --gutter: clamp(1rem, 3vw, 2rem);

  /* Radius */
  --r-xs: 2px;
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 10px;
  --r-full: 999px;

  /* Shadow */
  --shadow-sm: 0 1px 2px rgba(10,22,40,.08);
  --shadow-md: 0 4px 12px rgba(10,22,40,.10);
  --shadow-lg: 0 14px 32px -8px rgba(10,22,40,.16);
  --shadow-xl: 0 28px 60px -18px rgba(10,22,40,.28);
  --shadow-glow-blue: 0 0 0 1px rgba(42,70,201,.35), 0 10px 40px -10px rgba(42,70,201,.35);
  --shadow-glow-red: 0 0 0 1px rgba(229,57,53,.35), 0 10px 40px -10px rgba(229,57,53,.30);

  /* Motion */
  --ease-out: cubic-bezier(.16,.84,.44,1);
  --ease-in-out: cubic-bezier(.65,.05,.36,1);
  --dur-fast: 120ms;
  --dur-med: 220ms;
  --dur-slow: 420ms;

  /* Layers */
  --z-nav: 50;
  --z-drawer: 60;
  --z-modal: 70;
}

/* Selection */
::selection { background: var(--brand-blue); color: #fff; }