/* ==================================================================
   RSF Phönix – Variante A+C „Waldgrün modular“
   Farben & Schrift: Variante A · Layout: Variante C
   ================================================================== */

:root {
	--ph-wald: #10291f;
	--ph-wald-hell: #1f4535;
	--ph-linie: #2c5a44;
	--ph-gruen: #2fae47;
	--ph-gruen-text: #1d7a33;
	--ph-hellgruen: #7fd18f;
	--ph-rot: #c8161d;
	--ph-rot-dunkel: #a3121a;
	--ph-creme: #f5f4ef;
	--ph-weiss: #ffffff;
	--ph-nebel: #d5e2d9;
	--ph-schiefer: #4a5a52;
	--ph-braun: #6b5a2c;
	--ph-grau: #dde3dc;
	--ph-beige: #e4e2da;

	--ph-display: "Barlow Condensed", "Arial Narrow", sans-serif;
	--ph-text: "Source Sans 3", system-ui, -apple-system, "Segoe UI", sans-serif;

	--ph-rand: 64px;
	--ph-luecke: 16px;
	--ph-abschnitt: 96px;
	--ph-r-gross: 28px;
	--ph-r-karte: 22px;
	--ph-r-klein: 18px;

	/* Höhenlinien und Welle als Hintergrundmotive */
	--ph-linien-hero: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 760 620' fill='none' stroke='%232c5a44' stroke-width='1.5'%3E%3Cpath d='M520 40c120 10 210 90 200 190s-110 150-210 140-170-80-160-170 60-170 170-160z'/%3E%3Cpath d='M515 80c90 8 160 70 152 150s-86 116-164 108-130-62-122-132 48-134 134-126z'/%3E%3Cpath d='M512 120c62 6 110 48 104 104s-60 80-114 74-88-44-82-92 34-92 92-86z'/%3E%3Cpath d='M510 162c32 3 56 26 52 54s-30 40-58 36-44-22-40-46 16-47 46-44z'/%3E%3Cpath d='M-20 520c140-60 260 20 390-10s230-120 420-60'/%3E%3Cpath d='M-20 570c150-50 270 30 400 0s230-110 410-50'/%3E%3C/svg%3E");
	--ph-linien-band: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 560' preserveAspectRatio='none' fill='none' stroke='%231f4535' stroke-width='1.5'%3E%3Cpath d='M-10 120c200-60 380 40 620 0s440-110 840-30'/%3E%3Cpath d='M-10 170c210-50 390 50 630 10s430-100 830-20'/%3E%3Cpath d='M-10 220c220-40 400 60 640 20s420-90 820-10'/%3E%3Cpath d='M-10 470c260-40 480 40 720 0s460-60 740-20'/%3E%3C/svg%3E");
	--ph-linien-kachel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 300' fill='none' stroke='%235cc36f' stroke-width='1.5'%3E%3Cpath d='M200 30c90 5 160 60 150 130s-90 110-170 100-130-60-120-130 50-105 140-100z'/%3E%3Cpath d='M200 70c60 4 105 40 98 88s-58 72-112 66-86-40-80-86 34-72 94-68z'/%3E%3Cpath d='M200 110c30 2 52 20 48 44s-28 36-54 32-42-20-38-42 16-36 44-34z'/%3E%3C/svg%3E");
	--ph-welle: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1312 60' preserveAspectRatio='none'%3E%3Cpath d='M0 40 C 260 5, 470 55, 720 30 S 1150 10, 1312 34' fill='none' stroke='%232fae47' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E");
	--ph-pfeil: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M9 7h8v8'/%3E%3C/svg%3E");
}

/* ------------------------------------------------------------------
   Grundlagen (ganze Website)
   ------------------------------------------------------------------ */

body,
button,
input,
select,
textarea {
	font-family: var(--ph-text);
}

body {
	background-color: var(--ph-creme);
	color: var(--ph-wald);
}

h1, h2, h3,
.entry-title {
	font-family: var(--ph-display);
	font-weight: 800;
	text-transform: uppercase;
	line-height: 0.95;
	letter-spacing: 0.005em;
	color: inherit;
}

a {
	color: var(--ph-gruen-text);
}

a:hover,
a:focus {
	color: var(--ph-wald);
}

:focus-visible {
	outline: 3px solid var(--ph-gruen);
	outline-offset: 2px;
}

