/* Marken-Seiten: Logo-Rotation im rechten Split-Header */
.page-hero--brands .page-hero__media--logos {
  position: relative;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 45%, rgba(183, 214, 58, 0.16), transparent 52%),
    var(--color-asphalt-2);
}

.page-hero--brands .page-hero__media--logos::before {
  content: '';
  position: absolute;
  inset: 1.5rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: var(--radius-xl);
  pointer-events: none;
}

.page-hero--brands .brand-hero__logo {
  position: absolute;
  z-index: 1;
  display: block;
  width: min(76%, 360px);
  max-width: 360px;
  max-height: 46%;
  padding: 1rem;
  object-fit: contain;
  filter: brightness(0) invert(1);
  opacity: 0;
  visibility: hidden;
  transform: scale(0.94);
  transition: opacity 1s ease, transform 1s ease, visibility 0s linear 1s;
  pointer-events: none;
}

.page-hero--brands .brand-hero__logo.is-active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  transition: opacity 1s ease, transform 1s ease, visibility 0s linear 0s;
}

.page-hero--brands .hero__pause {
  z-index: 5;
}

@media (max-width: 860px) {
  .page-hero--brands.page-hero--split .page-hero__grid {
    min-height: auto;
  }

  .page-hero--brands .page-hero__media--split {
    aspect-ratio: 16 / 9;
  }

  .page-hero--brands .page-hero__media--logos::before {
    inset: 1rem;
  }

  .page-hero--brands .brand-hero__logo {
    width: min(72%, 280px);
    max-height: 46%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-hero--brands .brand-hero__logo {
    transition: none;
    transform: none;
  }
}
