/* ==========================================================================
   index2.html — Animación de batalla espacial en el hero
   Capa aparte para no tocar el tema original de index.html
   ========================================================================== */

.hero-bg {
  background: radial-gradient(ellipse 80% 60% at 50% 15%, #1a2444 0%, #0c1020 45%, #05060b 100%);
}

.hero-battle-canvas {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.hero-battle-video {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

.hero-overlay {
  z-index: 1;
  background: linear-gradient(180deg, rgb(5 6 11) 0%, rgb(5 6 11 / 63%) 42%, rgb(10 13 18) 100%);
}

@media (prefers-reduced-motion: reduce) {
  .hero-battle-canvas { opacity: 0.7; }
  .hero-battle-video { display: none; }
}