/* ============================================================
   FixRiver — Color tokens
   Dark, futuristic palette. Deep navy canvas, luminous
   teal→green brand spectrum, electric blue→violet secondary.
   ============================================================ */

:root {
  /* ---- Base / canvas (deep navy, near-black) ---- */
  --navy-950: #070B12;   /* page background */
  --navy-900: #0A0F1A;   /* alt section background */
  --navy-850: #0D1320;   /* card / surface */
  --navy-800: #121A2A;   /* raised surface, inputs */
  --navy-700: #1B2536;   /* hover surface, borders-strong */
  --navy-600: #28344A;   /* hairline borders */

  /* ---- Brand spectrum: AQUA (teal → green) ---- */
  --aqua-100: #C7FBEF;
  --aqua-300: #6FF0D6;
  --aqua-400: #2DE2C0;   /* primary teal */
  --aqua-500: #19D6B4;
  --green-300: #6BF0A0;
  --green-400: #28E06E;   /* vivid green accent */
  --green-500: #15C95C;
  --cyan-400: #29C7EC;    /* sky cyan */

  /* ---- Secondary spectrum: IRIS (blue → violet) ---- */
  --blue-400: #3D7DF6;
  --indigo-400: #5B6EF5;
  --violet-400: #A78BFA;
  --violet-300: #C4B2FC;

  /* ---- Accent: magenta (used sparingly, e.g. metrics) ---- */
  --magenta-400: #F0608F;

  /* ---- Neutral text ---- */
  --white: #FFFFFF;
  --slate-200: #D6DEEA;
  --slate-300: #AEB9C9;
  --slate-400: #98A2B3;   /* muted body */
  --slate-500: #6B768A;   /* dim / captions */
  --slate-600: #4A5468;   /* disabled */

  /* ---- Semantic status ---- */
  --success: #28E06E;
  --info: #29C7EC;
  --warning: #F5B544;
  --danger: #F0608F;

  /* ============================================================
     Semantic aliases — reference these in components
     ============================================================ */

  /* Surfaces */
  --bg-page: var(--navy-950);
  --bg-page-alt: var(--navy-900);
  --surface-card: var(--navy-850);
  --surface-raised: var(--navy-800);
  --surface-hover: var(--navy-700);

  /* Text */
  --text-strong: var(--white);
  --text-body: var(--slate-300);
  --text-muted: var(--slate-400);
  --text-dim: var(--slate-500);
  --text-on-bright: #06210F;   /* dark ink for bright/aqua buttons */

  /* Brand accents */
  --brand-primary: var(--aqua-400);
  --brand-green: var(--green-400);
  --brand-cyan: var(--cyan-400);
  --brand-iris: var(--violet-400);

  /* Borders & lines */
  --border-subtle: rgba(255, 255, 255, 0.07);
  --border-default: rgba(255, 255, 255, 0.10);
  --border-strong: rgba(255, 255, 255, 0.16);
  --border-aqua: rgba(45, 226, 192, 0.45);

  /* Focus ring */
  --focus-ring: rgba(45, 226, 192, 0.55);

  /* ============================================================
     Gradients — the heart of the FixRiver look
     ============================================================ */

  /* AQUA: primary headings & primary CTAs (teal → green) */
  --gradient-aqua: linear-gradient(120deg, #2DE2C0 0%, #28E06E 100%); /* @kind color */
  --gradient-aqua-soft: linear-gradient(120deg, #6FF0D6 0%, #6BF0A0 100%); /* @kind color */

  /* IRIS: secondary / contact CTAs (blue → violet) */
  --gradient-iris: linear-gradient(120deg, #3D7DF6 0%, #A78BFA 100%); /* @kind color */

  /* NAV: tri-stop pill button (cyan → blue → violet) */
  --gradient-nav: linear-gradient(120deg, #2DE2C0 0%, #3D7DF6 55%, #A78BFA 100%); /* @kind color */

  /* BRAND: full logo spectrum (green → cyan → blue) */
  --gradient-brand: linear-gradient(135deg, #28E06E 0%, #29C7EC 45%, #3D7DF6 100%); /* @kind color */

  /* Radial card auras (placed behind icons / blobs) */
  --aura-green: radial-gradient(60% 60% at 50% 45%, rgba(40,224,110,0.22) 0%, rgba(40,224,110,0) 70%); /* @kind color */
  --aura-teal:  radial-gradient(60% 60% at 50% 45%, rgba(45,226,192,0.20) 0%, rgba(45,226,192,0) 70%); /* @kind color */
  --aura-iris:  radial-gradient(60% 60% at 50% 45%, rgba(167,139,250,0.22) 0%, rgba(167,139,250,0) 70%); /* @kind color */
}