/* ============================================================
   SCHWIDER GBR — Bewertungs-Diashow (§0e-119)
   Ziehende Karten-Spur statt starres 3er-Grid. Nur Zitate im Wortlaut,
   kein Gesamtwert / keine Sternezahl / keine Anzahl (Profil steht bei
   3,7★ aus 7 Berichten — siehe data/bewertungen.json).
   ============================================================ */

.bewertungen {
  padding: clamp(3.6rem, 8vw, 6.4rem) 0;
  overflow: hidden;
}

.bewertungen__kopf {
  margin-bottom: clamp(2rem, 4vw, 3rem);
}

.bewertungen__bahn {
  position: relative;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(
    90deg,
    transparent 0,
    #000 var(--rand),
    #000 calc(100% - var(--rand)),
    transparent 100%
  );
  mask-image: linear-gradient(
    90deg,
    transparent 0,
    #000 var(--rand),
    #000 calc(100% - var(--rand)),
    transparent 100%
  );
}

.bewertungen__spur {
  display: flex;
  gap: 0;
  width: max-content;
  padding: 0.25rem var(--rand);
  animation: bewertungen-zug 38s linear infinite;
}

.bewertungen__bahn.ist-pausiert .bewertungen__spur,
.bewertungen__bahn:focus-within .bewertungen__spur {
  animation-play-state: paused;
}

@media (hover: hover) and (pointer: fine) {
  .bewertungen__bahn:hover .bewertungen__spur {
    animation-play-state: paused;
  }
}

@keyframes bewertungen-zug {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

.bewertungen__karte {
  flex: 0 0 auto;
  width: min(78vw, 380px);
  background: none;
  border: 0;
  border-left: 1px solid var(--kante);
  border-radius: 0;
  padding: 0.2rem clamp(1.8rem, 3vw, 2.4rem);
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
}

.bewertungen__karte:first-child {
  border-left: 0;
  padding-left: 0;
}

.bewertungen__zitat {
  font-family: var(--f-display);
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  font-weight: 500;
  line-height: 1.5;
  color: var(--hallenweiss);
  margin: 0;
  max-width: none;
}

.bewertungen__zitat::before {
  content: "\201E";
}
.bewertungen__zitat::after {
  content: "\201C";
}

.bewertungen__fuss {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  font-size: var(--t-caption);
  color: var(--zinn);
}

.bewertungen__fuss--quelle-only {
  justify-content: flex-end;
}

.bewertungen__autor {
  color: var(--hallenweiss);
  font-weight: 600;
}

.bewertungen__quelle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  font-size: 0.7rem;
}

.bewertungen__quelle svg {
  width: 13px;
  height: 13px;
}

/* Statisches Grid ohne Bewegung/Duplikat-Spur */
@media (prefers-reduced-motion: reduce) {
  .bewertungen__bahn {
    overflow: visible;
    -webkit-mask-image: none;
    mask-image: none;
  }
  .bewertungen__spur {
    animation: none !important;
    flex-wrap: wrap;
    width: auto;
    padding: 0 var(--rand);
  }
  .bewertungen__karte {
    width: min(100%, 400px);
  }
  .bewertungen__karte[aria-hidden="true"] {
    display: none;
  }
}


/* Sterne je Karte (Hamada 17.08.2026: „Mach die 5 Sterne sichtbar") */
.bewertungen__sterne {
  display: block;
  color: var(--bernstein);
  font-size: 0.95rem;
  letter-spacing: 0.22em;
  margin-bottom: 0.65rem;
}
.bewertungen__stern--leer {
  opacity: 0.28;
}
.bewertungen__sterne-zahl {
  letter-spacing: 0;
  font-size: 0.8rem;
  color: var(--zinn);
  margin-left: 0.3em;
}

/* ============================================================
   „Stimmen" v2 (Hamada 17.08.2026): Bewertungs-Diashow direkt
   unterm Head — editoriale Groß-Zitat-Bühne nach Skill
   bewertungs-widget (Zitat groß, kein Karten-Grid), reine
   CSS-Crossfade-Rotation, 8 Folien × 6 s = 48 s Umlauf.
   ============================================================ */
