/*
 * Ergänzungen zu theme.json. Regeln aus DESIGN.md:
 * - Nur Tokens verwenden (var(--wp--preset--…), var(--wp--custom--…)),
 *   keine festen Farben, Größen oder Abstände.
 * - Hier steht nur, was theme.json nicht ausdrücken kann.
 */

/*
 * Ersatzschrift, bis Roboto geladen ist: Arial (unter Linux das gleich
 * vermessene Liberation Sans), so skaliert, dass Zeilen gleich lang und hoch
 * werden wie in Roboto. Der Wechsel der Schrift verschiebt dann nichts.
 * Werte aus den Schriftdateien berechnet (mittlere Zeichenbreite eines
 * Textes der Seite, Überschrift bei Gewicht 500).
 */
@font-face {
	font-family: "Roboto Ersatz";
	src: local("Arial"), local("ArialMT"), local("Liberation Sans"), local("LiberationSans");
	size-adjust: 99.04%;
	ascent-override: 93.67%;
	descent-override: 24.65%;
	line-gap-override: 0%;
}
@font-face {
	font-family: "Roboto Slab Ersatz";
	src: local("Arial"), local("ArialMT"), local("Liberation Sans"), local("LiberationSans");
	size-adjust: 106.32%;
	ascent-override: 98.56%;
	descent-override: 25.49%;
	line-gap-override: 0%;
}

/* Logo: skaliert, auf dem Handy nie breiter als der Bildschirm */
.hgt-logo img {
	max-width: min(100%, 70vw);
	height: auto;
	border-radius: 0;
}

/* Kopfbereich: Logo als Mitte, Menü links und rechts (patterns/kopfbereich.php) */
.hgt-kopf {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	column-gap: var(--wp--preset--spacing--50);
}
.hgt-kopf > * {
	margin-block: 0;
}
.hgt-logo-kopf img {
	width: var(--wp--custom--logo--kopf);
}
.hgt-nav-links { grid-column: 1; }
.hgt-logo-kopf { grid-column: 2; }
.hgt-nav-rechts {
	grid-column: 3;
	justify-self: start;
}
/*
 * Unter 900px nur das rechte Menü als Overlay. Die volle Kopfzeile passt erst
 * ab 900px; darunter stünden rechts „Erfahrungsberichte“ und „Kontakt“
 * untereinander. Der Navigationsblock schaltet selbst schon bei 600px um,
 * deshalb wird sein Menüknopf zwischen 600 und 899px wieder eingeblendet.
 */
@media (max-width: 899px) {
	.hgt-nav-links {
		display: none;
	}
	.hgt-nav-rechts {
		justify-self: end;
	}
}
@media (min-width: 600px) and (max-width: 899px) {
	.hgt-nav-rechts .wp-block-navigation__responsive-container-open:not(.always-shown),
	.hgt-nav-rechts .wp-block-navigation__responsive-container-close:not(.always-shown) {
		display: flex;
	}
	.hgt-nav-rechts .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none;
	}
}
/* Ab 900px stehen die ersten beiden Punkte links vom Logo */
@media (min-width: 900px) {
	.hgt-nav-rechts .wp-block-navigation__container > li:nth-child(-n + 2) {
		display: none;
	}
}

/* Lange deutsche Wörter in Überschriften trennen statt mitten im Wort brechen
   (der Core setzt am Beitragstitel word-break: break-word; :root hebt die
   Spezifität über die Core-Regel, sonst bräche „Schwangerenvorso/rge“) */
:root :is(.wp-block-heading, .wp-block-post-title) {
	word-break: normal;
	overflow-wrap: break-word;
	hyphens: auto;
}
/* Zeilen gleich lang, kein einzelnes Wort allein in der letzten Zeile */
:is(h1, h2, h3) {
	text-wrap: balance;
}

/* Aktuelle Seite im Menü (Markierung setzt hgt_nav_aktuell() in functions.php) */
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	text-decoration: underline;
	text-decoration-thickness: var(--wp--custom--linie--mittel);
	text-underline-offset: 0.4em;
}

/* Sichtbarer Fokus für alles, was theme.json nicht abdeckt */
:where(summary, input, select, textarea, button, .wp-block-navigation-item__content):focus-visible {
	outline: var(--wp--custom--fokus--breite) solid var(--wp--preset--color--akzent);
	outline-offset: var(--wp--custom--fokus--abstand);
}

/* Übergänge knapp halten, bei Wunsch nach weniger Bewegung ganz aus */
:where(a, .wp-element-button) {
	transition: color var(--wp--custom--dauer--kurz) ease, background-color var(--wp--custom--dauer--kurz) ease;
}
@media (prefers-reduced-motion: reduce) {
	:where(a, .wp-element-button) { transition: none; }
}

/* Komponente Titelbild: volle Breite, feste Höhe aus Token, ohne Rundung */
.hgt-titelbild,
.hgt-titelbild img {
	border-radius: 0;
}
.hgt-titelbild img {
	height: var(--wp--custom--titelbild--hoehe);
	width: 100%;
	object-fit: cover;
}

/* Karte überlappt ein vorangehendes Titelbild */
.hgt-titelbild + .is-style-karte {
	position: relative;
	margin-top: calc(-1 * var(--wp--preset--spacing--70));
}
/* Karte in Textbreite: der Text darin behält die volle Textbreite */
.is-style-karte.is-layout-constrained:not(.alignwide, .alignfull) {
	max-width: calc(var(--wp--style--global--content-size) + 2 * var(--wp--preset--spacing--50));
}
main > .is-style-karte:first-child {
	margin-top: var(--wp--preset--spacing--50);
}

/* Block-Stil „Gepunktet“: die Punktlinie der Marke, in der Mitte der Kreis
   aus dem „in“ des Logos (zwei Seiten, die sich in der Mitte treffen) */
