/* === BACKGROUND CANVAS === */
.background-glow {
  position: fixed;
  inset: 0;
  overflow: hidden;
  z-index: -1;
  background: #050505;
}

/* === BLOB BASE === */
.blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(70px);
  opacity: 0.75;
  will-change: transform;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

/* === ANIMATIONS === */
@keyframes blobMovepurple {
  0% { transform: translate3d(0,270px,0) scale(1); }
  50% { transform: translate3d(-180px,-220px,0) scale(1.35); }
  100% { transform: translate3d(0,1870px,0) scale(1); }
}

@keyframes blobMovepink {
  0% { transform: translate3d(0,0,0) scale(1); }
  50% { transform: translate3d(-140px,250px,0) scale(1.45); }
  100% { transform: translate3d(0,0,0) scale(1); }
}

@keyframes blobMove4 {
  0% { transform: translate3d(0,0,0) scale(1); }
  50% { transform: translate3d(-250px,80px,0) scale(1.25); }
  100% { transform: translate3d(0,0,0) scale(1); }
}

@keyframes blobMove5 {
  0% { transform: translate3d(0,0,0) scale(1.2); }
  50% { transform: translate3d(300px,200px,0) scale(1.6); }
  100% { transform: translate3d(0,0,0) scale(1.2); }
}
