.about-partners {
  padding-block: var(--space-partners-top) calc(var(--space-2xl) + var(--space-sm));
  overflow: hidden;
  background: var(--color-surface-dark);
  color: var(--color-on-accent);
}

.about-partners__heading { margin-block-end: calc(var(--space-xl) + var(--space-sm)); }

.about-partners__band {
  position: relative;
  padding-block: var(--space-lg);
  background: var(--color-background);
  isolation: isolate;
}

.about-partners__band::before,
.about-partners__band::after {
  position: absolute;
  z-index: 1;
  inset-inline: calc(-1 * var(--space-xl));
  block-size: var(--size-partner-curve);
  background: url('../../images/partners-curve.svg') center / 100% 100% no-repeat;
  content: '';
  pointer-events: none;
}

.about-partners__band::before { inset-block-start: calc(-1 * (var(--space-2xl) - var(--space-sm))); }
.about-partners__band::after { inset-block-end: calc(-1 * (var(--space-2xl) - var(--space-xs))); }

.about-partners__row {
  padding-block: var(--space-xs);
  padding-inline-start: var(--space-lg);
}

.about-partners__track {
  display: flex;
  inline-size: max-content;
  animation: brefex-partners-marquee var(--dur-partner-loop) linear infinite;
  will-change: transform;
}

.about-partners__row--reverse .about-partners__track { animation-direction: reverse; }

.about-partners__group {
  display: flex;
  flex: none;
  align-items: center;
  gap: var(--space-partner-column);
  padding-inline-end: var(--space-partner-column);
}

.about-partners__logo {
  flex: none;
  inline-size: var(--size-partner-logo);
  aspect-ratio: 127 / 73;
}

.about-partners__image {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

.about-partners__image--dark { filter: brightness(0); }

@keyframes brefex-partners-marquee {
  to { transform: translateX(-50%); }
}

@media (width <= 48rem) {
  .about-partners { padding-block-start: var(--space-2xl); }
  .about-partners__heading { margin-block-end: var(--space-xl); }
  .about-partners__row { padding-inline-start: var(--space-sm); }
  .about-partners__band { padding-block: var(--space-xl); }
}

@media (prefers-reduced-motion: reduce) {
  .about-partners__track { animation: none; }
}
