/*
 * Zentrales Font-System für Überschriften in Frontend und Editor.
 * Die Schriftgröße skaliert fluid anhand der verfügbaren Breite.
 */

/* Gemeinsame Referenzwerte für die fluid-Skalierung. */
:root {
	/* Startbreite, ab der die fluide Interpolation beginnt. */
	--hoou-font-fluid-start-width: 767px;
	/* Breitenstrecke, über die die Font-Größe von min nach max wächst. */
	--hoou-font-fluid-width-range: 673;
	/* Standard-Basisbreite für Überschriften ohne eigenen Container-Kontext. */
	--hoou-font-fluid-default-source-width: 100vw;
	--wp--preset--font-size--x-large: clamp(36px, calc(36px + (((48 - 36) * (var(--hoou-font-fluid-default-source-width, 100vw) - 767px)) / 673)), 48px);
}

/* Bei offenem Seitenmenü wird die verfügbare Breite für nicht-containerbasierte Überschriften als Basisberechnung genommen. */
body.menuVisible {
	/* Standard-Basisbreite für nicht-containerbasierte Überschriften bei offenem Seitenmenü. */
	--hoou-font-fluid-default-source-width: calc(100vw - var(--sidebar-desktop-width, 285px));
}

/* Diese Bereiche nutzen Containerbreite statt Viewportbreite als fluid-Basis. */
:where(
	body .lernangebote-outer-card-wrapper,
	body .podcast-outer-card-wrapper,
	body .hoou-event-cards-wrapper,
	body .themenpages-block,
	body .faqblock,
	body .newsletter-outer-wrapper,
	body .entry-content > div[class*="ueber-uns-"]
) {
	container-type: inline-size;
}

/* In den Bereichen oben wird die Fluid-Basis auf Containerbreite umgestellt. */
:where(
	body .lernangebote-outer-card-wrapper,
	body .podcast-outer-card-wrapper,
	body .hoou-event-cards-wrapper,
	body .themenpages-block,
	body .faqblock,
body .newsletter-outer-wrapper,
body .entry-content > div[class*="ueber-uns-"]
) :is(.is-style-font-swan, .is-style-font-eagle, .is-style-font-stork, .is-style-font-heron, .is-style-font-buzzard, .is-style-font-magpie, .is-style-font-pigeon, .hoou-font-swan, .hoou-font-eagle, .hoou-font-stork, .hoou-font-heron, .hoou-font-buzzard, .hoou-font-magpie, .hoou-font-pigeon, h1, h2, h3, h4, h5, h6) {
	/* Aktuelle Rechenbasis für Überschriften in echten Container-Kontexten. */
	--font-fluid-source-width: 100cqi;
}

/* Gemeinsame Basis für alle Font-Überschriften (fluid). */
:is(.is-style-font-swan, .is-style-font-eagle, .is-style-font-stork, .is-style-font-heron, .is-style-font-buzzard, .is-style-font-magpie, .is-style-font-pigeon),
:is(.hoou-font-swan, .hoou-font-eagle, .hoou-font-stork, .hoou-font-heron, .hoou-font-buzzard, .hoou-font-magpie, .hoou-font-pigeon),
:is(body h1, body h2, body h3, body h4, body h5, body h6) {
	color: var(--hoou-blau);
	font-family: "Poppins", "Verdana", sans-serif;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: var(--hoou-font-fluid-letter-spacing, 0);
	/* Ohne Container-Kontext bleibt die Basis automatisch 100vw. */
	font-size: clamp(
		calc(var(--hoou-font-fluid-size-min, 16) * 1px),
		calc((var(--hoou-font-fluid-size-min, 16) * 1px) + (((var(--hoou-font-fluid-size-max, 16) - var(--hoou-font-fluid-size-min, 16)) * (var(--font-fluid-source-width, var(--hoou-font-fluid-default-source-width, 100vw)) - var(--hoou-font-fluid-start-width))) / var(--hoou-font-fluid-width-range))),
		calc(var(--hoou-font-fluid-size-max, 16) * 1px)
	);
}

/* Heading-Links: keine Unterstreichung in allen Zuständen. */
:is(h1, h2, h3, h4, h5, h6) {
	a,
	a:focus,
	a:active,
	a:visited {
		text-decoration: none;
	}
}

@media (hover: hover) and (pointer: fine) {
	:is(h1, h2, h3, h4, h5, h6) a:hover {
		text-decoration: none;
	}
}

