/* Client-logo motion only; the production site's design remains unchanged. */
.whyus-inner > *, .clients-inner > * { min-width: 0; }
.client-logos.is-scrolling {
  --client-logo-gap: 12px;
  display: block;
  overflow: hidden;
  max-width: 100%;
  mask-image: linear-gradient(to right, transparent, #000 12px, #000 calc(100% - 12px), transparent);
}
.client-logos-track {
  display: flex;
  width: max-content;
  animation: client-logos-scroll 38s linear infinite;
}
.client-logos-group {
  display: flex;
  flex: 0 0 auto;
  gap: var(--client-logo-gap);
  padding-inline-end: var(--client-logo-gap);
}
.is-scrolling .client-logo { flex: 0 0 176px; width: 176px; }
.is-scrolling .client-logo:hover { transform: none; box-shadow: none; }
.client-logos.is-paused .client-logos-track,
.client-logos.is-offscreen .client-logos-track { animation-play-state: paused; }
.client-logos-controls { display: flex; justify-content: flex-end; margin-top: 8px; }
.client-logos-toggle {
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: var(--radius);
  background: transparent;
  color: var(--white);
  font: inherit;
  font-size: .8rem;
  cursor: pointer;
}
.client-logos-controls--light .client-logos-toggle {
  color: var(--text-body);
  border-color: var(--grey-light);
}
.client-logos-toggle:hover { border-color: var(--teal); }
.client-logos-toggle:focus-visible { outline: 2px solid var(--teal); outline-offset: 3px; }
@keyframes client-logos-scroll {
  to { transform: translateX(-50%); }
}
@media (hover: hover) and (pointer: fine) {
  .client-logos.is-scrolling:hover .client-logos-track { animation-play-state: paused; }
}
@media (max-width: 600px) {
  .is-scrolling .client-logo { flex-basis: 148px; width: 148px; }
  .client-logos-track { animation-duration: 32s; }
}
@media (prefers-reduced-motion: reduce) {
  .client-logos.is-scrolling { mask-image: none; }
  .client-logos-track { width: 100%; animation: none; transform: none; }
  .client-logos-group { width: 100%; flex-wrap: wrap; justify-content: center; padding: 0; }
  .is-scrolling .client-logo { flex-basis: calc((100% - 2 * var(--client-logo-gap)) / 3); width: auto; }
  .client-logos-group[aria-hidden="true"], .client-logos-controls { display: none; }
}
@media (prefers-reduced-motion: reduce) and (max-width: 600px) {
  .is-scrolling .client-logo { flex-basis: calc((100% - var(--client-logo-gap)) / 2); }
}