@keyframes fadeSlide {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}

.animate-fade-slide {
  animation: fadeSlide 1s ease-out forwards;
}

.animation-scroll-fade-in {
  opacity: 0;
  transform: translateY(20px); /* small movement from bottom */
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

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