.sponsors__section {
  position: relative;
  background: var(--kf-bg-dark);
  border-top: var(--kf-white-1);
  overflow: hidden;
  padding-bottom: 10rem;
  z-index: 1;
  position: relative;
}

.sponsors__section::before,
.sponsors__section::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    to right,
    var(--kf-white-1) 15%,
    var(--kf-white-2) 50%,
    var(--kf-white-1) 85%,
    transparent 100%
  );
  pointer-events: none;
}

.sponsors__section::before {
  top: 0;
}

.sponsors__section::after {
  bottom: 0;
}

.sponsors__header {
  padding: 7.2rem 8rem 0;
}

.sponsors__eyebrow {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  margin-bottom: 2.4rem;
  opacity: 0;
  transform: translateX(-1.4rem);
  transition:
    opacity var(--kf-dt-focus) var(--kf-ease),
    transform var(--kf-dt-focus) var(--kf-ease);
}

.sponsors__eyebrow-line {
  width: 2.8rem;
  height: 0.1rem;
  background: var(--kf-white-3);
  flex-shrink: 0;
}

.sponsors__eyebrow span:last-child {
  font-size: var(--kf-fs-sm);
  letter-spacing: var(--kf-ls-xll);
  text-transform: var(--kf-tu);
  color: var(--kf-white-3);
}

.sponsors__heading {
  margin: 0 0 2rem 0;
  display: flex;
  flex-direction: column;
}

.sponsors__heading-row {
  display: block;
  font-size: var(--kf-fs-xl);
  font-weight: var(--kf-fw-bold);
  line-height: 1;
  color: var(--kf-text-invert);
  opacity: 0;
  transform: translateY(4rem);
  transition:
    opacity var(--kf-dt-focus) var(--kf-ease),
    transform var(--kf-dt-focus) var(--kf-ease);
}

.sponsors__heading-row-muted {
  font-weight: var(--kf-fw-thin);
  font-style: italic;
  color: var(--kf-white-2);
}

.sponsors__section.is-revealed .sponsors__eyebrow {
  opacity: 1;
  transform: translateX(0);
}

.sponsors__section.is-revealed .sponsors__heading-row {
  opacity: 1;
  transform: translateY(0);
}

.sponsors__section.is-revealed .sponsors__heading-row:nth-child(2) {
  transition-delay: 0.1s;
}

.sponsors__track-wrap {
  position: relative;
  overflow: hidden;
  mask-image: linear-gradient(
    to right,
    transparent 0%,
    var(--kf-bg-dark) 16rem,
    var(--kf-bg-dark) calc(100% - 16rem),
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0%,
    var(--kf-bg-dark) 16rem,
    var(--kf-bg-dark) calc(100% - 16rem),
    transparent 100%
  );
}

.sponsors__track {
  display: flex;
  align-items: center;
  width: max-content;
  will-change: transform;
  animation: sponsors-scroll 36s linear infinite;
}

.sponsors__track.is-paused {
  animation-play-state: paused;
}

@keyframes sponsors-scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-25%);
  }
}

.sponsor__item {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.sponsor__link {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 6.4rem;
  outline: none;
  position: relative;
}

.sponsor__link:focus-visible .sponsor__inner {
  outline: 1.5px solid var(--kf-white-4);
  outline-offset: 8px;
  border-radius: var(--kf-rs);
}

.sponsor__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  transition:
    opacity var(--kf-dt-base) var(--kf-ease),
    transform var(--kf-dt-base) var(--kf-ease),
    filter var(--kf-dt-base) var(--kf-ease);
}

.sponsor__logo {
  height: 10rem;
  width: auto;
  max-width: 20rem;
  display: block;
  object-fit: contain;
  filter: brightness(0) invert(1) opacity(0.8);
  transition:
    filter var(--kf-dt-base) var(--kf-ease),
    transform var(--kf-dt-base) var(--kf-ease);
  user-select: none;
  pointer-events: none;
  -webkit-user-drag: none;
}

.sponsor__name-fallback {
  font-size: var(--kf-fs-md);
  font-weight: var(--kf-fw-medium);
  letter-spacing: var(--kf-ls-xl);
  color: var(--kf-white-4);
  white-space: nowrap;
  transition: color var(--kf-dt-base) var(--kf-ease);
}