/* Farbklassen aus der Palette */
.has-wald-color { color: var(--ph-wald) !important; }
.has-gruen-color { color: var(--ph-gruen) !important; }
.has-rot-color { color: var(--ph-rot) !important; }
.has-creme-color { color: var(--ph-creme) !important; }
.has-weiss-color { color: var(--ph-weiss) !important; }
.has-gruen-text-color { color: var(--ph-gruen-text) !important; }
.has-schiefer-color { color: var(--ph-schiefer) !important; }
.has-wald-background-color { background-color: var(--ph-wald) !important; }
.has-gruen-background-color { background-color: var(--ph-gruen) !important; }
.has-rot-background-color { background-color: var(--ph-rot) !important; }
.has-creme-background-color { background-color: var(--ph-creme) !important; }
.has-weiss-background-color { background-color: var(--ph-weiss) !important; }

mark.has-inline-color {
	background: transparent;
	padding: 0;
}

/* ------------------------------------------------------------------
   Kopfbereich (GeneratePress)
   ------------------------------------------------------------------ */

/* Kopf- und Fußbereich laufen über die volle Breite, Inhalt wie die Seiten */
.site-header.grid-container,
.site-footer .site-info.grid-container {
	max-width: none;
}

.inside-header.grid-container,
.inside-site-info.grid-container {
	box-sizing: border-box;
	max-width: 1440px;
	padding-left: var(--ph-rand);
	padding-right: var(--ph-rand);
}

.site-header {
	background-color: var(--ph-weiss);
}

.inside-header {
	padding-top: 16px;
	padding-bottom: 16px;
}

.site-logo .header-image,
.site-logo img {
	max-height: 56px;
	width: auto;
}

.main-navigation,
.main-navigation ul ul {
	background-color: transparent;
}

.main-navigation .main-nav ul li a {
	font-family: var(--ph-text);
	font-weight: 600;
	font-size: 15px;
	color: var(--ph-wald);
}

.menu-bar-items {
	align-items: center;
}

.ph-cta {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	margin-left: 12px;
	padding: 0 22px;
	border-radius: 999px;
	background-color: var(--ph-rot);
	color: var(--ph-weiss) !important;
	font-weight: 700;
	font-size: 15px;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
}

.ph-cta:hover,
.ph-cta:focus {
	background-color: var(--ph-rot-dunkel);
	color: var(--ph-weiss);
}

@media (min-width: 769px) {
	/* Navigation als Pillen-Leiste */
	.main-navigation .main-nav > ul {
		display: flex;
		gap: 4px;
		padding: 6px;
		border-radius: 999px;
		background-color: var(--ph-creme);
	}

	.main-navigation .main-nav > ul > li > a {
		line-height: 1;
		padding: 13px 16px;
		border-radius: 999px;
	}

	.main-navigation .main-nav > ul > li:hover > a,
	.main-navigation .main-nav > ul > li.sfHover > a {
		background-color: var(--ph-grau);
		color: var(--ph-wald);
	}

	.main-navigation .main-nav > ul > li[class*="current-menu-"] > a {
		background-color: var(--ph-wald);
		color: var(--ph-weiss);
	}

	.main-navigation ul ul {
		background-color: var(--ph-weiss);
		border-radius: 14px;
		box-shadow: 0 8px 24px rgba(16, 41, 31, 0.14);
		padding: 6px;
	}

	.main-navigation .main-nav ul ul li a {
		border-radius: 10px;
	}
}

@media (max-width: 768px) {
	.site-logo .header-image,
	.site-logo img {
		max-height: 46px;
	}

	.ph-cta {
		padding: 0 16px;
		font-size: 14px;
	}

	.main-navigation .menu-toggle {
		color: var(--ph-wald);
		font-weight: 700;
	}

	.main-navigation.toggled .main-nav ul li a {
		padding-top: 6px;
		padding-bottom: 6px;
	}

	.main-navigation.toggled .main-nav > ul > li[class*="current-menu-"] > a {
		color: var(--ph-gruen-text);
	}
}

/* ------------------------------------------------------------------
   Fußbereich (GeneratePress)
   ------------------------------------------------------------------ */

.site-footer,
.site-info,
.footer-widgets {
	background-color: var(--ph-wald);
	color: var(--ph-nebel);
}

.site-info a,
.footer-widgets a {
	color: var(--ph-nebel);
}

.site-info a:hover,
.footer-widgets a:hover {
	color: var(--ph-weiss);
}

.inside-site-info {
	padding-top: 40px;
	padding-bottom: 40px;
}

.copyright-bar {
	width: 100%;
	text-align: left;
}

.ph-footer {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 24px;
	font-size: 15px;
}

.ph-footer__verein {
	display: flex;
	align-items: center;
	gap: 16px;
}

.ph-footer__logo {
	display: inline-flex;
	padding: 6px 10px;
	border-radius: 12px;
	background-color: var(--ph-weiss);
}

.ph-footer__logo img {
	display: block;
	height: 40px;
	width: auto;
}

