/* Clients slider — seamless marquee */
.clients-slider-wrapper {
  position: relative;
  overflow: hidden;
}

.clients-slider {
  display: flex;
  align-items: center;
  gap: 40px;
  will-change: transform;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
  animation-name: none; /* enabled when ready */
  animation-duration: var(--marquee-duration, 20s);
}

/* Individual slide items */
.clients-slider .slide {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 0;
  opacity: 0.95;
  transition: opacity 120ms ease;
}
.clients-slider .slide:hover { opacity: 1; }

/* Pause on hover */
.clients-slider-wrapper:hover .clients-slider,
.clients-slider.is-paused {
  animation-play-state: paused;
}

/* Activate animation when JS set up variables */
.clients-slider.is-ready { animation-name: clients-marquee; }

@keyframes clients-marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(var(--marquee-end, -50%)); }
}
