/*
 * Lezovic: gesamtes Styling.
 * Gliederung: Schriften, Tokens, Basis, Typografie, Rahmen, Kopf, Navigation,
 * Suche, Fuß, Knöpfe, Blöcke, Auto-Kontrast, Barrierefreiheit.
 * Größen skalieren mit clamp() zwischen 390 px (Mobil) und 1440 px (Desktop).
 */

/* ---------- Schriften (lokal, SIL OFL) ---------- */

@font-face {
	font-family: "Young Serif";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/young-serif-latin.woff2?v=2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Young Serif";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/young-serif-latin-ext.woff2?v=2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "DM Sans";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/dm-sans-latin.woff2?v=2") format("woff2-variations");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "DM Sans";
	font-style: normal;
	font-weight: 400 700;
	font-display: swap;
	src: url("../fonts/dm-sans-latin-ext.woff2?v=2") format("woff2-variations");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Source Serif 4";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/source-serif-4-latin.woff2?v=2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Source Serif 4";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/source-serif-4-latin-ext.woff2?v=2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Source Serif 4";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/source-serif-4-700-latin.woff2?v=2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Source Serif 4";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/source-serif-4-700-latin-ext.woff2?v=2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Source Serif 4";
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/source-serif-4-italic-latin.woff2?v=2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Source Serif 4";
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/source-serif-4-italic-latin-ext.woff2?v=2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Caveat";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/caveat-latin.woff2?v=2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Caveat";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/caveat-latin-ext.woff2?v=2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---------- Tokens ---------- */

:root {
	/* Farben */
	--creme: #faf7f2;
	--anthrazit: #292725;
	--rostrot: #a34332;
	--sand: #ede5da;
	--oliv: #626b52;
	--weiss: #ffffff;
	--gedaempft: #5f5a54;

	/* Kontextfarben (Auto-Kontrast überschreibt sie) */
	--farbe-text: var(--anthrazit);
	--farbe-meta: var(--gedaempft);
	--farbe-akzent: var(--rostrot);
	--farbe-fokus: var(--rostrot);
	--knopf-hg: var(--rostrot);
	--knopf-text: var(--weiss);

	/* Schriften */
	--schrift-titel: "Young Serif", Georgia, serif;
	--schrift-text: "Source Serif 4", Georgia, serif;
	--schrift-ui: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--schrift-hand: "Caveat", cursive;

	/* Schriftgrößen: Mobil 390 px bis Desktop 1440 px */
	--fs-display: clamp(2.75rem, 1.961rem + 3.238vw, 4.875rem);
	--fs-h1: clamp(2.375rem, 1.911rem + 1.905vw, 3.625rem);
	--fs-h2: clamp(1.8125rem, 1.557rem + 1.048vw, 2.5rem);
	--fs-h3: clamp(1.3125rem, 1.243rem + 0.2857vw, 1.5rem);
	--fs-zitat: clamp(1.5625rem, 1.4rem + 0.6667vw, 2rem);
	--fs-gross: clamp(1.1875rem, 1.164rem + 0.0952vw, 1.25rem);
	--fs-beitrag: clamp(1.1875rem, 1.164rem + 0.0952vw, 1.25rem);
	--fs-text: 1.0625rem;
	--fs-meta: 0.875rem;
	--fs-ui: 0.875rem;
	--fs-tag: 0.75rem;
	--fs-logo: 1.5rem;
	--fs-kicker: clamp(0.9375rem, 0.9143rem + 0.0952vw, 1rem);
	--fs-claim: 0.9375rem;
	--fs-hand: clamp(1.5rem, 1.407rem + 0.381vw, 1.75rem);

	/* Layout */
	--breite-text: 720px;
	--breite-weit: 960px;
	--breite-rahmen: 1200px;
	--rand: clamp(1.25rem, -1.071rem + 9.524vw, 7.5rem);
	--abstand-fuss: clamp(4rem, 2.7rem + 5.33vw, 7.5rem);
	--radius-pille: 100px;
	--radius-bild: clamp(16px, 12px + 1vw, 24px);
}

/* ---------- Basis ---------- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-padding-top: 1rem;
}

body {
	margin: 0;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	background: var(--creme);
	color: var(--farbe-text);
	font-family: var(--schrift-text);
	font-size: var(--fs-text);
	line-height: 1.6;
	font-optical-sizing: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

img,
svg,
video,
iframe {
	max-width: 100%;
}

img {
	height: auto;
	display: block;
}

a {
	color: inherit;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

a:hover {
	color: var(--farbe-akzent);
}

button {
	font: inherit;
	color: inherit;
}

/* ---------- Typografie ---------- */

h1,
h2,
h3,
h4 {
	font-family: var(--schrift-titel);
	font-weight: 400;
	margin: 0 0 0.5em;
	text-wrap: balance;
}

h1 {
	font-size: var(--fs-h1);
	line-height: 1.08;
	letter-spacing: clamp(-1px, -0.25px - 0.05vw, -0.5px);
}

h2 {
	font-size: var(--fs-h2);
	line-height: 1.15;
	letter-spacing: -0.5px;
}

h3,
h4 {
	font-size: var(--fs-h3);
	line-height: 1.25;
}

p {
	margin: 0 0 1em;
}

.text-display {
	font-family: var(--schrift-titel);
	font-size: var(--fs-display);
	line-height: 1.04;
	letter-spacing: clamp(-1px, -0.25px - 0.05vw, -0.5px);
}

.text-gross {
	font-size: var(--fs-gross);
	line-height: 1.6;
}

.text-meta {
	font-family: var(--schrift-text);
	font-style: italic;
	font-size: var(--fs-meta);
	line-height: 1.5;
	color: var(--farbe-meta);
}

.text-kicker {
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-kicker);
	line-height: 1.4;
	color: var(--farbe-akzent);
}

.text-hand {
	font-family: var(--schrift-hand);
	font-size: var(--fs-hand);
	line-height: 1.2;
}

/* ---------- Rahmen und Seitenlayout ---------- */

.rahmen {
	width: min(100% - 2 * var(--rand), var(--breite-rahmen));
	margin-inline: auto;
}

.seite {
	flex: 1 0 auto;
	padding-bottom: var(--abstand-fuss);
}

.seite:focus {
	outline: none;
}

.seitenkopf {
	width: min(100% - 2 * var(--rand), var(--breite-text));
	margin: clamp(2.5rem, 1.6rem + 3.6vw, 4.5rem) auto clamp(1.75rem, 1.3rem + 1.9vw, 3rem);
}

.seitenkopf__titel {
	margin: 0;
}

/* Inhalt aus dem Block-Editor: Textspalte 720, weit 960, voll 100 % */
.eintrag-inhalt {
	font-size: var(--fs-beitrag);
	line-height: 1.7;
}

.eintrag-inhalt > *,
.eintrag-inhalt > .beitrag-abschnitt > * {
	width: min(100% - 2 * var(--rand), var(--breite-text));
	margin-inline: auto;
	margin-block: 0 1.5em;
}

.eintrag-inhalt > .alignwide,
.eintrag-inhalt > .beitrag-abschnitt > .alignwide {
	width: min(100% - 2 * var(--rand), var(--breite-weit));
}

.eintrag-inhalt > .alignfull,
.eintrag-inhalt > .beitrag-abschnitt > .alignfull {
	width: 100%;
}

/* Benannte Abschnitte in Beiträgen (nur für die Listenansicht im Editor): ohne eigene Gestaltung */
.eintrag-inhalt > .beitrag-abschnitt {
	width: 100%;
}

.eintrag-inhalt > .beitrag-abschnitt > :last-child {
	margin-bottom: 0;
}

.eintrag-inhalt > :last-child {
	margin-bottom: 0;
}

.eintrag-inhalt > h2,
.eintrag-inhalt > h3,
.eintrag-inhalt > .beitrag-abschnitt > h2,
.eintrag-inhalt > .beitrag-abschnitt > h3 {
	margin-top: 1.5em;
	margin-bottom: 0.75em;
}

/* ---------- Kopf ---------- */

