/* ============================================================
   THE UPGRADE — Colour tokens
   "Future-Proofing Humans" — electric blue, warm white, ink black.
   Base palette + semantic aliases.
   ============================================================ */

:root {
  /* ---- Brand blues (base) ---- */
  --upgrade-blue:   #1E3FD7;  /* primary brand — future, clarity, possibility */
  --electric-blue:  #0A4BFF;  /* vivid electric accent */
  --neon-blue:      #2A4BFF;  /* the neon U, glows & founder script */
  --sky-blue:       #5E8CFF;  /* supporting glows, hover, highlights */
  --neon-cyan:      #66D2FF;  /* far end of the neon glow */
  --light-blue:     #E6ECFF;  /* panels, cards, subtle separation */

  /* ---- Spectrum accents (secondary energy) ---- */
  --violet:         #6D3BEF;  /* electric violet — secondary accent */
  --violet-bright:  #8A5BFF;  /* lighter violet for glow/hover */
  --violet-soft:    #ECE6FF;  /* violet tint panel */
  --ember:          #FF5236;  /* orangey-red — warm signal accent */
  --ember-bright:   #FF7A57;  /* lighter ember for glow/hover */
  --ember-soft:     #FFE7E0;  /* ember tint panel */

  /* ---- Neutrals (base) ---- */
  --warm-white:     #F8F7F4;  /* primary background */
  --pure-white:     #FFFFFF;
  --light-gray:     #F2F4F7;
  --silver:         #C4CAD3;  /* premium metallic edge — used sparingly */
  --steel:          #8A909C;  /* muted UI grey */
  --slate:          #55585F;  /* secondary text on light */
  --deep-navy:      #0A0F1F;  /* dark surface alternate */
  --ink-black:      #0A0A0C;  /* primary text & dark surfaces */
  --jet-black:      #05070D;

  /* ---- Silver / chrome surface (cool light alt to warm white) ---- */
  --silver-50:      #FBFCFD;  /* lightest cool white */
  --silver-100:     #F1F3F6;  /* cool panel */
  --silver-200:     #E4E8EE;  /* cool separation */
  --silver-300:     #D5DBE3;  /* chrome mid */

  /* ---- Signature gradients ---- */
  --gradient-electric: linear-gradient(158deg, #1E3FD7 0%, #2A4BFF 46%, #66D2FF 100%); /* @kind color */
  --gradient-glow:     radial-gradient(60% 60% at 50% 50%, rgba(94,140,255,.55) 0%, rgba(42,75,255,0) 70%); /* @kind color */
  --gradient-dark:     linear-gradient(180deg, #0A0F1F 0%, #05070D 100%); /* @kind color */
  /* Spectrum sweep — blue → violet → ember (use sparingly, for energy moments) */
  --gradient-spectrum: linear-gradient(108deg, #2A4BFF 0%, #6D3BEF 52%, #FF5236 100%); /* @kind color */
  /* Silvery white — premium metallic ground for webpages & decks */
  --gradient-silver:   linear-gradient(165deg, #FFFFFF 0%, #F1F3F6 46%, #E2E7EE 100%); /* @kind color */
  /* Brighter chrome sheen — for hero panels / deck cover plates */
  --gradient-chrome:   linear-gradient(150deg, #FFFFFF 0%, #EDF0F4 38%, #D9DEE6 68%, #EEF1F5 100%); /* @kind color */

  /* ============================================================
     Semantic aliases — reach for these in product work
     ============================================================ */

  /* Surfaces */
  --bg-base:        var(--warm-white);
  --bg-elevated:    var(--pure-white);
  --bg-panel:       var(--light-blue);
  --bg-silver:      var(--gradient-silver);  /* cool silvery-white page ground */
  --bg-dark:        var(--ink-black);
  --bg-dark-elev:   var(--deep-navy);
  --surface-card:   var(--pure-white);

  /* Text */
  --text-primary:   var(--ink-black);
  --text-secondary: var(--slate);
  --text-muted:     var(--steel);
  --text-on-dark:   var(--warm-white);
  --text-on-dark-muted: rgba(248,247,244,.62);
  --text-brand:     var(--upgrade-blue);

  /* Brand / interactive */
  --brand:          var(--upgrade-blue);
  --brand-hover:    #1A37BE;   /* darker press/hover */
  --brand-active:   #15309F;
  --brand-soft:     var(--light-blue);
  --accent-glow:    var(--neon-blue);
  --on-brand:       var(--pure-white);
  --accent-violet:  var(--violet);   /* secondary accent */
  --accent-ember:   var(--ember);    /* warm signal accent */

  /* Borders & lines */
  --border-subtle:  #E7E6E2;   /* hairline on warm white */
  --border-strong:  #D5D4CF;
  --border-brand:   rgba(30,63,215,.30);
  --border-on-dark: rgba(255,255,255,.12);

  /* Feedback */
  --success:        #1F9D63;
  --warning:        #D98A23;
  --danger:         #D9483B;

  /* Focus ring */
  --ring:           rgba(42,75,255,.45);
}