body {
  background: linear-gradient(315deg, #4a2036 3%, #5c2846 38%, #522840 68%, #3d1a2e 98%);
  animation: gradient 15s ease infinite;
  background-size: 400% 400%;
  background-attachment: fixed;
}

@keyframes gradient {
  0% { background-position: 0% 0%; }
  50% { background-position: 100% 100%; }
  100% { background-position: 0% 0%; }
}

.wave {
  background: rgb(255 179 209 / 18%);
  border-radius: 1000% 1000% 0 0;
  position: fixed;
  width: 200%;
  height: 50vh;
  animation: wave 10s -3s linear infinite;
  transform: translate3d(0, 0, 0);
  opacity: 0.8;
  bottom: 0;
  left: 0;
  z-index: -1;
  pointer-events: none;
}

.wave:nth-of-type(2) {
  bottom: -2vh;
  animation: wave 18s linear reverse infinite;
  opacity: 0.8;
}

.wave:nth-of-type(3) {
  bottom: -4vh;
  animation: wave 20s -1s reverse infinite;
  opacity: 0.9;
}

@keyframes wave {
  2% { transform: translateX(1); }
  25% { transform: translateX(-25%); }
  50% { transform: translateX(-50%); }
  75% { transform: translateX(-25%); }
  100% { transform: translateX(1); }
}