/* Logo-Laufband: endloses Band aus Kunden- bzw. Partnerlogos.
   Stellschrauben als Custom Properties auf .logoband (vom Widget gesetzt). */
.logoband {
  --logoband-hoehe: 32px;          /* optische Grundhöhe eines Wortlogos */
  --logoband-abstand: 40px;        /* Abstand zwischen zwei Logos */
  --logoband-rand: 10%;            /* weicher Auslauf links/rechts */
  --logoband-deckkraft: .7;
  --logoband-deckkraft-hover: 1;
  position: relative;
  width: 100%;
}
.logoband__fenster {
  overflow: hidden;
  padding-block: 8px;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 var(--logoband-rand), #000 calc(100% - var(--logoband-rand)), transparent 100%);
          mask-image: linear-gradient(90deg, transparent 0, #000 var(--logoband-rand), #000 calc(100% - var(--logoband-rand)), transparent 100%);
}
.logoband__spur {
  display: flex;
  align-items: center;
  width: max-content;
  margin: 0;
  padding: 0;
  list-style: none;
}
/* Astra setzt .entry-content ul { padding-left: 20px }; das verschöbe das Band und ließe die Schleife ruckeln */
.entry-content .logoband__spur { padding: 0; }
.logoband.ist-bereit .logoband__spur {
  animation: logoband-lauf var(--logoband-dauer, 60s) linear infinite;
}
.logoband[data-richtung="rechts"] .logoband__spur {
  animation-direction: reverse;
}
.logoband[data-hover-pause="ja"] .logoband__fenster:hover .logoband__spur,
.logoband.ist-pausiert .logoband__spur {
  animation-play-state: paused;
}
@keyframes logoband-lauf {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(-50%, 0, 0); }
}

/* Ein Logo: feste Box, das Bild wird darin auf seinen Inhalt zugeschnitten */
.logoband__logo {
  flex: 0 0 auto;
  margin: 0;
  padding-inline: calc(var(--logoband-abstand) / 2);
  list-style: none;
}
.logoband__logo a {
  display: block;
  outline-offset: 4px;
}
.logoband__box {
  position: relative;
  display: block;
  width: var(--lb-w, auto);
  height: var(--lb-h, var(--logoband-hoehe));
  overflow: hidden;
  opacity: var(--logoband-deckkraft);
  transition: opacity .3s ease;
}
.logoband__logo:hover .logoband__box,
.logoband__logo a:focus-visible .logoband__box {
  opacity: var(--logoband-deckkraft-hover);
}
.logoband__box img {
  display: block;
  max-width: none;
  height: 100%;
  width: auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
/* Zuschnitt nach Messung (Werte in Prozent der Box) */
.logoband__box.ist-vermessen img {
  position: absolute;
  left: var(--lb-x);
  top: var(--lb-y);
  width: var(--lb-iw);
  height: var(--lb-ih);
}

/* Farbmodus Weiß: einheitliche weiße Silhouette.
   Logos mit deckendem Hintergrund stellt das Skript vorher frei (transparente Kopie). */
/* Kein Eckenradius (übersteuert den globalen Bildradius des Kits) */
.logoband .logoband__box img { border-radius: 0; }
.logoband--weiss .logoband__box img { filter: brightness(0) invert(1); }
/* Farbmodus Graustufen */
.logoband--grau .logoband__box img { filter: grayscale(1); }
/* Deckendes Logo, das nicht freigestellt werden konnte: lieber verbergen als Kasten zeigen */
.logoband--weiss .ist-deckend:not(.ist-freigestellt),
.logoband--grau .ist-deckend:not(.ist-freigestellt) { visibility: hidden; }

/* Reduzierte Bewegung: kein Laufband, stattdessen wischbare Reihe */
@media (prefers-reduced-motion: reduce) {
  .logoband .logoband__spur { animation: none !important; }
  .logoband__fenster {
    overflow-x: auto;
    scroll-snap-type: x proximity;
    -webkit-mask-image: none;
            mask-image: none;
  }
  .logoband__logo { scroll-snap-align: center; }
  .logoband__logo[aria-hidden="true"] { display: none; }
}