/* Font-Tokens */
.is-style-font-swan,
.hoou-font-swan {
	--hoou-font-fluid-size-min: 36;
	--hoou-font-fluid-size-max: 48;
	--hoou-font-fluid-letter-spacing: -0.005em;
}

.is-style-font-eagle,
.hoou-font-eagle,
body h1 {
	--hoou-font-fluid-size-min: 32;
	--hoou-font-fluid-size-max: 40;
	--hoou-font-fluid-letter-spacing: -0.005em;
}

.is-style-font-stork,
.hoou-font-stork,
body h2 {
	--hoou-font-fluid-size-min: 28;
	--hoou-font-fluid-size-max: 32;
	--hoou-font-fluid-letter-spacing: -0.005em;
}

.is-style-font-heron,
.hoou-font-heron,
body h3 {
	--hoou-font-fluid-size-min: 24;
	--hoou-font-fluid-size-max: 28;
	/* Letter-spacing folgt derselben fluid-Basis wie die Font-Size. */
	--hoou-font-fluid-letter-spacing: clamp(-0.005em, calc(-0.005em * (var(--font-fluid-source-width, var(--hoou-font-fluid-default-source-width, 100vw)) - var(--hoou-font-fluid-start-width)) / var(--hoou-font-fluid-width-range)), 0em);
}

.is-style-font-buzzard,
.hoou-font-buzzard,
body h4 {
	--hoou-font-fluid-size-min: 20;
	--hoou-font-fluid-size-max: 24;
	--hoou-font-fluid-letter-spacing: 0;
}

.is-style-font-magpie,
.hoou-font-magpie,
body h5 {
	--hoou-font-fluid-size-min: 16;
	--hoou-font-fluid-size-max: 20;
	--hoou-font-fluid-letter-spacing: 0;
}

.is-style-font-pigeon,
.hoou-font-pigeon,
body h6 {
	--hoou-font-fluid-size-min: 16;
	--hoou-font-fluid-size-max: 16;
	--hoou-font-fluid-letter-spacing: 0;
}

/* Statischer Modus: fixiert die Größe auf den Desktop-Zielwert (--hoou-font-fluid-size-max). */
:is(.hoou-font-static, .is-style-font-static) {
	/* Aktuelle Rechenbasis für statische Überschriften am rechten Ende der Fluid-Strecke. */
	--font-fluid-source-width: calc(var(--hoou-font-fluid-start-width) + (var(--hoou-font-fluid-width-range) * 1px));
}

/* Statischer Fallback ohne explizite Bird-Klasse: nutzt die H1-H6-Defaults. */
:is(h1, h2, h3, h4, h5, h6).hoou-font-static,
:is(h1, h2, h3, h4, h5, h6).is-style-font-static {
	--hoou-font-fluid-size-min: var(--hoou-font-fluid-size-max);
}

/* Kontext-Overrides: Über-uns-Bereiche. */
div[class*="ueber-uns-"] h2.wp-block-heading.has-x-large-font-size {
	font-size: 40px !important;
	line-height: 1.45;
	letter-spacing: 0.2px;
	padding-bottom: 15px;
}

div[class*="ueber-uns-"] h3.wp-block-heading {
	font-size: 18px !important;
	font-weight: bold;
	line-height: 34px;
	letter-spacing: -0.27px;
}

.ueber-uns-statements .headline-wrapper h3.wp-block-heading {
	font-size: 28px !important;
}

div[class*="ueber-uns-"] h4.wp-block-heading {
	font-size: 16px !important;
	font-weight: bold;
	line-height: 1.5;
	letter-spacing: 0.08px;
}

div[class*="ueber-uns-"].ueber-uns-statements h4.wp-block-heading {
	font-size: 20px !important;
}

@media only screen and (max-width: 850px) {
	div[class*="ueber-uns-"] h2.wp-block-heading.has-x-large-font-size {
		font-size: 30px !important;
	}

	div[class*="ueber-uns-"] h3.wp-block-heading {
		font-size: 18px !important;
	}

	.ueber-uns-statements .headline-wrapper h3.wp-block-heading {
		font-size: 28px !important;
	}

	div[class*="ueber-uns-"] h4.wp-block-heading {
		font-size: 16px !important;
	}

	div[class*="ueber-uns-"].ueber-uns-statements h4.wp-block-heading {
		font-size: 20px !important;
	}
}

/* Legacy-Typografie für Headings mit Klasse has-x-large-font-size (Altlast-Kompatibilität). */
:is(h1, h2, h3, h4, h5, h6).has-x-large-font-size {
	color: var(--hoou-blau);
	font-family: "Poppins", "Verdana", sans-serif;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.005em;
}