.wp-block-separator.is-style-gepunktet {
	position: relative;
	overflow: visible;
	border: 0;
	border-top: var(--wp--custom--linie--punkt) dotted var(--wp--preset--color--akzent);
	background: none;
	height: 0;
	opacity: 1;
}
.wp-block-separator.is-style-gepunktet::after {
	content: "";
	position: absolute;
	left: 50%;
	top: calc(-0.5 * var(--wp--custom--linie--punkt));
	width: var(--wp--custom--ornament--groesse);
	height: var(--wp--custom--ornament--groesse);
	transform: translate(-50%, -50%);
	border: var(--wp--custom--linie--mittel) solid var(--wp--preset--color--akzent);
	border-radius: var(--wp--custom--radius--rund);
	background: var(--wp--preset--color--grund);
	box-shadow: 0 0 0 var(--wp--custom--linie--punkt) var(--wp--preset--color--grund);
}

/* Block-Stil „Abschnittstitel“ (seit 0.6.0): Überschrift in Roboto Slab wie alle
   Überschriften, ohne eigenes Ornament; Abschnitte trennt allein die Punktlinie
   mit Kreis. Vorher Versalien in Roboto: zwei konkurrierende Überschriften-Stimmen. */
/* Im Fuß bleiben die kleinen Spaltentitel in Versalien, ohne Bogen */
.hgt-fuss .wp-block-heading.is-style-abschnitt {
	font-family: var(--wp--preset--font-family--fliesstext);
	font-weight: 600;
	letter-spacing: var(--wp--custom--laufweite--versal);
	text-transform: uppercase;
}

/* Nur für Screenreader sichtbar (z. B. die h1 der Startseite) */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/*
 * Icons vor Absätzen und in Knöpfen: Font Awesome Free 7.3.1 (Stil solid),
 * https://fontawesome.com, Icons unter CC BY 4.0 (assets/icons/LICENSE.txt).
 * Als SVG direkt im CSS statt als Icon-Schrift: kein Nachladen, kein
 * Aufblitzen. Klasse am Absatz: hgt-icon-ort, -telefon, -mail, -taetigkeit,
 * -praxis, -hinweis, -gebiet, -haus; am Button: hgt-knopf-telefon, hgt-knopf-mail.
 * Neues Icon: Pfad aus der SVG-Datei von fontawesome.com als eine Zeile hier,
 * siehe DESIGN.md.
 */
