.partners {
  grid-column:2;
  grid-row:3;
  min-width:0;
  align-self:start;
  margin-top:48px;
  overflow:clip
}
.partners h3 {
  font-size:20px;
  line-height:1.3
}
.partners__marquees {
  overflow:clip;
  margin-top:16px;
  display:flex;
  flex-direction:column;
  gap:12px;
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)
}
.partners__row {
  --partner-size:100px;
  --partner-gap:32px;
  --partner-distance:792px;
  display:flex;
  gap:var(--partner-gap);
  width:max-content;
  animation:partner-left 28s linear infinite;
  will-change:transform
}
.partners__row:nth-child(2) {
  animation-name:partner-right
}
.partners__row:nth-child(3) {
  animation-duration:32s
}
.partners__row img {
  width:var(--partner-size);
  height:var(--partner-size);
  object-fit:contain;
  flex:none
}
.partners:hover .partners__row,.partners:focus-within .partners__row {
  animation-play-state:paused
}
.partners.is-paused .partners__row {
  animation-play-state:paused
}
@keyframes partner-left {
  from {
    transform:translateX(0)
  }
  to {
    transform:translateX(calc(-1 * var(--partner-distance)))
  }
}
@keyframes partner-right {
  from {
    transform:translateX(calc(-1 * var(--partner-distance)))
  }
  to {
    transform:translateX(0)
  }
}
@media(max-width:767px) {
  .partners {
    margin:0;
    padding:0 0 40px;
    overflow:clip
  }
  .partners h3 {
    padding:0 20px;
    font-size:22px
  }
  .partners__marquees {
    margin-top:20px;
    gap:10px
  }
  .partners__row {
    --partner-size:56px;
    --partner-gap:18px;
    --partner-distance:444px;
    animation-duration:22s
  }
  .partners__row:nth-child(3) {
    animation-duration:26s
  }
}
