/* The "Our partners" logos on the homepage, scrolling in one endless line. */
.partners-strip { padding: 28px 0 40px; }
.partners-strip .eyebrow { text-align: center; margin-bottom: 18px; }

/* The track holds the partners twice and slides by exactly one copy, so the
   loop has no seam. Each group ends with the same gap it puts between logos. */
.partners-marquee {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
          mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
}
.partners-track { display: flex; width: max-content; animation: partners-scroll 100s linear infinite; }
.partners-marquee:hover .partners-track,
.partners-marquee:focus-within .partners-track { animation-play-state: paused; }
.partners-group { display: flex; align-items: center; gap: 48px; padding-right: 48px; }
@keyframes partners-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

.partners-strip a, .partners-strip .partners-group > span { display: block; flex: none; border-radius: 8px; }
.partners-strip a:focus-visible { outline: 2px solid var(--tt-indigo); outline-offset: 6px; }
/* Each logo carries its own height in --h, chosen so every name reads at
   about the same weight: a wide wordmark sits lower, a round badge or an
   illustration whose name is small sits taller. */
.partners-strip img { display: block; height: var(--h, 48px); width: auto; max-width: none; }

@media (max-width: 720px) {
  .partners-group { gap: 32px; padding-right: 32px; }
  .partners-strip img { height: calc(var(--h, 48px) * 0.75); }
}

/* No motion wanted: the partners wrap into a still, centred block instead. */
@media (prefers-reduced-motion: reduce) {
  .partners-marquee { -webkit-mask-image: none; mask-image: none; }
  .partners-track { animation: none; width: auto; justify-content: center; }
  .partners-group { flex-wrap: wrap; justify-content: center; row-gap: 28px; padding: 0 20px; max-width: 1120px; }
  .partners-group[aria-hidden="true"] { display: none; }
}