/* location-dot */
.hgt-icon-ort, .hgt-knopf-ort { --hgt-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 384 512%22%3E%3Cpath d=%22M0 189C0 84 86 0 192 0C298 0 384 84 384 189C384 308 264 451 214 505C202 518 182 518 170 505C120 451 0 308 0 189ZM192 256C227 256 256 227 256 192C256 157 227 128 192 128C157 128 128 157 128 192C128 227 157 256 192 256Z%22/%3E%3C/svg%3E"); }
/* phone */
.hgt-icon-telefon, .hgt-knopf-telefon { --hgt-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 512 512%22%3E%3Cpath d=%22M160 25C152 6 132 -4 112 1L107 3C42 21 -13 83 3 159C40 334 178 472 353 509C429 525 492 470 509 405L511 400C516 380 506 360 487 352L390 311C373 304 354 309 343 323L304 370C234 335 177 277 145 205L189 169C203 158 208 139 201 122L160 25Z%22/%3E%3C/svg%3E"); }
/* envelope */
.hgt-icon-mail, .hgt-knopf-mail { --hgt-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 512 512%22%3E%3Cpath d=%22M48 64C22 64 0 86 0 112C0 127 7 141 19 150L227 306C244 319 268 319 285 306L493 150C505 141 512 127 512 112C512 86 491 64 464 64H48ZM0 196V384C0 419 29 448 64 448H448C483 448 512 419 512 384V196L314 345C280 370 233 370 198 345L0 196Z%22/%3E%3C/svg%3E"); }
/* briefcase */
.hgt-icon-taetigkeit { --hgt-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 512 512%22%3E%3Cpath d=%22M200 48H312C316 48 320 52 320 56V96H192V56C192 52 196 48 200 48ZM144 56V96H64C29 96 0 125 0 160V256H512V160C512 125 483 96 448 96H368V56C368 25 343 0 312 0H200C169 0 144 25 144 56ZM512 304H320V320C320 338 306 352 288 352H224C206 352 192 338 192 320V304H0V416C0 451 29 480 64 480H448C483 480 512 451 512 416V304Z%22/%3E%3C/svg%3E"); }
/* house-medical */
.hgt-icon-praxis { --hgt-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 512 512%22%3E%3Cpath d=%22M278 9C266 -3 247 -3 234 9L10 217C1 226 -3 240 2 252C7 264 19 272 32 272H48V448C48 483 77 512 112 512H400C435 512 464 483 464 448V272H480C493 272 505 264 510 252C515 240 511 226 502 217L278 9ZM224 248C224 239 231 232 240 232H272C281 232 288 239 288 248V288H328C337 288 344 295 344 304V336C344 345 337 352 328 352H288V392C288 401 281 408 272 408H240C231 408 224 401 224 392V352H184C175 352 168 345 168 336V304C168 295 175 288 184 288H224V248Z%22/%3E%3C/svg%3E"); }
/* circle-info */
.hgt-icon-hinweis { --hgt-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 512 512%22%3E%3Cpath d=%22M256 512C397 512 512 397 512 256C512 115 397 0 256 0C115 0 0 115 0 256C0 397 115 512 256 512ZM224 160C224 142 238 128 256 128C274 128 288 142 288 160C288 178 274 192 256 192C238 192 224 178 224 160ZM216 224H264C277 224 288 235 288 248V336H296C309 336 320 347 320 360C320 373 309 384 296 384H216C203 384 192 373 192 360C192 347 203 336 216 336H240V272H216C203 272 192 261 192 248C192 235 203 224 216 224Z%22/%3E%3C/svg%3E"); }
/* route */
.hgt-icon-gebiet { --hgt-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 512 512%22%3E%3Cpath d=%22M512 96C512 146 453 221 427 251C424 255 418 257 413 256H320C302 256 288 270 288 288C288 306 302 320 320 320H416C469 320 512 363 512 416C512 469 469 512 416 512H140C148 502 159 489 170 475C176 467 182 458 189 448H416C434 448 448 434 448 416C448 398 434 384 416 384H320C267 384 224 341 224 288C224 235 267 192 320 192H360C339 161 320 124 320 96C320 43 363 0 416 0C469 0 512 43 512 96ZM117 489C113 493 110 497 107 500L105 502C99 507 90 506 85 500C60 473 0 403 0 352C0 299 43 256 96 256C149 256 192 299 192 352C192 382 171 419 149 450C138 465 127 478 118 488L117 489ZM128 352C128 334 114 320 96 320C78 320 64 334 64 352C64 370 78 384 96 384C114 384 128 370 128 352ZM416 128C434 128 448 114 448 96C448 78 434 64 416 64C398 64 384 78 384 96C384 114 398 128 416 128Z%22/%3E%3C/svg%3E"); }
/* house */
.hgt-icon-haus, .hgt-filter-haus { --hgt-icon: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 512 512%22%3E%3Cpath d=%22M277.8 8.6c-12.3-11.4-31.3-11.4-43.5 0l-224 208c-9.6 9-12.8 22.9-8 35.1S18.8 272 32 272l16 0 0 176c0 35.3 28.7 64 64 64l288 0c35.3 0 64-28.7 64-64l0-176 16 0c13.2 0 25-8.1 29.8-20.3s1.6-26.2-8-35.1l-224-208zM240 320l32 0c26.5 0 48 21.5 48 48l0 96-128 0 0-96c0-26.5 21.5-48 48-48z%22/%3E%3C/svg%3E"); }

[class*="hgt-icon-"] {
	display: flex;
	gap: var(--wp--preset--spacing--20);
	align-items: baseline;
}
[class*="hgt-icon-"]::before,
[class*="hgt-knopf-"] .wp-block-button__link::before {
	content: "";
	flex: 0 0 auto;
	width: 1.25em;
	height: 1em;
	background: currentColor;
	-webkit-mask: var(--hgt-icon) center / auto 100% no-repeat;
	mask: var(--hgt-icon) center / auto 100% no-repeat;
}
/* Grundlinie des Icons liegt bei 7/8 seiner Höhe */
[class*="hgt-icon-"]::before {
	color: var(--wp--preset--color--akzent);
	transform: translateY(0.125em);
}

/* Pfeil-Links: Button-Stil „Pfeil-Link“ und „Weiterlesen“ */
.wp-block-button.is-style-pfeil .wp-block-button__link {
	background: none;
	color: var(--wp--preset--color--akzent);
	padding: 0;
}
.wp-block-button.is-style-pfeil .wp-block-button__link::after,
.wp-block-read-more::after {
	content: " →";
}
.wp-block-button.is-style-pfeil .wp-block-button__link:hover,
.wp-block-read-more:hover {
	color: var(--wp--preset--color--akzent-hover);
	text-decoration: underline;
}

/* Kontur-Button: beim Hover gefüllt */
.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--akzent);
	color: var(--wp--preset--color--weiss);
}

/* Begriffe als Liste (Leistungen einer Hebamme) */
.wp-block-post-terms.is-style-liste {
	display: grid;
	gap: var(--wp--preset--spacing--10);
}
.wp-block-post-terms.is-style-liste .wp-block-post-terms__separator {
	display: none;
}
.wp-block-post-terms.is-style-liste a {
	display: flex;
	gap: var(--wp--preset--spacing--20);
	color: var(--wp--preset--color--schrift);
	/* leise Unterstreichung: als Link erkennbar, ohne die Liste unruhig zu machen */
	text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--linie);
	text-decoration-thickness: 1px;
	text-underline-offset: 0.25em;
}
.wp-block-post-terms.is-style-liste a::before {
	content: "";
	flex: 0 0 auto;
	width: 0.45em;
	height: 0.45em;
	margin-top: 0.6em;
	border-radius: var(--wp--custom--radius--rund);
	background-color: var(--wp--preset--color--akzent);
}
.wp-block-post-terms.is-style-liste a:hover {
	color: var(--wp--preset--color--akzent);
	text-decoration-color: currentColor;
}
/* Zweispaltig als Spaltensatz: lange Einträge reißen keine Lücken in die Nachbarspalte */
.wp-block-post-terms.is-style-liste.hgt-zweispaltig {
	display: block;
	columns: 2 16rem;
	column-gap: var(--wp--preset--spacing--50);
}
.wp-block-post-terms.is-style-liste.hgt-zweispaltig a {
	break-inside: avoid;
	margin-bottom: var(--wp--preset--spacing--10);
}

/* Kachel: ganze Fläche klickbar über den Titel-Link, Hover hebt an */
.is-style-kachel {
	position: relative;
	overflow: hidden;
	height: 100%;
	transition: box-shadow var(--wp--custom--dauer--kurz) ease;
}
.is-style-kachel:hover,
.is-style-kachel:focus-within {
	box-shadow: var(--wp--preset--shadow--angehoben);
}
.is-style-kachel .wp-block-post-featured-image,
.is-style-kachel .wp-block-post-featured-image img {
	border-radius: 0;
}
/* Platzhalter, solange das Bild lädt (sonst weiße Fläche in der Kachel) */
.is-style-kachel .wp-block-post-featured-image {
	background: var(--wp--preset--color--flaeche);
}
.is-style-kachel .wp-block-post-title a::after {
	content: "";
	position: absolute;
	inset: 0;
}
.is-style-kachel .wp-block-post-title a:focus-visible {
	outline: none;
}
.is-style-kachel:focus-within {
	outline: var(--wp--custom--fokus--breite) solid var(--wp--preset--color--akzent);
	outline-offset: var(--wp--custom--fokus--abstand);
}
.is-style-kachel .hgt-kachel-text {
	padding: var(--wp--preset--spacing--40);
}
/* Anrufen und E-Mail füllen die Kachel: nebeneinander teilen sie die Zeile,
   untereinander sind sie gleich breit statt treppenartig. */
.is-style-kachel .hgt-kachel-text .wp-block-buttons { align-self: stretch; }
.is-style-kachel .hgt-kachel-text .wp-block-button { flex: 1 1 auto; }
.is-style-kachel .hgt-kachel-text .wp-block-button__link { width: 100%; justify-content: center; }
@media (prefers-reduced-motion: reduce) {
	.is-style-kachel { transition: none; }
}

/* Query-Raster: Kacheln gleich hoch */
.wp-block-post-template.is-layout-grid > li {
	display: flex;
	flex-direction: column;
}

/* Links-Seite: Logo-Kacheln und Textlinks */
.hgt-logo-kachel {
	padding: var(--wp--preset--spacing--40);
	min-height: calc(var(--wp--custom--logo--hoehe) + 2 * var(--wp--preset--spacing--40));
}
.hgt-logo-kachel img {
	max-height: var(--wp--custom--logo--hoehe);
	width: auto;
	object-fit: contain;
	border-radius: 0;
}
.hgt-logo-kachel a::after {
	content: "";
	position: absolute;
	inset: 0;
}
.hgt-linkliste {
	display: grid;
	gap: var(--wp--preset--spacing--20);
}

/*
 * Erkennungszeichen der Marke (DESIGN.md, „Gestaltungsidee“):
 * Bogen = Geborgenheit, Zuhause; Welle = der Schwung aus dem Logo.
 */

/* Block-Stil „Bogen“ für Bild und Beitragsbild: oben rund wie ein Torbogen */
:is(.wp-block-image, .wp-block-post-featured-image).is-style-bogen,
:is(.wp-block-image, .wp-block-post-featured-image).is-style-bogen :is(img, a) {
	border-radius: var(--wp--custom--radius--bogen);
}
:is(.wp-block-image, .wp-block-post-featured-image).is-style-bogen {
	overflow: hidden;
}

/* Zusatzklasse „hgt-portraet“: Porträt in Kacheln, begrenzt und mittig */
:is(.wp-block-post-featured-image, .wp-block-image).hgt-portraet {
	width: min(100%, var(--wp--custom--portraet--breite));
	margin-inline: auto;
}

/* Zusatzklasse „hgt-bogen-rahmen“: gepunktete Linie folgt dem Bogen mit Abstand */
.is-style-bogen.hgt-bogen-rahmen {
	overflow: visible;
	position: relative;
	margin: var(--wp--preset--spacing--30);
}
.is-style-bogen.hgt-bogen-rahmen::before {
	content: "";
	position: absolute;
	inset: calc(-1 * var(--wp--preset--spacing--30));
	border: var(--wp--custom--linie--mittel) dotted var(--wp--preset--color--akzent);
	border-radius: var(--wp--custom--radius--bogen);
	pointer-events: none;
}

/* Block-Stil „Bereich mit Welle“: Fläche über die volle Breite, unten eine Welle */
.wp-block-group.is-style-welle {
	position: relative;
	margin-bottom: var(--wp--custom--welle--hoehe);
}
.wp-block-group.is-style-welle::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	/* um eine dünne Linie überlappen, sonst bleibt bei Bruchteil-Pixeln eine Naht */
	top: calc(100% - var(--wp--custom--linie--duenn));
	height: var(--wp--custom--welle--hoehe);
	background: inherit;
	-webkit-mask: url(../images/welle.svg) center / 100% 100% no-repeat;
	mask: url(../images/welle.svg) center / 100% 100% no-repeat;
}

/* Fußbereich: Welle nach oben, Platz dafür über dem Fuß */
.wp-site-blocks > footer {
	margin-block-start: var(--wp--custom--welle--hoehe);
}
.hgt-fuss {
	position: relative;
}
.hgt-fuss::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: calc(100% - var(--wp--custom--linie--duenn));
	height: var(--wp--custom--welle--hoehe);
	background: inherit;
	transform: scale(-1, -1);
	-webkit-mask: url(../images/welle.svg) center / 100% 100% no-repeat;
	mask: url(../images/welle.svg) center / 100% 100% no-repeat;
}
.hgt-fuss .wp-block-navigation .wp-block-navigation-item__content {
	text-decoration: none;
}
.hgt-fuss .wp-block-navigation .wp-block-navigation-item__content:hover {
	text-decoration: underline;
}

/* Kopfbereich: Menüpunkt „Kontakt“ als Knopf */
.wp-block-navigation .hgt-nav-knopf > .wp-block-navigation-item__content {
	background: var(--wp--preset--color--akzent);
	color: var(--wp--preset--color--weiss);
	border-radius: var(--wp--custom--radius--klein);
	padding: 0.6em 1.2em;
	text-decoration: none;
}
.wp-block-navigation .hgt-nav-knopf > .wp-block-navigation-item__content:hover {
	background: var(--wp--preset--color--akzent-hover);
	color: var(--wp--preset--color--weiss);
	text-decoration: none;
}
.wp-block-navigation .hgt-nav-knopf.current-menu-item > .wp-block-navigation-item__content {
	text-decoration: none;
	box-shadow: 0 0 0 var(--wp--custom--linie--mittel) var(--wp--preset--color--grund), 0 0 0 calc(2 * var(--wp--custom--linie--mittel)) var(--wp--preset--color--akzent);
}

/* Telefon-Knopf in Kacheln liegt über dem klickbaren Kachel-Titel */
.is-style-kachel .wp-block-buttons {
	position: relative;
	z-index: 1;
}

/* Knopf mit Symbol (hgt-knopf-telefon, hgt-knopf-mail): Symbol folgt der Knopffarbe */
[class*="hgt-knopf-"] .wp-block-button__link {
	display: inline-flex;
	gap: var(--wp--preset--spacing--20);
	align-items: center;
	text-transform: none;
	letter-spacing: normal;
}

/* Handymenü (Overlay): zentriert und ruhig wie der Kopf, in der Überschriftenschrift */
.hgt-nav-rechts .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.hgt-nav-rechts .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: center;
}
.hgt-nav-rechts .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: var(--wp--preset--spacing--40);
	padding-top: var(--wp--preset--spacing--60);
	font-family: var(--wp--preset--font-family--ueberschrift);
	font-size: var(--wp--preset--font-size--gross);
	font-weight: 500;
}
.hgt-nav-rechts .wp-block-navigation__responsive-container.is-menu-open .hgt-nav-knopf > .wp-block-navigation-item__content {
	margin-top: var(--wp--preset--spacing--30);
	padding: 0.5em 1.4em;
}

/*
 * FAQ (Gruppe „hgt-faq“ mit Details-Blöcken): Frage in der Überschriftenschrift,
 * rechts der Kreis aus dem „in“ des Logos mit Plus, geöffnet gefüllt mit Minus.
 */
.hgt-faq .wp-block-details summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--40);
	list-style: none;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--ueberschrift);
	font-size: var(--wp--preset--font-size--mittel);
	font-weight: 500;
	line-height: var(--wp--custom--zeilenhoehe--ueberschrift);
	color: var(--wp--preset--color--akzent);
}
.hgt-faq .wp-block-details summary::-webkit-details-marker {
	display: none;
}
.hgt-faq .wp-block-details summary::after {
	--strich: var(--wp--custom--linie--mittel);
	content: "";
	flex: 0 0 auto;
	width: calc(var(--wp--custom--ornament--groesse) * 2);
	height: calc(var(--wp--custom--ornament--groesse) * 2);
	border: var(--strich) solid var(--wp--preset--color--akzent);
	border-radius: var(--wp--custom--radius--rund);
	background:
		linear-gradient(var(--wp--preset--color--akzent), var(--wp--preset--color--akzent)) center / 45% var(--strich) no-repeat,
		linear-gradient(var(--wp--preset--color--akzent), var(--wp--preset--color--akzent)) center / var(--strich) 45% no-repeat;
	transition: background-color var(--wp--custom--dauer--kurz) ease;
}
.hgt-faq .wp-block-details[open] summary::after {
	background:
		linear-gradient(var(--wp--preset--color--weiss), var(--wp--preset--color--weiss)) center / 45% var(--strich) no-repeat,
		var(--wp--preset--color--akzent);
}
.hgt-faq .wp-block-details summary:hover {
	color: var(--wp--preset--color--akzent-hover);
}
.hgt-faq .wp-block-details[open] {
	display: flow-root;
}
.hgt-faq .wp-block-details[open] > summary {
	margin-bottom: var(--wp--preset--spacing--30);
}
.hgt-faq .wp-block-details > :not(summary) {
	margin-block: 0 var(--wp--preset--spacing--30);
}