.springmarke {
	position: absolute;
	left: 1rem;
	top: -100px;
	z-index: 100;
	padding: 0.75rem 1.25rem;
	border-radius: var(--radius-pille);
	background: var(--anthrazit);
	color: var(--creme);
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-ui);
	text-decoration: none;
}

.springmarke:focus {
	top: 1rem;
	color: var(--creme);
}

.kopf {
	background: var(--creme);
	position: relative;
	z-index: 20;
}

.kopf__innen {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-block: 18px 14px;
}

.logo {
	display: flex;
	flex-direction: column;
	gap: 0;
	text-decoration: none;
	color: var(--anthrazit);
	min-width: 0;
}

.logo:hover {
	color: var(--anthrazit);
}

.logo__name {
	font-family: var(--schrift-titel);
	font-size: var(--fs-logo);
	line-height: 1.2;
}

.logo__claim {
	font-family: var(--schrift-ui);
	font-weight: 400;
	font-size: var(--fs-claim);
	line-height: 1.3;
	color: var(--rostrot);
	white-space: nowrap;
}

.kopf__aktionen {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}

/* Runde Knöpfe (Suche, Menü) */
.rundknopf {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
	border: 0;
	border-radius: var(--radius-pille);
	background: var(--sand);
	color: var(--anthrazit);
	cursor: pointer;
	line-height: 0;
}

.rundknopf svg {
	width: 16px;
	height: 16px;
}

.rundknopf:hover {
	background: color-mix(in srgb, var(--sand), var(--anthrazit) 8%);
}

.rundknopf--menue {
	display: none;
	background: var(--rostrot);
	color: var(--creme);
}

.rundknopf--menue:hover {
	background: color-mix(in srgb, var(--rostrot), var(--anthrazit) 15%);
}

.rundknopf--menue .icon-schliessen,
.rundknopf--menue[aria-expanded="true"] .icon-menue {
	display: none;
}

.rundknopf--menue[aria-expanded="true"] .icon-schliessen {
	display: block;
}

@media (min-width: 960px) {
	.kopf__innen {
		padding-block: 26px 22px;
		gap: 8px;
	}

	.hauptnav {
		margin-left: auto;
	}

	.logo {
		gap: 2px;
	}
}

/* ---------- Hauptnavigation ---------- */

.hauptnav__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 8px;
}

.hauptnav__liste a {
	display: block;
	padding: 9px 18px;
	border-radius: var(--radius-pille);
	background: var(--sand);
	color: var(--anthrazit);
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-ui);
	line-height: 1.4;
	text-decoration: none;
	white-space: nowrap;
}

.hauptnav__liste a:hover {
	background: color-mix(in srgb, var(--sand), var(--anthrazit) 8%);
	color: var(--anthrazit);
}

.hauptnav__liste .current-menu-item > a,
.hauptnav__liste .current-menu-ancestor > a,
.hauptnav__liste .current_page_parent > a,
.hauptnav__liste a[aria-current="page"] {
	background: var(--rostrot);
	color: var(--creme);
}

/* Mobil: Menüknopf statt Pillen; das Menü öffnet als Vollbild (.mobilmenue) */
@media (max-width: 959.98px) {
	.rundknopf {
		padding: 9px;
	}

	.rundknopf svg {
		width: 18px;
		height: 18px;
	}

	.rundknopf--menue {
		display: inline-flex;
	}

	.rundknopf--menue svg,
	.mobilmenue__schliessen svg {
		width: 22px;
		height: 22px;
	}

	.kopf__aktionen {
		gap: 6px;
	}

	.kopf__innen {
		flex-wrap: wrap;
	}

	.hauptnav {
		display: none;
	}
}

/* Ohne JavaScript bleibt das Menü auf Mobil als Liste sichtbar */
@media (max-width: 959.98px) {
	html:not(.js) .hauptnav {
		display: block;
		order: 3;
		flex-basis: 100%;
	}

	html:not(.js) .hauptnav__liste {
		flex-wrap: wrap;
		padding-block: 0.5rem 0.75rem;
	}

	html:not(.js) .rundknopf--menue,
	html:not(.js) .rundknopf--suche {
		display: none;
	}
}

/* Vollbild-Menü (Mobil) */
.mobilmenue {
	position: fixed;
	inset: 0;
	z-index: 50;
	display: flex;
	flex-direction: column;
	overflow-y: auto;
	overscroll-behavior: contain;
	background: var(--creme);
}

.mobilmenue[hidden] {
	display: none;
}

html.menue-offen {
	overflow: hidden;
}

.mobilmenue__kopf {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 18px 20px 14px;
}

.mobilmenue__kopf .logo {
	flex: 1 1 0;
	order: 1;
}

.mobilmenue__schliessen {
	order: 2;
}

.mobilmenue__kopf .logo__claim {
	white-space: normal;
	text-wrap: balance;
}

.rundknopf--rostrot {
	background: var(--rostrot);
	color: var(--creme);
}

.rundknopf--rostrot:hover {
	background: color-mix(in srgb, var(--rostrot), var(--anthrazit) 15%);
}

.mobilmenue__suche {
	padding: 12px 20px 8px;
}

.mobilnav {
	padding: 4px 20px 32px;
}

.mobilnav__liste {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mobilnav__liste > li {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding-block: 14px;
	border-bottom: 2px solid var(--sand);
}

.mobilnav__liste > li > a {
	font-family: var(--schrift-titel);
	font-size: var(--fs-h2);
	line-height: 1.18;
	text-decoration: none;
	color: var(--anthrazit);
}

.mobilnav__liste > li > a:hover,
.mobilnav__liste .current-menu-item > a,
.mobilnav__liste .current-menu-ancestor > a,
.mobilnav__liste .current_page_parent > a,
.mobilnav__liste a[aria-current="page"] {
	color: var(--rostrot);
}

.mobilnav__rubriken {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
}

.pille {
	display: block;
	padding: 7px 14px;
	border-radius: var(--radius-pille);
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-ui);
	line-height: 1.4;
	text-decoration: none;
}

.pille--rostrot { background: var(--rostrot); color: var(--weiss); }
.pille--oliv { background: var(--oliv); color: var(--weiss); }
.pille--sand { background: var(--sand); color: var(--anthrazit); }

.pille:hover {
	color: inherit;
	text-decoration: underline;
}

.pille--rostrot:hover,
.pille--oliv:hover {
	color: var(--weiss);
}

.mobilmenue__fuss {
	--farbe-fokus: var(--creme);
	margin-top: auto;
	padding: 22px 24px 30px;
	border-radius: 28px 28px 0 0;
	background: var(--oliv);
	color: var(--creme);
}

.mobilmenue__fuss .fussnav__liste {
	padding: 0;
}

@media (min-width: 960px) {
	.mobilmenue {
		display: none !important;
	}
}

/* Mobil: Claim bricht nur bei Platzmangel, dann in zwei ausgewogene Zeilen */
@media (max-width: 959.98px) {
	.kopf__innen {
		gap: 0 12px;
	}

	.logo {
		flex: 1 1 0;
	}

	.logo__claim {
		white-space: normal;
		text-wrap: balance;
	}
}

/* ---------- Suche ---------- */

.kopfsuche {
	padding-bottom: 1rem;
}

.kopfsuche[hidden] {
	display: none;
}

.kopfsuche .suchformular {
	margin-left: auto;
}

.suchformular {
	display: flex;
	align-items: center;
	gap: 10px;
	max-width: 640px;
}

.suchformular__eingabe {
	position: relative;
	flex: 1;
	min-width: 0;
}

.suchformular__lupe {
	position: absolute;
	left: 20px;
	top: 50%;
	width: 18px;
	height: 18px;
	transform: translateY(-50%);
	color: var(--anthrazit);
	pointer-events: none;
}

.suchformular__feld {
	width: 100%;
	height: 52px;
	padding: 0 20px 0 50px;
	border: 1px solid transparent;
	border-radius: var(--radius-pille);
	background: var(--weiss);
	color: var(--anthrazit);
	font-family: var(--schrift-text);
	font-size: var(--fs-text);
	line-height: 1.6;
	-webkit-appearance: none;
	appearance: none;
}

