/* Partner marquee (ported from the founder's design): CSS-only animation, paused on hover or focus,
   still when the visitor prefers reduced motion. The same list renders twice for a seamless loop. */
.marquee {
  overflow: hidden;
  width: 100%;
  -webkit-mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
  mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent);
}
.marquee-track {
  display: flex;
  width: max-content;
  animation: marquee-scroll 35s linear infinite;
}
.marquee-group {
  display: flex;
  align-items: center;
  gap: 75px;
  padding: 0 75px 0 0;
  margin: 0;
  list-style: none;
}
.marquee-group img {
  height: 80px;
  width: auto;
  display: block;
  object-fit: contain;
}
.marquee-group a { display: block; color: inherit; text-decoration: none; }
.partner-name {
  display: block;
  font: 700 1.125rem var(--font-heading);
  white-space: nowrap;
}
.marquee:hover .marquee-track,
.marquee:focus-within .marquee-track {
  animation-play-state: paused;
}
@keyframes marquee-scroll {
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .marquee { -webkit-mask-image: none; mask-image: none; }
  .marquee-track { animation: none; width: auto; flex-wrap: wrap; }
  .marquee-group { flex-wrap: wrap; justify-content: center; gap: 24px 40px; padding: 0; }
  .marquee-group[aria-hidden="true"] { display: none; }
}