/* Zeichnungen in den Antworten: rechts neben dem Text, am Handy mittig darüber */
.hgt-faq .hgt-faq-bild.alignright {
	width: min(42%, 18rem);
	margin: 0 0 var(--wp--preset--spacing--30) var(--wp--preset--spacing--40);
}
.hgt-faq .hgt-faq-bild img {
	border-radius: var(--wp--custom--radius--mittel);
}
@media (max-width: 599px) {
	.hgt-faq .hgt-faq-bild.alignright {
		float: none;
		width: min(100%, 20rem);
		margin-inline: auto;
	}
}
@media (prefers-reduced-motion: reduce) {
	.hgt-faq .wp-block-details summary::after { transition: none; }
}

/* Kurze Seiten: Der Fuß schließt am Fensterrand ab, kein Creme darunter */
.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100dvh;
}
.wp-site-blocks > main {
	flex: 1 0 auto;
}

/* Seitenzahlen: Zielflächen mindestens 24 × 24 px (WCAG 2.2, 2.5.8), Kreis
   wie die Ornamente, aktuelle Seite gefüllt */
.wp-block-query-pagination {
	gap: var(--wp--preset--spacing--20);
}
.wp-block-query-pagination-numbers {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--10);
}
.wp-block-query-pagination .page-numbers,
.wp-block-query-pagination-previous,
.wp-block-query-pagination-next {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: var(--wp--custom--nadel--groesse);
	min-height: var(--wp--custom--nadel--groesse);
	margin: 0;
}
.wp-block-query-pagination .page-numbers {
	border-radius: var(--wp--custom--radius--rund);
	text-decoration: none;
	font-weight: 600;
}
.wp-block-query-pagination a.page-numbers:hover {
	background: var(--wp--preset--color--flaeche);
}
.wp-block-query-pagination .page-numbers.current {
	background: var(--wp--preset--color--akzent);
	color: var(--wp--preset--color--weiss);
}