.sponsor__divider {
  display: block;
  width: 1px;
  height: 2rem;
  background: var(--kf-white-1);
  flex-shrink: 0;
}

.sponsors__track:hover .sponsor__link:hover .sponsor__inner {
  opacity: 1;
  transform: scale(1.05);
}

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

@media (max-width: 1280px) {
  .sponsors__section {
    padding-bottom: 8rem;
  }

  .sponsors__header {
    padding: 6rem 5.2rem 0;
  }

  .sponsors__logo {
    height: 8rem;
    max-width: 16rem;
  }

  .sponsor__link {
    padding: 0 4.8rem;
  }

  .sponsors__track-wrap {
    mask-image: linear-gradient(
      to right,
      transparent 0%,
      var(--kf-bg-dark) 12rem,
      var(--kf-bg-dark) calc(100% - 12rem),
      transparent 100%
    );
    -webkit-mask-image: linear-gradient(
      to right,
      transparent 0%,
      var(--kf-bg-dark) 12rem,
      var(--kf-bg-dark) calc(100% - 12rem),
      transparent 100%
    );
  }
}

@media (max-width: 1024px) {
  .sponsors__section {
    padding-bottom: 6.4rem;
  }

  .sponsors__header {
    padding: 4.8rem 3.2rem 0;
  }

  .sponsors__logo {
    height: 6.4rem;
    max-width: 14rem;
  }

  .sponsor__link {
    padding: 0 3.6rem;
  }

  .sponsors__track-wrap {
    mask-image: linear-gradient(
      to right,
      transparent 0%,
      var(--kf-bg-dark) 8rem,
      var(--kf-bg-dark) calc(100% - 8rem),
      transparent 100%
    );
    -webkit-mask-image: linear-gradient(
      to right,
      transparent 0%,
      var(--kf-bg-dark) 8rem,
      var(--kf-bg-dark) calc(100% - 8rem),
      transparent 100%
    );
  }

  .sponsors__eyebrow {
    margin-bottom: 2rem;
  }
}

@media (max-width: 768px) {
  .sponsors__section {
    padding-bottom: 5.6rem;
  }

  .sponsprs__header {
    padding: 4rem 2.4rem 0;
  }

  .sponsors__heading {
    margin: 0 0 1.6rem 0;
  }

  .sponsors__logo {
    height: 5.6rem;
    max-width: 13rem;
  }

  .sponsor__link {
    padding: 0 2.8rem;
  }

  .sponsor__divider {
    height: 1.6rem;
  }

  .sponsors__track-wrap {
    mask-image: linear-gradient(
      to right,
      transparent 0%,
      var(--kf-bg-dark) 6rem,
      var(--kf-bg-dark) calc(100% - 6rem),
      transparent 100%
    );
    -webkit-mask-image: linear-gradient(
      to right,
      transparent 0%,
      var(--kf-bg-dark) 6rem,
      var(--kf-bg-dark) calc(100% - 6rem),
      transparent 100%
    );
  }

  .sponsors__eyebrow {
    gap: 1.2rem;
    margin-bottom: 1.6rem;
  }
}

@media (max-width: 480px) {
  .sponsors__section {
    padding-bottom: 4.8rem;
  }

  .sponsors__header {
    padding: 3.2rem 2rem 0;
  }

  .sponsors__heading {
    margin: 0 0 1.4rem 0;
  }

  .sponsor__logo {
    height: 4.8rem;
    max-width: 12rem;
  }

  .sponsor__link {
    padding: 0 2rem;
  }

  .sponsor__divider {
    height: 1.4rem;
  }

  .sponsors__track {
    animation: sponsors-scroll 15s linear infinite;
  }

  .sponsors__track-wrap {
    mask-image: linear-gradient(
      to right,
      transparent 0%,
      var(--kf-bg-dark) 4rem,
      var(--kf-bg-dark) calc(100% - 4rem),
      transparent 100%
    );
    -webkit-mask-image: linear-gradient(
      to right,
      transparent 0%,
      var(--kf-bg-dark) 4rem,
      var(--kf-bg-dark) calc(100% - 4rem),
      transparent 100%
    );
  }

  .sponsors__eyebrow {
    gap: 1rem;
    margin-bottom: 1.4rem;
  }

  .sponsors__eyebrow-line {
    width: 2rem;
  }
}