.stimmen {
  padding: 5rem var(--rand) 4.5rem;
  border-bottom: 1px solid var(--kante);
}
.stimmen__innen {
  display: grid;
  grid-template-columns: minmax(15rem, 1fr) 2fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: start;
  max-width: 78rem;
  margin-inline: auto;
}
.stimmen__wert {
  display: flex;
  align-items: baseline;
  gap: 0.7rem;
  margin-top: 1.1rem;
}
.stimmen__wert-zahl {
  font-family: var(--f-display);
  font-weight: 500;
  font-size: clamp(3rem, 5.5vw, 4.4rem);
  line-height: 1;
}
.stimmen__wert-sterne {
  color: var(--bernstein);
  font-size: clamp(1.05rem, 1.6vw, 1.35rem);
  letter-spacing: 0.2em;
}
.stimmen__stern--teil {
  opacity: 0.35;
}
.stimmen__zeile {
  margin-top: 0.9rem;
  color: var(--zinn);
  font-size: 0.95rem;
  max-width: 26ch;
}
.stimmen__zeile a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}
.stimmen__pruefsatz {
  margin-top: 1.3rem;
  font-size: 0.78rem;
  line-height: 1.55;
  color: var(--zinn);
  opacity: 0.75;
  max-width: 30ch;
}
.stimmen__buehne {
  position: relative;
  min-height: 17rem;
}
.stimmen__folie {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  animation: stimmen-rotation 48s linear infinite;
  animation-delay: calc(var(--folie) * 6s);
  pointer-events: none;
}
.stimmen__zitat {
  font-family: var(--f-display);
  font-weight: 500;
  font-size: clamp(1.35rem, 2.6vw, 2.1rem);
  line-height: 1.32;
  letter-spacing: -0.01em;
  margin: 0;
  max-width: 24ch;
  text-wrap: balance;
}
.stimmen__fuss {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  margin-top: 1.4rem;
}
.stimmen__sterne {
  color: var(--bernstein);
  letter-spacing: 0.22em;
  font-size: 0.9rem;
}
.stimmen__autor {
  font-size: 0.92rem;
}
.stimmen__quelle {
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--zinn);
}
@keyframes stimmen-rotation {
  0% { opacity: 0; transform: translateY(0.6rem); }
  1.5% { opacity: 1; transform: translateY(0); }
  11% { opacity: 1; }
  12.5% { opacity: 0; transform: translateY(-0.4rem); }
  100% { opacity: 0; }
}
@media (max-width: 860px) {
  .stimmen { padding-block: 3.5rem 3rem; }
  .stimmen__innen { grid-template-columns: 1fr; gap: 2.2rem; }
  .stimmen__buehne { min-height: 21rem; }
}
@media (prefers-reduced-motion: reduce) {
  .stimmen__folie { animation: none; }
  .stimmen__folie[style="--folie: 0"] { position: relative; opacity: 1; }
}

/* v3 (Hamada 17.08.2026: „Die Diashow soll automatisch nach RECHTS ziehen!"):
   Ersetzt die Crossfade-Bühne durch eine kontinuierlich nach RECHTS laufende
   Bahn großer Zitat-Karten (Duplikat-Satz = nahtloser Umlauf, Hover pausiert). */
