/* Elementor Logo Marquee - CSS */
.elm-logo-marquee{
  --elm-gap: 32px;
  --elm-height: 72px;
  --elm-duration: 25s;
  --elm-direction: normal; /* normal | reverse */
  position: relative;
  overflow: hidden;
  width: 100%;
  line-height: 0;
}

.elm-logo-marquee .elm-track{
  display: flex;
  width: max-content;
  /* Due segmenti di elementi affiancati */
  animation: elm-marquee var(--elm-duration) linear infinite;
  animation-direction: var(--elm-direction);
}

.elm-logo-marquee[data-pause="true"]:hover .elm-track{
  animation-play-state: paused;
}

@keyframes elm-marquee{
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

.elm-logo-marquee .elm-segment{
  display: flex;
  gap: var(--elm-gap);
  align-items: center;
  padding-right: var(--elm-gap);
}

.elm-logo-marquee .elm-item{
  display: inline-flex;
  align-items: center;
  height: var(--elm-height);
}

.elm-logo-marquee .elm-img{
  max-height: var(--elm-height);
  width: auto;
  height: auto;
  display: block;
  object-fit: contain;
  filter: var(--elm-filter, none);
  transition: filter .2s ease, opacity .2s ease, transform .2s ease;
  will-change: transform;
}

.elm-logo-marquee.elm--grayscale .elm-img{
  --elm-filter: grayscale(100%);
}

.elm-logo-marquee .elm-link:hover .elm-img{
  filter: none;
  transform: translateY(-2px);
}