.suchformular__feld::placeholder {
	color: var(--gedaempft);
	opacity: 1;
}

.suchformular__feld:focus-visible {
	outline: 2px solid var(--rostrot);
	outline-offset: 1px;
}

@media (max-width: 639.98px) {
	.suchformular__knopf {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		clip-path: inset(50%);
	}
}

/* Suchergebnisse */
.suchkopf__formular {
	width: 100%;
	padding-top: 8px;
}

.treffer__liste {
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: 800px;
}

.treffer__eintrag {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 28px 0 30px;
	border-top: 2px solid var(--sand);
}

.treffer__eintrag p,
.treffer__titel {
	margin: 0;
}

.treffer__titel {
	font-size: var(--fs-h3);
	line-height: 1.25;
}

.treffer__titel a {
	text-decoration: none;
}

.treffer__titel a:hover {
	text-decoration: underline;
	color: inherit;
}

.treffer__text {
	font-size: var(--fs-text);
	line-height: 1.6;
}

.etikett--still {
	color: var(--gedaempft);
}

.treffer__leer {
	max-width: 660px;
	padding-top: 12px;
	border-top: 2px solid var(--sand);
	font-size: var(--fs-gross);
}

.fehler__knoepfe {
	padding-top: 8px;
}

/* ---------- Fuß ---------- */

.fuss {
	--farbe-text: var(--creme);
	--farbe-akzent: var(--creme);
	--farbe-fokus: var(--creme);
	background: var(--oliv);
	color: var(--creme);
	border-radius: 36px 36px 0 0;
	padding-block: 44px 48px;
	flex-shrink: 0;
}

.fuss__innen {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
}

.fuss__stapel {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.fuss__kicker a {
	color: inherit;
	text-decoration: none;
}

.fuss__kicker a:hover {
	text-decoration: underline;
}

.fuss__kicker {
	margin: 0;
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: clamp(1.125rem, 1.079rem + 0.1905vw, 1.25rem);
	line-height: 1.3;
}

.fuss__name {
	margin: 0;
	font-family: var(--schrift-titel);
	font-size: var(--fs-h2);
	line-height: 1.18;
	letter-spacing: 0;
}

.fussnav__liste {
	list-style: none;
	margin: 0;
	padding: 10px 0 18px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
}

.fussnav__liste a {
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-ui);
	line-height: 1.4;
	text-decoration: none;
	color: var(--creme);
}

.fussnav__liste a:hover {
	text-decoration: underline;
	color: var(--creme);
}

@media (min-width: 960px) {
	.fuss {
		border-radius: 56px 56px 0 0;
		padding-block: 64px 60px;
	}

	.fuss__innen {
		flex-direction: row;
		align-items: flex-end;
		justify-content: space-between;
		gap: 2rem;
	}

	.fuss__stapel {
		gap: 6px;
	}

	.fuss__name {
		line-height: 1.15;
		letter-spacing: -0.2px;
	}

	.fussnav__liste {
		gap: 24px;
		padding: 14px 0 0;
	}
}

/* Agenturlogo im Impressum: ohne Bildrahmen. */
.wp-block-image.logo-agentur {
	margin-block: 4px 0;
}

.wp-block-image.logo-agentur img {
	max-width: 100%;
	height: auto;
	border-radius: 0;
	box-shadow: none;
}

/* Vermerk unter dem Fuß: Jahr, Name, Agentur. */
.fuss__vermerk {
	margin: clamp(24px, 16px + 2vw, 40px) auto 0;
	padding-top: 16px;
	border-top: 1px solid color-mix(in srgb, var(--creme) 30%, transparent);
	font-family: var(--schrift-ui);
	font-size: var(--fs-ui);
	line-height: 1.5;
}

/* ---------- Knöpfe ---------- */

.knopf,
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 22px;
	border: 0;
	border-radius: var(--radius-pille);
	background: var(--knopf-hg);
	color: var(--knopf-text);
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-ui);
	line-height: 1.4;
	text-decoration: none;
	cursor: pointer;
}

.knopf:hover,
.wp-block-button__link:hover {
	background: color-mix(in srgb, var(--knopf-hg), var(--anthrazit) 8%);
	color: var(--knopf-text);
}

.knopf svg {
	width: 15px;
	height: 15px;
	flex-shrink: 0;
}

.knopf--weiss {
	--knopf-hg: var(--weiss);
	--knopf-text: var(--anthrazit);
}

.knopf--sand {
	--knopf-hg: var(--sand);
	--knopf-text: var(--anthrazit);
}

.knopf--rostrot {
	--knopf-hg: var(--rostrot);
	--knopf-text: var(--weiss);
}

.knopf--dunkel,
.is-style-dunkel .wp-block-button__link {
	--knopf-hg: var(--anthrazit);
	--knopf-text: var(--weiss);
}

.is-style-sand .wp-block-button__link {
	--knopf-hg: var(--sand);
	--knopf-text: var(--anthrazit);
}

.is-style-weiss .wp-block-button__link {
	--knopf-hg: var(--weiss);
	--knopf-text: var(--anthrazit);
}

.knopf--dunkel:hover,
.is-style-dunkel .wp-block-button__link:hover {
	background: color-mix(in srgb, var(--anthrazit), var(--weiss) 15%);
}

/* Pfeil an Block-Knöpfen (Deko über CSS) */
.wp-block-button__link::after {
	content: "";
	width: 15px;
	height: 15px;
	flex-shrink: 0;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h15M13 6l6 6-6 6'/%3E%3C/svg%3E") center / contain no-repeat;
}

.wp-block-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 12px;
	align-items: center;
}

/* ---------- Blöcke (Grundwerte, Details in späteren Etappen) ---------- */

.eintrag-inhalt img {
	border-radius: clamp(16px, 13.8px + 0.57vw, 22px);
}

.eintrag-inhalt .wp-block-gallery {
	--wp--style--gallery-gap-default: 16px;
	gap: 16px;
}

.eintrag-inhalt .wp-block-gallery.has-nested-images figure.wp-block-image img {
	border-radius: clamp(16px, 13.8px + 0.57vw, 22px);
}

.wp-element-caption,
.wp-block-image figcaption,
.wp-block-gallery figcaption {
	margin-top: 10px;
	font-family: var(--schrift-text);
	font-style: italic;
	font-size: var(--fs-meta);
	line-height: 1.5;
	color: var(--farbe-meta);
	text-align: left;
}

.wp-block-quote {
	margin-inline: auto;
	padding: 6px 0 6px clamp(20px, 15px + 1.2vw, 28px);
	border-left: 4px solid var(--farbe-akzent);
	font-family: var(--schrift-titel);
	font-size: var(--fs-zitat);
	line-height: 1.25;
}

.wp-block-quote p:last-of-type {
	margin-bottom: 0;
}

.wp-block-quote cite {
	display: block;
	margin-top: 0.75rem;
	font-family: var(--schrift-ui);
	font-style: normal;
	font-size: var(--fs-ui);
}

.wp-block-media-text {
	gap: clamp(20px, 12px + 2vw, 40px);
}

.wp-block-media-text > .wp-block-media-text__content {
	padding: 0;
}

.wp-block-media-text__media img {
	border-radius: clamp(16px, 13.8px + 0.57vw, 22px);
}

@media (max-width: 600px) {
	.wp-block-media-text.is-stacked-on-mobile {
		gap: 16px;
	}
}

.wp-block-separator {
	border: 0;
	border-top: 1px solid color-mix(in srgb, currentColor 25%, transparent);
}

.has-normal-font-size {
	font-size: var(--fs-beitrag) !important;
}

.has-gross-font-size {
	font-size: var(--fs-h3) !important;
	line-height: 1.5;
}

/* ---------- Block-Stile ---------- */

.is-style-handschrift {
	font-family: var(--schrift-hand);
	font-size: var(--fs-hand);
	line-height: 1.2;
	color: var(--farbe-akzent);
}

.is-style-kicker {
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-kicker);
	line-height: 1.4;
	color: var(--farbe-akzent);
}