.stimmen__innen--bahn {
  grid-template-columns: 1fr;
  max-width: none;
}
.stimmen__innen--bahn .stimmen__aggregat {
  max-width: 78rem;
  margin-inline: auto;
  width: 100%;
}
.stimmen__bahn {
  overflow: hidden;
  margin-top: 0.5rem;
  /* volle Viewportbreite aus dem gepolsterten Container ausbrechen */
  margin-inline: calc(var(--rand) * -1);
  padding-block: 0.5rem;
  -webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
}
.stimmen__spur {
  display: flex;
  gap: clamp(2rem, 4vw, 3.5rem);
  width: max-content;
  padding-inline: 1rem;
  animation: stimmen-rechts 70s linear infinite;
}
.stimmen__bahn:hover .stimmen__spur {
  animation-play-state: paused;
}
/* Start bei -50% (Duplikat-Satz links), Lauf nach RECHTS auf 0 → nahtloser Umlauf */
@keyframes stimmen-rechts {
  from { transform: translateX(-50%); }
  to   { transform: translateX(0); }
}
.stimmen__karte {
  margin: 0;
  width: clamp(19rem, 30vw, 27rem);
  flex-shrink: 0;
}
.stimmen__karte .stimmen__zitat {
  font-size: clamp(1.05rem, 1.5vw, 1.3rem);
  line-height: 1.42;
  max-width: none;
}
.stimmen__karte .stimmen__sterne {
  display: block;
  margin-bottom: 0.7rem;
}
.stimmen__karte .stimmen__fuss {
  margin-top: 0.9rem;
}
@media (prefers-reduced-motion: reduce) {
  .stimmen__spur { animation: none; }
  .stimmen__bahn { overflow-x: auto; mask-image: none; -webkit-mask-image: none; }
  .stimmen__karte[aria-hidden="true"] { display: none; }
}

/* v4 (Hamada 17.08.2026: „ES SOLL ALLES IN EINER REIHE SEIN!"):
   Aggregat und laufende Bahn in EINER Zeile — links der feste 4,6-Block,
   rechts ziehen die Zitat-Karten in derselben Reihe nach rechts durch. */
.stimmen {
  padding-block: 2.6rem 2.4rem;
}
.stimmen__innen--bahn {
  display: flex;
  align-items: center;
  gap: clamp(1.6rem, 3vw, 3rem);
}
.stimmen__innen--bahn .stimmen__aggregat {
  flex: 0 0 auto;
  width: auto;
  max-width: 15.5rem;
  margin-inline: 0;
}
.stimmen__innen--bahn .stimmen__aggregat .eyebrow { display: none; }
.stimmen__wert { margin-top: 0; }
.stimmen__wert-zahl { font-size: clamp(2.3rem, 3.4vw, 3.1rem); }
.stimmen__zeile { margin-top: 0.5rem; font-size: 0.82rem; max-width: 22ch; }
.stimmen__pruefsatz { margin-top: 0.6rem; font-size: 0.62rem; max-width: 24ch; }
.stimmen__bahn {
  flex: 1 1 auto;
  min-width: 0;
  margin-top: 0;
  margin-inline: 0 calc(var(--rand) * -1);
  border-left: 1px solid var(--kante);
  padding-left: clamp(1.4rem, 2.5vw, 2.4rem);
  -webkit-mask-image: linear-gradient(to right, transparent, #000 3%, #000 93%, transparent);
  mask-image: linear-gradient(to right, transparent, #000 3%, #000 93%, transparent);
}
.stimmen__karte {
  width: clamp(17rem, 24vw, 23rem);
}
.stimmen__karte .stimmen__zitat {
  font-size: 1.02rem;
  line-height: 1.4;
}
.stimmen__karte .stimmen__sterne { margin-bottom: 0.45rem; font-size: 0.8rem; }
.stimmen__karte .stimmen__fuss { margin-top: 0.55rem; }
@media (max-width: 860px) {
  .stimmen__innen--bahn { flex-direction: column; align-items: flex-start; gap: 1.4rem; }
  .stimmen__innen--bahn .stimmen__aggregat { max-width: none; }
  .stimmen__bahn { width: 100%; border-left: 0; padding-left: 0; margin-inline: calc(var(--rand) * -1); }
}

/* v4b (Hamada 17.08.2026: „UND ETWAS SCHNELLER NACH RECHTS ZIEHEN") */
.stimmen__spur { animation-duration: 38s; }

/* v4c (Mobil-Feinschliff 17.08.2026): auf schmalen Breiten kompaktere Karten +
   engerer Takt, damit die Reihe immer gefüllt wirkt (1,5 Karten sichtbar). */
@media (max-width: 860px) {
  .stimmen { padding-block: 2.1rem 1.9rem; }
  .stimmen__spur { gap: 1.3rem; animation-duration: 30s; }
  .stimmen__karte { width: 15.5rem; }
  .stimmen__karte .stimmen__zitat { font-size: 0.95rem; }
  .stimmen__pruefsatz { max-width: none; }
}