/* Suchfeld: Rahmen in Tokenfarbe statt Core-Grau (Bedienelement, 3 : 1) */
.wp-block-search__input {
	border-color: var(--wp--preset--color--schrift-leise);
}

/* Platzhalter in Entwürfen (z. B. Datenschutzerklärung): fallen auf, bis sie ersetzt sind. */
.hgt-platzhalter {
	background: var(--wp--preset--color--flaeche);
	color: var(--wp--preset--color--akzent);
	outline: 1px dashed var(--wp--preset--color--akzent);
	padding: 0 0.2em;
}

/* Blättern am Ende eines Beitrags: vorheriger und nächster Beitrag derselben
   Kategorie, Titel in der Überschriftenschrift */
.hgt-blaettern {
	max-width: var(--wp--style--global--content-size);
	margin-inline: auto;
	gap: var(--wp--preset--spacing--40);
}
.hgt-blaettern > * {
	flex: 1 1 14rem;
	margin: 0;
}
.hgt-blaettern a {
	font-family: var(--wp--preset--font-family--ueberschrift);
	font-size: var(--wp--preset--font-size--mittel);
	line-height: var(--wp--custom--zeilenhoehe--ueberschrift);
	text-decoration: none;
}
.hgt-blaettern a:hover {
	text-decoration: underline;
}
.hgt-blaettern .wp-block-post-navigation-link__arrow-previous,
.hgt-blaettern .wp-block-post-navigation-link__arrow-next {
	color: var(--wp--preset--color--akzent);
}

/* Luft zwischen Abschnitten: Die Punktlinie trennt Abschnitte und bekommt
   oben und unten den Abschnittsabstand, sonst wirkt die Seite gequetscht. */
.wp-block-separator.is-style-gepunktet {
	margin-block: var(--wp--preset--spacing--70) var(--wp--preset--spacing--60) !important;
}
/* Steht die Punktlinie am Anfang eines Abschlusses, bringt die Gruppe den
   Abstand schon mit. */
