/* Soft side EMP flashes — one pulse every 2 seconds, rotating sides */

.aqwa-pulsefx {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  contain: paint;
}

.aqwa-pulsefx__flash {
  position: absolute;
  width: min(52vw, 420px);
  height: min(52vw, 420px);
  border-radius: 50%;
  opacity: 0;
  filter: blur(8px);
  will-change: opacity, transform;
  background: radial-gradient(
    circle,
    rgba(34, 211, 238, 0.42) 0%,
    rgba(59, 130, 246, 0.18) 35%,
    transparent 70%
  );
  animation: aqwa-side-pulse 16s linear infinite;
}

.aqwa-pulsefx__flash--1 {
  top: 8%;
  inset-inline-start: -8%;
  animation-delay: 0s;
}

.aqwa-pulsefx__flash--2 {
  top: 18%;
  inset-inline-end: -10%;
  background: radial-gradient(
    circle,
    rgba(139, 92, 246, 0.4) 0%,
    rgba(99, 102, 241, 0.16) 38%,
    transparent 70%
  );
  animation-delay: -14s;
}

.aqwa-pulsefx__flash--3 {
  top: 48%;
  inset-inline-start: -12%;
  background: radial-gradient(
    circle,
    rgba(59, 130, 246, 0.38) 0%,
    rgba(34, 211, 238, 0.14) 40%,
    transparent 70%
  );
  animation-delay: -12s;
}

.aqwa-pulsefx__flash--4 {
  top: 58%;
  inset-inline-end: -8%;
  background: radial-gradient(
    circle,
    rgba(34, 211, 238, 0.36) 0%,
    rgba(139, 92, 246, 0.14) 40%,
    transparent 70%
  );
  animation-delay: -10s;
}

.aqwa-pulsefx__flash--5 {
  bottom: 10%;
  inset-inline-start: 8%;
  width: min(44vw, 340px);
  height: min(44vw, 340px);
  background: radial-gradient(
    circle,
    rgba(99, 102, 241, 0.34) 0%,
    rgba(34, 211, 238, 0.12) 42%,
    transparent 70%
  );
  animation-delay: -8s;
}

.aqwa-pulsefx__flash--6 {
  bottom: 16%;
  inset-inline-end: 6%;
  width: min(46vw, 360px);
  height: min(46vw, 360px);
  background: radial-gradient(
    circle,
    rgba(139, 92, 246, 0.36) 0%,
    rgba(59, 130, 246, 0.14) 40%,
    transparent 70%
  );
  animation-delay: -6s;
}

.aqwa-pulsefx__flash--7 {
  top: 34%;
  left: 50%;
  width: min(48vw, 380px);
  height: min(48vw, 380px);
  background: radial-gradient(
    circle,
    rgba(34, 211, 238, 0.28) 0%,
    rgba(59, 130, 246, 0.1) 40%,
    transparent 70%
  );
  animation-name: aqwa-side-pulse-center;
  animation-delay: -4s;
}

.aqwa-pulsefx__flash--8 {
  top: 72%;
  left: 42%;
  width: min(40vw, 300px);
  height: min(40vw, 300px);
  background: radial-gradient(
    circle,
    rgba(59, 130, 246, 0.32) 0%,
    rgba(139, 92, 246, 0.12) 40%,
    transparent 70%
  );
  animation-delay: -2s;
}

/* 16s loop / 8 positions = 1 pulse every 2 seconds */
@keyframes aqwa-side-pulse {
  0% {
    opacity: 0;
    transform: scale(0.75);
  }
  1% {
    opacity: 0.9;
    transform: scale(1);
  }
  3% {
    opacity: 0.25;
    transform: scale(1.1);
  }
  12.5%,
  100% {
    opacity: 0;
    transform: scale(0.75);
  }
}

@keyframes aqwa-side-pulse-center {
  0% {
    opacity: 0;
    transform: translateX(-50%) scale(0.75);
  }
  1% {
    opacity: 0.8;
    transform: translateX(-50%) scale(1);
  }
  3% {
    opacity: 0.2;
    transform: translateX(-50%) scale(1.1);
  }
  12.5%,
  100% {
    opacity: 0;
    transform: translateX(-50%) scale(0.75);
  }
}

@media (prefers-reduced-motion: reduce) {
  .aqwa-pulsefx__flash {
    animation: none !important;
    opacity: 0;
  }
}

@media (max-width: 860px) {
  /* Fewer, farther flashes — 4 corners × 3s = 12s */
  .aqwa-pulsefx__flash {
    width: min(58vw, 220px);
    height: min(58vw, 220px);
    filter: blur(12px);
    animation-duration: 12s;
  }

  .aqwa-pulsefx__flash--3,
  .aqwa-pulsefx__flash--4,
  .aqwa-pulsefx__flash--7,
  .aqwa-pulsefx__flash--8 {
    display: none;
  }

  .aqwa-pulsefx__flash--1 {
    top: 4%;
    inset-inline-start: -18%;
    inset-inline-end: auto;
    bottom: auto;
    animation-delay: 0s;
  }

  .aqwa-pulsefx__flash--2 {
    top: 6%;
    inset-inline-end: -18%;
    inset-inline-start: auto;
    bottom: auto;
    animation-delay: -9s;
  }

  .aqwa-pulsefx__flash--5 {
    top: auto;
    bottom: 8%;
    inset-inline-start: -16%;
    inset-inline-end: auto;
    animation-delay: -6s;
  }

  .aqwa-pulsefx__flash--6 {
    top: auto;
    bottom: 10%;
    inset-inline-end: -16%;
    inset-inline-start: auto;
    animation-delay: -3s;
  }
}

@media (max-width: 860px) {
  @keyframes aqwa-side-pulse {
    0% {
      opacity: 0;
      transform: scale(0.75);
    }
    2% {
      opacity: 0.9;
      transform: scale(1);
    }
    6% {
      opacity: 0.22;
      transform: scale(1.1);
    }
    25%,
    100% {
      opacity: 0;
      transform: scale(0.75);
    }
  }
}