/* Basis — mobile-first, randlos: Sektions-Hintergründe volle Breite,
   Inhalt in .inhalt auf Lesebreite (1248px) begrenzt. */

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; overflow-x: clip; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; } /* keine Mobile-Text-Inflation (Samsung & Co.) */

body {
    background: var(--surface-page);
    font-family: var(--font-ui);
    color: var(--text-standard);
}

html.menue-offen { overflow: hidden; }

/* height:auto = Gegenstück zu den width/height-Attributen aus bild() — hält das
   Seitenverhältnis, wenn max-width das Bild schrumpft. Explizite Höhen
   (Klassen/Inline) gewinnen weiterhin. */
img { max-width: 100%; height: auto; }

h1, h2, h3, p { margin: 0; }

.inhalt {
    --pad: clamp(20px, 4vw, 48px); /* für Full-Bleed-Ausbrecher (negative margin) */
    max-width: 1344px; /* 1248px Inhalt + 2×48px Innenabstand */
    margin-inline: auto;
    padding-inline: var(--pad);
}

.abschnitt { padding-block: 48px 56px; }
.abschnitt--creme { background: var(--creme); }
.abschnitt--oben-0 { padding-top: 0; }

.mittig { text-align: center; }
.schmal { max-width: 820px; margin-inline: auto; }
.schmal--links { margin-inline: 0; } /* linksbündig kappen (nur INNERHALB eines .inhalt nutzen) */
/* Sitzt die Kombination auf dem .inhalt-Container SELBST (V2-Textsektionen,
   Inklusive-Intro): Container bleibt zentriert, nur der Inhalt ist auf
   Lesebreite gekappt — sonst rutscht der ganze Block an den Viewport-Rand
   (fiel erst ab ~1920 auf; Patrick 11.7.). */
.inhalt.schmal--links { max-width: 1344px; margin-inline: auto; }
.inhalt.schmal--links > * { max-width: 724px; } /* 820 − 2×48 Pad */
.schmal--760 { max-width: 760px; }
.schmal--860 { max-width: 860px; }
.nachsatz { margin-top: 18px; }

.fliesstext { font-size: 17px; line-height: 1.7; color: var(--text-neben); }
.fliesstext strong { color: var(--text-standard); }

.display-headline {
    font-family: var(--font-display);
    font-size: clamp(28px, 5vw, 36px);
    font-weight: 700;
    line-height: 1.25;
}

@media (min-width: 1100px) {
    .abschnitt { padding-block: 88px 96px; }
}

/* 404-Seite */
.fehler-links { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; margin-top: 28px; }