.is-style-display {
	font-size: var(--fs-display);
	line-height: 1.04;
	letter-spacing: -0.01em;
	text-wrap: wrap;
}

/* Farbbox (Gruppe mit Hintergrund): Fläche, Mit Linie, Groß. :where() hält eigene Musterklassen vorrangig. */
:where(.wp-block-group.has-background) {
	padding: clamp(22px, 18px + 1vw, 32px) clamp(22px, 16px + 1.5vw, 36px);
	border-radius: clamp(16px, 13.8px + 0.57vw, 22px);
}

:where(.wp-block-group.has-background) > :first-child {
	margin-top: 0;
}

:where(.wp-block-group.has-background) > :last-child {
	margin-bottom: 0;
}

.wp-block-group.is-style-linie {
	border-left: 4px solid var(--farbe-akzent);
	border-radius: 0 clamp(16px, 13.8px + 0.57vw, 22px) clamp(16px, 13.8px + 0.57vw, 22px) 0;
}

.wp-block-group.is-style-gross {
	padding: clamp(32px, 24px + 2vw, 56px);
	font-size: var(--fs-h3);
	line-height: 1.5;
}

.wp-block-image.is-style-rund-oliv img,
.wp-block-image.is-style-rund-sand img {
	width: 100%;
	aspect-ratio: 1;
	object-fit: cover;
	border-radius: 50%;
}

.wp-block-image.is-style-rund-oliv img {
	border: clamp(5px, 3px + 0.5vw, 8px) solid var(--oliv);
}

.wp-block-image.is-style-rund-sand {
	padding: 8%;
	border-radius: 50%;
	background: var(--sand);
}

.wp-block-image.is-style-gerahmt img {
	width: 100%;
	aspect-ratio: 250 / 320;
	object-fit: cover;
	border: clamp(6px, 4px + 0.6vw, 10px) solid var(--weiss);
	border-radius: clamp(11px, 8px + 1vw, 18px);
	transform: rotate(6deg);
	box-shadow: 0 10px 30px rgb(41 39 37 / 0.12);
}

.is-style-stempel {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 116px;
	aspect-ratio: 1;
	padding: 12px;
	border-radius: 50%;
	background: var(--rostrot);
	color: var(--weiss);
	font-family: var(--schrift-ui);
	font-weight: 700;
	font-size: 1rem;
	line-height: 1.15;
	text-align: center;
	text-wrap: balance;
}

.is-style-stempel a {
	color: inherit;
	text-decoration: none;
}

/* Zweizeilig wie in Figma („Neu“ / „hier?“) */
.is-style-stempel a {
	display: block;
	width: min-content;
	margin-inline: auto;
}

.is-style-stempel a:hover {
	color: inherit;
	text-decoration: underline;
}

/* ---------- Startseite ---------- */

.seite--start {
	padding-bottom: 0;
}

.seite--start .wp-block-group,
.seite--start p {
	margin: 0;
}

.seite--start .wp-block-image {
	margin: 0;
}

/* Begrüßung */
.start-begruessung {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding-block: 28px 40px;
}

.start-begruessung__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
}

.start-begruessung__text h1 {
	margin: 0;
}

.start-begruessung__text > p:not([class*="is-style"]) {
	font-size: var(--fs-gross);
	line-height: 1.6;
}

.start-begruessung__text .wp-block-buttons {
	padding-top: 8px;
}

/* Fotokomposition: Kreis (Deko), Porträt, gerahmtes Foto, Stempel */
.start-komposition {
	position: relative;
	width: min(100%, 560px);
	aspect-ratio: 560 / 520;
	margin-inline: auto;
}

.start-komposition::before {
	content: "";
	position: absolute;
	left: 19.64%;
	top: 5.77%;
	width: 76.79%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: var(--sand);
}

.start-komposition > .wp-block-image,
.start-komposition > .is-style-stempel {
	position: absolute;
}

.start-komposition > .is-style-rund-oliv {
	left: 3.57%;
	top: 38.46%;
	width: 51.79%;
	z-index: 1;
}

.start-komposition > .is-style-gerahmt {
	left: 48.68%;
	top: 5.04%;
	width: 44.64%;
	z-index: 2;
}

.start-komposition > .is-style-stempel {
	left: 73.2%;
	top: 69.2%;
	width: 20.7%;
	min-width: 72px;
	z-index: 3;
}

/* Abschnitte */
.start-abschnitt + .start-abschnitt,
.start-liste,
.start-themen {
	margin-top: clamp(3.5rem, 2.38rem + 4.6vw, 6.5rem);
}

.start-abschnitt--top {
	margin-top: 0;
}

.abschnittskopf {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: clamp(1.75rem, 1.5rem + 1.14vw, 2.5rem);
}

.abschnittskopf__hand {
	margin: 0 0 2px;
	color: var(--rostrot);
}

.abschnittskopf__titel {
	margin: 0;
	font-size: var(--fs-h2);
	line-height: 1.15;
}

.abschnittskopf__knopf {
	display: none;
}

.start-liste__knopf-mobil {
	margin-top: 28px;
}

/* Hervorgehobener Beitrag */
.hervorgehoben {
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding: 18px;
	border-radius: 26px;
	background: var(--sand);
}

.hervorgehoben__bild img {
	width: 100%;
	height: 214px;
	object-fit: cover;
	border-radius: 18px;
}

.hervorgehoben__inhalt {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding: 0 6px 8px;
}

.hervorgehoben__inhalt p,
.hervorgehoben__titel {
	margin: 0;
}

.hervorgehoben__titel {
	font-size: var(--fs-h2);
	line-height: 1.15;
}

.hervorgehoben__titel a,
.karte__titel a {
	text-decoration: none;
}

.hervorgehoben__titel a:hover,
.karte__titel a:hover {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	color: inherit;
}

.hervorgehoben__text,
.karte__text {
	font-size: var(--fs-text);
	line-height: 1.6;
}

.hervorgehoben__knopf {
	padding-top: 6px;
}

/* Beitragskarten */
.karten {
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px;
}

.karte {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.karte__bild {
	display: block;
}

.karte--links .karte__bild,
.karte--rechts .karte__bild,
.karte--leicht .karte__bild {
	padding-block: 6px;
}

.karte__bild img,
.karte__bild:empty {
	width: 100%;
	height: 262px;
	object-fit: cover;
	border-radius: 22px;
}

.karte__bild:empty {
	background: var(--sand);
}

.karte--links .karte__bild > * { transform: rotate(2deg); }
.karte--rechts .karte__bild > * { transform: rotate(-1.5deg); }
.karte--leicht .karte__bild > * { transform: rotate(1deg); }
.karte--links .karte__bild:empty { transform: rotate(2deg); }
.karte--rechts .karte__bild:empty { transform: rotate(-1.5deg); }
.karte--leicht .karte__bild:empty { transform: rotate(1deg); }

.karte__inhalt {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: 6px 4px 0;
}

.karte__inhalt p,
.karte__titel {
	margin: 0;
}

.karte__titel {
	font-size: var(--fs-h3);
	line-height: 1.25;
}

.etikett {
	display: inline-block;
	padding: 5px 11px;
	border-radius: var(--radius-pille);
	background: var(--sand);
	color: var(--rostrot);
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-tag);
	line-height: 1.3;
	text-decoration: none;
}

.etikett:hover {
	background: color-mix(in srgb, var(--sand), var(--anthrazit) 8%);
	color: var(--rostrot);
}

/* Rubrikkacheln */
.start-themen .abschnittskopf__titel {
	margin-bottom: 20px;
}

.kacheln {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}

.kachel {
	--farbe-fokus: var(--anthrazit);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 118px;
	padding: 18px 22px 20px;
	border-radius: 22px;
	text-decoration: none;
}

.kachel--rostrot {
	--farbe-fokus: var(--rostrot);
	--kachel-hg: var(--rostrot);
	--kachel-text: var(--weiss);
}

.kachel--oliv {
	--farbe-fokus: var(--oliv);
	--kachel-hg: var(--oliv);
	--kachel-text: var(--weiss);
}

.kachel--sand {
	--kachel-hg: var(--sand);
	--kachel-text: var(--anthrazit);
}

