/* Die zwei Zwischensektionen auf der Startseite.
 *
 * Befund vom 25.08., gemessen bei 1440px:
 * Beide .art-hero-section-c hatten background-image: none. Nicht weil ein
 * Bild fehlte, sondern weil die Theme-Regeln daneben zielen:
 *
 *   .brxe-lxowps .brxe-oiihfv[data-query-loop-index="0"]   -> .brxe-oiihfv
 *                                                             existiert gar
 *                                                             nicht (0 Stueck)
 *   .brxe-lxowps .brxe-sevsvl[data-query-loop-index="0"]   -> nur innerhalb
 *                                                             @media max-width:991px
 *
 * Die echten Sektionen tragen .brxe-sevsvl und haben die Schleifen-Index 0
 * und 3. Auf dem Desktop griff also keine einzige Regel. Deshalb hier die
 * Zuordnung ausdruecklich und ohne Media-Query.
 *
 * !important, weil das Theme seine Regeln in einem <style>-Block nach
 * unseren Links wiederholt.
 */

/* Der eigentliche Stolperstein, gemessen am 25.08.:
 *
 *   .bricks-lazy-hidden { background-image: none !important; }
 *
 * Die Sektionen tragen diese Klasse dauerhaft. Der Lazy-Loader von Bricks
 * haette sie beim Sichtbarwerden entfernen muessen, tut es in dieser
 * statischen Ausleitung aber nie - es gibt kein WordPress, das den
 * passenden Beobachter startet. Ergebnis: die Regel bleibt fuer immer
 * scharf und loescht JEDEN Hintergrund, auch unseren.
 *
 * Nachgewiesen: classList.remove('bricks-lazy-hidden') im Browser laesst
 * das Bild sofort erscheinen. Deshalb hier die Klasse mitschreiben, damit
 * unsere Regel dieselbe Spezifitaet plus eins hat und gewinnt.
 */

/* WOLKENTEMPEL RAUS, auf Ansage vom 25.08.
 *
 * Das erste Zwischenband (Schleifen-Index 0) trug das Motiv "Tempel ueber
 * Wolken". Es ist raus. Weil das Band NUR aus diesem Bild bestand - kein
 * Text, kein Knopf, nachgemessen: innerText leer - wird die ganze Sektion
 * ausgeblendet. Nur das Bild zu entfernen wuerde einen leeren, dunklen
 * Streifen im Seitenfluss stehen lassen.
 *
 * Das zweite Band (Index 3, Rotunde) bleibt unveraendert.
 *
 * Die Sektion selbst kommt aus dem Bricks-Export und laesst sich dort
 * nicht sauber herausschneiden, deshalb hier per CSS. Die Klasse
 * .bricks-lazy-hidden wird mitgeschrieben, sonst gewinnt die Theme-Regel.
 */
/* V2, 25.08. abends: das Band ist ZURUECK, mit einem anderen Motiv.

   Am Vormittag war es ausgeblendet, weil der Wolkentempel raus sollte
   und ein Band ohne Bild nur ein dunkler Streifen gewesen waere. Jetzt
   traegt es das Plateau (idee-4-plateau.png, umgesetzt nach
   flaechen/kamui-band-archiv.jpg) und steht zwischen "Der Alltag" und
   dem Freigabeprinzip: die Pause zwischen Problem und Antwort. */
.art-hero-section-c[data-query-loop-index="0"],
.art-hero-section-c[data-query-loop-index="0"].bricks-lazy-hidden {
  background-image: url(flaechen/kamui-band-archiv.jpg) !important;
}

.art-hero-section-c[data-query-loop-index="3"],
.art-hero-section-c[data-query-loop-index="3"].bricks-lazy-hidden {
  background-image: url(flaechen/kamui-band-wasser.jpg) !important;
}

/* Haltung fuer das verbliebene Zwischenbild */
.art-hero-section-c[data-query-loop-index="3"] {
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll !important;
  position: relative !important;
}

/* Das Bild ist hell in der Mitte. Damit die Schrift darauf sicher
   traegt, legen wir einen Tuscheschleier darueber, der zu den Raendern
   hin aufmacht: das Motiv bleibt lesbar, der Text auch. */
.art-hero-section-c[data-query-loop-index="3"]::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    180deg,
    rgba(22, 27, 25, 0.55) 0%,
    rgba(22, 27, 25, 0.25) 45%,
    rgba(22, 27, 25, 0.65) 100%
  ) !important;
  pointer-events: none !important;
  z-index: 0 !important;
}

/* Der Inhalt muss ueber den Schleier. */
.art-hero-section-c[data-query-loop-index="3"] > * {
  position: relative !important;
  z-index: 1 !important;
}

/* Auf schmalen Fenstern die kleinere Fassung, spart Ladezeit. */
@media (max-width: 991px) {
  .art-hero-section-c[data-query-loop-index="3"] {
    background-image: url(flaechen/kamui-band-wasser-klein.jpg) !important;
  }
}
