/* ============================================================
   Our Story Movement — Design Tokens
   Direction: "Bioluminescence / Aurora" — cinematic night lit by
   neon green. One continuous deep-dark canvas; emerald / mint / cyan
   used as light, not decoration. Bright neon for accents + glow,
   soft off-white for reading. Calm by default, wow on contact.

   Contrast discipline (audience: ADHD / mental-health / disability):
   - Body copy: soft off-white (--ink / --ink-soft) — never neon fields.
   - Neon (--accent / --neon) reserved for accents, headings, glow, hover.
   - All colour pairs target WCAG AA on the near-black canvas.
   - Same variable NAMES as the previous "Vivid Spectrum" system so the
     whole cascade keeps working; only the values changed.
   ============================================================ */

:root {
  /* ---- Surfaces (deep cinematic night, faint green undertone) ---- */
  --paper:        #05080B;   /* page background — near-black, cool green   */
  --paper-2:      #080D10;   /* raised section pocket                      */
  --paper-peach:  #0B1512;   /* tinted band / icon wells (green-black)     */
  --surface:      #0C1613;   /* cards — dark green glass base              */

  /* ---- Ink (text) ---- */
  --ink:          #E9F5EE;   /* primary — near-white, faint mint           */
  --ink-soft:     #B2C7BC;   /* secondary body                             */
  --ink-mute:     #8AA093;   /* labels / captions (>=4.5:1 on --paper)     */
  --line:         rgba(150, 235, 200, 0.12);
  --line-2:       rgba(150, 235, 200, 0.22);
  --border-interactive: rgba(140, 224, 186, 0.36); /* ~3:1 UI borders on dark */

  /* ---- Aurora spectrum: BRIGHT (fills, gradients, glows, sparks) ---- */
  --sp-amber:   #A3E635;   /* chartreuse — warm green edge                 */
  --sp-gold:    #C6F24E;
  --sp-coral:   #34E39B;   /* repointed warm -> spring green               */
  --sp-pink:    #6EE7B7;   /* mint                                         */
  --sp-magenta: #2DD4BF;   /* teal                                         */
  --sp-purple:  #10B981;   /* emerald                                      */
  --sp-indigo:  #34D399;
  --sp-blue:    #22C7E6;   /* aurora cyan                                  */
  --sp-teal:    #22D3B7;
  --sp-green:   #35F0A0;   /* the neon green — hero accent                 */

  /* ---- Aurora: BRIGHT text on dark (all high-contrast on --paper) ---- */
  --cd-amber:   #B6F24A;
  --cd-coral:   #4BFFB0;
  --cd-pink:    #6EE7B7;
  --cd-purple:  #5EEAD4;
  --cd-indigo:  #4BE6B4;
  --cd-blue:    #56D9F2;
  --cd-teal:    #3DE0C8;
  --cd-green:   #4BFFB0;

  /* ---- Lead accent (links, focus, eyebrow text) — neon green ---- */
  --accent:        #35F0A0;   /* ~13:1 on --paper; >=3:1 for focus rings    */
  --accent-strong: #12D98A;
  --neon:          #4BFFB0;   /* brightest neon for glow / key words        */
  --neon-2:        #22C7E6;   /* aurora cyan companion                      */
  --ink-on-neon:   #04140D;   /* dark ink for text ON neon fills (AA)       */

  /* ---- Legacy warm names, repointed into the aurora ---- */
  --gold:        #35F0A0;
  --gold-deep:   #12D98A;
  --gold-soft:   #6EE7B7;
  --amber-text:  #4BFFB0;   /* eyebrow / tag / link text on dark          */
  --dawn-pale:   #0E1A15;
  --dawn-peach:  #16C79A;
  --dawn-coral:  #35F0A0;
  --dawn-rose:   #22C7E6;
  --sky:         #123024;
  --sky-2:       #0C221A;

  /* ---- Gradients ---- */
  --grad-spectrum: linear-gradient(100deg, #35F0A0, #22D3B7, #22C7E6, #6EE7B7, #A3E635);
  --grad-rule:     linear-gradient(90deg, transparent, #35F0A0, #22C7E6, #35F0A0, transparent);
  --grad-warm:     linear-gradient(120deg, #A3E635, #35F0A0, #22D3B7);
  --grad-cta:       linear-gradient(135deg, #5BFFB6 0%, #2FE9A4 48%, #16C79A 100%);
  --grad-cta-hover: linear-gradient(135deg, #6BFFC0 0%, #45F2B0 48%, #22D3A8 100%);

  /* ---- Deep beats (manifesto / campaign / closing / footer) ---- */
  --dusk:      #04110C;
  --dusk-2:    #030B08;
  --bone:      #E6F5EC;   /* text on the deep beats                       */
  --bone-soft: #A7C6B7;
  --gold-glow: #4BFFB0;   /* aurora accent on the deep beats              */
  --dusk-glow: #35F0A0;

  --sage:      #7FA890;

  /* ---- Typography ---- */
  /* Single family — Lexend. Research-backed for readability / lower
     cognitive load (Shaver-Troup + Google). One font, no mixing. */
  --font-display: "Lexend", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body:    "Lexend", system-ui, -apple-system, "Segoe UI", sans-serif;

  --t-hero:    clamp(2.85rem, 1.0rem + 7.0vw, 6.75rem);
  --t-h1:      clamp(2.25rem, 1.2rem + 4.0vw, 4.25rem);
  --t-h2:      clamp(1.9rem,  1.2rem + 2.6vw, 3.0rem);
  --t-h3:      clamp(1.35rem, 1.05rem + 1.1vw, 1.7rem);
  --t-lead:    clamp(1.15rem, 1.02rem + 0.62vw, 1.45rem);
  --t-body:    clamp(1.0rem,  0.96rem + 0.2vw, 1.125rem);
  --t-small:   0.875rem;
  --t-eyebrow: 0.78rem;

  --lh-tight:  1.06;
  --lh-snug:   1.2;
  --lh-body:   1.72;

  --track-eyebrow: 0.2em;
  --track-tight:  0em;   /* Lexend reads best without negative tracking */

  /* ---- Layout ---- */
  --container:        1180px;
  --container-narrow: 880px;
  --container-text:   680px;
  --gutter:           clamp(1.25rem, 0.7rem + 2.4vw, 2.75rem);
  --space-section:    clamp(3.25rem, 2.2rem + 3.2vw, 6.5rem);

  /* ---- Radius ---- */
  --r-sm:   10px;
  --r-md:   16px;
  --r-lg:   24px;
  --r-xl:   34px;
  --r-pill: 999px;

  /* ---- Shadow + neon glow ---- */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 20px 48px -22px rgba(0, 0, 0, 0.75);
  --shadow-lg: 0 40px 90px -34px rgba(0, 0, 0, 0.85);
  --glow:      0 0 42px -6px rgba(53, 240, 160, 0.5);
  --glow-soft: 0 0 30px -8px rgba(53, 240, 160, 0.3);
  --glow-cyan: 0 0 42px -8px rgba(34, 199, 230, 0.42);

  /* ---- Motion ---- */
  --dur-fast: 160ms;
  --dur:      320ms;
  --dur-slow: 820ms;
  --ease:     cubic-bezier(0.16, 1, 0.3, 1);
  --ease-io:  cubic-bezier(0.65, 0, 0.35, 1);

  /* ---- z-index ---- */
  --z-atmosphere: 0;
  --z-nav: 100;
}