:is(.hgt-weiter, .hgt-hinweis-abschluss) > .is-style-gepunktet:first-child {
	margin-top: 0 !important;
}
:is(.hgt-weiter, .hgt-hinweis-abschluss) > .is-style-gepunktet + .wp-block-heading {
	margin-top: 0 !important;
}
/* Startseite: zwei Fragen nebeneinander (Eltern, Studierende); die Pfeil-Links
   stehen auf einer Linie, auch wenn ein Satz länger ist */
.hgt-abschluss-zwei > .wp-block-column,
.hgt-abschluss-zwei .hgt-hinweis-studierende {
	display: flex;
	flex-direction: column;
}
.hgt-abschluss-zwei .hgt-hinweis-studierende {
	flex: 1;
}
.hgt-abschluss-zwei .wp-block-buttons {
	margin-top: auto;
	padding-top: var(--wp--preset--spacing--30);
}

/* Verfügbarkeit im Profilkopf: schlichter Satz in Akzent, kein Kasten */
.hgt-verfuegbarkeit {
	color: var(--wp--preset--color--akzent);
	font-weight: 600;
}
.hgt-profilkopf .hgt-icon-telefon a {
	color: inherit;
	text-decoration-color: var(--wp--preset--color--linie);
}
.hgt-profilkopf .hgt-icon-telefon a:hover {
	color: var(--wp--preset--color--akzent);
}
/* Profilkopf am Handy: Porträt begrenzt, damit Name und Anrufen früh sichtbar sind */
@media (max-width: 781px) {
	.hgt-profilkopf .wp-block-post-featured-image {
		width: min(100%, var(--wp--custom--portraet--breite));
		margin-inline: auto;
	}
}

/* Am Handy: Porträt klein links, Angaben rechts, Knöpfe darunter über die
   ganze Breite. Sieben große Karten untereinander wären fast 4000 px. */
@media (max-width: 599px) {
	.hgt-kontaktraster .hgt-kachel-text {
		display: grid !important;
		grid-template-columns: var(--wp--custom--person--bild) 1fr;
		column-gap: var(--wp--preset--spacing--40);
		row-gap: var(--wp--preset--spacing--10);
		align-items: center;
	}
	.hgt-kontaktraster .hgt-portraet {
		grid-row: 1 / span 4;
		align-self: start;
		width: var(--wp--custom--person--bild);
		margin: 0;
	}
	.hgt-kontaktraster .hgt-kachel-text > :not(.hgt-portraet, .wp-block-buttons) {
		grid-column: 2;
		text-align: left;
		justify-content: flex-start;
		margin: 0;
	}
	.hgt-kontaktraster .wp-block-buttons {
		grid-column: 1 / -1;
	}
}

/*
 * Knöpfe am Handy über die ganze Inhaltsbreite (der Seitenrand bleibt),
 * untereinander; Pfeil-Links bleiben Textlinks.
 */
@media (max-width: 599px) {
	.wp-block-buttons:has(> .wp-block-button:not(.is-style-pfeil)) {
		flex-direction: column;
		align-items: stretch;
	}
	.wp-block-buttons > .wp-block-button:not(.is-style-pfeil) {
		width: 100%;
	}
	.wp-block-buttons > .wp-block-button.is-style-pfeil {
		align-self: flex-start;
	}
	.wp-block-button:not(.is-style-pfeil) > .wp-block-button__link {
		display: flex;
		width: 100%;
		box-sizing: border-box;
		justify-content: center;
		text-align: center;
	}
}

/* 404: Hauptwege als Pfeil-Links untereinander, Suche schmal darunter */
.hgt-wege {
	gap: var(--wp--preset--spacing--30);
}
.hgt-wege .wp-block-button__link {
	font-family: var(--wp--preset--font-family--ueberschrift);
	font-size: var(--wp--preset--font-size--mittel);
	font-weight: 400;
	letter-spacing: normal;
	text-transform: none;
}
.hgt-404 .wp-block-search {
	max-width: 28rem;
	margin-inline: auto !important;
}

/* Leistungskacheln am Handy zweispaltig: ganze Übersicht statt Bild für Bild */
@media (max-width: 599px) {
	.hgt-leistungskacheln .wp-block-post-template.is-layout-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--wp--preset--spacing--30);
	}
	.hgt-leistungskacheln .is-style-kachel .wp-block-post-title {
		font-size: var(--wp--preset--font-size--klein) !important;
		hyphens: auto;
	}
	.hgt-leistungskacheln .is-style-kachel .hgt-kachel-text {
		padding: var(--wp--preset--spacing--30) var(--wp--preset--spacing--20);
	}
	/* Ungerade Anzahl: die erste Kachel breit, damit keine allein in der letzten Reihe steht */
	.hgt-leistungskacheln .wp-block-post:first-child:nth-last-child(odd) {
		grid-column: span 2;
	}
	.hgt-leistungskacheln .wp-block-post:first-child:nth-last-child(odd) .wp-block-post-featured-image {
		aspect-ratio: 2 / 1 !important;
	}
	.hgt-leistungskacheln .wp-block-post:first-child:nth-last-child(odd) .wp-block-post-featured-image img {
		aspect-ratio: 2 / 1 !important;
	}
}

/* Erfahrungsberichte: ruhige Liste statt Kartenstapel, getrennt von der Punktlinie */
.hgt-berichte > .wp-block-post + .wp-block-post {
	margin-top: var(--wp--preset--spacing--50);
	padding-top: var(--wp--preset--spacing--50);
	border-top: var(--wp--custom--linie--punkt) dotted var(--wp--preset--color--linie);
}
.hgt-bericht-eintrag .wp-block-post-date,
.hgt-nur-bericht {
	color: var(--wp--preset--color--schrift-leise);
}
.hgt-bericht-eintrag .wp-block-post-title {
	margin-top: 0;
}
.wp-block-query:has(> .hgt-berichte) {
	margin-top: var(--wp--preset--spacing--50);
}