/* Textfarbe in allen Zuständen fest (keine globale a:hover-Farbe auf farbigen Flächen) */
.kachel,
.kachel:visited,
.kachel:hover,
.kachel:focus {
	background: var(--kachel-hg);
	color: var(--kachel-text);
}

/* Hover und Fokus: Fläche leicht dunkler, Name unterstrichen, Pfeil rückt nach rechts */
.kachel:hover,
.kachel:focus-visible {
	background: color-mix(in srgb, var(--kachel-hg), var(--anthrazit) 10%);
}

.kachel:hover .kachel__name,
.kachel:focus-visible .kachel__name {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.18em;
}

.kachel svg {
	transition: transform 0.2s ease;
}

.kachel:hover svg,
.kachel:focus-visible svg {
	transform: translateX(4px);
}

@media (prefers-reduced-motion: reduce) {
	.kachel svg {
		transition: none;
	}
}

.kachel__kurzzeile {
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-kicker);
	line-height: 1.4;
}

.kachel__reihe {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.kachel__name {
	font-family: var(--schrift-titel);
	font-size: var(--fs-h3);
	line-height: 1.25;
}

.kachel svg {
	width: 20px;
	height: 20px;
	flex-shrink: 0;
}

/* Ich bin Grit */
.start-ueber {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 28px;
	padding-block: 64px 72px;
}

.start-ueber > .is-style-rund-sand {
	width: min(100%, 300px);
	padding: 32px;
}

.start-ueber__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	width: 100%;
}

.start-ueber__text h2 {
	margin: 0;
	font-size: var(--fs-h2);
}

.start-ueber__text > p {
	font-size: var(--fs-gross);
	line-height: 1.6;
}

.start-ueber__text .wp-block-buttons {
	padding-top: 6px;
}

@media (min-width: 640px) {
	.karten {
		grid-template-columns: repeat(2, 1fr);
		gap: 40px 30px;
	}

	.kacheln {
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
	}

	.kachel {
		height: 168px;
		padding: 24px 28px 26px;
		border-radius: 26px;
	}
}

@media (min-width: 960px) {
	.start-begruessung {
		flex-direction: row;
		align-items: center;
		gap: 40px;
		padding-block: 56px 88px;
	}

	.start-begruessung__text {
		flex: 0 1 600px;
		gap: 20px;
	}

	.start-komposition {
		flex: 0 1 560px;
		margin: 0;
	}

	.hervorgehoben {
		flex-direction: row;
		align-items: center;
		gap: 48px;
		padding: 30px;
		border-radius: 36px;
	}

	.hervorgehoben__bild {
		flex: 0 0 min(560px, 50%);
	}

	.hervorgehoben__bild img {
		height: 380px;
		border-radius: 24px;
	}

	.hervorgehoben__inhalt {
		flex: 1;
		gap: 16px;
		padding: 0 24px 0 0;
	}

	.karten {
		grid-template-columns: repeat(3, 1fr);
	}

	.abschnittskopf__knopf {
		display: inline-flex;
	}

	.start-liste__knopf-mobil {
		display: none;
	}

	.start-themen .abschnittskopf__titel {
		margin-bottom: 28px;
	}

	.start-ueber {
		flex-direction: row;
		gap: 80px;
		padding: 112px 0 128px 20px;
	}

	.start-ueber > .is-style-rund-sand {
		flex: 0 0 400px;
		width: 400px;
	}

	.start-ueber__text {
		flex: 0 1 580px;
		gap: 18px;
	}
}

/* ---------- Blog und Rubrik ---------- */

.listenkopf {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding-block: 36px 28px;
}

.listenkopf .text-kicker,
.listenkopf__titel {
	margin: 0;
}

.listenkopf__titel {
	font-size: var(--fs-h1);
	line-height: 1.08;
}

.listenkopf__text {
	max-width: 660px;
	font-size: var(--fs-gross);
	line-height: 1.6;
}

.listenkopf__text > :last-child {
	margin-bottom: 0;
}

.filter__liste {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 8px 0 0;
}

.filter__punkt {
	display: block;
	padding: 9px 18px;
	border-radius: var(--radius-pille);
	background: var(--sand);
	color: var(--anthrazit);
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-ui);
	line-height: 1.4;
	text-decoration: none;
	white-space: nowrap;
}

.filter__punkt:hover {
	background: color-mix(in srgb, var(--sand), var(--anthrazit) 8%);
	color: var(--anthrazit);
}

.filter__punkt[aria-current="page"] {
	background: var(--rostrot);
	color: var(--weiss);
}

.raster {
	padding-top: 8px;
}

.raster__leer {
	font-size: var(--fs-gross);
}

.seitennavigation {
	margin-top: clamp(2.5rem, 2rem + 2vw, 4rem);
}

.seitennavigation .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.seitennavigation .page-numbers {
	display: block;
	min-width: 40px;
	padding: 9px 16px;
	border-radius: var(--radius-pille);
	background: var(--sand);
	color: var(--anthrazit);
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-ui);
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
}

.seitennavigation .page-numbers.current {
	background: var(--rostrot);
	color: var(--weiss);
}

/* Reihenbox */
.reihenbox {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 12px;
	padding: 30px 30px 32px;
	border-left: 5px solid var(--rostrot);
	border-radius: 26px;
	background: var(--sand);
}

.reihenbox p {
	margin: 0;
}

.reihenbox__kicker {
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-kicker);
	line-height: 1.4;
	color: var(--rostrot);
}

.reihenbox__titel {
	font-family: var(--schrift-titel);
	font-size: var(--fs-h2);
	line-height: 1.15;
	letter-spacing: -0.5px;
	text-wrap: balance;
}

.reihenbox__text {
	font-size: var(--fs-text);
	line-height: 1.6;
}

.reihenbox__teile {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	padding: 8px 0 0;
}

.reihenbox__teil {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 12px 16px;
	border-radius: 14px;
	background: var(--creme);
	font-family: var(--schrift-ui);
	font-weight: 500;
	text-decoration: none;
}

.reihenbox__teil:hover {
	background: var(--weiss);
	color: var(--anthrazit);
}

.reihenbox__teil[aria-current="page"] {
	background: var(--weiss);
	box-shadow: inset 0 0 0 2px var(--rostrot);
}

.reihenbox__nr {
	font-size: var(--fs-tag);
	line-height: 1.3;
	color: var(--rostrot);
}

.reihenbox__name {
	font-size: var(--fs-ui);
	line-height: 1.4;
	color: var(--anthrazit);
}

/* ---------- Beitrag ---------- */

.beitragskopf,
.beitragsfuss {
	width: min(100% - 2 * var(--rand), var(--breite-text));
	margin-inline: auto;
}

.beitragskopf {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(12px, 10.5px + 0.38vw, 18px);
	padding-top: clamp(36px, 26.7px + 2.4vw, 72px);
}

.beitragskopf p,
.beitragskopf__titel {
	margin: 0;
}

.beitragskopf__titel {
	font-size: var(--fs-h1);
	line-height: 1.08;
}

.beitragskopf__text {
	font-size: var(--fs-gross);
	line-height: 1.6;
	color: var(--gedaempft);
}

.titelbild {
	width: min(100% - 2 * var(--rand), var(--breite-weit));
	margin: 30px auto 0;
	padding-block: 14px;
}

.titelbild img {
	width: 100%;
	aspect-ratio: 960 / 580;
	object-fit: cover;
	border-radius: clamp(18px, 14.3px + 0.95vw, 28px);
}

.seite--beitrag .eintrag-inhalt {
	margin-top: 30px;
}

.seite--beitrag .eintrag-inhalt > h2,
.seite--beitrag .eintrag-inhalt > h3,
.seite--beitrag .eintrag-inhalt > .beitrag-abschnitt > h2,
.seite--beitrag .eintrag-inhalt > .beitrag-abschnitt > h3 {
	margin-top: 0;
	margin-bottom: 30px;
}

.beitragsfuss {
	display: flex;
	flex-direction: column;
	gap: 30px;
	margin-top: 30px;
}

