/*
 * gfp-hero.css
 * Full-Bleed-Fix für die Lay-Gridder-Hero-Reihe auf der Startseite
 * (Klasse "hero-fullwidth", in Lay per Row-CSS-Klasse gesetzt).
 *
 * Lag bisher nur in Lays eigenem Custom-CSS-Feld (Design → Custom CSS) —
 * dort ist es verloren gegangen, deshalb jetzt fest im Plugin (versioniert,
 * site-weit geladen, siehe site-integration.php). Der Slide wird via
 * negativer Margin auf 100vw ausgebrochen (klassischer Full-Bleed-Trick).
 *
 * Der Text-Overlay ist von Lay per Inline-Style absolut positioniert
 * (inset: 0 auto auto 0, relativ zur jetzt randlosen 100vw-Bildbox) und
 * würde dadurch bis an die echte Bildschirmkante rutschen. Lays normale
 * Zeilen (z. B. "Unsere Fachbereiche") beginnen ihren Inhalt aber bei 2%
 * vom Rand (--lay-row-bg-frame-left: 2%, siehe #grid-Regeln im Quelltext).
 * Damit der Hero-Text an derselben Stelle wie der restliche Seiteninhalt
 * beginnt, wird links exakt derselbe 2%-Wert erzwungen — !important, weil
 * Lays Inline-Style (left:0) sonst gewinnt (funktioniert nach demselben
 * Prinzip wie width:100vw oben: !important schlägt normale Inline-Styles).
 *
 * Bewusst NUR "left" gesetzt, kein "right"/"width" (Versuch verworfen —
 * hat die Textbreite/-position auf der Live-Seite wieder falsch aussehen
 * lassen, vermutlich Wechselwirkung mit Lays eigener, JS-gesetzter
 * Inline-Breite). Diese schlankere Variante war bereits vom User bestätigt.
 *
 * "left: 2%" allein reicht aber nur, solange normale Zeilen ebenfalls auf
 * die volle Fensterbreite gehen. Ist in Lay unter Design → Layout eine
 * "Max Width" gesetzt (hier: Option misc_options_max_width, aktuell
 * 1700px), boxt Lay ab dieser Fensterbreite alle normalen Zeilen auf
 * .row-inner{max-width:1700px} und zentriert sie — 2% wären dann 2% der
 * VOLLEN Fensterbreite, während der restliche Seiteninhalt bei 2% der
 * 1700px-Box endet. Ergebnis: Text driftet oberhalb von 1700px sichtbar
 * weiter nach außen als der Rest der Seite.
 * Fix folgt Lays eigenem CSS-Custom-Property "--lay-row-max-width", das
 * Lay bei aktiver Max-Width-Option auf jedes .row-Element schreibt (hier
 * geerbt von der .hero-fullwidth-Zeile selbst) — dadurch bleibt es
 * automatisch korrekt, falls der Max-Width-Wert in Lay je geändert wird,
 * ohne einen hartcodierten 1700px-Breakpoint hier im Code. Ist die
 * Option in Lay aus, fehlt die Variable → Fallback (999999px) sorgt
 * dafür, dass die Formel dann wieder exakt "2vw" ergibt, also identisch
 * zum alten, unboxed Verhalten.
 */

.hero-fullwidth .lay-carousel-slide {
  width: 100vw !important;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

.hero-fullwidth .lay-text-on-element-overlay {
  left: calc(
    max(0px, (100vw - var(--lay-row-max-width, 999999px)) / 2)
    + min(2vw, var(--lay-row-max-width, 999999px) * 0.02)
  ) !important;
}

.hero-fullwidth .laycarousel-bullets,
.hero-fullwidth .swiper-pagination-bullets {
  display: none !important;
}