.ph-footer__text strong {
	color: var(--ph-weiss);
}

.ph-footer__links ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 28px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ph-footer__links a {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ------------------------------------------------------------------
   Vollbreite Seiten
   ------------------------------------------------------------------ */

body.ph-vollbreite #page,
body.ph-vollbreite .site.grid-container {
	max-width: none;
	padding: 0;
}

body.ph-vollbreite .site-content {
	display: block;
	padding: 0;
}

.ph-main {
	display: block;
	width: 100%;
}

/* Grundabstände der Blöcke innerhalb der Vorlagen neutralisieren */
.ph-seite :where(p, h1, h2, h3, figure, ul) {
	margin: 0;
}

.ph-seite .wp-block-columns {
	margin-bottom: 0;
}

.ph-seite {
	padding-bottom: 72px;
	color: var(--ph-wald);
}

/* Abschnitte untereinander (mit und ohne innere Container von WordPress) */
.ph-seite > * + *,
.ph-seite > .wp-block-group__inner-container > * + * {
	margin-top: var(--ph-abschnitt);
}

/* Inhaltsbreite */
.ph-wrap {
	box-sizing: border-box;
	width: 100%;
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
	padding-left: var(--ph-rand);
	padding-right: var(--ph-rand);
}

/* Stapel: Abstand zwischen Elementen in einem Abschnitt */
.ph-wrap > * + *,
.ph-wrap > .wp-block-group__inner-container > * + * {
	margin-top: 32px;
}

/* ------------------------------------------------------------------
   Typografie in den Vorlagen
   ------------------------------------------------------------------ */

.ph-kicker {
	font-family: var(--ph-text);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	line-height: 1.3;
	text-transform: uppercase;
	color: var(--ph-gruen-text);
}

.ph-k--rot { color: var(--ph-rot); }
.ph-k--braun { color: var(--ph-braun); }
.ph-k--gruen { color: var(--ph-gruen-text); }

.ph-display {
	font-size: 80px;
	line-height: 0.92;
	color: var(--ph-weiss);
}

.ph-h2 {
	font-size: 56px;
	line-height: 0.92;
}

.ph-h2--gross {
	font-size: 68px;
}

.ph-h2--hell {
	color: var(--ph-weiss);
}

.ph-lead {
	font-size: 19px;
	line-height: 1.5;
	color: var(--ph-nebel);
	max-width: 540px;
}

.ph-unterzeile {
	font-size: 16px;
	color: var(--ph-schiefer);
}

.ph-mehr {
	font-weight: 700;
	font-size: 16px;
}

.ph-mehr a {
	color: var(--ph-gruen-text);
	text-underline-offset: 3px;
}

.ph-leer,
.ph-hinweis {
	padding: 16px 18px;
	border-radius: var(--ph-r-klein);
	background-color: var(--ph-weiss);
	color: var(--ph-schiefer);
}

.ph-hinweis {
	border: 2px dashed var(--ph-rot);
}

/* ------------------------------------------------------------------
   Kachelraster oben (Bento)
   ------------------------------------------------------------------ */

.ph-bento.wp-block-columns {
	gap: var(--ph-luecke);
	align-items: stretch;
	margin-top: 8px;
}

.ph-seite > .ph-bento:first-child,
.ph-seite > .wp-block-group__inner-container > .ph-bento:first-child {
	margin-top: 8px;
}

/* Hero */
.ph-hero.wp-block-column {
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 20px;
	min-height: 600px;
	padding: 48px 52px;
	border-radius: var(--ph-r-gross);
	background-color: var(--ph-wald);
	background-image: var(--ph-linien-hero);
	background-size: cover;
	background-position: center;
	color: var(--ph-weiss);
}

.ph-hero .ph-kicker {
	color: var(--ph-hellgruen);
}

.ph-hero > * {
	position: relative;
}

.ph-hero .ph-hero__foto {
	position: absolute;
	top: 40px;
	right: 44px;
	width: 300px;
	margin: 0;
}

.ph-hero .ph-hero__foto img {
	display: block;
	width: 100%;
	height: 210px;
	object-fit: cover;
	border-radius: 22px;
}

/* Rechte Seite: Kacheln */
.ph-kacheln.wp-block-column {
	display: flex;
	flex-direction: column;
	gap: var(--ph-luecke);
}

.ph-kacheln > * {
	margin: 0 !important;
}

.ph-kacheln > .ph-kachel--gruen {
	flex: 1.15 1 0;
}

.ph-kacheln > .ph-kachel-reihe {
	flex: 1 1 0;
}

.ph-kachel-reihe.wp-block-columns {
	gap: var(--ph-luecke);
	align-items: stretch;
}

.ph-kachel-reihe > .wp-block-column {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.ph-kachel-reihe > .wp-block-column > * {
	flex: 1 1 auto;
}

/* Kachel-Grundform */
.ph-kachel {
	box-sizing: border-box;
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 12px;
	min-height: 180px;
	padding: 28px;
	border-radius: var(--ph-r-gross);
	text-decoration: none;
	color: var(--ph-wald);
}

.ph-kachel > .wp-block-group__inner-container {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 12px;
}

a.ph-kachel:hover .ph-kachel__titel,
a.ph-kachel:focus .ph-kachel__titel {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

.ph-kachel__gross {
	font-size: 64px;
	line-height: 0.92;
}

.ph-kachel__titel {
	font-family: var(--ph-display);
	font-weight: 800;
	text-transform: uppercase;
	font-size: 34px;
	line-height: 0.95;
}

.ph-kachel__unten {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.ph-kachel__klein {
	font-size: 14px;
	color: var(--ph-schiefer);
}

/* Grüne Info-Kachel – Text immer waldgrün (Kontrast!) */
.ph-kachel--gruen {
	padding: 32px 36px;
	background-color: var(--ph-gruen);
	background-image: var(--ph-linien-kachel);
	background-repeat: no-repeat;
	background-size: 340px auto;
	background-position: right -40px top -30px;
	color: var(--ph-wald);
}

.ph-kachel--gruen .ph-kicker,
.ph-kachel--gruen p,
.ph-kachel--gruen a {
	color: var(--ph-wald);
}

.ph-kachel--gruen p:last-child {
	font-weight: 600;
	font-size: 16px;
}

/* Weiße Kachel */
.ph-kachel--weiss {
	background-color: var(--ph-weiss);
}

.ph-kachel--weiss .ph-kachel__gross {
	font-size: 44px;
}

.ph-kachel--weiss p:last-child:not(.ph-kicker) {
	font-size: 15px;
	color: var(--ph-schiefer);
}

/* Rote Handlungs-Kachel aus einem Button-Block */
.ph-kachel-buttons.wp-block-buttons {
	display: flex;
	align-items: stretch;
	height: 100%;
	margin: 0;
}

.ph-kachel-button.wp-block-button {
	display: flex;
	flex: 1 1 100%;
	width: 100%;
	margin: 0;
}

.ph-kachel-button.wp-block-button .wp-block-button__link.wp-element-button {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: flex-start;
	width: 100%;
	min-height: 180px;
	padding: 72px 28px 28px;
	border-radius: var(--ph-r-gross);
	background-color: var(--ph-rot);
	background-image: var(--ph-pfeil);
	background-repeat: no-repeat;
	background-size: 30px 30px;
	background-position: 28px 28px;
	color: var(--ph-weiss);
	font-family: var(--ph-display);
	font-weight: 800;
	font-size: 32px;
	line-height: 0.95;
	text-align: left;
	text-transform: uppercase;
	text-decoration: none;
	hyphens: manual;
}

.ph-kachel-button.wp-block-button .wp-block-button__link.wp-element-button:hover,
.ph-kachel-button.wp-block-button .wp-block-button__link.wp-element-button:focus {
	background-color: var(--ph-rot-dunkel);
	color: var(--ph-weiss);
}

/* ------------------------------------------------------------------
   Dunkle Bänder mit Höhenlinien
   ------------------------------------------------------------------ */

.ph-band {
	padding-top: 88px;
	padding-bottom: 88px;
	background-color: var(--ph-wald);
	background-image: var(--ph-linien-band);
	background-size: 100% 100%;
	color: var(--ph-weiss);
}

/* ------------------------------------------------------------------
   Karten (Sparten, Trainingsgruppen, Schritte)
   ------------------------------------------------------------------ */

.ph-karten.wp-block-columns {
	gap: 20px;
	align-items: stretch;
}

.ph-karten.wp-block-columns + .ph-karten.wp-block-columns {
	margin-top: 16px;
}

.ph-karte.wp-block-column {
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 8px;
	overflow: hidden;
	border-radius: var(--ph-r-karte);
	background-color: var(--ph-weiss);
	color: var(--ph-wald);
}

.ph-karte > :not(.ph-karte__bild) {
	margin-left: 26px;
	margin-right: 26px;
}

.ph-karte > :last-child {
	margin-bottom: 26px;
}

.ph-karte > .ph-karte__bild + * {
	margin-top: 18px;
}

.ph-karte--text.wp-block-column {
	padding-top: 26px;
}

.ph-karte .ph-karte__bild {
	margin: 0;
}

.ph-karte .ph-karte__bild img {
	display: block;
	width: 100%;
	height: 220px;
	object-fit: cover;
}

.ph-karte__titel {
	font-size: 38px;
	line-height: 0.95;
}

.ph-karte__titel a {
	color: inherit;
	text-decoration: none;
}

.ph-karte__titel a:hover,
.ph-karte__titel a:focus {
	text-decoration: underline;
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

.ph-karte p:not(.ph-kicker):not(.ph-schritt-nr) {
	font-size: 16px;
	line-height: 1.5;
	color: var(--ph-schiefer);
}

.ph-karte--dunkel.wp-block-column {
	justify-content: space-between;
	background-color: var(--ph-wald);
	color: var(--ph-weiss);
}

.ph-karte--dunkel.wp-block-column p:not(.ph-kicker) {
	color: var(--ph-nebel);
}

.ph-karte--dunkel a {
	color: var(--ph-gruen);
	font-weight: 700;
}

.ph-schritt-nr {
	font-family: var(--ph-display);
	font-weight: 800;
	font-size: 72px;
	line-height: 0.85;
	color: var(--ph-gruen-text);
}

/* ------------------------------------------------------------------
   Termine | Berichte
   ------------------------------------------------------------------ */

.ph-split.wp-block-columns {
	gap: 48px;
}

.ph-split > .wp-block-column > * + * {
	margin-top: 22px;
}

.ph-termine {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ph-termin__link {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 16px 18px;
	border-radius: var(--ph-r-klein);
	background-color: var(--ph-weiss);
	color: var(--ph-wald);
	text-decoration: none;
}

.ph-termin__link:hover .ph-termin__titel,
.ph-termin__link:focus .ph-termin__titel {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.ph-datum {
	flex: 0 0 60px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	border-radius: 14px;
	background-color: var(--ph-wald);
	color: var(--ph-weiss);
}

.ph-datum__tag {
	font-family: var(--ph-display);
	font-weight: 800;
	font-size: 26px;
	line-height: 1;
}

.ph-datum__monat {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.ph-termin__text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.ph-termin__text .ph-kicker {
	font-size: 11px;
}

.ph-termin__titel {
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
}

.ph-termin__ort {
	font-size: 14px;
	color: var(--ph-schiefer);
}

.ph-berichte {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}

.ph-bericht {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ph-bericht__bild {
	display: block;
	overflow: hidden;
	border-radius: 20px;
	background-color: var(--ph-beige);
	aspect-ratio: 16 / 10;
}

.ph-bericht__bild img,
.ph-bericht__ohne-bild {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ph-bericht__ohne-bild {
	background: var(--ph-beige) url("img/platzhalter-hell.jpg") center / cover no-repeat;
	opacity: 0.6;
}

.ph-bericht__meta {
	margin: 0;
	font-size: 14px;
	color: var(--ph-schiefer);
}

.ph-bericht__titel {
	margin: 0;
	font-family: var(--ph-text);
	font-weight: 700;
	font-size: 22px;
	line-height: 1.25;
	text-transform: none;
}

.ph-bericht__titel a {
	color: var(--ph-wald);
	text-decoration: none;
}

.ph-bericht__titel a:hover,
.ph-bericht__titel a:focus {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ------------------------------------------------------------------
   Aufruf „Werde Teil der Phönix-Familie“
   ------------------------------------------------------------------ */

.ph-aufruf.wp-block-columns {
	box-sizing: border-box;
	align-items: center;
	gap: 40px;
	padding: 56px 64px 80px;
	border-radius: var(--ph-r-gross);
	background-color: var(--ph-wald);
	background-image: var(--ph-welle);
	background-repeat: no-repeat;
	background-size: 100% 44px;
	background-position: left bottom 14px;
	color: var(--ph-weiss);
}

.ph-aufruf .ph-h2 {
	font-size: 60px;
}

.ph-aufruf .ph-lead {
	margin-top: 12px;
	font-size: 18px;
}

.ph-aufruf .wp-block-buttons {
	justify-content: flex-end;
}

/* Normaler roter Button */
.ph-button-rot.wp-block-button .wp-block-button__link.wp-element-button {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 18px 30px;
	border-radius: 999px;
	background-color: var(--ph-rot);
	color: var(--ph-weiss);
	font-weight: 700;
	font-size: 18px;
	line-height: 1.1;
	text-decoration: none;
}

.ph-button-rot.wp-block-button .wp-block-button__link.wp-element-button:hover,
.ph-button-rot.wp-block-button .wp-block-button__link.wp-element-button:focus {
	background-color: var(--ph-rot-dunkel);
	color: var(--ph-weiss);
}

/* ------------------------------------------------------------------
   Ansprechperson
   ------------------------------------------------------------------ */

.ph-kontakt-reihe.wp-block-columns {
	gap: var(--ph-luecke);
	align-items: stretch;
}

.ph-kontakt-reihe > .wp-block-column {
	display: flex;
	flex-direction: column;
}

.ph-kontakt-reihe > .wp-block-column > * {
	flex: 1 1 auto;
}

.ph-kontakt.wp-block-group {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 28px;
	padding: 36px 40px;
	border-radius: var(--ph-r-gross);
	background-color: var(--ph-weiss);
}

.ph-kontakt .ph-kontakt__foto {
	flex: 0 0 120px;
	margin: 0;
}

.ph-kontakt .ph-kontakt__foto img {
	display: block;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	object-fit: cover;
}

.ph-kontakt__text > * + *,
.ph-kontakt__text > .wp-block-group__inner-container > * + * {
	margin-top: 6px;
}

.ph-kontakt__name {
	font-size: 48px;
	line-height: 0.95;
}

.ph-kontakt-reihe .ph-kachel-button.wp-block-button .wp-block-button__link.wp-element-button {
	font-size: 48px;
}

/* ------------------------------------------------------------------
   Handy und Tablet
   ------------------------------------------------------------------ */

@media (max-width: 1100px) {
	:root {
		--ph-rand: 32px;
	}

	.ph-display { font-size: 64px; }
	.ph-hero .ph-hero__foto { width: 220px; }
	.ph-hero .ph-hero__foto img { height: 150px; }
	.ph-kachel__gross { font-size: 48px; }
	.ph-aufruf .ph-h2 { font-size: 48px; }
}

@media (max-width: 781px) {
	:root {
		--ph-rand: 16px;
		--ph-abschnitt: 48px;
		--ph-r-gross: 24px;
		--ph-luecke: 10px;
	}

	.ph-bento.wp-block-columns {
		padding-left: 12px;
		padding-right: 12px;
	}

	.ph-hero.wp-block-column {
		min-height: 0;
		padding: 20px 20px 28px;
		justify-content: flex-start;
		gap: 16px;
	}

	.ph-hero .ph-hero__foto {
		position: relative;
		top: auto;
		right: auto;
		width: 100%;
	}

	.ph-hero .ph-hero__foto img {
		height: 170px;
		border-radius: 18px;
	}

	.ph-display { font-size: 54px; }
	.ph-lead { font-size: 16px; }
	.ph-h2,
	.ph-h2--gross,
	.ph-aufruf .ph-h2 { font-size: 40px; }

	.ph-kachel {
		min-height: 150px;
		padding: 18px;
	}

	.ph-kachel--gruen { padding: 20px; }
	.ph-kachel__gross { font-size: 40px; }
	.ph-kachel--weiss .ph-kachel__gross { font-size: 30px; }
	.ph-kachel__titel { font-size: 24px; }

	.ph-kachel-button.wp-block-button .wp-block-button__link.wp-element-button,
	.ph-kontakt-reihe .ph-kachel-button.wp-block-button .wp-block-button__link.wp-element-button {
		min-height: 150px;
		padding: 56px 18px 18px;
		background-size: 24px 24px;
		background-position: 18px 18px;
		font-size: 26px;
	}

	.ph-band {
		padding-top: 44px;
		padding-bottom: 44px;
	}

	.ph-wrap > * + *,
	.ph-wrap > .wp-block-group__inner-container > * + * {
		margin-top: 20px;
	}

	.ph-karten.wp-block-columns { gap: 14px; }
	.ph-karten.wp-block-columns + .ph-karten.wp-block-columns { margin-top: 14px; }

	/* Sparten auf dem Handy als Zeilen mit kleinem Bild */
	.ph-sparten .ph-karte.wp-block-column {
		display: grid;
		grid-template-columns: 108px minmax(0, 1fr);
		grid-template-rows: auto auto;
		column-gap: 14px;
		row-gap: 2px;
		align-content: center;
	}

	.ph-sparten .ph-karte .ph-karte__bild {
		grid-row: 1 / span 2;
	}

	.ph-sparten .ph-karte .ph-karte__bild img {
		width: 108px;
		height: 100%;
		min-height: 96px;
	}

	.ph-sparten .ph-karte > :not(.ph-karte__bild) {
		margin: 0;
		padding-right: 14px;
	}

	.ph-sparten .ph-karte > .ph-karte__bild + * {
		align-self: end;
		margin-top: 0;
	}

	.ph-sparten .ph-karte > :last-child {
		align-self: start;
		margin-bottom: 0;
	}

	.ph-sparten .ph-karte p:not(.ph-kicker) { font-size: 13px; }

	.ph-karte__titel { font-size: 28px; }
	.ph-sparten .ph-karte__titel { font-size: 26px; }
	.ph-karte > :not(.ph-karte__bild) { margin-left: 20px; margin-right: 20px; }
	.ph-karte > :last-child { margin-bottom: 20px; }
	.ph-karte--text.wp-block-column { padding-top: 20px; }
	.ph-schritt-nr { font-size: 56px; }

	.ph-split.wp-block-columns { gap: 44px; }

	.ph-termin__link {
		gap: 14px;
		padding: 12px 14px;
	}

	.ph-datum {
		flex-basis: 52px;
		width: 52px;
		height: 52px;
	}

	.ph-termin__titel { font-size: 16px; }

	.ph-berichte { grid-template-columns: minmax(0, 1fr); }
	.ph-bericht__titel { font-size: 19px; }

	.ph-aufruf.wp-block-columns {
		gap: 20px;
		padding: 32px 22px 64px;
	}

	.ph-aufruf .wp-block-buttons { justify-content: flex-start; }

	.ph-aufruf .ph-button-rot,
	.ph-aufruf .ph-button-rot.wp-block-button .wp-block-button__link.wp-element-button {
		width: 100%;
		justify-content: center;
		box-sizing: border-box;
	}

	.ph-kontakt.wp-block-group {
		gap: 18px;
		padding: 22px;
	}

	.ph-kontakt .ph-kontakt__foto { flex-basis: 80px; }
	.ph-kontakt .ph-kontakt__foto img { width: 80px; height: 80px; }
	.ph-kontakt__name { font-size: 32px; }

	.ph-footer { font-size: 14px; }
}

/* ------------------------------------------------------------------
   Block-Editor: Vorlagen so zeigen, wie sie später aussehen
   ------------------------------------------------------------------ */

.editor-styles-wrapper .ph-seite {
	background-color: var(--ph-creme);
}

.editor-styles-wrapper .ph-hero .ph-hero__foto {
	z-index: 1;
}

/* Innere Container von WordPress in Kacheln */
.ph-kachel__unten > .wp-block-group__inner-container {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

@media (min-width: 769px) {
	.main-navigation .inside-navigation .menu-bar-items {
		order: 10;
	}
}

/* Editor: Phönix-Vorlagen in voller Breite bearbeiten */
.editor-styles-wrapper .wp-block.ph-seite {
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}

.editor-styles-wrapper .ph-seite .wp-block {
	max-width: none;
}

/* ------------------------------------------------------------------
   Tablet / schmale Fenster: Hero oben, Kacheln darunter (v1.0.2)
   ------------------------------------------------------------------ */

@media (min-width: 782px) and (max-width: 1000px) {
	.ph-bento.wp-block-columns {
		flex-wrap: wrap !important;
	}

	.ph-bento.wp-block-columns > .wp-block-column.ph-hero,
	.ph-bento.wp-block-columns > .wp-block-column.ph-kacheln {
		flex-basis: 100% !important;
		width: 100%;
	}

	.ph-hero.wp-block-column {
		min-height: 440px;
	}
}

/* ------------------------------------------------------------------
   Kartentitel nie mitten im Wort umbrechen (v1.0.3)
   ------------------------------------------------------------------ */

.ph-karten .ph-karte__titel,
.ph-karte--text .ph-karte__titel {
	font-size: clamp(22px, 3.3vw, 38px);
	overflow-wrap: normal;
	word-break: normal;
	hyphens: manual;
}

@media (max-width: 781px) {
	.ph-karten .ph-karte__titel,
	.ph-karte--text .ph-karte__titel {
		font-size: 28px;
	}
}

/* v1.0.4 – Untermenü-Links lesbar (GeneratePress setzt sonst Weiß auf Weiß) */
@media (min-width: 769px) {
	.main-navigation .main-nav ul ul li > a,
	.main-navigation .main-nav ul ul li[class*="current-menu-"] > a {
		color: var(--ph-wald) !important;
		background-color: transparent;
		font-size: 15px;
		padding: 11px 16px;
		white-space: nowrap;
	}
	.main-navigation .main-nav ul ul li:hover > a,
	.main-navigation .main-nav ul ul li.sfHover > a,
	.main-navigation .main-nav ul ul li > a:focus {
		background-color: var(--ph-creme);
		color: var(--ph-gruen-text) !important;
	}
	.main-navigation ul ul { min-width: 220px; }
}

/* v1.0.5 – Button „Mitglied werden“ als Menüpunkt (Float-Struktur) */
.main-navigation .main-nav ul li.ph-cta-item > a.ph-cta {
	background-color: var(--ph-rot);
	color: var(--ph-weiss) !important;
	margin-left: 8px;
	padding: 0 22px;
	line-height: 1;
	border-radius: 999px;
}
.main-navigation .main-nav ul li.ph-cta-item > a.ph-cta:hover,
.main-navigation .main-nav ul li.ph-cta-item > a.ph-cta:focus {
	background-color: var(--ph-rot-dunkel);
	color: var(--ph-weiss) !important;
}
@media (min-width: 769px) {
	.main-navigation .main-nav > ul > li.ph-cta-item { display: flex; align-items: center; }
}
@media (max-width: 768px) {
	.main-navigation .main-nav ul li.ph-cta-item > a.ph-cta { margin: 8px 20px; display: inline-flex; min-height: 44px; }
}

/* ------------------------------------------------------------------
   v1.0.6 – Standard-Layout für alle Unterseiten (wie „Jugend“)
   ------------------------------------------------------------------ */
.ph-seitenkopf-wrap { padding-top: 8px; }
.ph-seitenkopf {
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 16px;
	min-height: 280px;
	padding: 48px;
	border-radius: 28px;
	background-color: var(--ph-wald);
	background-image: radial-gradient(circle at 88% 20%, rgba(47, 174, 71, 0.22) 0, rgba(47, 174, 71, 0) 38%), repeating-radial-gradient(circle at 88% 20%, rgba(255, 255, 255, 0.05) 0 2px, transparent 2px 46px);
	color: var(--ph-weiss);
}
.ph-seitenkopf .ph-display { font-size: clamp(44px, 7vw, 80px); overflow-wrap: break-word; }
.ph-unterseite .ph-seite > * + * { margin-top: 24px; }
.ph-inhalt {
	box-sizing: border-box;
	padding: 48px;
	border-radius: 28px;
	background: var(--ph-weiss);
	font-family: var(--ph-text);
	font-size: 18px;
	line-height: 1.65;
	color: var(--ph-wald);
}
.ph-inhalt > * + * { margin-top: 1.1em; }
.ph-inhalt h2, .ph-inhalt h3, .ph-inhalt h4 {
	font-family: var(--ph-display);
	font-weight: 800;
	line-height: 1;
	text-transform: uppercase;
	color: var(--ph-wald);
	margin-top: 1.6em;
}
.ph-inhalt h2 { font-size: clamp(30px, 4vw, 48px); }
.ph-inhalt h3 { font-size: clamp(24px, 3vw, 34px); }
.ph-inhalt h4 { font-size: 24px; }
.ph-inhalt > :first-child { margin-top: 0; }
.ph-inhalt a { color: var(--ph-gruen-text); font-weight: 600; }
.ph-inhalt img, .ph-fliesstext img { max-width: 100%; height: auto; border-radius: 18px; }
.ph-inhalt table { width: 100%; border-collapse: collapse; font-size: 16px; }
.ph-inhalt th, .ph-inhalt td { padding: 10px 12px; border-bottom: 1px solid var(--ph-grau); text-align: left; }
.ph-inhalt th { font-weight: 700; background: var(--ph-creme); }
.ph-inhalt .panel-layout, .ph-inhalt .so-panel { max-width: 100%; }
.ph-inhalt--liste { background: transparent; padding: 0; }
.ph-berichte--raster { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.ph-berichte--raster .ph-bericht { background: var(--ph-weiss); border-radius: 24px; padding: 16px 16px 24px; }
.ph-berichte--raster .ph-bericht__titel { font-size: 22px; }
.ph-inhalt--liste .navigation.pagination { margin-top: 32px; font-weight: 600; }
.ph-fliesstext { max-width: 760px; font-size: 18px; line-height: 1.65; }
.ph-fliesstext > * + * { margin-top: 1em; }
.ph-fliesstext img { margin: 8px 8px 8px 0; max-height: 360px; width: auto; }
.ph-fliesstext a { color: var(--ph-gruen-text); font-weight: 600; }
@media (max-width: 900px) { .ph-berichte--raster { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 781px) {
	.ph-seitenkopf { padding: 28px; min-height: 200px; }
	.ph-inhalt { padding: 24px; border-radius: 20px; }
	.ph-berichte--raster { grid-template-columns: 1fr; }
}

/* v1.0.7 – Button „Mitglied werden“ im Menü: Text mittig, Höhe wie die Menü-Pillen */
.main-navigation .main-nav ul li.ph-cta-item > a.ph-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 41px;
	min-height: 0;
	margin: 0 0 0 8px;
	padding: 0 22px;
	line-height: 1;
	white-space: nowrap;
}
.main-navigation .main-nav > ul > li.ph-cta-item { align-self: center; height: auto; }
@media (max-width: 768px) {
	.main-navigation .main-nav ul li.ph-cta-item > a.ph-cta { height: 44px; margin: 8px 20px; }
}