.logo-slider {
  overflow:hidden;
  border-block:1px solid var(--line);
  background:#fff
}
.logo-slider-inner {
  display:flex;
  width:max-content;
  padding:22px 0;
  animation:logo-scroll 26s linear infinite;
  will-change:transform
}
.logo-slider-group {
  display:flex;
  align-items:center;
  justify-content:space-around;
  gap:32px;
  min-width:100vw;
  padding:0 24px;
  flex:none
}
.logo-item {
  display:inline-flex;
  align-items:center;
  gap:11px;
  opacity:.55;
  transition:opacity .2s ease,transform .2s ease
}
.logo-item:hover {
  opacity:.92;
  transform:translateY(-2px)
}
.logo-item img {
  width:22px;
  height:22px;
  object-fit:contain
}
.logo-item span {
  white-space:nowrap;
  color:var(--ink);
  font:600 17px/1 Manrope,sans-serif;
  letter-spacing:-.025em
}
.development-logo-slider {
  background:#0d1016;
  border-color:rgba(255,255,255,.16)
}
.development-logo-slider .logo-item {
  opacity:1
}
.development-logo-slider .logo-item:hover {
  opacity:1
}
.development-logo-slider .logo-item img {
  filter:brightness(0) invert(1) !important
}
.development-logo-slider .logo-item span {
  color:#fff;
  font-weight:650;
  text-shadow:0 0 18px rgba(255,255,255,.2)
}
@keyframes logo-scroll {
  from {
    transform:translateX(0)
  }
  to {
    transform:translateX(-50%)
  }
}
@media(max-width:600px) {
  .logo-slider-group {
    gap:30px;
    padding-inline:18px
  }
  .logo-slider-inner {
    padding:18px 0
  }
  .logo-item span {
    font-size:15px
  }
  .logo-item img {
    width:20px;
    height:20px
  }
}
@media(prefers-reduced-motion:reduce) {
  .logo-slider-inner {
    animation:none;
    transform:none;
    flex-wrap:wrap;
    width:auto
  }
  .logo-slider-group[aria-hidden="true"] {
    display:none
  }
  .logo-slider-group {
    min-width:0;
    flex-wrap:wrap;
    padding:18px 24px
  }
}