/* ============================================================
   PRZ Hero Header
   Full-Bleed core/cover: Bildhintergrund + graues Overlay + H1.
   Overlay (grau) und weiße Schrift kommen NATIV aus dem Cover-Block
   (funktioniert dadurch auch im Editor ohne Component-CSS).
   Component-CSS nur für: Full-Bleed-Breakout, Container-Ausrichtung
   des Textes (unten-links) und responsive Höhe.
   ============================================================ */

.prz-hero {
	/* Full-Bleed auf allen Breakpoints — Cover align:full allein bricht in
	   unserem .prz-container nicht aus (kein WP-constrained-Layout),
	   deshalb der bewährte 100vw-Breakout wie bei cta-image-banner. */
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* Mobile: flacherer Hero (überschreibt die inline min-height:600px aus
   dem Cover-Block, daher !important). */
@media (max-width: 767px) {
	.prz-hero {
		min-height: 460px !important;
	}
}

/* Textspalte auf Site-Container-Breite bringen und den Inhalt unten-links
   ausrichten. align-self: stretch überschreibt Covers align-items: center,
   damit die Spalte volle Höhe bekommt und justify-content: flex-end den
   Text nach unten schiebt. margin-inline: auto richtet die Spalte an der
   Container-Kante aus (Text fluchtet mit dem restlichen Seiteninhalt). */
.prz-hero .wp-block-cover__inner-container {
	align-self: stretch;
	width: 100%;
	max-width: calc(var(--prz-container-max) + 2 * var(--prz-container-padding));
	margin-inline: auto;
	padding: var(--prz-space-xl) var(--prz-container-padding);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.prz-hero__title {
	color: var(--prz-color-text-inverse);
	/* Begrenzt die Zeilenlänge, damit die Headline auf Desktop umbricht.
	   Kein Token für Text-Measure, daher fixer Wert; Mobile bricht ohnehin
	   früher (Viewport < 820px). */
	max-width: 820px;
}