/* * EMEU Section-Anatomy v1.3.2 (S113, Lumina-Auftrag 2026-08-22) * v1.3.2 (Lumina-Korrektur 2026-09-05): Mein Konto (woocommerce-account) * bekommt dieselbe Huelle wie Warenkorb und Kasse. Die Ausnahme in * v1.3.0 stammte aus dem Bricks-Denken; in Elementor rendert Mein Konto * als Shortcode-Seite [woocommerce_my_account] in derselben Theme-Huelle * (gemessen 01:5x: site-main und page-content ohne Breite und Abstand). * v1.3.1 (Lumina-Setzung 2026-09-04): Top-Padding fuer Warenkorb und * Kasse aus der fluiden Innen-Staffel (Token --w-inner-section-padding * der Hand-Schicht), dazu dasselbe Mass als Bottom-Padding. * v1.3.0 (Lumina-Setzung 2026-09-04, S129, Weg B): die Edge-Padding- * Staffel und die Canvas-Breite sind EIN Token-Satz (:root, je * Breakpoint) — content-wrapper und canvas lesen ihn, und die * WooCommerce-Block-Seiten Warenkorb und Kasse (kein Elementor an * der Seite, Hello-Elementor-Template main.site-main > .page-content * > Block) bekommen dieselbe Staffel aus denselben Token, Abschnitt * (f). Robust ueber alle Live-Seiten (Geburtsstunden-Prinzip), ohne * Template-Bedingung. Mein Konto ausdruecklich NICHT (Elementor- * Template, Lumina). Werte unveraendert: 32/24/20/0 plus 1700. * ------------------------------------------------------------------ * Werte-Fundament fuer die Sektions-Anatomie der WPMU-PRO-Engine. * Die Klassen sind im Elementor-V4-Class-Manager als LEERE Anker * definiert und Elementen zugewiesen (Kit traegt die Labels, der * Styles-Store ist bewusst leer) — ALLE Werte kommen aus dieser * Datei. Wohnort anatomy/ statt dist/, damit kein Generator-Lauf * sie beruehrt; laedt NACH dist, VOR hand (Hand-Schicht behaelt * das letzte Wort). * * SELEKTOR-BAUART: .e-con.e-flexbox-base.w-section__* (Dreifach- * Anker, 0-3-0) — schlaegt die V4-Basis .elementor .e-flexbox-base * (0-2-0, Quelle des 10px-Fallbacks in uploads/elementor/css/ * base-*.css) UNABHAENGIG von der Lade-Reihenfolge * (Spezifitaets-Netz-Empirie S111). Kein !important — die * Hand-Schicht uebersteuert weiterhin frei. * * GRUNDREGELN (festgezurrt in der Struktur-Runde 2026-08-22): * - wrapper und container tragen NIEMALS overflow (Sticky-Killer) * - container ist der Positions-Anker fuer die absolute * Background-Ebene UND liefert als positioniertes Element die * Stapel-Ordnung beim Sticky-Ueberschieben (DOM-spaeter deckt) * - overflow wohnt ausschliesslich auf der Background-Ebene * (Medien-Beschnitt, als Kind gefahrlos) * - Abstaende laufen ueber GAP und die w-Worker der Hand-Schicht, * nie ueber Editor-Padding an Anatomie-Ebenen * * BREAKPOINT-ZONEN (Kit-Stand 2026-08-22): * F Mobile bis 600 | D Tablet 601-1024 | B Laptop 1025-1279 | * X Desktop 1280-1779 | A Widescreen ab 1780 */ /* ------------------------------------------------------------------ * (0) TOKEN-SATZ der Anatomie (v1.3.0): Edge-Padding je Breakpoint- * Zone plus Canvas-Breite — EINE Quelle fuer (d), (e) und (f). * ------------------------------------------------------------------ */ :root { --w-edge-padding: 2rem; /* X Desktop plus B Laptop (Regelfall) */ --w-canvas-max-width: 1700px; /* Arbeitsraum des Inhalts */ } @media (max-width: 1024px) { :root { --w-edge-padding: 1.5rem; } /* D Tablet */ } @media (max-width: 600px) { :root { --w-edge-padding: 1.25rem; } /* F Smartphone */ } @media (min-width: 1780px) { :root { --w-edge-padding: 0px; } /* A Widescreen — die 1700er-Begrenzung liefert den Abstand */ } /* ------------------------------------------------------------------ * (a) w-section__wrapper — Seiten-Stamm plus Sticky-Buehne. * Eine Seite hat im Regelfall EINEN wrapper; Sektionen wohnen darin. * KEIN overflow hier — sonst sterben alle Sticky-Sektionen lautlos. * ------------------------------------------------------------------ */ .e-con.e-flexbox-base.w-section__wrapper { position: relative; width: 100%; max-width: 100%; padding: 0; } /* ------------------------------------------------------------------ * (b) w-section__container — voll-breite Sektions-Flaeche. * Einfache Farb-Hintergruende duerfen direkt hier leben. * * POSITION als :where-FALLBACK (v1.2.0, Lumina-Befund 2026-08-23): * das harte relative im Dreifach-Anker (0-3-0) blockierte die * Editor-Positionierung — Oben halten (sticky) fuer den * Scroll-Effekt kam nicht durch. Ganz entfernen geht aber nicht: * ohne positionierten Container ankert die absolute * Background-Ebene (inset 0) am naechsthoeheren positionierten * Vorfahren — dem WRAPPER — und spannt sich ueber die ganze * Seite. Deshalb relative mit Spezifitaet NULL (:where): * JEDE Editor-Einstellung gewinnt (sticky ist selbst * positioniert, der Background-Anker plus die Stapel-Ordnung * bleiben auch dann erhalten); ohne Editor-Wert greift der * Fallback und alles ankert wie gehabt. * ------------------------------------------------------------------ */ .e-con.e-flexbox-base.w-section__container { width: 100%; max-width: 100%; padding: 0; } :where(.w-section__container) { position: relative; } /* ------------------------------------------------------------------ * (c.1) w-section__container__background — Medien-Hintergrund. * Absolute Ebene, fuellt den Container exakt (inset 0). Traegt * Bild, Video-Shortcode, Slider, Overlays. overflow hidden liefert * den Cover-Beschnitt — hier gefahrlos, weil Kind-Ebene. * pointer-events none: die Hintergrund-Schicht frisst keine Klicks. * z-index 0 haelt sie unter dem Inhalt. * ------------------------------------------------------------------ */ .e-con.e-flexbox-base.w-section__container__background { position: absolute; inset: 0; width: 100%; max-width: 100%; height: 100%; padding: 0; overflow: hidden; z-index: 0; pointer-events: none; } /* ------------------------------------------------------------------ * (c.2) w-section__flex-box — Inhalts-Traeger plus Panel-Schicht. * position relative plus z-index 1 sind PFLICHT: ohne sie malt die * absolute Background-Ebene UEBER den Inhalt (absolute Elemente * decken nicht-positionierte Geschwister). Panel-Optik (eigener * Hintergrund, Innen-Abstand) kommt spaeter per Worker-Klasse — * hier bewusst neutral. * * flex-grow 1 (v1.1.0, Lumina-Befund 2026-08-22): die Flex-Box * spannt IMMER die volle Container-Hoehe auf, damit die Content- * Positionierung AN IHR laeuft (justify-content) statt am * Container. Bewusst flex-grow statt height 100% — Prozent-Hoehen * loesen gegen Eltern, die nur min-height tragen (Hero 100vh), * nicht zuverlaessig auf; flex-grow verteilt exakt diesen Raum. * In Fluss-Sektionen ohne Container-Hoehe ist grow wirkungslos — * die Sektions-Hoehe bleibt Inhalts-getrieben. * ------------------------------------------------------------------ */ .e-con.e-flexbox-base.w-section__flex-box { position: relative; z-index: 1; width: 100%; max-width: 100%; padding: 0; flex-grow: 1; } /* ------------------------------------------------------------------ * (d) w-section__content-wrapper — Deck-Schicht plus Edge-Heimat. * Volle Breite (deckt beim Sticky-Ueberschieben auch die Raender, * die der 1700er-Canvas frei laesst — Deck-Hintergrund kommt per * Worker-Klasse mit Farbwelt-Ton). Traegt als ELTERN des Canvas * die Edge-Padding-Staffel: so bleibt die Naht an der 1780er-Kante * glatt (natuerlicher Zentrier-Rand 40px ueberdeckt die 32px * darunter) und das System ist selbst-regelnd. * ------------------------------------------------------------------ */ .e-con.e-flexbox-base.w-section__content-wrapper { width: 100%; max-width: 100%; padding-block: 0; padding-inline: var(--w-edge-padding, 2rem); /* v1.3.0: Staffel aus dem Token-Satz (0) */ } /* ------------------------------------------------------------------ * (e) w-section__canvas__max-width__1700 — Arbeitsraum des Inhalts. * Zentriert, auf 1700px begrenzt. Flex- oder Grid-Steuerung der * Inhalts-Elemente laeuft im Editor bzw. ueber Worker — neutral. * ------------------------------------------------------------------ */ .e-con.e-flexbox-base.w-section__canvas__max-width__1700 { width: 100%; max-width: var(--w-canvas-max-width, 1700px); margin-inline: auto; padding: 0; } /* ------------------------------------------------------------------ * (f) Theme-Template-Anschluss fuer WooCommerce-Block-Seiten * (v1.3.0, Lumina-Setzung 2026-09-04, Weg B). Warenkorb und Kasse * sind Block-Seiten ohne Elementor-Huelle: Hello Elementor rendert * main.site-main > .page-content > Block, ohne Breite und ohne * Innenabstand (Theme-CSS ist im Haus abgeschaltet). Hier uebernimmt * .site-main die Rolle des content-wrapper (Edge-Padding-Staffel) * und .page-content die des canvas (1700 zentriert) — dieselben * Token wie (d) und (e), also KEINE zweite Wahrheit. Der Anschluss * gilt nur, solange die Seite NICHT durch ein Elementor-Template * laeuft (Body ohne elementor-page-Klasse) — bekommt eine Site die * Kasse spaeter als Elementor-Template, tritt diese Regel von selbst * zurueck. Mein Konto (woocommerce-account, Shortcode-Seite in derselben * Huelle) gehoert seit v1.3.2 dazu (Lumina-Korrektur 2026-09-05). * ------------------------------------------------------------------ */ body.woocommerce-cart:not([class*="elementor-page-"]) .site-main, body.woocommerce-checkout:not([class*="elementor-page-"]) .site-main, body.woocommerce-account:not([class*="elementor-page-"]) .site-main { box-sizing: border-box; width: 100%; max-width: 100%; padding-inline: var(--w-edge-padding, 2rem); /* v1.3.1 (Lumina-Setzung 2026-09-04): Top-Padding fuer Seiten ohne regulaeren Header — die fluide Innen-Staffel des Hauses (40px bei 600 und darunter bis 88px ab 1780), Token aus der Hand-Schicht, dasselbe Mass wie inner-section__padding__top auf Impressum und Datenschutz. Header ist sticky im Fluss, der Abstand gilt ab seiner Unterkante. */ padding-top: var(--w-inner-section-padding, clamp(2.5rem, 0.9745rem + 4.068vw, 5.5rem)); padding-bottom: var(--w-inner-section-padding, clamp(2.5rem, 0.9745rem + 4.068vw, 5.5rem)); /* Luft vor dem Footer, gleiches Mass */ } body.woocommerce-cart:not([class*="elementor-page-"]) .site-main > .page-content, body.woocommerce-checkout:not([class*="elementor-page-"]) .site-main > .page-content, body.woocommerce-account:not([class*="elementor-page-"]) .site-main > .page-content { width: 100%; max-width: var(--w-canvas-max-width, 1700px); margin-inline: auto; }