/*
 * Compendion Mitwirkende-Uebersicht — Page-Layout fuer
 * `compendion.net/mitwirkende/`.
 *
 * Eingebunden nur auf der Uebersichts-URL (siehe
 * includes/contributors/mitwirkende-overview.php, gated). Das Card-Markup
 * teilt sich diese Page mit dem Sub-Site-Shortcode
 * `[compendion-contributors]`; die Card- und Grid-Stile leben deshalb in
 * `compendion-components.css` (queer geladen). Hier bleibt nur das
 * Page-spezifische Layout (Hero-Header, Group-Container, Empty-States).
 */

/* Hinweis: Die Voll-Breite des `<main>` (sonst kollabiert das wide-layout-`<main>`
 * als Flex-Kind auf Inhaltsbreite → Grid einspaltig, Headings zu schmal) kommt
 * systemisch aus `main.compendion-wide-layout { width: 100% }` in
 * compendion-components.css — gilt fuer alle wide-layout-Seiten (Fundus,
 * Podcasts, Profil, …), nicht nur hier. */

.compendion-mitwirkende-overview {
	display: flex;
	flex-direction: column;
	gap: clamp(2rem, 5vw, 3.5rem);
	padding-block: clamp(1.5rem, 4vw, 3rem);
}

.compendion-mitwirkende-overview__header {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	width: 100%;
	max-width: var(--wp--style--global--content-size, 720px);
	margin-inline: auto;
}

/* Page-Title-Skala analog zu Block-Theme-Post-Title (xxx-large/clamp).
 * Vorher: H1 erbte den generischen H1-Stil, der in Twenty-Twenty-Five im
 * Inhaltsfluss kleiner ist als ein expliziter Post-Title-Block. */
.compendion-mitwirkende-overview__header h1 {
	font-size: clamp(2.25rem, 5vw, 3.5rem);
	line-height: 1.1;
	margin: 0;
}

.compendion-mitwirkende-overview__lede {
	color: color-mix(in srgb, var(--wp--preset--color--contrast) 70%, transparent);
	font-size: clamp(1rem, 2vw, 1.125rem);
	margin: 0;
}

.compendion-mitwirkende-overview__group {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

/* Box (720px-Spalte, zentriert, linksbündig) kommt aus der global geladenen
 * compendion-components.css (`.compendion-mitwirkende-overview__group h2`) —
 * Single Source für alle Render-Pfade. Hier bleibt nur die Page-spezifische
 * Schriftgröße. */
.compendion-mitwirkende-overview__group h2 {
	font-size: clamp(1.5rem, 3vw, 2rem);
}

.compendion-mitwirkende-overview--empty,
.compendion-mitwirkende-overview--unavailable {
	color: color-mix(in srgb, var(--wp--preset--color--contrast) 60%, transparent);
}