:root {
  /* ─── BASE COLOR PALETTE ─── */
  --midnight:    #051464;   
  --royal:       #2228E5;   
  --lavanda:     #BC86FF;   
  --neon-purple: #5504D5;   
  --imperial:    #200D57;   
  --sky:         #468DFC;   
  --soft-lav:    #B1A0FE;   
  --white:       #FFFFFF;   
  --deep-blue:   #1E2282;   
  --light-gray:  #F3F3F3;   
  --black:       #000000;   

  /* ─── COMPATIBILITY ALIASES ─── */
  --navy:        var(--midnight);
  --navy2:       #0A0E4A;
  --navy3:       #120B5E;
  --b1:          var(--royal);
  --b2:          var(--deep-blue);
  --b3:          var(--sky);
  --b4:          var(--soft-lav);
  --b-light:     var(--lavanda);
  --b-pale:      #D8C4FF;
  --gold:        var(--lavanda);
  --gold2:       var(--soft-lav);
  --neon:        var(--lavanda);
  --neon2:       var(--neon-purple);
  --dim:         #B3A8DB;

  /* ─── SHADOWS & GLOWS ─── */
  --glow:        rgba(188, 134, 255, 0.18);
  --glow-purple: rgba(85, 4, 213, 0.35);
  --glow-royal:  rgba(34, 40, 229, 0.30);
  
  --nav-h:       68px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:hidden}
body{
  font-family:'Exo 2',sans-serif;
  background:var(--midnight);
  color:var(--white);
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{cursor:pointer;font-family:inherit;border:none;background:none}
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:var(--midnight)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg, var(--neon-purple), var(--royal));border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg, var(--lavanda), var(--neon-purple))}
::selection {
  background: var(--lavanda);
  color: var(--midnight);
}