.schlagworte {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 6px 0 0;
}

.autorin {
	display: flex;
	align-items: center;
	gap: 18px;
	padding-block: 24px;
	border-block: 2px solid var(--sand);
}

.autorin__bild {
	width: 64px;
	height: 64px;
	flex-shrink: 0;
	border-radius: 50%;
	object-fit: cover;
}

.autorin__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.autorin__text p {
	margin: 0;
}

.autorin__name {
	font-family: var(--schrift-titel);
	font-size: var(--fs-h3);
	line-height: 1.25;
}

.autorin__bio {
	font-size: var(--fs-text);
	line-height: 1.6;
	color: var(--gedaempft);
}

.weiterlesen {
	margin-top: clamp(4rem, 2.9rem + 4.6vw, 6rem);
	padding-top: clamp(2.5rem, 2rem + 2vw, 3.5rem);
	border-top: 2px solid var(--sand);
}

.weiterlesen__kopf {
	flex-direction: column;
	align-items: flex-start;
}

@media (min-width: 640px) {
	.karten--raster {
		row-gap: 64px;
	}
}

@media (min-width: 960px) {
	.listenkopf {
		gap: 16px;
		padding-block: 72px 52px;
	}

	.karten--raster > .reihenbox {
		align-self: start;
	}

	.weiterlesen__kopf {
		flex-direction: row;
		align-items: flex-end;
	}

	.weiterlesen .karten {
		gap: 30px;
	}
}

/* ---------- Freie Seiten (Über mich) ---------- */

.frei-inhalt > * {
	width: min(100% - 2 * var(--rand), var(--breite-rahmen));
	margin-inline: auto;
}

.frei-inhalt p,
.frei-inhalt .wp-block-group,
.frei-inhalt .wp-block-image {
	margin-block: 0;
}

.frei-inhalt .wp-block-group .wp-block-group,
.frei-inhalt .wp-block-group .wp-block-image {
	margin-inline: 0;
}

.is-style-klein {
	font-size: var(--fs-text);
	line-height: 1.6;
}

.wp-block-image.is-style-weiss-gerade img {
	width: 100%;
	aspect-ratio: 420 / 262;
	object-fit: cover;
	border: clamp(8px, 6.5px + 0.4vw, 12px) solid var(--weiss);
	border-radius: 16px;
}

/* Über mich: Einstieg */
.ueber-einstieg {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding-block: 28px 40px;
}

.ueber-einstieg__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
}

.ueber-einstieg__text h1 {
	margin: 0;
}

.ueber-einstieg__text .wp-block-buttons {
	padding-top: 8px;
}

.ueber-komposition {
	position: relative;
	width: min(100%, 540px);
	aspect-ratio: 1;
	margin-inline: auto;
}

.ueber-komposition::before {
	content: "";
	position: absolute;
	left: 11.1%;
	top: 7.4%;
	width: 85.2%;
	aspect-ratio: 1;
	border-radius: 50%;
	background: var(--sand);
}

.ueber-komposition > * {
	position: absolute;
}

.ueber-komposition > .is-style-gerahmt {
	left: 37.1%;
	top: 3.95%;
	width: 59.3%;
	z-index: 1;
}

.ueber-komposition > .is-style-gerahmt img {
	aspect-ratio: 320 / 400;
	border-width: clamp(8px, 6.5px + 0.4vw, 12px);
	border-radius: clamp(16px, 12px + 1vw, 26px);
	transform: rotate(-3deg);
}

.ueber-komposition > .is-style-rund-oliv {
	left: 1.85%;
	top: 53.7%;
	width: 42.6%;
	z-index: 2;
}

.ueber-komposition > .is-style-handschrift {
	left: 46%;
	top: 88%;
	z-index: 3;
	white-space: nowrap;
	transform: rotate(8deg);
	transform-origin: left center;
}

/* Über mich: Fakten, Text, Themen, Fotografie */
.ueber-fakten {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
}

.ueber-fakt {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 18px 22px 20px;
	border-radius: 22px;
}

.ueber-fakt__wert {
	font-family: var(--schrift-titel);
	font-size: var(--fs-h3);
	line-height: 1.25;
}

.ueber-text {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 26px;
	padding-top: clamp(3.5rem, 2.3rem + 4.9vw, 5.5rem);
	font-size: var(--fs-beitrag);
	line-height: 1.7;
}

.ueber-text > p {
	width: min(100%, var(--breite-text));
}

.ueber-themen {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding-top: clamp(3.5rem, 2.3rem + 4.9vw, 6rem);
}

.ueber-themen h2 {
	margin: 0;
}

.ueber-foto {
	display: flex;
	flex-direction: column;
	gap: 32px;
	margin-top: clamp(3.5rem, 2.3rem + 4.9vw, 6rem) !important;
	padding: 36px 24px;
	border-radius: 26px;
}

.ueber-foto__text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
}

.ueber-foto__text h2 {
	margin: 0;
	color: var(--weiss);
}

.ueber-foto__text .wp-block-buttons {
	padding-top: 6px;
}

.ueber-foto__bilder {
	display: flex;
	gap: 18px;
	justify-content: center;
}

.ueber-foto__bilder > .wp-block-image {
	width: min(45%, 220px);
}

.ueber-foto__bilder .is-style-gerahmt img {
	aspect-ratio: 220 / 280;
	border-width: clamp(6px, 4.5px + 0.4vw, 10px);
	border-radius: 12px;
	box-shadow: none;
	transform: rotate(3deg);
}

.ueber-foto__bilder > :nth-child(2) img {
	transform: rotate(-2.5deg);
}

/* Fotografie-Übersicht (Einleitung als benannte Gruppe, im Layout unsichtbar) */
.fotografie-einleitung {
	display: contents;
}

.listenkopf--fotografie > *,
.fotografie-einleitung > * {
	margin: 0;
}

.listenkopf--fotografie h1 {
	max-width: 900px;
	text-wrap: wrap;
	font-size: var(--fs-h1);
	line-height: 1.08;
}

.listenkopf--fotografie > p:not([class*="is-style"]),
.fotografie-einleitung > p:not([class*="is-style"]) {
	max-width: 660px;
	font-size: var(--fs-gross);
	line-height: 1.6;
}

.galeriekarten {
	list-style: none;
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
	padding: 8px 0 0;
}

.galeriekarte {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 12px;
	border-radius: 18px;
	background: var(--weiss);
	text-decoration: none;
	box-shadow: 0 6px 24px rgb(41 39 37 / 0.06);
	transform: rotate(1.2deg);
	transition: transform 0.2s ease;
}

.galeriekarten > li:nth-child(4n + 2) .galeriekarte { transform: rotate(-1.2deg); }
.galeriekarten > li:nth-child(4n + 3) .galeriekarte { transform: rotate(-1deg); }
.galeriekarten > li:nth-child(4n + 4) .galeriekarte { transform: rotate(1deg); }

.galeriekarte:hover {
	transform: rotate(0deg) !important;
	color: inherit;
}

.galeriekarte__bild {
	display: block;
	border-radius: 14px;
	overflow: hidden;
	background: var(--sand);
	aspect-ratio: 538 / 360;
}

.galeriekarte__bild img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.galeriekarte__fuss {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	padding: 0 6px 4px;
}

.galeriekarte__titel {
	font-family: var(--schrift-titel);
	font-size: var(--fs-h3);
	line-height: 1.25;
}

.galeriekarte__art {
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-kicker);
	color: var(--rostrot);
	white-space: nowrap;
}

/* Galerie */
.galeriekopf {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
	padding-block: 32px 12px;
}

