/* Rechtsseiten (und die Werkstatt, werkstatt.css): Werkstatt-Bild seitenfüllend; keine Lesefläche mehr, die Folie liegt nur hinter den
   Textzeilen selbst (Buchstaben-Folie: jedes Textelement inline mit box-decoration-break: clone, Folie rgba(28,19,12,0.72), Ecken 6 px,
   Polster .14em .45em; Zeilenumbrüche zwischen den Blöcken über ::after). So bleibt das Bild zwischen und neben den Zeilen frei, und der
   Text ist auf jedem Hintergrund lesbar (heller Text #f3ead9 auf der dunklen Folie, Kontrast > 10:1). Spalte max. 640 px mittig. */
/* Schriften, selbst gehostet (schriften/, SIL OFL, Latin-Dateien von fonts.google.com unverändert, weil kein Subsetting-Werkzeug vorhanden):
   Fraunces (Variable Font, 400–600) für Überschriften, Inter (Variable Font, 400–600) für alles andere; font-display: swap.
   Ersatzschriften Georgia/Arial mit size-adjust (mittlere Zeichenbreite gleich) und denselben Vertikalmetriken wie die Webschrift
   (ascent/descent/line-gap-override auf beiden), damit beim Nachladen nichts springt. Werte per Canvas gemessen (BERICHT-UMBAU.md). */
@font-face{font-family:"Fraunces";src:url(/schriften/fraunces-latin.woff2) format("woff2");font-weight:400 600;font-display:swap;ascent-override:98%;descent-override:26%;line-gap-override:0%}
@font-face{font-family:"Fraunces Ersatz";src:local("Georgia");size-adjust:104.86%;ascent-override:98%;descent-override:26%;line-gap-override:0%}
@font-face{font-family:"Inter";src:url(/schriften/inter-latin.woff2) format("woff2");font-weight:400 600;font-display:swap;ascent-override:97%;descent-override:24%;line-gap-override:0%}
@font-face{font-family:"Inter Ersatz";src:local("Arial");size-adjust:105.94%;ascent-override:97%;descent-override:24%;line-gap-override:0%}
*{box-sizing:border-box}html{scroll-behavior:auto}
body{margin:0;min-height:100vh;background:#1a1f23;color:#f3ead9;font-family:"Inter","Inter Ersatz",Arial,Helvetica,sans-serif;line-height:1.7}
/* Bild in einer fixen Ebene hinter dem Text (seitenfüllend, mittig, cover). */
body::before{content:"";position:fixed;inset:0;z-index:-1;background-color:#1a1f23;background-position:center;background-size:cover;background-repeat:no-repeat;background-attachment:fixed}
body.recht--impressum::before{background-image:url(/werkstatt-halle.webp)}
body.recht--datenschutz::before{background-image:url(/werkstatt-nah.webp)}
body.recht--agb::before{background-image:url(/werkstatt-oben.webp)}
.folie{color:#f3ead9;overflow-wrap:anywhere}
/* Buchstaben-Folie nur am Text: der Inhalt jeder Überschrift, jedes Absatzes, Listenpunkts und jeder Beschriftung liegt in <span class="wort">
   (inline, box-decoration-break: clone), jede Zeile bekommt ihre eigene Folie; Blöcke und Abstände bleiben wie gehabt. */
.folie .wort{background:rgba(28,19,12,.72);-webkit-box-decoration-break:clone;box-decoration-break:clone;padding:.14em .45em;border-radius:6px;margin-left:-.45em}
.folie h1,.folie h2,.folie p,.folie li,.folie label{margin-left:.45em} /* Textkante bleibt an der Spaltenkante, die Folie ragt links hinaus */
.folie ul{list-style:none;padding-left:0}.folie li{margin-bottom:8px}.folie li .wort::before{content:"– "}
.folie label .wort{display:inline-block}
a{color:#fbf5ea;text-decoration:underline;text-underline-offset:4px}a:focus-visible{outline:3px solid #fbf5ea;outline-offset:5px}
header{display:flex;justify-content:space-between;gap:24px;padding:24px 48px}
header a{font-size:14px;letter-spacing:.12em;font-weight:700;text-decoration:none;color:#172c30;background:rgba(244,241,234,.85);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:9px 14px;border-radius:999px}
/* Marke in der Kopfzeile: Ypsilon-Pi-Zeichen als Inline-SVG (22 px hoch) in der Textfarbe der Wortmarke (currentColor), 10 px Abstand, mittig zur Schrift. */
.marke{display:inline-flex;align-items:center;gap:10px}.zeichen{height:22px;width:auto;flex:0 0 auto}
.legal-content{max-width:640px;padding:0 36px;margin:64px auto;overflow-wrap:anywhere}
h1,h2{font-family:"Fraunces","Fraunces Ersatz",Georgia,serif;font-weight:400;line-height:1.2;letter-spacing:-.025em;color:#fbf5ea}
h1{font-size:clamp(32px,4.5vw,50px);margin:0 0 28px}h2{font-size:clamp(23px,3vw,30px);margin:36px 0 14px}p,li{font-size:17px}p{margin:0 0 14px}
.site-footer{max-width:640px;margin:0 auto 64px;padding:0 36px}
.site-footer nav{display:flex;gap:24px;flex-wrap:wrap;margin-bottom:12px}.site-footer nav a{background:rgba(28,19,12,.72);padding:.14em .45em;border-radius:6px}.site-footer p{font-size:14px;margin:0}
@media(max-width:700px){
body::before{background-attachment:scroll}
header{padding:16px}
.legal-content{margin:64px 16px;padding:0 8px}
.site-footer{margin:0 16px 64px;padding:0 8px}
p,li{font-size:16px}
h1{font-size:28px;hyphens:auto}
}
