/* Bild-Slider (wiederverwendbare Komponente, Vorbild: Bewertungs-Slider auf runnerswiss.ch).
   Markup und Skript: assets/js/slider.js. Dauer pro Bild: data-duration am .bslider (ms, Standard 5000).
   Überblenden: --bslider-fade (800 ms). Farben und Easing kommen aus style.css (--text, --surface, --ease-out). */
.bslider { --bslider-fade: .8s; }
.bslider__list { position: relative; }
.bslide { position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden; z-index: 0; transition: opacity var(--bslider-fade) var(--ease), visibility 0s var(--bslider-fade); }
.bslide.is-on { opacity: 1; visibility: visible; z-index: 2; transition-delay: 0s; }
.bslide.is-prev { opacity: 1; visibility: visible; z-index: 1; transition: none; } /* bleibt stehen, bis das neue Bild darüber eingeblendet ist */
.bslide img { display: block; }
.bslider__dots { display: flex; align-items: center; gap: 0; margin: 14px 0 -9px -9px; }
.bslider__dots[hidden] { display: none; }
.bdot { all: unset; box-sizing: content-box; cursor: pointer; display: block; padding: 9px; -webkit-tap-highlight-color: transparent; }
.bdot i { display: block; width: 6px; height: 6px; border-radius: 3px; overflow: hidden; background: color-mix(in srgb, var(--text) 20%, transparent); transition: width .4s var(--ease-out); }
.bdot.is-on i { width: 28px; }
.bdot b { display: block; height: 100%; background: var(--text); transform: scaleX(0); transform-origin: left; }
.bdot:focus-visible { outline: 2px solid var(--red-text); outline-offset: 2px; border-radius: 3px; }
@media (prefers-reduced-motion: reduce) {
  .bslide, .bslide.is-on { transition: none !important; }
  .bdot i { transition: none; }
  .bdot.is-on b { transform: none; }
}