.galeriekopf__zurueck {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.galeriekopf__zurueck svg {
	width: 15px;
	height: 15px;
	transform: scaleX(-1);
}

.galeriekopf__titel {
	padding-top: 8px;
}

.galeriekopf__titel p,
.galeriekopf__titel h1 {
	margin: 0;
}

.galeriekopf__titel h1 {
	font-size: var(--fs-h1);
	line-height: 1.08;
}

.galerie-inhalt {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.galerie-inhalt > p:not(.text-meta) {
	max-width: 660px;
	margin: 0;
	font-size: var(--fs-gross);
	line-height: 1.6;
}

/* Texte zwischen den Fotos (aus lezovic.com übernommen): Zitate so breit wie die Absätze. */
.galerie-inhalt > .wp-block-quote {
	max-width: 660px;
	margin: clamp(8px, 4px + 1vw, 16px) 0;
}

.galerie-inhalt > .wp-block-gallery + p,
.galerie-inhalt > .wp-block-gallery + .wp-block-quote {
	margin-top: clamp(8px, 4px + 1vw, 16px);
}

.galerie-inhalt__meta {
	margin: 0 0 clamp(12px, 6px + 1.5vw, 28px);
}

/* Mosaik ohne Beschnitt: Bilder behalten ihr Seitenverhältnis, Zeilen füllen die Breite */
.galerie-inhalt .wp-block-gallery.has-nested-images,
.abschnitt--galerie .wp-block-gallery.has-nested-images {
	--zeile: clamp(200px, 120px + 22vw, 440px);
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin: 0;
}

.galerie-inhalt .wp-block-gallery.has-nested-images::after,
.abschnitt--galerie .wp-block-gallery.has-nested-images::after {
	content: "";
	flex-grow: 999;
}

.galerie-inhalt .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image),
.abschnitt--galerie .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
	flex: var(--ar, 1.5) 1 calc(var(--ar, 1.5) * var(--zeile));
	width: auto;
	max-width: 100%;
	margin: 0;
}

.galerie-inhalt .wp-block-gallery.ist-mosaik figure.wp-block-image:not(#individual-image),
.abschnitt--galerie .wp-block-gallery.ist-mosaik figure.wp-block-image:not(#individual-image) {
	flex: 0 0 auto;
}

.galerie-inhalt .wp-block-gallery.ist-mosaik::after,
.abschnitt--galerie .wp-block-gallery.ist-mosaik::after {
	display: none;
}

.galerie-inhalt .wp-block-gallery.has-nested-images figure.wp-block-image img,
.galerie-inhalt .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) img,
.abschnitt--galerie .wp-block-gallery.has-nested-images figure.wp-block-image img,
.abschnitt--galerie .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) img {
	width: 100%;
	height: auto;
	aspect-ratio: var(--ar, 1.5);
	object-fit: cover;
	border-radius: clamp(14px, 10px + 1vw, 24px);
}

.galerienav {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	margin-top: clamp(2.5rem, 1.8rem + 2.8vw, 4rem);
}

.galerienav__karte {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 18px 22px 20px;
	border-radius: 22px;
	background: var(--sand);
	text-decoration: none;
}

.galerienav__karte:hover {
	background: color-mix(in srgb, var(--sand), var(--anthrazit) 6%);
	color: var(--anthrazit);
}

.galerienav__karte--weiter {
	align-items: flex-end;
	text-align: right;
}

.galerienav__kicker {
	font-family: var(--schrift-ui);
	font-weight: 500;
	font-size: var(--fs-kicker);
	color: var(--rostrot);
}

.galerienav__titel {
	font-family: var(--schrift-titel);
	font-size: var(--fs-h3);
	line-height: 1.25;
}

@media (min-width: 640px) {
	.ueber-fakten {
		grid-template-columns: repeat(3, 1fr);
		gap: 20px;
	}

	.ueber-fakt {
		padding: 22px 28px 24px;
		border-radius: 24px;
	}

	.galeriekarten {
		grid-template-columns: repeat(2, 1fr);
		gap: 48px 40px;
	}

	.galeriekarte {
		padding: 16px;
		border-radius: 22px;
	}

	.galerienav {
		grid-template-columns: 1fr 1fr;
		gap: 20px;
	}

	.galerienav__karte {
		padding: 22px 28px 24px;
		border-radius: 26px;
	}
}

@media (min-width: 960px) {
	.ueber-einstieg {
		flex-direction: row;
		align-items: center;
		gap: 56px;
		padding-block: 56px 80px;
	}

	.ueber-einstieg__text {
		flex: 0 1 600px;
		gap: 20px;
	}

	.ueber-komposition {
		flex: 0 1 540px;
		margin: 0;
	}

	.ueber-themen {
		gap: 28px;
	}

	.ueber-foto {
		flex-direction: row;
		align-items: center;
		gap: 48px;
		padding: 52px 56px;
		border-radius: 36px;
	}

	.ueber-foto__text {
		flex: 1;
	}

	.ueber-foto__bilder > .wp-block-image {
		width: 220px;
	}


	.listenkopf--fotografie {
		padding-block: 64px 56px;
	}

	.galeriekopf {
		padding-block: 52px 28px;
	}
}

/* ---------- Auto-Kontrast je Hintergrundfarbe ---------- */

.has-creme-background-color,
.has-sand-background-color,
.has-weiss-background-color {
	--farbe-text: var(--anthrazit);
	--farbe-meta: var(--gedaempft);
	--farbe-akzent: var(--rostrot);
	--farbe-fokus: var(--rostrot);
	--knopf-hg: var(--rostrot);
	--knopf-text: var(--weiss);
	color: var(--anthrazit);
}

.has-sand-background-color {
	--knopf-hg: var(--weiss);
	--knopf-text: var(--anthrazit);
}

.has-rostrot-background-color,
.has-oliv-background-color,
.has-anthrazit-background-color {
	--farbe-text: var(--creme);
	--farbe-meta: var(--creme);
	--farbe-akzent: var(--creme);
	--farbe-fokus: var(--creme);
	--knopf-hg: var(--weiss);
	--knopf-text: var(--anthrazit);
	color: var(--creme);
}

/* Textfarben aus dem Editor überschreiben den Auto-Kontrast nur, wenn sie lesbar sind */
.has-rostrot-background-color .has-rostrot-color,
.has-oliv-background-color .has-oliv-color,
.has-rostrot-background-color.has-anthrazit-color,
.has-oliv-background-color.has-anthrazit-color {
	color: var(--creme) !important;
}

.has-creme-background-color { background-color: var(--creme); }
.has-anthrazit-background-color { background-color: var(--anthrazit); }
.has-rostrot-background-color { background-color: var(--rostrot); }
.has-sand-background-color { background-color: var(--sand); }
.has-oliv-background-color { background-color: var(--oliv); }
.has-weiss-background-color { background-color: var(--weiss); }

.has-creme-color { color: var(--creme); }
.has-anthrazit-color { color: var(--anthrazit); }
.has-rostrot-color { color: var(--rostrot); }
.has-sand-color { color: var(--sand); }
.has-oliv-color { color: var(--oliv); }
.has-weiss-color { color: var(--weiss); }

/* ---------- Barrierefreiheit ---------- */

:focus-visible {
	outline: 2px solid var(--farbe-fokus);
	outline-offset: 3px;
}

.rundknopf:focus-visible,
.hauptnav__liste a:focus-visible,
.knopf:focus-visible {
	outline-offset: 2px;
}

