.client-carousel { margin-top: 132px; overflow: hidden; }
.client-carousel h2 { margin: 0 28px 28px; padding-top: 24px; border-top: 1px solid var(--rule); font: .6875rem/1 var(--font-mono); text-transform: uppercase; }
.client-carousel__viewport { width: 100%; overflow: hidden; }
.client-carousel__track { display: flex; width: max-content; animation: client-carousel-scroll 32s linear infinite; }
.client-carousel__logos { display: flex; flex: none; align-items: center; gap: 12px; padding-right: 12px; }
.client-carousel__logos img { width: 220px; height: 124px; padding: 24px; object-fit: contain; border-radius: 4px; background: #fff; filter: grayscale(100%); }

@keyframes client-carousel-scroll {
  to { transform: translateX(calc(-1 * var(--client-carousel-cycle, 50%))); }
}

@media(max-width:1193px) {
  .client-carousel { margin-top: 88px; }
  .client-carousel h2 { margin-inline: 16px; }
}

@media(max-width:833px) {
  .client-carousel { margin-top: 72px; }
  .client-carousel__logos img { width: 170px; height: 100px; padding: 20px; }
}

@media(prefers-reduced-motion:reduce) {
  .client-carousel__viewport { overflow-x: auto; }
  .client-carousel__track { animation: none; }
  .client-carousel__logos[aria-hidden='true'] { display: none; }
}