/* EFECTOS ESPACIALES INTERACTIVOS Y OPTIMIZACIÓN MÓVIL BIG BANG PARK */

@media (max-width: 991px) {
  #space-scene {
    display: none !important; /* Desactivar 3D Three.js pesado en celulares */
  }
  body {
    background: radial-gradient(circle at 50% 20%, #1e1b4b 0%, #06020c 70%) !important;
    background-attachment: fixed !important;
  }
}

/* Contenedor de Estrellas Fugaces */
.shooting-star-sky {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  overflow: hidden;
}

.shooting-star {
  position: absolute;
  width: 140px;
  height: 2px;
  background: linear-gradient(90deg, #ffffff, #f59e0b, transparent);
  transform: rotate(-35deg);
  opacity: 0;
  filter: drop-shadow(0 0 6px #f59e0b);
  animation: shootStarAnim 3.5s cubic-bezier(0.25, 0.1, 0.25, 1) infinite;
}

.shooting-star:nth-child(1) { top: 10%; right: 15%; animation-delay: 0s; }
.shooting-star:nth-child(2) { top: 35%; right: 5%; animation-delay: 1.2s; }
.shooting-star:nth-child(3) { top: 60%; right: 25%; animation-delay: 2.4s; }

@keyframes shootStarAnim {
  0% {
    transform: translateX(0) translateY(0) rotate(-35deg);
    opacity: 1;
    width: 140px;
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translateX(-700px) translateY(700px) rotate(-35deg);
    opacity: 0;
    width: 0px;
  }
}

/* Despegue de Cohete al Cargar la Página */
#rocketLaunchOverlay {
  position: fixed;
  inset: 0;
  z-index: 99999;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  transition: opacity 0.8s ease-out;
}

.rocket-blast-body {
  width: 75px;
  height: 75px;
  animation: launchUpAnim 2.5s cubic-bezier(0.11, 0, 0.5, 1) forwards;
  filter: drop-shadow(0 0 18px #f59e0b);
}

.rocket-trail-fire {
  width: 20px;
  height: 90px;
  background: linear-gradient(to bottom, #f59e0b, #ef4444, transparent);
  border-radius: 50%;
  animation: fireFlicker 0.12s infinite alternate;
  filter: blur(2px);
  margin-top: -12px;
}

@keyframes launchUpAnim {
  0% {
    transform: translateY(100vh) scale(0.6);
    opacity: 0;
  }
  15% {
    opacity: 1;
    transform: translateY(70vh) scale(1);
  }
  100% {
    transform: translateY(-120vh) scale(1.4);
    opacity: 0;
  }
}

@keyframes fireFlicker {
  0% { opacity: 0.8; transform: scaleX(0.8); }
  100% { opacity: 1; transform: scaleX(1.3); }
}

/* Cohete Flotante Interactivo */
#interactiveFloatingRocket {
  position: fixed;
  bottom: 25px;
  right: 20px;
  z-index: 9999;
  width: 60px;
  height: 60px;
  cursor: pointer;
  animation: floatOrbitAnim 4s ease-in-out infinite alternate;
  filter: drop-shadow(0 0 14px rgba(245, 158, 11, 0.9));
  transition: transform 0.3s;
}

#interactiveFloatingRocket:hover {
  transform: scale(1.25) rotate(12deg);
}

.spin-rocket-boost {
  animation: rocketSpinBoost 0.8s ease-in-out !important;
}

@keyframes floatOrbitAnim {
  0% { transform: translateY(0px) rotate(-5deg); }
  50% { transform: translateY(-14px) rotate(6deg); }
  100% { transform: translateY(-4px) rotate(-4deg); }
}

@keyframes rocketSpinBoost {
  0% { transform: scale(1) rotate(0deg); }
  50% { transform: scale(1.5) rotate(180deg); }
  100% { transform: scale(1) rotate(360deg); }
}

/* Partículas al tocar el cohete */
.spark-particle {
  position: fixed;
  pointer-events: none;
  z-index: 9999;
  width: 8px;
  height: 8px;
  background: #f59e0b;
  border-radius: 50%;
  box-shadow: 0 0 10px #f59e0b;
  animation: sparkFade 0.7s ease-out forwards;
}

@keyframes sparkFade {
  0% { opacity: 1; transform: translate(0,0) scale(1); }
  100% { opacity: 0; transform: translate(var(--dx), var(--dy)) scale(0.2); }
}

/* ==========================================================================
   SUPER NOVA ASTEROID COLLISION EASTER EGG (ÉPICO BIG BANG EXPLOSION)
   ========================================================================== */
#epicBigBangContainer {
  position: fixed;
  inset: 0;
  z-index: 999999;
  pointer-events: none;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Camara con temblor de impacto */
.screen-impact-shake {
  animation: cameraImpactShake 0.6s cubic-bezier(0.36, 0.07, 0.19, 0.97) !important;
}

@keyframes cameraImpactShake {
  0%, 100% { transform: translate(0, 0); }
  15% { transform: translate(-14px, 10px) rotate(-1.5deg); }
  30% { transform: translate(16px, -12px) rotate(2deg); }
  45% { transform: translate(-12px, 14px) rotate(-1deg); }
  60% { transform: translate(10px, -8px) rotate(0.8deg); }
  75% { transform: translate(-6px, 6px); }
}

/* Asteroides Gigantes */
.giant-asteroid-left {
  position: absolute;
  width: 170px;
  height: 170px;
  animation: collideLeftAnim 1.1s cubic-bezier(0.5, 0, 0.25, 1) forwards;
  filter: drop-shadow(0 0 25px #f59e0b);
}

.giant-asteroid-right {
  position: absolute;
  width: 170px;
  height: 170px;
  animation: collideRightAnim 1.1s cubic-bezier(0.5, 0, 0.25, 1) forwards;
  filter: drop-shadow(0 0 25px #ef4444);
}

@keyframes collideLeftAnim {
  0% {
    transform: translate(-70vw, -70vh) rotate(0deg) scale(0.3);
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  100% {
    transform: translate(-25px, -25px) rotate(540deg) scale(1.3);
    opacity: 1;
  }
}

@keyframes collideRightAnim {
  0% {
    transform: translate(70vw, 70vh) rotate(0deg) scale(0.3);
    opacity: 0;
  }
  30% {
    opacity: 1;
  }
  100% {
    transform: translate(25px, 25px) rotate(-540deg) scale(1.3);
    opacity: 1;
  }
}

/* Supernova Blast Overlay que cubre la pantalla */
.bigbang-blast-screen {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 50% 50%, #ffffff 0%, #f59e0b 25%, #ef4444 50%, #1e1b4b 80%, rgba(6,2,12,0.95) 100%);
  opacity: 0;
  animation: epicSupernovaFade 5s cubic-bezier(0.1, 0.9, 0.2, 1) forwards;
}

@keyframes epicSupernovaFade {
  0% {
    opacity: 0;
    transform: scale(0.2);
  }
  10% {
    opacity: 1;
    transform: scale(1.05);
  }
  30% {
    opacity: 0.95;
    transform: scale(1);
  }
  70% {
    opacity: 0.6;
  }
  100% {
    opacity: 0;
    transform: scale(1.2);
  }
}

/* Anillo de Onda de Choque */
.shockwave-ring {
  position: absolute;
  width: 250px;
  height: 250px;
  border-radius: 50%;
  border: 8px solid #fef08a;
  box-shadow: 0 0 50px #f59e0b, inset 0 0 40px #ef4444;
  animation: shockwaveExpand 1.5s ease-out forwards;
}

@keyframes shockwaveExpand {
  0% { transform: scale(0.1); opacity: 1; border-width: 20px; }
  100% { transform: scale(6); opacity: 0; border-width: 1px; }
}

/* Texto Épico BIG BANG PARK */
.epic-bigbang-text {
  position: absolute;
  font-family: 'Outfit', sans-serif;
  font-weight: 900;
  font-size: clamp(2.2rem, 8vw, 4.5rem);
  text-align: center;
  color: #ffffff;
  text-shadow: 0 0 25px #f59e0b, 0 0 50px #ef4444;
  letter-spacing: 4px;
  animation: epicTextPulse 4.5s ease-out forwards;
}

@keyframes epicTextPulse {
  0% { transform: scale(0.2); opacity: 0; }
  12% { transform: scale(1.2); opacity: 1; }
  25% { transform: scale(1); opacity: 1; }
  80% { opacity: 0.8; }
  100% { transform: scale(1.3); opacity: 0; }
}

/* Fragmentos de Escombros Estelares */
.asteroid-debris-particle {
  position: absolute;
  width: 12px;
  height: 12px;
  background: #f59e0b;
  border-radius: 4px;
  box-shadow: 0 0 15px #ef4444;
  animation: debrisFly 2s cubic-bezier(0.1, 0.8, 0.3, 1) forwards;
}

@keyframes debrisFly {
  0% { transform: translate(0, 0) rotate(0deg) scale(1); opacity: 1; }
  100% { transform: translate(var(--dx), var(--dy)) rotate(720deg) scale(0.1); opacity: 0; }
}
