/* ═══════════════════════════════════════════════════════════════════════════
   Home — logos dos clientes em esteira contínua

   Usado só em /index.php, no carrossel de imagens 5d0ca94 (as logos).

   Por que não é a rotação automática do Elementor: o carrossel dele (Swiper)
   leva cerca de 1 s para começar cada passo depois de terminar o anterior,
   mesmo com espera de 1 ms e tempo linear — a faixa anda e para (medido em
   06/10/2026). Aqui o Swiper fica só como ESTRUTURA: ele monta a fila e
   duplica as logos das pontas para o loop. Quem move a faixa é esta animação.

   A distância de uma volta (--vp-esteira-dist) e o tempo (--vp-esteira-tempo)
   vêm de js/vp-logos-clientes.js, que mede a largura real das logos na tela —
   ela muda entre computador e celular. Sem o script a classe .vp-esteira não
   entra e o carrossel fica parado, como no site no ar.

   A volta termina exatamente onde as cópias das pontas mostram as mesmas
   logos do começo: é o que faz o recomeço não aparecer.
   ═══════════════════════════════════════════════════════════════════════════ */

.elementor-element-5d0ca94.vp-esteira .swiper-wrapper {
  /* animação vence o transform que o Swiper escreve no style do elemento */
  animation: vp-esteira var(--vp-esteira-tempo, 100s) linear infinite;
}
/* mouse em cima: para no lugar, para dar tempo de ler uma logo; saiu, continua.
   Só onde existe mouse: em tela de toque o "hover" gruda depois de um toque e a
   esteira ficaria parada até a pessoa tocar em outro lugar. */
@media (hover: hover) {
  .elementor-element-5d0ca94.vp-esteira:hover .swiper-wrapper {
    animation-play-state: paused;
  }
}
@keyframes vp-esteira {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(var(--vp-esteira-dist, 0), 0, 0); }
}

/* bolinhas de página não fazem sentido numa esteira: somem, com o espaço delas */
.elementor-element-5d0ca94 .swiper-pagination {
  display: none !important;
}
.elementor-element-5d0ca94.elementor-pagination-position-outside .swiper {
  padding-bottom: 0 !important;
}

@media (prefers-reduced-motion: reduce) {
  .elementor-element-5d0ca94.vp-esteira .swiper-wrapper { animation: none; }
}