footer {
  gap: 1.25rem;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #0a1e20;
}

footer::before,
footer::after {
  content: "";
  position: absolute;
  inset: -16% -14%;
  z-index: 0;
  pointer-events: none;
}

footer::before {
  opacity: .72;
  background:
    radial-gradient(82% 120% at 4% 132%, transparent 48%, #5bb29436 49% 55%, transparent 56%),
    radial-gradient(95% 120% at 92% 138%, transparent 49%, #a7dec435 50% 57%, transparent 58%);
  background-size: 175% 168%, 205% 180%;
  background-position: 0 100%, 100% 100%;
  animation: footer-wave-back 24s ease-in-out infinite alternate;
}

footer::after {
  opacity: .76;
  background:
    radial-gradient(78% 100% at 38% 136%, transparent 50%, #dfff6730 51% 54%, transparent 55%),
    radial-gradient(86% 112% at 100% 134%, transparent 50%, #70c8a73a 51% 56%, transparent 57%);
  background-size: 180% 150%, 220% 162%;
  background-position: 0 100%, 100% 100%;
  animation: footer-wave-front 17s ease-in-out infinite alternate-reverse;
}

footer > * {
  position: relative;
  z-index: 1;
}

footer div,
footer address {
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
  font-style: normal;
}

footer strong {
  color: #fff;
  font-size: 0.8rem;
}

@media (max-width: 480px) {
  footer { flex-direction: column; }
}

@keyframes footer-wave-back {
  from {
    background-position: 0 100%, 100% 100%;
    transform: translate3d(-5%, 2px, 0);
  }
  to {
    background-position: 100% 94%, 0 97%;
    transform: translate3d(5%, -3px, 0);
  }
}

@keyframes footer-wave-front {
  from {
    background-position: 0 100%, 100% 100%;
    transform: translate3d(5%, 3px, 0);
  }
  to {
    background-position: 100% 96%, 0 94%;
    transform: translate3d(-5%, -2px, 0);
  }
}

@media (prefers-reduced-motion: reduce) {
  footer::before,
  footer::after { animation: none; }
}