/** Shopify CDN: Minification failed

Line 35:21 Expected identifier but found whitespace
Line 35:23 Unexpected "{"
Line 35:32 Expected ":"
Line 35:51 Expected ":"

**/


/* CSS from section stylesheet tags */
.logo-marquee-section {
  padding-block: 3rem;
}

.logo-marquee__wrapper {
  text-align: center;
}

.logo-marquee__heading {
  margin: 0 0 1.5rem;
}

.logo-marquee {
  position: relative;
  overflow: hidden;
  width: 100%;
}

.logo-marquee__inner {
  display: flex;
  align-items: center;
  gap: 2.5rem;
  animation: logo-marquee-scroll linear infinite;
  animation-duration: {{ section.settings.speed }}s;
}

.logo-marquee__item {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* This is the key to fixing your “too small / giant” problem */
.logo-marquee__image {
  max-height: 60px;      /* controls visual size */
  width: auto;           /* keeps logo proportions */
  max-width: 180px;      /* stops super-wide logos from exploding */
  object-fit: contain;
}

/* Pause on hover (nice little UX touch) */
.logo-marquee:hover .logo-marquee__inner {
  animation-play-state: paused;
}

/* Mobile: slightly smaller logos & tighter gaps */
@media (max-width: 749px) {
  .logo-marquee__image {
    max-height: 44px;
    max-width: 140px;
  }

  .logo-marquee__inner {
    gap: 1.5rem;
  }
}

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