/* ============================================================
   FRANKFURT 2042 — Atmosphären-Effekte site-weit
   Dauerregen (2 Ebenen) + Gewitterblitze auf JEDER Seite.
   Wird von fx-v2.js injiziert; auf der Startseite werden die
   dort bereits vorhandenen Effekte erkannt und NICHT doppelt
   erzeugt. prefers-reduced-motion deaktiviert alles.
   v3: Ebenen-Logik der Site beachtet — site.css legt #bg-stage
   (Slideshow) auf z-index:0 und hebt allen Inhalt (main, .page, …)
   auf z-index:1. Die Effekte liegen daher auf z-index:0 und werden
   per JS NACH #bg-stage in den DOM gehaengt: ueber den Bildern,
   unter Text/Reader/Inhalten. (z-index:-1 fiel hinter die Slideshow
   und war unsichtbar — Fehler aus v2.)
   ============================================================ */
.v2fx-rain{position:fixed;inset:-5%;pointer-events:none;z-index:0}
.v2fx-rain i{position:absolute;inset:0;background-repeat:repeat;display:block}
.v2fx-rain .r1{opacity:.10;
  background-image:linear-gradient(103deg, transparent 0 46%, rgba(200,215,240,.9) 46.5% 47%, transparent 47.5%);
  background-size:31px 90px;animation:v2fxr1 .55s linear infinite}
.v2fx-rain .r2{opacity:.07;
  background-image:linear-gradient(101deg, transparent 0 46%, rgba(170,190,220,.8) 46.5% 47.2%, transparent 48%);
  background-size:53px 160px;animation:v2fxr2 .9s linear infinite}
@keyframes v2fxr1{to{background-position:-14px 90px}}
@keyframes v2fxr2{to{background-position:-20px 160px}}

.v2fx-flash{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:0;
  background:radial-gradient(55% 46% at var(--fx,68%) 0%,
    rgba(215,228,255,.5), rgba(150,180,255,.16) 42%, transparent 72%)}
.v2fx-flash.go{animation:v2fxflash 1.1s ease-out}
@keyframes v2fxflash{0%{opacity:0}6%{opacity:.9}12%{opacity:.1}20%{opacity:.7}
  30%{opacity:.15}38%{opacity:.35}100%{opacity:0}}

@media (prefers-reduced-motion:reduce){
  .v2fx-rain,.v2fx-flash{display:none !important}
}

/* Footer (falls ausserhalb von main) auf Inhalts-Ebene heben,
   damit die Effekte niemals ueber Footer-Text laufen */
footer, .site-footer{ position:relative; z-index:1; }
