/* container only uses custom class; do not add marquee-swiper to wrapper/slides */
.swiper.marquee-swiper {
  margin-top: 2.5rem;
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  overflow: hidden;
}
.marquee-swiper .swiper-wrapper {
  align-items: center;
  will-change: transform;
}
.marquee-swiper .swiper-slide {
  width: 12rem;
  display: flex;
  align-items: center;
  justify-content: center;
  user-select: none;
  -webkit-user-drag: none;
  padding: .5rem 0;
}
.marquee-swiper img {
  max-width: 100%;
  max-height: 4.5rem;
  height: auto;
  object-fit: contain;
  display: block;
}
@media (max-width:640px) {
  .marquee-swiper .swiper-slide { width: 9rem; }
  .marquee-swiper img { max-height: 3rem; }
}

/* Ensure Swiper layout is horizontal and slides don't wrap */
.marquee-swiper .swiper-wrapper {
  display: flex !important;      /* must be flex */
  flex-wrap: nowrap !important;  /* prevent stacked wraps */
  align-items: center !important;
}

/* Each slide should not stretch vertically — keep its intrinsic size */
.marquee-swiper .swiper-slide {
  flex: 0 0 auto !important;     /* don't grow or shrink; width controlled by CSS / content */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* small responsive tweak for logo images */
.marquee-swiper .swiper-slide img {
  max-width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
}