/* ritzy Kursverwaltung — Seiten-Banner (global, site-weit)
   ------------------------------------------------------------------
   Diese Datei wird auf ALLEN Frontend-Seiten geladen (Assets::BANNER),
   nicht nur dort, wo ein ritzy-Widget steht — die Titel-Banner der
   Unterseiten sind reine Elementor-/Theme-Elemente ohne ritzy-Markup.

   Alle Titel-Banner (Finanzierung, Kontakt, Über uns, Agenda …) sind
   Elementor-Container mit Hintergrundbild, die ein Breadcrumb-Widget
   enthalten. Genau daran erkennen wir sie über :has() — dadurch treffen
   wir NUR echte Titel-Banner und KEINE Inhalts-/Hero-Sections (z. B.
   Kategorie-Landingpages wie /marketing, die kein Breadcrumb haben).

   Problem: die Bannerhöhe kam aus grossem vertikalem Padding
   (Elementor: --padding-top:100px / --padding-bottom:120px) → auf
   schmaleren Screens (~1250px) wurde der Header sehr hoch; ein blosses
   `max-height` schneidet das Padding ab und die Überschrift rutscht aus
   der Mitte.

   ⚠️ Elementor legt das Padding NICHT als `padding` an, sondern über eigene
   Custom Properties (`--padding-top`/`--padding-bottom`), die per
   `padding-block-start: var(--padding-top)` konsumiert werden — bei boxed
   Containern auf `.e-con-inner`, bei full-width auf dem Element selbst.
   Ein physisches `padding-top` überschreibt das nicht zuverlässig. Deshalb
   überschreiben wir die VARIABLEN — sie vererben sich nach innen und wirken
   in beiden Container-Varianten.

   Lösung: kleines Padding (via Variablen) + Höhe über `min-height` + Inhalt
   per Flexbox zentriert → gleiche Höhe und mittige Überschrift auf allen
   Geräten.

   Getrennte Regelblöcke (keine gemeinsame Komma-Liste mit `.rz-page-banner`),
   damit ein Browser ohne :has() die Escape-Hatch-Regel nicht mitverwirft. */

/* Direkte Kindschaft (`> .e-con-inner > …` bzw. `> …`), damit ausschliesslich
   der Banner-Container selbst getroffen wird — niemals eine umschliessende
   Section. Erste Variante = boxed (mit .e-con-inner), zweite = full-width. */
.e-con.e-parent:has(> .e-con-inner > .elementor-widget-breadcrumbs),
.e-con.e-parent:has(> .elementor-widget-breadcrumbs){
  --padding-top:1.5rem !important;    /* Elementor-Variable statt physischem padding */
  --padding-bottom:1.5rem !important;
  min-height:clamp(160px, 30vh, 300px) !important;
  justify-content:center !important;  /* vertikal mittig (Flex-Spalte) */
  align-items:center !important;      /* horizontal mittig */
  overflow:hidden !important;         /* Elementor setzt hier overflow:visible */
}
.e-con.e-parent:has(> .e-con-inner > .elementor-widget-breadcrumbs) > .e-con-inner{
  justify-content:center !important;
  align-items:center !important;
}
.e-con.e-parent:has(> .e-con-inner > .elementor-widget-breadcrumbs) .elementor-heading-title,
.e-con.e-parent:has(> .elementor-widget-breadcrumbs) .elementor-heading-title{margin:0}

/* Escape-Hatch: dieselbe Wirkung per manueller CSS-Klasse `rz-page-banner`
   (Elementor → Erweitert → CSS-Klassen) — für Banner OHNE Breadcrumb oder
   sehr alte Browser ohne :has(). */
.rz-page-banner{
  --padding-top:1.5rem !important;
  --padding-bottom:1.5rem !important;
  min-height:clamp(160px, 30vh, 300px) !important;
  justify-content:center !important;
  align-items:center !important;
  overflow:hidden !important;
}
.rz-page-banner > .e-con-inner{
  justify-content:center !important;
  align-items:center !important;
}
.rz-page-banner .elementor-heading-title{margin:0}