/* Menüknopf am Handy: Symbol mit dem Wort „Menü“, damit klar ist, was er tut */
.hgt-nav-rechts .wp-block-navigation__responsive-container-open {
	gap: 0.4em;
	align-items: center;
	font-size: var(--wp--preset--font-size--klein);
	font-weight: 600;
}
.hgt-nav-rechts .wp-block-navigation__responsive-container-open::after {
	content: "Menü";
}
/* Overlay: oben das Logo, darunter die Punktlinie, dann die Menüpunkte */
.hgt-nav-rechts .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content::before {
	content: "";
	display: block;
	width: var(--wp--custom--logo--kopf);
	aspect-ratio: 937 / 398;
	background: url("../images/logo.svg") center / contain no-repeat;
}
.hgt-nav-rechts .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	min-width: min(16rem, 100%);
	margin-top: var(--wp--preset--spacing--40);
	padding-top: var(--wp--preset--spacing--50);
	border-top: var(--wp--custom--linie--punkt) dotted var(--wp--preset--color--akzent);
	position: relative;
}
/* Kreis auf der Punktlinie wie beim Trenner „Gepunktet“ */
.hgt-nav-rechts .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container::before {
	content: "";
	position: absolute;
	left: 50%;
	top: calc(-0.5 * var(--wp--custom--linie--punkt));
	width: var(--wp--custom--ornament--groesse);
	height: var(--wp--custom--ornament--groesse);
	transform: translate(-50%, -50%);
	border: var(--wp--custom--linie--mittel) solid var(--wp--preset--color--akzent);
	border-radius: var(--wp--custom--radius--rund);
	background: var(--wp--preset--color--grund);
	box-shadow: 0 0 0 var(--wp--custom--linie--punkt) var(--wp--preset--color--grund);
}
/* Menü öffnen und schließen: Tippfläche mindestens 44 px */
.hgt-nav-rechts .wp-block-navigation__responsive-container-open,
.hgt-nav-rechts .wp-block-navigation__responsive-container-close {
	min-width: 44px;
	min-height: 44px;
	justify-content: center;
}

/*
 * Breiten (DESIGN.md 3.4): Lesetext in Inhaltsbreite (720 px), alles mit
 * Bildern, Rastern und Spalten in breiter Ausrichtung (1140 px). Beiträge
 * stehen ohne weiße Karte direkt auf dem Grund.
 */
.hgt-beitragsbild {
	margin-block: var(--wp--preset--spacing--50) !important;
}
.hgt-beitragsbild img {
	width: 100%;
	height: var(--wp--custom--titelbild--hoehe);
	object-fit: cover;
	border-radius: var(--wp--custom--radius--mittel);
}

/* Beginnt der Text mit einer Zwischenüberschrift (Impressum), steht sie
   nicht eng unter dem Seitentitel */
.wp-block-post-content > .wp-block-heading:first-child {
	margin-top: var(--wp--preset--spacing--50);
}

/* Fünf Leistungskacheln: zwischen Handy und voller Breite drei Spalten (3 + 2)
   statt vier, sonst stünde eine allein in der letzten Reihe (DESIGN.md 2a) */
@media (min-width: 600px) and (max-width: 1023px) {
	.hgt-leistungskacheln .wp-block-post-template.is-layout-grid:has(> li:nth-child(5):last-child) {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}
/* Vier Kacheln (z. B. „Zum Weiterlesen“): 2 + 2 statt 3 + 1 */
@media (min-width: 600px) and (max-width: 1199px) {
	main .wp-block-post-template.is-layout-grid:has(> li:nth-child(4):last-child) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Leistungsseite: wenige Hebammen (z. B. K-Tapen) stehen mittig statt links */
body.tax-leistungen .hgt-aktive .wp-block-post-template.is-layout-grid {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 20rem));
	justify-content: center;
}

/* Profil: Leistungen links schmal, persönlicher Text rechts */
/* Ohne eingetragene Leistungen (neues Profil) keine leere Überschrift */
.hgt-profil-leistungen:not(:has(.wp-block-post-terms)) {
	display: none;
}
.hgt-profil-leistungen .wp-block-heading {
	margin-top: 0;
}
.hgt-profil-inhalt .hgt-lesetext > :first-child {
	margin-top: 0;
}
@media (min-width: 782px) {
	.hgt-profil-leistungen {
		align-self: flex-start;
		position: sticky;
		top: var(--wp--preset--spacing--40);
	}
}
.hgt-profil-inhalt h2 {
	font-size: var(--wp--preset--font-size--gross);
}
/* Punktlinie zwischen Leistungen und Text nur am Handy, wo beides untereinander steht */
.hgt-profil-trenner {
	display: none;
}
/*
 * Am Handy: „Leistungen“ als leise Beschriftung, die Leistungen als Felder
 * wie im Filter der Teamseite (halb so hoch wie die Liste und klar anders als
 * Fließtext), dann mit Luft die Punktlinie und der persönliche Text.
 */
@media (max-width: 781px) {
	.hgt-profil-leistungen .wp-block-heading {
		margin-bottom: var(--wp--preset--spacing--20);
		font-family: var(--wp--preset--font-family--fliesstext);
		font-size: var(--wp--preset--font-size--klein) !important;
		font-weight: 600;
		color: var(--wp--preset--color--schrift-leise);
	}
	.hgt-profil-leistungen .wp-block-post-terms.is-style-liste {
		display: flex;
		flex-wrap: wrap;
		gap: var(--wp--preset--spacing--20);
	}
	.hgt-profil-leistungen .wp-block-post-terms.is-style-liste a {
		padding: 0.4em 0.95em;
		font-size: var(--wp--preset--font-size--klein);
		line-height: var(--wp--custom--zeilenhoehe--ueberschrift);
		border: var(--wp--custom--linie--duenn) solid var(--wp--preset--color--linie);
		border-radius: var(--wp--custom--radius--rund);
		background: var(--wp--preset--color--weiss);
		text-decoration: none;
	}
	.hgt-profil-leistungen .wp-block-post-terms.is-style-liste a::before {
		content: none;
	}
	.hgt-profil-leistungen .wp-block-post-terms.is-style-liste a:hover {
		border-color: var(--wp--preset--color--akzent);
		text-decoration: none;
	}
	.hgt-profil-trenner {
		display: block;
		margin-block: var(--wp--preset--spacing--50) var(--wp--preset--spacing--60) !important;
	}
}