.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ---------- Editor: Galerie als Mosaik ohne Beschnitt (statt quadratischem Raster) ---------- */
.editor-styles-wrapper .wp-block-gallery.galerie-mosaik.has-nested-images {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.editor-styles-wrapper .wp-block-gallery.galerie-mosaik.has-nested-images figure.wp-block-image:not(#individual-image) {
	flex: 0 0 auto !important;
	width: auto !important;
	max-width: 100%;
	height: 220px;
	margin: 0 !important;
}

.editor-styles-wrapper .wp-block-gallery.galerie-mosaik.has-nested-images figure.wp-block-image:not(#individual-image) > div,
.editor-styles-wrapper .wp-block-gallery.galerie-mosaik.has-nested-images figure.wp-block-image:not(#individual-image) img {
	width: auto !important;
	max-width: 100%;
	height: 100% !important;
	aspect-ratio: auto !important;
	object-fit: contain !important;
	border-radius: 14px;
}


/* ---------- Abschnitte für neue Seiten (Starter-Vorlagen) ---------- */

.frei-inhalt > .abschnitt + .abschnitt {
	margin-top: clamp(3rem, 2.1rem + 3.8vw, 5.5rem) !important;
}

.frei-inhalt > .abschnitt.ueber-text,
.frei-inhalt > .abschnitt.ueber-themen {
	padding-top: 0;
}

/* Text auf Abschnitts-Seiten bündig mit dem Einstieg (links), nicht mittig wie auf Über mich */
.frei-inhalt > .abschnitt.ueber-text {
	align-items: flex-start;
}

.frei-inhalt > .abschnitt:last-child {
	margin-bottom: clamp(3rem, 2.1rem + 3.8vw, 5.5rem);
}

.ueber-text > * {
	width: min(100%, var(--breite-text));
	margin-block: 0;
}

.ueber-text > h2 {
	margin-bottom: -8px;
}

/* Einstieg schlicht */
.abschnitt--einstieg {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	padding-top: clamp(28px, 14px + 3vw, 64px);
}

.abschnitt--einstieg > * {
	margin: 0;
}

.abschnitt--einstieg h1 {
	max-width: 900px;
	font-size: var(--fs-h1);
	line-height: 1.08;
}

.abschnitt__einleitung {
	max-width: 660px;
	font-size: var(--fs-gross);
	line-height: 1.6;
}

/* Bild und Text, Farbbox, Zitat */
.abschnitt--bild-text > .wp-block-media-text {
	margin: 0;
}

.abschnitt--bild-text .wp-block-media-text__content > * {
	margin-block: 0 12px;
}

.abschnitt--bild-text .wp-block-media-text__media img {
	width: 100%;
	height: auto;
}

.frei-inhalt > .abschnitt--farbbox {
	width: min(100% - 2 * var(--rand), var(--breite-weit));
}

.abschnitt--farbbox > * + * {
	margin-top: 10px;
}

.abschnitt--farbbox h3 {
	margin-bottom: 0;
}

.frei-inhalt > .abschnitt--zitat {
	width: min(100% - 2 * var(--rand), var(--breite-text));
}

.abschnitt--zitat .wp-block-quote {
	margin: 0;
}

/* Galerie */
.abschnitt--galerie {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.abschnitt--galerie > h2 {
	margin: 0;
}

/* Neueste Beiträge (Kernblock „Neueste Beiträge“ als Karten) */
.abschnitt--beitraege {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
}

.abschnitt--beitraege > h2 {
	margin: 0;
}

.wp-block-latest-posts.beitragsliste {
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
}

.wp-block-latest-posts.beitragsliste.is-grid li {
	width: auto;
	margin: 0;
}

.wp-block-latest-posts.beitragsliste li {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.beitragsliste .wp-block-latest-posts__featured-image {
	margin: 0 0 4px;
}

.beitragsliste .wp-block-latest-posts__featured-image img {
	width: 100%;
	height: 262px;
	object-fit: cover;
	border-radius: 22px;
}

.beitragsliste .wp-block-latest-posts__post-title {
	font-family: var(--schrift-titel);
	font-size: var(--fs-h3);
	line-height: 1.25;
	text-decoration: none;
}

.beitragsliste .wp-block-latest-posts__post-title:hover {
	text-decoration: underline;
}

.beitragsliste .wp-block-latest-posts__post-date {
	order: 3;
	font-family: var(--schrift-text);
	font-style: italic;
	font-size: var(--fs-meta);
	color: var(--farbe-meta);
}

@media (min-width: 760px) {
	.wp-block-latest-posts.beitragsliste {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* Kontakt-Abschluss */
.frei-inhalt > .abschnitt--kontakt {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	width: min(100% - 2 * var(--rand), var(--breite-weit));
	padding: clamp(28px, 20px + 2vw, 48px) clamp(24px, 16px + 2.5vw, 56px);
	border-radius: clamp(22px, 18px + 1vw, 32px);
}

.abschnitt--kontakt > * {
	margin: 0;
}

/* Schmalere Abschnitte bündig mit der linken Rahmenkante, nicht mittig */
.frei-inhalt > .abschnitt--farbbox,
.frei-inhalt > .abschnitt--zitat,
.frei-inhalt > .abschnitt--kontakt {
	margin-left: max(var(--rand), (100% - var(--breite-rahmen)) / 2);
	margin-right: auto;
}

.abschnitt--farbbox h3 + p {
	margin-top: 6px;
}

/*
 * Gruppen mit Flex-Layout: Abstände nur über gap. Der WordPress-Standardabstand
 * (margin-block-start: 24px für Kinder von .is-layout-flow) käme sonst zusätzlich dazu.
 */
.is-layout-flow:is(.start-begruessung, .start-begruessung__text, .start-ueber, .start-ueber__text, .ueber-einstieg, .ueber-einstieg__text, .ueber-fakten, .ueber-fakt, .ueber-text, .ueber-themen, .ueber-foto, .ueber-foto__text, .ueber-foto__bilder, .abschnitt--einstieg, .abschnitt--galerie, .abschnitt--beitraege, .abschnitt--kontakt) > * {
	margin-block: 0;
}


/* Rechtstexte: Überschriften und Listen im Textabschnitt */
.abschnitt--recht > h2 {
	margin-top: 16px;
	font-size: var(--fs-h3);
}

.abschnitt--recht > h3 {
	margin-top: 8px;
	font-family: var(--schrift-ui);
	font-weight: 700;
	font-size: var(--fs-text);
}

.abschnitt--recht > ul {
	padding-left: 1.2em;
	font-size: var(--fs-text);
}

.abschnitt--recht > p,
.abschnitt--recht li {
	font-size: var(--fs-text);
	overflow-wrap: anywhere;
}

/* Abstände mobil nach Figma (Über mich: Fakten und Text) */
@media (max-width: 639.98px) {
	.ueber-fakten {
		gap: 10px;
	}

	.ueber-fakt {
		padding: 16px 22px 18px;
	}

	.ueber-text {
		gap: 20px;
		padding-top: 48px;
	}
}

/*
 * Galerie-Mosaik: bis das Skript die Zeilen gesetzt hat, unsichtbar (kein Layout-Sprung, CLS).
 * Sicherheitsnetz: nach 1,5 s auf jeden Fall sichtbar, auch wenn das Skript nicht läuft.
 */
.js .galerie-inhalt .wp-block-gallery.has-nested-images:not(.ist-mosaik),
.js .abschnitt--galerie .wp-block-gallery.has-nested-images:not(.ist-mosaik) {
	visibility: hidden;
	animation: lezovic-sichtbar 0s 1.5s forwards;
}

@keyframes lezovic-sichtbar {
	to {
		visibility: visible;
	}
}

/* Lange Wörter im Seitentitel (z. B. „Datenschutzerklärung“) auf dem Handy trennen */
.abschnitt--einstieg h1 {
	max-width: min(100%, 900px);
	hyphens: auto;
	overflow-wrap: break-word;
}

/* ---------- YouTube mit 2-Klick-Lösung ---------- */
.lezovic-video {
	margin-inline: 0;
}

.lezovic-video__flaeche {
	position: relative;
	overflow: hidden;
	aspect-ratio: 16 / 9;
	border-radius: clamp(16px, 13.8px + 0.57vw, 22px);
	background: var(--anthrazit);
}

.lezovic-video__bild,
.lezovic-video__flaeche iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	object-fit: cover;
}

.lezovic-video__bild {
	opacity: 0.55;
}

.lezovic-video__hinweis {
	position: absolute;
	inset: auto 0 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
	padding: clamp(14px, 10px + 1.5vw, 28px);
	background: linear-gradient(to top, rgb(41 39 37 / 0.92), rgb(41 39 37 / 0));
	color: var(--creme);
	--farbe-akzent: var(--creme);
	--farbe-fokus: var(--creme);
	--knopf-hg: var(--weiss);
	--knopf-text: var(--anthrazit);
}

.lezovic-video__hinweis p {
	max-width: 560px;
	margin: 0;
	font-family: var(--schrift-ui);
	font-size: var(--fs-ui);
	line-height: 1.45;
}

.lezovic-video__hinweis a {
	color: inherit;
	text-decoration: underline;
}

.lezovic-video__start svg {
	width: 16px;
	height: 16px;
}