img.scroll-animate {
  opacity: 0;
  transition: all 0.8s ease-out;
  will-change: opacity, transform;
}

/* EFFETTI DI BASE */

img.scroll-animate.zoom-fade {
  transform: scale(0.95) translateY(30px);
}
img.scroll-animate.slide-up {
  transform: translateY(40px);
}
img.scroll-animate.fade-only {
  transform: none;
}
img.scroll-animate.slide-left {
  transform: translateX(50px);
}
img.scroll-animate.slide-right {
  transform: translateX(-50px);
}
img.scroll-animate.rotate-in {
  transform: rotate(-10deg) scale(0.9);
}

/* STATI VISIBILI */

img.scroll-animate.visible {
  opacity: 1;
}
img.scroll-animate.zoom-fade.visible {
  transform: scale(1) translateY(0);
}
img.scroll-animate.slide-up.visible {
  transform: translateY(0);
}
img.scroll-animate.fade-only.visible {
  transform: none;
}
img.scroll-animate.slide-left.visible,
img.scroll-animate.slide-right.visible {
  transform: translateX(0);
}
img.scroll-animate.rotate-in.visible {
  transform: rotate(0deg) scale(1);
}