/* Faixas de clientes: visual do site original e movimento do piloto. */
.clients-page .clients-hero {
  text-align: center;
}

.clients-page .clients-hero p {
  margin: 0 auto;
}

.clients-slider {
  --clients-tile: 112px;
  --clients-gap: 16px;
  display: grid;
  gap: var(--clients-gap);
}

.clients-row {
  min-width: 0;
}

.clients-track {
  width: 100%;
}

.clients-set {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--clients-gap);
}

.clients-tile {
  flex: 0 0 var(--clients-tile);
  width: var(--clients-tile);
  height: var(--clients-tile);
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--white);
  box-shadow: var(--shadow-premium);
}

.clients-tile img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.clients-clone {
  display: none;
  pointer-events: none;
}

.clients-controls {
  margin-top: 28px;
  text-align: center;
}

#clients-toggle {
  font-family: inherit;
}

#clients-toggle[hidden] {
  display: none;
}

@media (min-width: 768px) {
  .clients-slider {
    --clients-tile: 132px;
    --clients-gap: 20px;
  }
}

@media (max-width: 640px) {
  .clients-slider {
    --clients-tile: 88px;
    --clients-gap: 12px;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .clients-slider.is-enhanced .clients-row {
    animation: clients-enter .5s cubic-bezier(.22, 1, .36, 1);
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  }

  .clients-slider.is-enhanced .clients-track {
    display: flex;
    gap: var(--clients-gap);
    width: max-content;
  }

  .clients-slider.is-enhanced .clients-set {
    flex-wrap: nowrap;
    flex-shrink: 0;
    justify-content: flex-start;
  }

  .clients-slider.is-enhanced .clients-clone {
    display: flex;
  }

  .clients-slider.is-ready .clients-track {
    will-change: transform;
    animation: clients-scroll var(--clients-duration, 46s) linear infinite;
  }

  .clients-slider.is-ready .clients-row:nth-child(2) .clients-track {
    animation-direction: reverse;
  }

  .clients-slider.is-paused .clients-track {
    animation-play-state: paused;
  }
}

@keyframes clients-enter {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes clients-scroll {
  to {
    transform: translate3d(calc(-1 * var(--clients-shift)), 0, 0);
  }
}

@media (prefers-reduced-motion: reduce), print {
  .clients-page .clients-slider .clients-row {
    animation: none;
    opacity: 1;
    overflow: visible;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .clients-page .clients-slider .clients-track {
    display: block;
    width: 100%;
    animation: none;
    transform: none;
    will-change: auto;
  }

  .clients-page .clients-slider .clients-set {
    flex-wrap: wrap;
    justify-content: center;
  }

  .clients-page .clients-slider .clients-clone,
  #clients-toggle {
    display: none;
  }
}