/**
 * Testimonial Animation Fix CSS
 * Specifically targets the testimonial/review section with scroller-y animations
 * Slows down animations on mobile devices
 */

@media (max-width: 767px) {
  /* Target the testimonial section */
  #testimonial .scroller-y {
    overflow: hidden !important;
  }

  /* Slow down the scrolling animation */
  #testimonial .scroller-y__list {
    /* The JS will apply a custom slow animation */
    animation-duration: 60s !important; /* Very slow animation */
    animation-timing-function: linear !important;
    transition-duration: 60s !important;
  }

  /* Make sure all testimonial items are visible */
  #testimonial .scroller-y__list > li {
    opacity: 1 !important;
  }

  /* Override any speed attributes to ensure slow animations */
  #testimonial .scroller-y[data-speed="fast"] .scroller-y__list {
    animation-duration: 60s !important; /* Override fast speed */
  }

  /* Ensure proper height for the container */
  #testimonial .scroller-y {
    height: 400px !important; /* Fixed height to ensure proper scrolling */
  }
  
  /* Custom slow animations defined in JS */
  @keyframes slowScrollDown {
    0% { transform: translateY(0); }
    100% { transform: translateY(-50%); }
  }
  
  @keyframes slowScrollUp {
    0% { transform: translateY(0); }
    100% { transform: translateY(50%); }
  }
}
