/* The original logo grid remains available if JavaScript is disabled. */
.services { padding-block: 27px 23px; }
.service-logos.is-carousel { --service-gap: clamp(22px, 2.5vw, 34px); display: block; overflow: hidden; max-width: none; margin: 22px auto 19px; padding-block: 5px; mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
.service-carousel-track { display: flex; width: max-content; animation: service-logo-loop 32s linear infinite; }
.service-carousel-group { display: flex; align-items: center; gap: var(--service-gap); padding-right: var(--service-gap); flex: 0 0 auto; }
.is-carousel .service-logo { flex: 0 0 136px; width: 136px; height: 39px; }
.is-carousel .service-logo img { max-width: 127px; height: 33px; }
.is-carousel .service-disney img { height: 39px; }
.is-carousel .service-plex img { max-width: 74px; }
.is-carousel .service-drive img { width: 27px; height: 27px; }
.how-section { padding-top: 55px; }
@keyframes service-logo-loop { to { transform: translateX(-50%); } }
@media (max-width: 800px) {
  .how-section { padding-top: 42px; }
  .is-carousel .service-logo { flex-basis: 120px; width: 120px; }
}
@media (max-width: 600px) {
  .services { padding-block: 23px 20px; }
  .service-logos.is-carousel { --service-gap: 22px; margin-block: 18px 16px; }
  .is-carousel .service-logo { flex-basis: 110px; width: 110px; height: 34px; }
  .is-carousel .service-logo img { max-width: 105px; height: 28px; }
  .is-carousel .service-disney img { height: 34px; }
  .is-carousel .service-plex img { max-width: 65px; }
  .is-carousel .service-drive { gap: 6px; font-size: 12px; }
  .is-carousel .service-drive img { width: 23px; height: 23px; }
  .how-section { padding-top: 36px; }
}
/* This logo strip intentionally keeps moving, including on hover and focus. */
@media (prefers-reduced-motion: reduce) {
  .service-carousel-track { animation: service-logo-loop 32s linear infinite !important; }
}