/* 98 – Typografie-Vereinheitlichung
 *
 * Befund vom 19.08.2026: Der Fließtext lief je nach Sektion mit 15,94 px oder
 * 18 px, und Überschriften innerhalb von Text-Editor-Widgets waren mit 16,5 px
 * kleiner als der Fließtext um sie herum. Elementor vererbt dort nichts, Astras
 * Skala greift nur bei Widgets. Hier wird beides auf eine Skala gezogen.
 */

/* --- Fließtext: eine Größe für alle Elementor-Textbausteine --- */
.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-widget-text-editor li,
.elementor-widget-theme-post-content p,
.elementor-widget-theme-post-content li {
	font-size: var(--cz-text-basis);
	line-height: 1.72;
}

/* Der erste Absatz eines Abschnitts darf führen – aber überall gleich viel. */
.elementor-widget-text-editor > .elementor-widget-container > p:first-child,
p.cz-lead {
	font-size: var(--cz-schrift-lead, 1.1875rem);
	line-height: 1.62;
	color: var(--cz-text);
}

/* --- Überschriften in Textblöcken auf die Widget-Skala heben --- */
.elementor-widget-text-editor h2,
.elementor-widget-theme-post-content h2 {
	font-size: var(--cz-h2, clamp(1.7rem, 1.2rem + 1.6vw, 2.35rem));
	line-height: 1.22;
}

.elementor-widget-text-editor h3,
.elementor-widget-theme-post-content h3 {
	font-size: var(--cz-h3, clamp(1.3rem, 1.05rem + 0.8vw, 1.55rem));
	line-height: 1.3;
}

.elementor-widget-text-editor h4,
.elementor-widget-theme-post-content h4 {
	font-size: var(--cz-h4, 1.15rem);
	line-height: 1.35;
}

.elementor-widget-text-editor h2,
.elementor-widget-text-editor h3,
.elementor-widget-text-editor h4,
.elementor-widget-theme-post-content h2,
.elementor-widget-theme-post-content h3,
.elementor-widget-theme-post-content h4 {
	font-family: var(--cz-schrift-titel, "Quicksand", sans-serif);
	font-weight: 600;
	color: var(--cz-orange-braun);
	margin-top: 2.1em;
	margin-bottom: 0.55em;
}

.elementor-widget-text-editor > .elementor-widget-container > :first-child {
	margin-top: 0;
}

/* --- Widget-Überschriften: gleiche Skala, egal in welcher Spaltenbreite --- */
:where(.elementor-widget-heading) :where(.elementor-heading-title) {
	font-size: var(--cz-h2, clamp(1.7rem, 1.2rem + 1.6vw, 2.35rem));
	line-height: 1.22;
}

:where(.elementor-widget-heading) :where(.elementor-heading-title.elementor-size-small) {
	font-size: var(--cz-h3, clamp(1.3rem, 1.05rem + 0.8vw, 1.55rem));
}

:where(h1.elementor-heading-title) {
	font-size: var(--cz-h1, clamp(2.1rem, 1.4rem + 2.4vw, 3.25rem));
}

@media (max-width: 921px) {
	.elementor-widget-text-editor,
	.elementor-widget-text-editor p,
	.elementor-widget-text-editor li {
		font-size: 1.0625rem;
	}
}

/* --- Lesespalte auf dieselbe Skala ziehen ---------------------------
 * Befund 19.08.2026: Absätze in .cz-lesespalte liefen mit 20,25 px,
 * daneben stand Fließtext mit 15,94 px – derselbe Text wirkte je nach
 * Sektion unterschiedlich groß. Beides läuft jetzt über dieselben Tokens.
 */
.cz-lesespalte .elementor-widget-text-editor,
.cz-lesespalte .elementor-widget-text-editor p,
.cz-lesespalte .elementor-widget-text-editor li,
.elementor .cz-lesespalte p,
.elementor .cz-lesespalte li {
	font-size: var(--cz-text-basis);
	line-height: 1.72;
}

.cz-lesespalte .elementor-widget-text-editor > .elementor-widget-container > p:first-child {
	font-size: var(--cz-schrift-lead);
	line-height: 1.62;
}

/* Kleintexte bleiben klein – Bildunterschriften, Quellen, Zeitangaben. */
.elementor .cz-referenz__quelle,
.elementor .cz-referenz__zeitraum p {
	font-size: 14px;
}