/* Design "Elektrosucht Bewegung": lebendiger Hintergrund hinter der normal scrollenden Seite. Texte bleiben lesbar (Hintergrund gedimmt, liegt unter dem Inhalt). */
.bw-layer{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.bw-layer canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.bw-p{position:absolute;width:min(80vw,780px);aspect-ratio:4/5;background-size:cover;background-position:center;opacity:0;mix-blend-mode:screen;
  filter:grayscale(.75) contrast(1.15) brightness(.85);will-change:transform,opacity;
  -webkit-mask-image:radial-gradient(ellipse 46% 44% at 50% 50%,#000 22%,rgba(0,0,0,.55) 48%,transparent 74%);mask-image:radial-gradient(ellipse 46% 44% at 50% 50%,#000 22%,rgba(0,0,0,.55) 48%,transparent 74%)}
/* Reihenfolge: Hintergrundbilder < lebendiges Wesen < Inhalt (Text, Karten, Knöpfe) */
main .wrap,main .hero .inner,.site-foot,.marq{position:relative;z-index:3}
.hero .bg,.pagehead .bg{z-index:0}
.floatmark{display:none}
@media(prefers-reduced-motion:reduce){.bw-p{transition:none}}

/* Kopfbereiche (Header) lassen den lebendigen Hintergrund durchscheinen */
.hero .bg,.pagehead .bg{opacity:.4}
.hero,.pagehead{background:transparent}

/* Bewegte Kopfbereiche: die Bildfolge laeuft leise ueber dem Kopfbild */
canvas.bw-head{position:absolute;inset:0;width:100%;height:100%;z-index:1;opacity:.22;mix-blend-mode:screen;pointer-events:none;filter:saturate(.8) contrast(1.05)}
.hero .inner,.pagehead .wrap{position:relative;z-index:3}
/* Start: groesserer Kopfbereich */
.hero{min-height:94svh}
/* Laufband etwas tiefer, mit dezentem Muster */
.marq{margin-top:56px;background-image:linear-gradient(rgba(107,26,43,.9),rgba(107,26,43,.9)),url(/assets/img/pat-logo-50.png);background-size:auto,120px}
/* Fuss: durchscheinend mit zartem Kachelmuster, damit das Wesen auch dort sichtbar ist */
.site-foot{background-color:transparent;background-image:linear-gradient(rgba(11,9,9,.72),rgba(11,9,9,.82)),url(/assets/img/pat-damast-fein.webp);background-size:auto,420px}
/* Fuss liegt unter dem Wesen, damit es auch dort leuchtet (Text bleibt lesbar, die Punkte sind zart) */
main .wrap,.marq{z-index:3}
.site-foot{position:relative;z-index:1;background-image:linear-gradient(rgba(11,9,9,.55),rgba(11,9,9,.7)),url(/assets/img/pat-damast-fein.webp)}

/* Flaechen durchscheinend, damit das Wesen und das ES-Zeichen auch hinter Karten und Playern zu sehen sind */
.song,.player,.sup,.empty{background:rgba(26,22,23,.58)}
