.page-hero--legal{ position:relative; overflow:hidden; height:40vh; display:flex; align-items:center; padding:60px 0; margin-top:-70px; } .page-hero--legal .container{margin-top:70px;} .page-hero--legal__media{ position:absolute;inset:0; background-size:cover; background-position:center; } @media (max-width:479px){ .page-hero--legal__media{background-position:68.49% 48.99%;} } .page-hero--legal__overlay{ position:absolute;inset:0; background-image:linear-gradient(45deg, rgba(0,0,0,.7), rgba(0,0,0,0)); } .page-hero--legal .container{position:relative;z-index:1;text-align:center;} .page-hero--legal h1{ text-align:center; text-transform:uppercase; /* Automatic.css-Default, nicht Original-Content-Grossschreibung */ letter-spacing:normal; /* war faelschlich 1px im generischen .page-hero h1 */ font-size:clamp(2.61rem,2.2rem + 1.75vw,3.775rem); line-height:1.4; /* Original-Ratio konstant 1.4 auf allen Breakpoints (getComputedStyle 375/1024/1440px: 58.4559/41.7542, 75.5505/53.9647, 84.5588/60.3991 -> exakt 1.4000). Fehlte bisher komplett -> erbte main.css' generische Basis-line-height 1.45, dadurch kumulativer vertikaler Versatz ggue. Original (QA-Fund 2026-08-12). */ } .page-hero__lede{ font-family:var(--font-body); font-weight:400; text-align:center; color:var(--white); /* Fix 2026-08-12 (Fluid-Nachrunde): war fix 8px, Original waechst H1-zu-Tagline mit der Breite (32.171875px@375, 37.265625px@768, 40.5625px@1024, 45px@1440+ -- live an allen 3 Legal-Seiten (Impressum/Datenschutz/Nutzungsbedingungen, teilen diese Klasse) identisch gemessen, exakt dieselbe Formel wie bereits fuer .bib-hero__content h1 auf /bibliothek/ etabliert -- Zweipunkt-Fit aus 375/1440px). */ margin-top:clamp(32.171875px, calc(28.4263px + 1.1509vw), 45px); font-size:clamp(1.203rem,1.161rem + 0.284vw,1.416rem); line-height:clamp(1.6936rem, calc(25.78px + 0.3509vw), 1.9272rem); /* Original-Lede (".hero-sub__lede") hat KEINEN konstanten Ratio (27.098px@375/29.5421px@1024/ 30.8354px@1440 -> 1.408/1.375/1.361, kein sauberes 1.4), daher Zweipunkt-Clamp aus den echten 375/1440-Randmesswerten statt eines fixen Faktors -- dasselbe fehlende- Override-Muster wie bei h1, gleicher QA-Fund. */ } .content-page--legal .content-blocks__heading{ color:var(--neutral); /* Original: schwarz, nicht der goldene --secondary-text-Ton der auf Retreat/Event-Content-Blocks verwendet wird */ font-weight:700; overflow-wrap:break-word; /* Sicherheitsnetz (QA-Fund, gleiches Muster wie Hero-h1): lange Datenschutz-Ueberschriften wie "Google Fonts Lokale Datenschutzbestimmungen" liefen mit Versalien+4px Letter-Spacing bei 375px 8px ueber den Viewport hinaus. */ } /* Sitewide-Muster-Fix D (2026-08-12): das "margin:0;" oben (jetzt entfernt) schlug die in main.css definierte .content-blocks__heading{margin:2em 0 .6em} tot -- H2-zu-Text UND Text-zu-naechster-Ueberschrift kollabierten auf 0px (Impressum/Datenschutz/ Nutzungsbedingungen, alle 3 teilen diese Klasse). Live verifiziert: Original hat auf diesen Content-Bloecken keine Heading-eigene Margin, sondern einen flex-column row-gap:30px auf dem umschliessenden .brxe-block je Abschnitt (Heading+Text) UND einen row-gap:~67.5px ZWISCHEN den Abschnitten -- dieses Rebuild nutzt stattdessen Margin auf der Ueberschrift, main.css' vorhandene 2em/.6em-Regel (hier ~80px/24px bei 40px- Ueberschriftgroesse) liegt in der vom Auftrag selbst genannten 24-68px-Zielspanne nah genug, ohne die Content-Blocks-Komponente auf ein neues Flex-Gap-Modell umzubauen. */ .content-page--legal h2.content-blocks__heading{ text-transform:uppercase; letter-spacing:4px; font-size:clamp(1.1455rem,0.669rem + 2.035vw,2.5rem); line-height:clamp(1.576rem, calc(1.038rem + 2.373vw), 3.145rem); } .content-page--legal h3.content-blocks__heading{ /* h3 bleibt bewusst OHNE Versalien/Letter-Spacing — 1:1 so im Original gemessen, nur h2 bekommt die Automatic.css-Versalien-Behandlung. */ /* ⭐ QA-Fund 2026-08-12 (pingeliger UX-Experte): die alte Formel unten (0.764rem Boden) lieferte nur 12.2px@375/21.0px@1024 statt der echten Original-Werte 21.68/24.94px -- Boden lag faelschlich fast auf Hoehe des linearen Anteils bei 375px, statt bei einem sinnvollen Minimum. Ersetzt durch die bereits an mehreren anderen Stellen dieses Themes verifizierte Sitewide-Formel fuer Content-H3 (Cormorant/700/26.66px bei 1440px+, identisch zu .ibz-cardpair__text h3/.ibz-tier h3/.ev-card__title) -- exakter Match bei 1440/1920px, <0.23px Restfehler bei 1024px (etabliert akzeptierte Toleranz dieses Projekts). */ font-size:clamp(1.355rem, calc(19.92px + 0.468vw), 1.666rem); line-height:1.31; /* Original-Ratio 1.342@375 -> 1.308@1440 (nicht ganz konstant, aber 1.31 trifft den fuer die Lesbarkeit massgeblichen groesseren Breakpoint-Bereich am naechsten und deckt sich mit der bereits fuer .ibz-tier h3 etablierten Konvention). */ margin:0; /* Original: marginTop/marginBottom 0px/0px auf allen 4 Breakpoints (Gewaehr- leistung/Vertraulichkeit/Sonstiges). Klon erbte main.css' generische .content-blocks__heading{margin:2em 0 .6em}, was bei 26.66px Schriftgroesse exakt 53.3px/16px ergibt -- deckt sich 1:1 mit dem im QA-Bericht gemeldeten Versatz. */ /* Fix 2026-08-12 (Fluid-Nachrunde): margin:0 oben ist fuer die H3-EIGENE Margin korrekt (bestaetigt s.o.), der eigentliche sichtbare Vorabsatz-zu-Ueberschrift-Abstand kommt auf dem Original aber NICHT von dieser Margin, sondern von row-gap auf dem umschliessenden .brxe-block (24.078125px@375, 26.421875px@768, 27.953125px@1024, 30px@1440+ -- live an ALLEN ~35 Ueberschriften auf /datenschutz/ UND /nutzungsbedingungen/ identisch gemessen, inkl. der jeweils ersten Ueberschrift nach dem Hero). main.css' generische .content-blocks__heading{margin:2em 0 .6em} wurde durch das margin:0 hier komplett stillgelegt, ohne Ersatz -- dadurch der gemeldete 0px-Bug. Fix simuliert den row-gap-Effekt ueber margin-top auf der Ueberschrift selbst (exakt dieselbe Formel, die auch fuer .retreat-card__content/.ev-card__date/.ev-card__title/.story__heading-row an anderen Stellen dieses Themes denselben Automatic.css-Design-Token abbildet, s. project_stefanie_grace_technik.md). */ margin-top:clamp(24px, calc(21.853px + 0.5964vw), 30px); } /* Pfeil-Listen (→) — auf dem Original eine sitewide Automatic.css-Regel (".brxe-text ul{display:grid;grid-template-columns:1fr 1fr}" + "li::marker{content: '→'}"), auf /datenschutz/ durch die vielen Cookie-/GDPR-Aufzaehlungen besonders auffaellig. Hier bewusst nur fuer Legal-Seiten nachgebaut (nicht sitewide auf .content-blocks__text ul, um Retreat/Event-FAQ-Listen nicht anzufassen — die liegen ausserhalb dieses Fixes). */ .content-page--legal .content-blocks__text ul{ display:grid; grid-template-columns:1fr 1fr; gap:.2rem; margin:1rem 0 1.2em; padding:0; list-style:none; } .content-page--legal .content-blocks__text ul li{ margin:0 0 0 1rem; padding:0 0 0 .5rem; position:relative; } .content-page--legal .content-blocks__text ul li::before{ content:"→"; position:absolute; left:-1rem; } @media (max-width:767px){ .content-page--legal .content-blocks__text ul{grid-template-columns:1fr;} } .content-page--legal a[href^="mailto:"], .content-page--legal a[href^="tel:"]{ color:var(--secondary); text-decoration:none; } .content-page--legal a[href^="mailto:"]:hover, .content-page--legal a[href^="tel:"]:hover{ text-decoration:underline; } .content-page--legal .content-blocks__text a:not([href^="mailto:"]):not([href^="tel:"]){ color:var(--secondary); text-decoration:none; } .content-page--legal .content-blocks__text a:not([href^="mailto:"]):not([href^="tel:"]):hover{ text-decoration:underline; } /* margin-top war fix 17px statt fluid (Fix 2026-08-12, Fluid-Nachrunde) -- Original- Absatz-zu-Absatz-Abstand (innerhalb derselben Antwort, .brxe-text) waechst mit der Breite: 16.0149px@375, 16.4056px@768, 16.66px@1024, 17px@1440+ -- deckt sich exakt mit 1em der eigenen, hier bereits fluiden font-size clamp() (16.03px@375...17px@1440, <0.02px Restfehler) -- 1em statt eines eigenen Clamps, da beide Formeln praktisch identisch sind. */ .content-page--legal .content-blocks__text p{font-size:clamp(1rem, calc(0.98rem + 0.093vw), 1.0625rem);line-height:1.45;margin-top:1em;margin-bottom:0;} .content-page--legal .content-blocks__text p:first-child{margin-top:0;} .content-page--legal .content-page--narrow{max-width:var(--container,1100px);} /* ⭐ Sitewide-Root-Cause-Fix 2026-08-12 (Runde 6 Zentralisierung, "Heading-Spacing clamp()- Bug auf /nutzungsbedingungen/ seit 5 Fix-Runden UNVERAENDERT"): der eigentliche Bug war NIE das h2/h3-Margin selbst (das war schon vorher korrekt gefixt, s. Update weiter unten in project_stefanie_grace_technik.md), sondern main.css' `.content-page{padding:60px 0 100px}` (Zeile ~911) -- ein starrer statt fluider Wert fuer den Hero->Content-Anfang- UND Content-Ende->Footer-Abstand. Jede vorige Fix-Runde behandelte nur einzelne Heading-Margins innerhalb des Content-Bereichs und schloss dadurch nur 6-13px des gemeldeten kumulativen Delta (~110-252px je nach Breakpoint) -- der dominante Rest kam aus genau dieser einen, nie zentral gefixten Zeile. Bereits EINMAL isoliert und korrekt page-scoped fuer `/impressum/` geloest (page-impressum.php, identische Formel) -- hier zentral in `legal-pages.css` uebernommen, damit sie automatisch auch fuer `/datenschutz/` und `/nutzungsbedingungen/` gilt (beide hatten den Fix bisher NICHT, da er nie ausserhalb von `/impressum/` zentralisiert wurde). `.content-page--legal` (Spezifitaet 0-2-0) schlaegt main.css' `.content-page` (0-1-0) zuverlaessig, unabhaengig von Ladereihenfolge. Bewusst NUR auf `.content-page--legal` gescoped (nicht das generische `.content-page` in main.css direkt geaendert) -- diese Klasse wird ausschliesslich von den 3 Legal-Seiten genutzt (post_class() in page-impressum.php/page-datenschutz.php/page-nutzungsbedingungen.php), waehrend das generische `.content-page` sitewide zusaetzlich von `page.php` (aktuell ungenutzter Fallback, 0 publizierte Seiten) UND von `archive-bibliothek.php`s Intro-Textblock (bewusst NICHT Teil dieses Befunds) geteilt wird -- ein main.css-Edit haette dort ungeprueften Kollateraleffekt gehabt. Formel identisch zur bereits an >10 anderen Stellen dieses Themes bewiesenen Hero-zu-Content-Fluid-Formel (48.63px@<=360px bis 90px@>=1366px, z.B. `.arigatou-page`, `.mbe-hero`, Bibliothek-Footer-Padding-Top). */ .content-page--legal{ padding: clamp(48.63px, calc(32.97px + 4.175vw), 90px) 0; } /* "made with heart by Auftrittsreich"-Badge — nur auf /impressum/ (grace_ar_badge()), letztes Element der Seite im Original. */ .legal-badge__link{display:inline-block;margin-top:28px;opacity:.7;transition:opacity .2s ease;} .legal-badge__link:hover{opacity:1;} .legal-badge__svg{display:block;width:110px;height:15px;} /* Dezenter Agentur-Credit-Satz (grace_ar_credit(), nur Impressum+Datenschutz) — Basiswerte (font-size/line-height/opacity/margin-top) 1:1 aus dem Original-mu-Plugin ar-credit.php. Horizontal-Position + Footer-Abstand ABSICHTLICH NICHT 1:1 vom Original uebernommen (Alex- Feedback 2026-08-12, /datenschutz/ Punkt 1): eigene Playwright-Messung gegen das echte stefanie-grace.com/datenschutz/ bestaetigte, dass der Credit-Satz dort selbst randlos links (x=0, kein Container-Einzug) UND mit nur 6px Abstand direkt an den Footer-Hintergrund stoesst -- exakt das von Alex bemaengelte Verhalten ist also bereits im Original vorhanden, keine Rebuild-Divergenz. Da der Auftrag ausdruecklich eine bessere, organische Wirkung statt strikter Original-Parity verlangt, bekommt der Satz hier dieselbe Container-Box wie die umgebende Rechtstext-Spalte (width:91%/max-width:var(--container) wie .container, 1100px auf dieser Seite via .content-page--legal .content-page--narrow-Override) -- der Text faellt dadurch automatisch mit dem linken Rand des eingerueckten Contents zusammen. margin-bottom von 6px auf 56px angehoben fuer sichtbar organischen Abstand zum Footer-Hintergrundwechsel. */ .ar-seo-credit{font-size:12px;line-height:1.5;opacity:.5;width:91%;max-width:var(--container,1100px);margin:34px auto 56px;} .ar-seo-credit a{color:inherit;} /* /datenschutz/-Footer-Spaltenversatz (Fix-Runde "dsux8", 2026-08-12 vormittags) — Original hat Flex 267,5px:802,5px (Logo:Menues), main.css' sitewide .site-footer__inner{grid- template-columns:1fr 2fr auto} ergibt bei 1100px-Container 346,4px Logo-Spalte (79px zu breit). Ratio auf 1fr 2.6fr auto korrigiert, per .page-id-11-Body-Klasse auf /datenschutz/ gescopet (main.css/footer.php unangetastet, 0 Risiko fuer die anderen 18 Seiten). Restauriert nach einer Parallelsession-Kollision (ntbfix2-Deploy ueberschrieb diese Regel versehentlich, da dsux8 zwischen dem initialen Pull und dem Upload dieser Session deployt hatte, s. project_stefanie_grace_technik.md). FIX 2026-08-12 (kleinere Punkte): die obige "1fr 2.6fr auto"-Ratio war nur eine grobe Naeherung der AEUSSEREN Logo:Menues-Aufteilung — sie beruecksichtigte nicht, dass das Original innerhalb der Menues-Spalte selbst NOCHMAL verschachtelt ist (Links-Block: Sprachschalter ebenfalls im festen Verhaeltnis, per Playwright/getBoundingClientRect gegen stefanie-grace.com/datenschutz/ auf allen 3 Breakpoints bestaetigt). Live-Vergleich einzelner Footer-Links (Rebuild vs. Original) deckte den dadurch entstehenden Rest-Versatz auf: "Retreats"-Link +84,73px, "DE"-Sprachschalter +169,56px bei 1440px (deckt sich exakt mit den gemeldeten "+85px/+169px"). Ersetzt durch dieselbe verschachtelte Grid-Formel, die bereits fuer /kontakt/ unabhaengig hergeleitet+auf <0,35px Restfehler live verifiziert wurde (identische Footer-Komponente, footer.php sitewide geteilt, daher 1:1 uebertragbar) — hier ebenfalls per .page-id-11 auf /datenschutz/ gescopet, main.css/footer.php weiterhin unangetastet. */ /* Sitewide-QA-Fund 2026-08-16 (Playwright-Sweep): war "min-width:479px" -- diese feste Clamp-Untergrenze (236.29px+479.25px+auto+Gaps) braucht mathematisch ~900px Container- Breite, main.css kollabierte .site-footer__inner damals nur unter 478px auf 1fr, dazwischen (479-899px) lief die Spalte 81px ueber den Viewport hinaus (live per Bisektion gemessen, 0px ab genau 900px). main.css hat jetzt eine eigene @media(max-width:899px)-Kollapsregel dafuer bekommen -- Schwelle hier synchron auf 900px angehoben, damit diese hoeher-spezifische .page-id-11-Regel sie in der Luecke nicht mehr aussticht. >=900px unveraendert (die urspruengliche 1024/1440/1920px-Messung dieser Fix-Runde bleibt komplett unangetastet). */ @media (min-width:900px){ .page-id-11 .site-footer__inner{ grid-template-columns: clamp(236.29px, calc(131.79px + 10.2059vw), 278.75px) clamp(479.25px, calc(253.56px + 22.0404vw), 570.938px) auto; gap: clamp(27.96px, calc(22.94px + 0.4903vw), 30px); } .page-id-11 .site-footer__links{ column-gap: clamp(27.96px, calc(22.94px + 0.4903vw), 30px); } } /* /nutzungsbedingungen/-Paragraph-4-"Sonstiges" ungewollter Abstand (kleinere Punkte, 2026-08-12) — dieser Content-Block wird im Original NICHT als normale Bricks-Text- Struktur gespeichert, sondern (wie der aehnliche Fall in page-datenschutz.php's Kopfkommentar dokumentiert) als ein einziges, roh eingebettetes Elementor-Widget-HTML (".elementor-widget-text-editor"), dessen

-Tags im Original komplett OHNE eigene Margin auskommen (live per getComputedStyle bestaetigt: marginTop/marginBottom 0px/0px auf allen 5 Absaetzen 4.1-4.4 + Schlussabsatz, direkt aneinanderstossend, "eng gesetzt"). Die generische `.content-page--legal .content-blocks__text p{margin-top:1em}`-Regel greift per Nachfahren-Selektor aber AUCH innerhalb dieses eingebetteten Blocks (nicht nur bei :first-child, der bereits per main.css/legal-pages.css auf 0 gesetzt ist) — dadurch 17px ungewollter Abstand zwischen 4.2/4.3/4.4 (Original: 0px). Fix scoped exakt auf diesen eingebetteten Block, alle anderen .content-blocks__text-Absaetze (normale 1em-Fluid-Formel) bleiben unangetastet. */ .content-page--legal .content-blocks__text .elementor-widget-text-editor p{ margin-top:0; } /* Gezielte Fix-Runde "dsux_footer3" (2026-08-12, pingeliger UX-Experte, 3 Befunde ausschliesslich auf /datenschutz/) — alle 3 page-scoped per .page-id-11, main.css/ footer.php/functions.php unangetastet. Befund A — Footer-Newsletter-Absatz zu schmal: main.css setzt sitewide `.newsletter p{max-width:620px}`. Original (Post 822/gleiche geteilte Footer-Komponente) hat auf `.footer-top__lede` KEINEN eigenen Breiten-Deckel (`max-width:100%`, live gemessen 333.8125/677.453125/802.5/802.5px bei 375/1024/1440/1920px — identisch zur Elterncontainer-Breite `.newsletter__inner`, die im Rebuild bereits korrekt fluid ist). Der Absatz selbst war zusaetzlich eingeschraenkt, wodurch "Yoga-Events" mitten im Wort umbricht statt sauber nach "Workshops,". Nur `.newsletter p` gefixt (nicht `.newsletter form`, das war nicht Teil dieses Befunds und bleibt unveraendert). */ .page-id-11 .newsletter p{ max-width:100%; } /* Befund B — schwarzer Copyright-Balken schliesst nicht buendig ab: main.css setzt sitewide `.site-footer{padding:70px 0 40px}` — die 40px Bottom-Padding liegen NACH `.site-footer__bottom` (dem schwarzen Balken) und lassen den beigen `.site-footer`- Hintergrund darunter durchscheinen. Original: `