.fade-in-on-scroll {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.6s ease, transform 0.6s ease;
  will-change: opacity, transform;
}

.fade-in-on-scroll.in-view {
  opacity: 1;
  transform: translateY(0);
}

.zoom-in-on-scroll {
  opacity: 0;
  transform: scale(0.95);
  transition: opacity 0.6s ease, transform 0.6s ease;
  will-change: opacity, transform;
}

.zoom-in-on-scroll.in-view {
  opacity: 1;
  transform: scale(1);
}

.slide-left-on-scroll {
  opacity: 0;
  transform: translateX(-40px);
  transition: opacity 0.6s ease, transform 0.6s ease;
  will-change: opacity, transform;
}

.slide-left-on-scroll.in-view {
  opacity: 1;
  transform: translateX(0);
}

.slide-right-on-scroll {
  opacity: 0;
  transform: translateX(40px);
  transition: opacity 0.6s ease, transform 0.6s ease;
  will-change: opacity, transform;
}

.slide-right-on-scroll.in-view {
  opacity: 1;
  transform: translateX(0);
}