/* =====================================================================
   Laufende Google-Rezensionen (Stimmen-Band) - uebernommen aus der
   Masterclass-Seite, damit die Startseite dasselbe Band zeigt
   (Kadir, 05.11.2026: "wo auf der Startseite sind die Google-Rezensionen
   darunter?"). Markup: <div class="mc-band" data-band> mit .mc-stimme-
   Kacheln, Google-Zeile, Dialog und JSON; Skript: assets/stimmen-band.js.
   Regeln 1:1 aus dem Browser der Masterclass-Seite ausgelesen.
   ===================================================================== */

.mc-wrap { max-width: var(--seitenbreite, 1600px); margin: 0 auto; padding-left: clamp(2rem, 3vw, 3.5rem); padding-right: clamp(2rem, 3vw, 3.5rem); }

/* Band: Kacheln nebeneinander, Rand links/rechts weich ausgeblendet */
.mc-band { overflow: auto hidden; scrollbar-width: none; margin: 0 calc(-1 * clamp(2rem, 3vw, 3.5rem)); padding: 0 clamp(2rem, 3vw, 3.5rem); }
.mc-band::-webkit-scrollbar { display: none; }
.mc-band--laeuft { overflow: hidden; -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); }
.mc-band__spur { display: flex; gap: 1.5rem; width: max-content; }
.mc-band--laeuft .mc-band__spur { animation: mc-band var(--mc-band-dauer, 72s) linear infinite; }
.mc-band--laeuft:hover .mc-band__spur, .mc-band--laeuft:focus-within .mc-band__spur, .mc-band--pause .mc-band__spur { animation-play-state: paused; }
@keyframes mc-band {
  0% { transform: translateX(0); }
  100% { transform: translateX(calc(-50% - 0.75rem)); }
}
@media (prefers-reduced-motion: reduce) {
  .mc-band--laeuft .mc-band__spur { animation: none; }
  .mc-band--laeuft { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
}

/* Kacheln */
.mc-band .mc-stimme { flex: 0 0 auto; width: clamp(300px, 80vw, 440px); display: flex; }
.mc-band .mc-stimme__inhalt { display: flex; flex-direction: column; width: 100%; }
.mc-band .mc-stimme__wer { margin-top: auto; }
.mc-band .mc-stimme__mehr { align-self: flex-start; text-align: left; }
.mc-stimme { border: 1px solid rgba(255,255,255,0.10); background: rgba(255,255,255,0.05); padding: clamp(1.5rem, 3vw, 2rem); position: relative; }
.mc-stimme__sterne { color: #E3B94D !important; letter-spacing: 0.1em; margin: 0 0 0.9rem; font-size: 0.875rem; }
.mc-stimme__text { margin: 0 0 1.25rem; color: #FFFFFF; }
.mc-stimme__auszug { color: rgba(255,255,255,0.65); margin: 0 0 1.25rem; }
.mc-stimme__wer { display: flex; align-items: center; gap: 0.75rem; margin: 0; }
.mc-stimme__wer strong { display: block; font-weight: 600; font-size: 0.9375rem; }
.mc-stimme__wer span { display: block; font-size: 0.8125rem; color: rgba(255,255,255,0.55); }
.mc-stimme__rolle { font-style: normal; }
.mc-stimme__mehr { background: none; border: 0; padding: 0; margin: 1rem 0 0; color: #D9B38C; font: inherit; font-size: 0.875rem; cursor: pointer; text-decoration: underline; text-decoration-color: rgba(217,179,140,0.5); text-underline-offset: 4px; }
.mc-stimme__mehr:hover { text-decoration-color: #D9B38C; }

/* Google-Zeile unter dem Band */
.mc-band__google { margin: 2rem 0 0; color: rgba(255,255,255,0.65); font-size: 0.9375rem; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; }
.mc-band__google .mc-stimme__sterne { margin: 0; }
.mc-band__google strong { color: #FFFFFF; font-weight: 600; }
.mc-band__google a { color: #D9B38C; }

/* Dialog "Ganze Rezension lesen" */
.mc-dialog { border: 1px solid rgba(255,255,255,0.14); background: #111111; color: #FFFFFF; padding: 0; max-width: 640px; width: calc(100% - 2rem); }
.mc-dialog::backdrop { background: rgba(0,0,0,0.72); }
.mc-dialog__innen { padding: clamp(1.5rem, 4vw, 2.5rem); }
.mc-dialog__kopf { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; margin: 0 0 1.25rem; }
.mc-dialog__kopf .mc-stimme__sterne { margin-bottom: 0.5rem; }
.mc-dialog__titel { margin: 0; font-size: 0.9375rem; color: rgba(255,255,255,0.65); }
.mc-dialog__titel strong { color: #FFFFFF; font-weight: 600; }
.mc-dialog__schliessen { flex-shrink: 0; background: none; color: #FFFFFF; cursor: pointer; border: 1px solid rgba(255,255,255,0.3); border-radius: 9999px; width: 2.25rem; height: 2.25rem; font-size: 1.375rem; line-height: 1; }
.mc-dialog__schliessen:hover { border-color: #FFFFFF; }
.mc-dialog__text p { margin: 0 0 1rem; line-height: 1.7; color: rgba(255,255,255,0.85); font-size: 1.0625rem; }
.mc-dialog__quelle { margin: 1.5rem 0 0 !important; font-size: 0.875rem !important; }
.mc-dialog__quelle a { color: #D9B38C; }