/* Base hidden state */
.animate-on-scroll {
  opacity: 0;
  transform: translateY(40px);
  transition: all 0.6s cubic-bezier(0.25, 0.1, 0.25, 1); /* slower and smoother */
  transition-delay: 0s; /* slight delay before animation starts */
}

/* When visible */
.animate-on-scroll.visible {
  opacity: 1;
  transform: none;
}

/* Variants */
.slide-left {
  transform: translateX(-70px);
}
.slide-left.visible {
  transform: translateX(0);
}

.slide-right {
  transform: translateX(70px);
}
.slide-right.visible {
  transform: translateX(0);
}

.fade-in {
  opacity: 0;
  transform: scale(0.92);
}
.fade-in.visible {
  opacity: 1;
  transform: scale(1);
}
.elementor-editor-active .animate-on-scroll {
  opacity: 1 !important;
  transform: none !important;
}