.brand-marquee {
  --brand-marquee-gap: clamp(32px, 4vw, 64px);
  background: var(--rc-ivory);
  border-top: 1px solid var(--rc-line);
  color: var(--rc-ink);
  padding-block: 24px 32px;
}
.brand-marquee + .site-footer { border-top: 0; }
.brand-marquee__heading {
  align-items: center;
  display: flex;
  justify-content: space-between;
  margin: 0 auto 20px;
  max-width: 1440px;
  padding-inline: 5vw;
}
.brand-marquee__heading h2 {
  font: 400 .65rem/1.5 "Helvetica Neue", Helvetica, sans-serif;
  letter-spacing: .25em;
  margin: 0;
  text-transform: uppercase;
}
.brand-marquee__viewport:focus-visible { outline: 2px solid var(--rc-ink); outline-offset: 4px; }
.brand-marquee__viewport { cursor: grab; overflow-x: auto; scrollbar-width: thin; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.brand-marquee__viewport.is-dragging { cursor: grabbing; }
.brand-marquee.is-ready .brand-marquee__viewport { overflow: hidden; }
.brand-marquee__track { display: flex; width: max-content; }
.brand-marquee__group {
  align-items: center;
  display: flex;
  flex: 0 0 auto;
  gap: var(--brand-marquee-gap);
  list-style: none;
  margin: 0;
  padding: 0 var(--brand-marquee-gap) 0 0;
}
.brand-marquee__group li {
  align-items: center;
  display: flex;
  flex: 0 0 clamp(150px, 16vw, 200px);
  height: 112px;
  justify-content: center;
  width: clamp(150px, 16vw, 200px);
}
.brand-marquee__group img { display: block; filter: grayscale(1); height: 100%; max-height: 100px; object-fit: contain; transition: filter .2s ease; width: 100%; }
.brand-marquee__group li:hover img { filter: grayscale(0); }
.brand-marquee.is-ready .brand-marquee__track {
  animation: brand-marquee-scroll var(--brand-marquee-duration, 120s) linear infinite;
}
.brand-marquee__viewport:hover .brand-marquee__track,
.brand-marquee__viewport.is-dragging .brand-marquee__track,
.brand-marquee__viewport:focus-within .brand-marquee__track { animation-play-state: paused; }
@keyframes brand-marquee-scroll { to { transform: translateX(-50%); } }
@media (max-width: 799px) {
  .brand-marquee { padding-block: 20px 24px; }
  .brand-marquee__heading { margin-bottom: 12px; padding-inline: 6vw; }
  .brand-marquee__group li { height: 88px; }
  .brand-marquee__group img { max-height: 80px; }
}
@media (prefers-reduced-motion: reduce) {
  .brand-marquee__group img { transition: none; }
  .brand-marquee.is-ready .brand-marquee__track { animation: none; }
  .brand-marquee.is-ready .brand-marquee__viewport { overflow-x: auto; }
  .brand-marquee__group[aria-hidden="true"] { display: none; }
}