.client-logo-wrapper {
  overflow: hidden;
  width: 100%;
  background-color: #f5f5f5;
  position: relative;
}

.client-logo-track {
  display: flex;
  width: calc(1.5 * 100%); /* twice the width for the duplicated logos */
  animation: scroll-loop 30s linear infinite;
}

#client-logo {
  display: flex;
  /* Remove any gap or margin */
}

#client-logo .item {
  flex: 0 0 auto;
  /* No margin or gap */
}

#client-logo .item img {
  width: 150px;
  height: 80px;
  object-fit: contain;
  border-radius: 10px; /* optional rounding */
}

/* Scroll left by 50% (one set width) */
@keyframes scroll-loop {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

.client-logo-wrapper:hover .client-logo-track {
  animation-play-state: paused;
}
