/* ═══════════════════════════════════════
   logo-carousel.css — Animação Ultra Suave
   ═══════════════════════════════════════ */

.carouselContainer {
  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 16px 0;
  user-select: none;
  cursor: default;
  mask-image: linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 12%, #000 88%, transparent 100%);
}

@media (min-width: 1024px) {
  .carouselContainer {
    cursor: ew-resize;
  }
}

.rowWrapper {
  width: 100%;
  overflow: hidden;
  display: flex;
}

@keyframes scrollLeftAnim {
  0% { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}

@keyframes scrollRightAnim {
  0% { transform: translate3d(-50%, 0, 0); }
  100% { transform: translate3d(0, 0, 0); }
}

.scrollerMobileLeft {
  display: flex;
  gap: 32px;
  width: max-content;
  animation: scrollLeftAnim 35s linear infinite;
  will-change: transform;
}

.scrollerMobileRight {
  display: flex;
  gap: 32px;
  width: max-content;
  animation: scrollRightAnim 35s linear infinite;
  will-change: transform;
}

.scroller {
  display: flex;
  gap: 32px;
  width: max-content;
  will-change: transform;
}