.brand-carousel {
  --brand-columns: 4;
  overflow-x: auto;
  margin-top: 16px;
}
.brand-carousel.is-rotating { overflow: hidden; }
.brand-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: calc(100% / var(--brand-columns));
}
.brand-track a {
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 78px;
  padding: 12px clamp(10px, 3vw, 48px);
  background: var(--paper);
}
.brand-track a:focus-visible { outline-offset: -3px; }
.brand-track img {
  width: min(100%, 142px);
  height: 46px;
  object-fit: contain;
  mix-blend-mode: multiply;
}
@media (max-width: 880px) { .brand-carousel { --brand-columns: 3; } }
@media (max-width: 560px) { .brand-carousel { --brand-columns: 2; } }