/* Aurora animada (atras das star-layers, dentro do wrapper fixo do fundo).
   Classe renomeada de .container para .aurora-bg para nao colidir com
   estilos genericos do site. */
.aurora-bg {
  position: absolute;
  inset: 0;
  background: radial-gradient(
      ellipse at 20% 30%,
      rgba(77, 125, 255, 0.22) 0%,
      rgba(77, 125, 255, 0) 60%
    ),
    radial-gradient(
      ellipse at 80% 50%,
      rgba(56, 189, 248, 0.15) 0%,
      rgba(56, 189, 248, 0) 70%
    ),
    radial-gradient(
      ellipse at 50% 80%,
      rgba(99, 91, 255, 0.15) 0%,
      rgba(99, 91, 255, 0) 65%
    ),
    linear-gradient(135deg, #070B14 0%, #0a1128 100%);
  background-blend-mode: overlay, screen, hard-light;
  overflow: hidden;
  animation: aurora-drift 25s infinite alternate ease-in-out;
}

.aurora-bg::before {
  content: "";
  position: absolute;
  width: 200%;
  height: 200%;
  top: -50%;
  left: -50%;
  background: repeating-linear-gradient(
      45deg,
      rgba(185, 203, 255, 0.02) 0px,
      rgba(185, 203, 255, 0.02) 1px,
      transparent 1px,
      transparent 40px
    ),
    repeating-linear-gradient(
      -45deg,
      rgba(185, 203, 255, 0.03) 0px,
      rgba(185, 203, 255, 0.03) 1px,
      transparent 1px,
      transparent 60px
    );
  animation: grid-shift 20s linear infinite;
}

.aurora-bg::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle at center,
    transparent 70%,
    rgba(7, 11, 20, 0.9) 100%
  );
  animation: aurora-pulse 8s infinite alternate;
}

@keyframes aurora-drift {
  0% {
    background-position:
      0% 0%,
      0% 0%,
      0% 0%;
    filter: hue-rotate(0deg) brightness(1);
  }
  50% {
    background-position:
      -10% -5%,
      5% 10%,
      0% 15%;
    filter: hue-rotate(-8deg) brightness(1.15);
  }
  100% {
    background-position:
      5% 10%,
      -10% -5%,
      15% 0%;
    filter: hue-rotate(10deg) brightness(1);
  }
}

@keyframes grid-shift {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(-50%, -50%);
  }
}

@keyframes aurora-pulse {
  0% {
    opacity: 0.8;
    transform: scale(1);
  }
  50% {
    opacity: 0.5;
    transform: scale(1.05);
  }
  100% {
    opacity: 0.8;
    transform: scale(1);
  }
}