.alt-marquee {
  display: block;
  background: var(--alt-mq-bg);
  overflow: hidden;
}

.alt-marquee__heading { margin-bottom: 26px; text-align: center; }

.alt-marquee__viewport { overflow: hidden; }

/* The track holds the items twice (the copy is cloned by the script), so
   translating it by exactly -50% loops seamlessly. */
.alt-marquee__track {
  display: flex;
  align-items: center;
  gap: var(--alt-mq-gap);
  width: max-content;
  animation: alt-marquee-scroll var(--alt-mq-duration) linear infinite;
  animation-direction: var(--alt-mq-direction);
}

.alt-marquee__track.is-paused { animation-play-state: paused; }

@keyframes alt-marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.alt-marquee__item {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
  height: var(--alt-mq-height);
}

.alt-marquee__link { display: flex; align-items: center; gap: 12px; height: 100%; text-decoration: none; }

.alt-marquee__img {
  height: 100%;
  width: auto;
  max-width: none;
  object-fit: contain;
}

.alt-marquee__text {
  font-family: var(--alt-font-heading);
  font-size: calc(var(--alt-body-size) * 1.05);
  font-weight: var(--alt-fw-heading);
  color: var(--alt-heading-color);
  white-space: nowrap;
}

@media (max-width: 767px) {
  .alt-marquee__item { height: var(--alt-mq-height-m); }
}

@media (prefers-reduced-motion: reduce) {
  .alt-marquee__track { animation: none; }
  .alt-marquee__viewport { overflow-x: auto; }
}