/* ───────── GLOBAL LAYOUT ───────── */
html,body{min-height:100%;margin:0;}
body{
  display:flex;flex-direction:column;
  background:#0f1638;color:#e2e8f0;font-family:system-ui,sans-serif;
}
main{flex:1;}

/* ───────── PALETTE ───────── */
:root{
  --primary:#0f1638;--primary-dark:#0a1024;
  --accent-1:#7dd1e7;--accent-2:#394d9b;--accent-3:#a8d897;
}
.bg-primary{background:var(--primary);}
.bg-primary-dark{background:var(--primary-dark);}
.text-accent-1{color:var(--accent-1);}
.bg-accent-2{background:var(--accent-2);}

/* ───────── SECTION TITLES ───────── */
.section-title{
  font-size:1.875rem;font-weight:700;letter-spacing:.05em;margin-bottom:.75rem;
  color:var(--accent-1);text-shadow:0 0 8px var(--accent-1),0 0 16px var(--accent-1);
}

/* ───────── HERO GRADIENT (index) ───────── */
.hero-bg{
  background:radial-gradient(ellipse at center,transparent 0%,var(--primary-dark) 70%),
             conic-gradient(from 180deg at center,var(--accent-2)0%,var(--primary)45%,var(--accent-3)90%,var(--primary)100%);
  background-size:200% 200%;animation:spin 20s linear infinite;
}
@keyframes spin{to{background-position:100% 100%;}}

/* ───────── EPIC FOOTER (unchanged) ───────── */
footer.epic{position:relative;overflow:hidden;background:var(--primary-dark);color:#cbd5e1;}
footer.epic::before{
  content:"";position:absolute;top:0;left:0;width:100%;height:3px;
  background:linear-gradient(90deg,var(--accent-1),var(--accent-2),var(--accent-3),var(--accent-1));
  background-size:400% 100%;animation:strip 12s linear infinite;
}
@keyframes strip{0%{background-position:0 0;}100%{background-position:400% 0;}}
footer.epic::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 30% 70%,var(--accent-2)10%,transparent 60%),
             radial-gradient(circle at 70% 30%,var(--accent-1)10%,transparent 60%);
  filter:blur(120px);opacity:.15;
}
footer.epic a:hover{color:var(--accent-1);}
footer.epic input{background:rgba(255,255,255,.07);color:#e2e8f0;}
footer.epic input::placeholder{color:#64748b;}
footer.epic button:hover{background:var(--accent-1);}

/* ───────── NEWS TICKER ───────── */
.ticker-wrap{overflow:hidden;background:var(--primary-dark);border-top:1px solid #1e293b;}
.ticker{
  display:inline-block;white-space:nowrap;padding-block:.5rem;
  animation:scroll 25s linear infinite;font-size:.875rem;color:var(--accent-1);
}
.ticker span{margin-right:2rem;}
@keyframes scroll{from{transform:translateX(100%);}to{transform:translateX(-100%);}}