/* Beitragstitel: WordPress setzt den Titel-Link als inline-block, dann trennt
   der Browser lange Wörter („Wochenbettbetreuung“) nicht und sie laufen über
   (Kacheln, Suchergebnisse, Listen) */
.wp-block-post-title a {
	display: inline;
	hyphens: auto;
	overflow-wrap: break-word;
}

/* Fokus im Fußbereich: Bordeaux auf Bordeaux wäre unsichtbar */
.hgt-fuss :focus-visible {
	outline-color: var(--wp--preset--color--weiss) !important;
}

/* Brotkrumen über dem Inhalt: klein und leise, die Seite selbst ohne Link.
   Am Handy nur der Weg zurück, ohne die (oft lange) aktuelle Seite. */
.hgt-brotkrumen {
	font-size: var(--wp--preset--font-size--klein);
	color: var(--wp--preset--color--schrift-leise);
}
/* Direkt über dem Titel: mittig wie der Titel, mit wenig Abstand */
.hgt-brotkrumen-mitte ol {
	justify-content: center;
}
.hgt-brotkrumen + * {
	margin-top: var(--wp--preset--spacing--20) !important;
}
/* Über der Profilkarte: bündig mit dem Inhalt der Karte */
.hgt-brotkrumen + .hgt-profilkopf {
	margin-top: var(--wp--preset--spacing--30) !important;
}
.hgt-brotkrumen:has(+ .hgt-profilkopf) {
	padding-inline: var(--wp--preset--spacing--50);
}
.hgt-brotkrumen a {
	color: var(--wp--preset--color--akzent);
	text-decoration: none;
}
.hgt-brotkrumen a:hover {
	text-decoration: underline;
}
@media (max-width: 599px) {
	.hgt-brotkrumen li:last-child {
		display: none;
	}
	.hgt-brotkrumen li:nth-last-child(2)::after {
		content: none;
	}
}

/* Lange Wörter und Adressen im Text umbrechen statt die Seite bei 320 px
   zu verbreitern (WCAG 1.4.10, z. B. Gesetzesnamen und Links im Impressum) */
.wp-block-post-content {
	overflow-wrap: break-word;
}

/*
 * Bewegung (DESIGN.md „Bewegung“): leise und kurz, nie zum Selbstzweck.
 * Bei „Bewegung reduzieren“ im System entfällt alles hier.
 */

/* Fotos: bis sie geladen sind, steht an ihrer Stelle die Flächenfarbe statt
   einer Lücke (nicht bei Logo und Grafiken, die sind durchsichtig) */
.wp-block-post-featured-image img,
.wp-block-image:not(.hgt-logo) img:not([src$=".svg"]),
.hgt-nadel-bild {
	background-color: var(--wp--preset--color--flaeche);
}

@media (prefers-reduced-motion: no-preference) {
	/* Seitenwechsel: weiches Überblenden; der Kopf bleibt stehen */
	@view-transition {
		navigation: auto;
	}
	/* Name nur während des Wechsels: Ein Name macht den Kopf zur eigenen
	   Ebene, dann läge das Handymenü (Overlay im Kopf) unter dem Inhalt. */
	:root:active-view-transition .hgt-kopf {
		view-transition-name: hgt-kopf;
	}
	/* Die alte Seite tritt schnell zurück, die neue blendet ein und rückt
	   dabei ein kleines Stück nach oben. */
	::view-transition-old(root) {
		animation: hgt-ausblenden var(--wp--custom--dauer--kurz) ease-out both;
	}
	::view-transition-new(root) {
		animation: hgt-einblenden var(--wp--custom--dauer--mittel) ease-out both;
	}
	::view-transition-group(hgt-kopf) {
		animation-duration: var(--wp--custom--dauer--mittel);
	}
	/* Beim Filtern der Hebammenliste (Kennzeichen aus view.js) bleibt die
	   Seite stehen; nur Einträge und Stecknadeln gleiten. */
	:root.hgt-filtern::view-transition-old(root),
	:root.hgt-filtern::view-transition-new(root) {
		animation: none;
	}

	/* Fotos erscheinen weich, sobald sie geladen sind (Kennzeichen ist-da
	   setzt das Skript im Kopf, functions.php). Das Logo steht sofort. */
	.hgt-js img:not(.hgt-logo img) {
		transition: opacity var(--wp--custom--dauer--mittel) ease-out;
	}
	.hgt-js img:not(.ist-da):not(.hgt-logo img) {
		opacity: 0;
	}

	/*
	 * Was beim Scrollen ins Bild kommt (Kacheln, Beiträge, Berichte, Fragen),
	 * blendet sanft ein und rückt ein kleines Stück nach oben. Was beim Laden
	 * schon sichtbar ist, steht sofort da. Nur in Browsern mit
	 * scroll-gesteuerten Animationen, sonst ohne Bewegung.
	 */
	@supports (animation-timeline: view()) {
		.wp-block-post-template > li,
		.hgt-bericht-eintrag,
		.hgt-faq .wp-block-details {
			animation: hgt-einblenden linear both;
			animation-timeline: view();
			animation-range: entry 0% entry 60%;
		}
	}
}
/* Häufige Fragen: Antwort klappt weich auf (wo der Browser es kann) */
@media (prefers-reduced-motion: no-preference) {
	:root {
		interpolate-size: allow-keywords;
	}
	/* flow-root: Die Zeichnung rechts ist umflossen; ohne eigenen Block-Kontext
	   endet die Höhe beim Text und overflow-y: clip schneidet das Bild ab. */
	.hgt-faq .wp-block-details::details-content {
		display: flow-root;
		block-size: 0;
		overflow-y: clip;
		transition: block-size var(--wp--custom--dauer--mittel) ease, content-visibility var(--wp--custom--dauer--mittel) allow-discrete;
	}
	.hgt-faq .wp-block-details[open]::details-content {
		block-size: auto;
	}
}
@keyframes hgt-einblenden {
	from {
		opacity: 0;
		translate: 0 var(--wp--preset--spacing--30);
	}
}
@keyframes hgt-ausblenden {
	to {
		opacity: 0;
	}
}