/* ============================================================
 * Phase-3-Templates: Archiv, Bezirks-Silo, WG-Detail, Formular.
 * Mobile-first, nutzt die Design-Tokens aus tokens.css.
 * ============================================================ */

/* ---- Breadcrumb ---- */
.breadcrumb {
	background: var(--bg-soft);
	border-bottom: 1px solid var(--border);
	padding: 12px 0;
	font-size: 13px;
	color: var(--text-muted);
}
.breadcrumb a { color: inherit; }
.breadcrumb [aria-current="page"] { color: var(--anthrazit); font-weight: 700; }
.breadcrumb > .container-wide > span[aria-hidden="true"] { margin: 0 6px; opacity: .5; }

/* ---- Listing-Hero ---- */
.listing-hero {
	background: #fff;
	padding: var(--s-8) 0 var(--s-7);
}
.listing-hero__grid {
	display: grid;
	gap: var(--s-7);
	grid-template-columns: 1fr;
}
.listing-hero h1 {
	font-size: clamp(28px, 4vw, 42px);
	margin-top: 14px;
	line-height: 1.1;
}
.listing-hero__lead {
	margin-top: 16px;
	font-size: var(--fs-md);
	color: var(--text-muted);
	max-width: 640px;
}
.listing-hero__lead strong { color: var(--anthrazit); }
.listing-hero__desc { margin-top: 14px; color: var(--text-muted); }
.listing-hero__aside {
	background: var(--bg-section);
	padding: var(--s-6);
	border-radius: var(--r-lg);
	border: 1px solid var(--border);
}
.listing-hero__aside h4 {
	font-size: 13px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--text-muted);
	margin-bottom: var(--s-3);
}
@media (min-width: 900px) {
	.listing-hero__grid {
		grid-template-columns: 1.5fr 1fr;
		align-items: start;
	}
}

/* ---- Filter-Chips (Schnell-Filter, Pflegegrad, Ortsteile) ---- */
.filter-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.filter-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	background: #fff;
	border: 1px solid var(--border-strong);
	border-radius: var(--r-pill);
	font-size: 13px;
	font-weight: 700;
	color: var(--anthrazit);
	text-decoration: none;
	line-height: 1;
	transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.filter-chip:hover { text-decoration: none; border-color: var(--talea-cyan); color: var(--primary-ink); }
.filter-chip.is-active {
	background: var(--talea-cyan);
	border-color: var(--talea-cyan);
	color: #fff;
	box-shadow: 0 4px 10px rgba(0,159,227,.25);
}

/* ---- Listing-Body ---- */
.listing-body { background: var(--bg-soft); padding: var(--s-8) 0 var(--s-10); }
.listing-body__grid {
	display: grid;
	gap: var(--s-7);
	grid-template-columns: 1fr;
}
@media (min-width: 900px) {
	.listing-body__grid {
		grid-template-columns: 280px 1fr;
		align-items: start;
	}
}

/* ---- Filter-Sidebar ---- */
.filter-sidebar {
	background: #fff;
	padding: var(--s-6);
	border-radius: var(--r-lg);
	border: 1px solid var(--border);
	position: sticky;
	top: 120px;
}
.filter-sidebar__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: var(--s-5);
}
.filter-sidebar__head h3 { font-size: 18px; margin: 0; }
.filter-sidebar__reset { font-size: 13px; color: var(--primary-ink); }

.filter-group {
	padding-bottom: var(--s-5);
	margin-bottom: var(--s-5);
	border-bottom: 1px solid var(--border);
}
.filter-group:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.filter-group h4 {
	font-size: 14px;
	margin: 0 0 var(--s-3);
	color: var(--anthrazit);
}
.filter-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.filter-list--children { margin-top: 4px; padding-left: 16px; border-left: 2px solid var(--gray-100); }
.filter-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	padding: 6px 10px;
	border-radius: 8px;
	font-size: 14px;
	color: var(--anthrazit);
	text-decoration: none;
	transition: background .12s ease;
}
.filter-item:hover { background: var(--gray-50); text-decoration: none; }
.filter-item--child { font-size: 13px; color: var(--text-muted); padding: 4px 10px; }
.filter-item.is-active {
	background: var(--talea-cyan-50);
	color: var(--primary-ink);
	font-weight: 700;
}
.filter-item__count { font-size: 12px; color: var(--text-faint); }
.filter-item__check { color: var(--primary-ink); font-weight: 700; }

/* ---- Listing-Toolbar ---- */
.listing-toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: var(--s-5);
}
.listing-toolbar__count strong { font-size: 18px; }
.listing-toolbar__sub { color: var(--text-muted); margin-left: 8px; font-size: 14px; }
.listing-toolbar__sort { display: flex; align-items: center; gap: 8px; }
.listing-toolbar__sort select {
	padding: 8px 32px 8px 12px;
	border: 1px solid var(--border-strong);
	border-radius: 8px;
	background: #fff;
	font: inherit;
	color: var(--anthrazit);
	cursor: pointer;
}

/* ---- WG-Grid & Karte ---- */
.wg-grid {
	display: grid;
	gap: var(--s-5);
	grid-template-columns: 1fr;
}
@media (min-width: 700px) {
	.wg-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1280px) {
	.wg-grid { grid-template-columns: repeat(3, 1fr); }
}

/* Polaroid-Kippen: leicht unregelmäßige Rotation, hebt sich bei Hover auf */
.wg-grid .wg-card {
	transform: rotate(0deg);
	transition: transform .35s ease, box-shadow .25s ease, border-color .25s ease;
}
@media (min-width: 700px) {
	.wg-grid > .wg-card:nth-child(3n+1) { transform: rotate(-.9deg); }
	.wg-grid > .wg-card:nth-child(3n+2) { transform: rotate(.6deg); }
	.wg-grid > .wg-card:nth-child(3n+3) { transform: rotate(-.3deg); }
	.wg-grid > .wg-card:hover           { transform: rotate(0deg) translateY(-4px); }
}
@media (prefers-reduced-motion: reduce) {
	.wg-grid > .wg-card,
	.wg-grid > .wg-card:hover { transform: none; transition: none; }
}

.wg-card {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 22px 8px 22px 12px;   /* Default, wird via nth-child variiert */
	overflow: hidden;
	display: flex;
	flex-direction: column;
	box-shadow: var(--shadow-sm);
	transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
/* Alternierende organische Radien für den Waldorf-Look */
.wg-grid > .wg-card:nth-child(3n+1) { border-radius: 22px 8px 22px 12px; }
.wg-grid > .wg-card:nth-child(3n+2) { border-radius: 8px 24px 8px 24px; }
.wg-grid > .wg-card:nth-child(3n+3) { border-radius: 22px 22px 8px 12px; }
.wg-card:hover {
	box-shadow: var(--shadow-card-hover);
	border-color: var(--talea-cyan-200);
	transform: translateY(-2px);
}
.wg-card__cover {
	display: block;
	position: relative;
	aspect-ratio: 4 / 3;
	background: linear-gradient(135deg, var(--talea-cyan-50) 0%, var(--sec-lindgruen-50) 100%);
	overflow: hidden;
}
.wg-card__img { width: 100%; height: 100%; object-fit: cover; }
.wg-card__cover-placeholder {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: var(--text-muted);
	font-weight: 700;
	font-size: 14px;
	letter-spacing: .04em;
	text-transform: uppercase;
}
.wg-card__badge {
	position: absolute;
	left: 12px;
	bottom: 12px;
	filter: drop-shadow(0 4px 10px rgba(0,0,0,.15));
}

.wg-card__body {
	padding: var(--s-5);
	display: flex;
	flex-direction: column;
	gap: 12px;
	flex: 1;
}
.wg-card__meta { display: flex; flex-wrap: wrap; gap: 6px; }
.wg-card__title { font-size: var(--fs-lg); line-height: 1.2; margin: 0; }
.wg-card__title a { color: var(--anthrazit); text-decoration: none; }
.wg-card__title a:hover { color: var(--primary-ink); }
.wg-card__motto { color: var(--text-muted); font-style: italic; font-size: 14px; }

.wg-card__stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
	padding: 12px 0;
	border-top: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
	margin: 4px 0;
}
.wg-card__stats > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.wg-card__stats dt {
	font-size: 11px;
	color: var(--text-muted);
	letter-spacing: .06em;
	text-transform: uppercase;
	font-weight: 700;
	margin: 0;
}
.wg-card__stats dd {
	margin: 0;
	font-weight: 700;
	color: var(--anthrazit);
	font-size: 15px;
}
.wg-card__stats-strong {
	font-size: 12px !important;
	font-weight: 700;
	color: var(--anthrazit);
	line-height: 1.25;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.wg-card__highlights {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 13px;
	color: var(--text-muted);
}
.wg-card__highlights li::before {
	content: "·";
	color: var(--talea-cyan);
	font-weight: 700;
	margin-right: 6px;
}
.wg-card__cta { margin-top: auto; display: flex; gap: 8px; flex-wrap: wrap; }

/* List-Layout: horizontales Karten-Layout */
.wg-card--list { flex-direction: row; }
.wg-card--list .wg-card__cover { flex: 0 0 260px; aspect-ratio: auto; }
.wg-card--list .wg-card__body { flex: 1; }
@media (max-width: 700px) {
	.wg-card--list { flex-direction: column; }
	.wg-card--list .wg-card__cover { flex: 0 0 auto; aspect-ratio: 4 / 3; }
}

/* ---- Waiting-Chip / Träger-Chip ---- */
.chip-waiting { background: #fef0e3; color: #b56610; }
.chip-traeger { background: #fff7ec; color: #a06700; border: 1px solid #f1d9ad; }

/* ---- Empty-State / SEO-Block / Pagination ---- */
.empty-state {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: var(--s-8);
	text-align: center;
	box-shadow: var(--shadow-sm);
}
.empty-state h2 { font-size: var(--fs-xl); margin-bottom: 10px; }
.empty-state p { color: var(--text-muted); margin-bottom: var(--s-5); }

.seo-block {
	margin-top: var(--s-8);
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: var(--s-7);
}
.seo-block h2 { font-size: var(--fs-xl); margin-bottom: 12px; }
.seo-block p { color: var(--text-muted); }

.pagination {
	margin-top: var(--s-7);
	display: flex;
	justify-content: center;
}
.pagination .nav-links { display: flex; gap: 6px; flex-wrap: wrap; }
.pagination .page-numbers {
	padding: 8px 14px;
	border-radius: 8px;
	background: #fff;
	border: 1px solid var(--border-strong);
	text-decoration: none;
	color: var(--anthrazit);
	font-weight: 700;
	font-size: 14px;
}
.pagination .page-numbers.current {
	background: var(--talea-cyan);
	color: #fff;
	border-color: var(--talea-cyan);
}

/* ============================================================
 * WG-Detail
 * ============================================================ */
.profile-header {
	background: #fff;
	padding: var(--s-6) 0 0;
	position: relative;
	overflow: hidden;
}
/* dekorative Blobs hinter der Galerie (nur wenn genug Platz) */
.profile-header::before,
.profile-header::after {
	content: "";
	position: absolute;
	border-radius: 999px;
	filter: blur(60px);
	opacity: .5;
	pointer-events: none;
	z-index: 0;
}
.profile-header::before {
	width: 380px; height: 380px;
	top: -140px; right: -80px;
	background: radial-gradient(circle, rgba(0,159,227,.22), rgba(0,159,227,0) 65%);
}
.profile-header::after {
	width: 260px; height: 260px;
	top: 40px; left: -100px;
	background: radial-gradient(circle, rgba(84,189,163,.18), rgba(84,189,163,0) 65%);
}
.profile-header > * { position: relative; z-index: 1; }

.profile-gallery {
	display: grid;
	gap: 10px;
	grid-template-columns: 1fr;
	grid-auto-rows: 160px;
	margin-bottom: var(--s-6);
}
.profile-gallery__main {
	background: linear-gradient(135deg, var(--talea-cyan-50) 0%, var(--sec-lindgruen-50) 100%);
	overflow: hidden;
	position: relative;
	min-height: 220px;
	border-radius: 58% 42% 55% 45% / 42% 55% 45% 58%;
	transform: rotate(-1deg);
	box-shadow: 0 20px 40px rgba(11,58,82,.12), 0 8px 16px rgba(11,58,82,.06);
	transition: transform .5s ease;
}
.profile-gallery__main:hover { transform: rotate(-.4deg) translateY(-3px); }
.profile-gallery__img {
	width: 100%; height: 100%;
	object-fit: cover; object-position: center 35%;
	display: block;
}
.profile-gallery__main--empty {
	display: grid; place-items: center;
	color: var(--text-muted); font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
}
.profile-gallery__thumb {
	background: var(--gray-100);
	overflow: hidden;
	display: block;
	border-radius: 20px 8px 20px 10px;
	box-shadow: 0 8px 20px rgba(11,58,82,.08);
	transition: transform .35s ease;
}
.profile-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Polaroid-Verhalten für die Thumbs */
.profile-gallery__thumb:nth-of-type(1) { transform: rotate(-1.5deg); }
.profile-gallery__thumb:nth-of-type(2) { border-radius: 8px 22px 10px 20px; transform: rotate(1deg); }
.profile-gallery__thumb:nth-of-type(3) { border-radius: 20px 20px 8px 12px; transform: rotate(-.7deg); }
.profile-gallery__thumb:nth-of-type(4) { border-radius: 10px 20px 20px 8px; transform: rotate(.5deg); }
.profile-gallery__thumb:hover { transform: rotate(0deg) translateY(-3px); }
@media (prefers-reduced-motion: reduce) {
	.profile-gallery__main,
	.profile-gallery__main:hover,
	.profile-gallery__thumb,
	.profile-gallery__thumb:hover { transform: none; transition: none; }
}
@media (min-width: 900px) {
	.profile-gallery {
		/* Hauptbild schmaler als vorher: 1.6fr statt 2fr, Reihen niedriger. */
		grid-template-columns: 1.6fr 1fr 1fr;
		grid-template-rows: 200px 200px;
	}
	.profile-gallery__main {
		grid-row: 1 / span 2;
		min-height: 0;
		max-height: 410px;
	}
}

.profile-title {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--s-6);
	padding: var(--s-5) 0 var(--s-7);
	border-bottom: 1px solid var(--border);
}
.profile-title__meta { margin-bottom: 14px; }
.profile-title__name {
	font-size: clamp(28px, 4vw, 42px);
	line-height: 1.05;
}
.profile-title__motto {
	color: var(--text-muted);
	font-style: italic;
	font-size: var(--fs-md);
	margin-top: 10px;
	max-width: 720px;
}
.profile-stats {
	display: flex;
	flex-wrap: wrap;
	gap: var(--s-6);
	margin-top: var(--s-5);
}
.profile-stat { display: flex; flex-direction: column; gap: 4px; min-width: 80px; }
.profile-stat__num {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 32px;
	color: var(--anthrazit);
	line-height: 1;
}
.profile-stat__num--sm { font-size: 18px; padding-top: 8px; }
.profile-stat__lbl {
	font-size: 12px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--text-muted);
	font-weight: 700;
}

.profile-body { background: var(--bg-soft); padding: var(--s-8) 0 var(--s-10); }
.profile-body__grid { display: grid; gap: var(--s-7); grid-template-columns: 1fr; }
.profile-main { display: flex; flex-direction: column; gap: var(--s-6); }
.profile-aside { display: flex; flex-direction: column; gap: var(--s-5); }
@media (min-width: 1024px) {
	.profile-body__grid {
		grid-template-columns: 1fr 380px;
		align-items: start;
	}
	.profile-aside > * { position: sticky; top: 120px; }
	.profile-aside > *:not(:first-child) { position: static; }
	/* Contact-Box muss beim Sticky über den darunterliegenden Karten liegen,
	   sonst schieben rotierte Kinder (Hausleitungs-Foto) sich beim Scrollen darüber. */
	.profile-aside > :first-child { z-index: 5; background: #fff; }
	.profile-aside > *:not(:first-child) { z-index: 1; }
}

.profile-card, .profile-aside-card {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: var(--s-6);
	box-shadow: var(--shadow-sm);
}
.profile-card h2 { font-size: var(--fs-lg); margin: 0 0 var(--s-4); }
.profile-aside-card h3 { font-size: var(--fs-md); margin: 0 0 var(--s-4); }
.prose p { margin-bottom: 10px; }
.prose p:last-child { margin-bottom: 0; }

.highlight-grid {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	font-size: 14px;
}
.highlight-grid li { display: flex; gap: 10px; align-items: flex-start; }
.highlight-grid svg { flex-shrink: 0; margin-top: 2px; }
@media (min-width: 700px) {
	.highlight-grid { grid-template-columns: 1fr 1fr; }
}

.detail-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--s-6);
}
.detail-grid h4 {
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--text-muted);
	margin: 0 0 12px;
}
@media (min-width: 700px) {
	.detail-grid { grid-template-columns: 1fr 1fr; }
}
.detail-dl { display: flex; flex-direction: column; gap: 8px; margin: 0; font-size: 14px; }
.detail-dl > div {
	display: grid;
	grid-template-columns: 130px 1fr;
	gap: 12px;
	align-items: baseline;
}
.detail-dl dt { color: var(--text-muted); font-weight: 400; }
.detail-dl dd { margin: 0; color: var(--anthrazit); }
.detail-dl--wide > div { grid-template-columns: 160px 1fr; }

.chip-cluster { display: flex; flex-wrap: wrap; gap: 8px; }

.cost-grid {
	display: grid;
	gap: var(--s-5);
	grid-template-columns: 1fr;
	margin-top: var(--s-5);
}
@media (min-width: 700px) { .cost-grid { grid-template-columns: repeat(3, 1fr); align-items: stretch; margin-bottom: var(--s-5); } }

/* Kosten-Blöcke im 3-Schritte-Look: organische Radien, Rotation, Watermark. */
.cost-block {
	position: relative;
	padding: var(--s-6) var(--s-5) var(--s-5);
	background: #fff;
	border: 1px solid var(--border);
	box-shadow: var(--shadow-sm);
	transition: transform .35s ease, box-shadow .25s ease;
	overflow: hidden;
}
.cost-block[data-cost="1"] { border-radius: 24px 8px 20px 12px; transform: rotate(-.6deg); }
.cost-block[data-cost="2"] {
	border-radius: 8px 22px 8px 22px;
	transform: rotate(.4deg) translateY(6px);
	background: var(--talea-cyan-50);
	border-color: var(--talea-cyan-200);
}
.cost-block[data-cost="3"] { border-radius: 20px 20px 8px 12px; transform: rotate(-.2deg); }
.cost-block:hover { transform: rotate(0deg) translateY(-4px); box-shadow: var(--shadow-md); }
@media (prefers-reduced-motion: reduce) {
	.cost-block,
	.cost-block:hover { transform: none; transition: none; }
}
.cost-block__num {
	display: inline-grid;
	place-items: center;
	width: 40px; height: 40px;
	border-radius: 999px;
	background: var(--talea-cyan);
	color: #fff;
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 17px;
	box-shadow: 0 6px 14px rgba(0,159,227,.28);
	position: relative;
	z-index: 1;
	margin-bottom: var(--s-3);
}
.cost-block[data-cost="2"] .cost-block__num {
	background: var(--sec-lindgruen);
	box-shadow: 0 6px 14px rgba(84,189,163,.32);
	color: #0d3a30;
}
.cost-block::after {
	/* große Watermark-Zahl im Hintergrund */
	content: attr(data-cost);
	position: absolute;
	top: -18px; right: 10px;
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 128px;
	line-height: 1;
	color: var(--talea-cyan);
	opacity: .06;
	pointer-events: none;
	z-index: 0;
}
.cost-block[data-cost="2"]::after { color: var(--sec-lindgruen); opacity: .1; }
.cost-block__title {
	position: relative;
	z-index: 1;
	font-size: var(--fs-md);
	margin: 0 0 6px;
	color: var(--anthrazit);
}
.cost-block p {
	position: relative;
	z-index: 1;
	color: var(--anthrazit);
	font-size: 14px;
	line-height: 1.55;
}
.cost-hint {
	margin-top: var(--s-4);
	padding: var(--s-5);
	background: var(--talea-cyan-50);
	border: 1px solid var(--talea-cyan-200);
	border-radius: 10px;
}
.cost-hint p { font-size: 15px; color: var(--anthrazit); margin-bottom: 12px; }

.tagesablauf { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.tagesablauf li {
	display: grid;
	grid-template-columns: 80px 1fr;
	gap: 12px;
	padding: 8px 0;
	border-bottom: 1px dashed var(--border);
	font-size: 14px;
}
.tagesablauf li:last-child { border-bottom: 0; }
.tagesablauf__time { color: var(--primary-ink); font-weight: 700; }
.tagesablauf__act { color: var(--anthrazit); }

/* ---- Contact-Box ---- */
.contact-box {
	background: #fff;
	border: 2px solid var(--talea-cyan);
	border-radius: var(--r-lg);
	padding: var(--s-6);
	box-shadow: 0 18px 36px rgba(0,159,227,.14);
}
.contact-box h3 {
	margin-top: 14px;
	font-size: var(--fs-lg);
}
.contact-box p { color: var(--text-muted); margin-top: 8px; font-size: 14px; }
.contact-box__actions { margin-top: var(--s-4); display: flex; flex-direction: column; gap: 8px; }
.contact-box__actions .btn { width: 100%; }
.contact-box__trust {
	list-style: none; padding: 0; margin: var(--s-5) 0 0;
	border-top: 1px solid var(--border);
	padding-top: var(--s-4);
	display: flex; flex-direction: column; gap: 6px;
	font-size: 12px; color: var(--text-faint);
}

/* ---- Leitung ---- */
.leitung { display: flex; gap: 16px; align-items: center; }
.leitung__foto {
	width: 84px; height: 84px;
	border-radius: 58% 42% 55% 45% / 42% 55% 45% 58%;
	object-fit: cover;
	background: linear-gradient(135deg, var(--talea-cyan) 0%, var(--sec-lindgruen) 100%);
	transform: rotate(-2deg);
	box-shadow: 0 10px 20px rgba(11,58,82,.14);
	flex-shrink: 0;
	transition: transform .4s ease;
}
.leitung__foto:hover { transform: rotate(0deg) scale(1.04); }
@media (prefers-reduced-motion: reduce) {
	.leitung__foto, .leitung__foto:hover { transform: none; transition: none; }
}
.leitung__foto--initials {
	display: grid; place-items: center;
	color: #fff; font-weight: 700; font-size: 26px;
}
.leitung__qual { font-size: 13px; color: var(--text-muted); }
.leitung__team {
	margin: var(--s-4) 0 0;
	padding: var(--s-4) 0 0;
	border-top: 1px dashed var(--border);
	font-size: 13px;
	color: var(--text-muted);
	display: flex; flex-direction: column; gap: 6px;
}
.leitung__team div { display: flex; gap: 6px; }
.leitung__team dt { color: var(--anthrazit); font-weight: 700; }
.leitung__team dd { margin: 0; }
.profile-aside-card .btn-ghost { width: 100%; margin-top: var(--s-4); justify-content: center; }

.facts { display: flex; flex-direction: column; gap: 8px; margin: 0; font-size: 14px; }
.facts > div { display: grid; grid-template-columns: 120px 1fr; gap: 10px; }
.facts dt { color: var(--text-muted); }
.facts dd { margin: 0; color: var(--anthrazit); font-weight: 700; }

/* ============================================================
 * Beratungs-Formular
 * ============================================================ */
.beratung-form-wrap { margin-top: var(--s-4); }
.beratung-form {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: var(--s-7);
	box-shadow: var(--shadow-sm);
}
.beratung-form h2 { font-size: var(--fs-xl); margin: 0 0 8px; }
.beratung-form__lead { color: var(--text-muted); margin-bottom: var(--s-5); }

.form-grid { display: flex; flex-direction: column; gap: var(--s-4); }
.form-row { display: flex; flex-direction: column; }
.form-row--split { display: grid; gap: var(--s-4); grid-template-columns: 1fr; }
@media (min-width: 600px) {
	.form-row--split { grid-template-columns: 1fr 1fr; }
}
.form-hint { font-size: 13px; color: var(--text-muted); margin-top: 6px; }
.form-consent { flex-direction: row; }
.form-consent label {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 14px;
	line-height: 1.5;
	color: var(--anthrazit);
	cursor: pointer;
}
.form-consent input[type="checkbox"] {
	margin-top: 3px;
	accent-color: var(--talea-cyan);
	width: 18px; height: 18px; flex-shrink: 0;
}
.form-submit {
	flex-direction: row;
	align-items: center;
	gap: var(--s-4);
	flex-wrap: wrap;
	margin-top: var(--s-3);
}

.honeypot { position: absolute !important; left: -9999px !important; height: 0; overflow: hidden; }

.alert {
	padding: 14px 18px;
	border-radius: 10px;
	margin-bottom: var(--s-4);
	font-size: 14px;
}
.alert-success {
	background: var(--sec-lindgruen-50);
	color: #1f5a48;
	border: 1px solid var(--sec-lindgruen);
}
.alert-error {
	background: #fdeaea;
	color: #7a1e1e;
	border: 1px solid #f4b4b4;
}
.alert-warning {
	background: #fff7e6;
	color: #7a4a10;
	border: 1px solid #f4d59e;
}
.alert ul { margin: 8px 0 0 18px; }

/* ============================================================
 * Legal-Seiten (Impressum, Datenschutz, Cookie, AGB, Barrierefreiheit)
 * ============================================================ */
.legal-page {
	background: var(--bg-soft);
	padding: var(--s-8) 0 var(--s-10);
}
.legal-page__grid {
	display: grid;
	gap: var(--s-7);
	grid-template-columns: 1fr;
}
.legal-page__main { max-width: 760px; }
.legal-page__header {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: var(--s-7);
	margin-bottom: var(--s-5);
}
.legal-page__header h1 {
	font-size: clamp(28px, 4vw, 40px);
	line-height: 1.15;
}
.legal-page__teaser {
	color: var(--text-muted);
	margin-top: 10px;
	font-size: var(--fs-md);
}

.legal-page__content {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: var(--s-7);
	font-size: 16px;
	line-height: 1.7;
	color: #2a3540;
}
.legal-page__content h2 {
	font-size: 22px;
	margin-top: 32px;
	margin-bottom: 12px;
	color: var(--anthrazit);
	scroll-margin-top: 100px;
}
.legal-page__content h2:first-child { margin-top: 0; }
.legal-page__content p { margin-bottom: 14px; }
.legal-page__content ul,
.legal-page__content ol {
	padding-left: 20px;
	margin-bottom: 14px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.legal-page__content a {
	color: var(--primary-ink);
	text-decoration: underline;
}
.legal-page__content code {
	font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
	font-size: 13px;
	padding: 2px 6px;
	background: var(--gray-100);
	border-radius: 4px;
}
.cookie-table {
	overflow-x: auto;
	margin: 16px 0;
}
.cookie-table table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}
.cookie-table th,
.cookie-table td {
	text-align: left;
	padding: 10px 12px;
	border-bottom: 1px solid var(--border);
	vertical-align: top;
}
.cookie-table th {
	background: var(--bg-soft);
	font-weight: 700;
	color: var(--anthrazit);
	font-size: 13px;
	letter-spacing: .02em;
}
.legal-page__foot {
	margin-top: var(--s-5);
	color: var(--text-muted);
	font-size: 13px;
	text-align: right;
}
.legal-page__aside { display: none; }
@media (min-width: 1100px) {
	.legal-page__grid { grid-template-columns: 1fr 260px; align-items: start; }
	.legal-page__aside { display: block; position: sticky; top: 120px; }
}

/* ============================================================
 * Startseite — Hero-Stats, Section-Header, Bezirks-Auszug, Träger
 * ============================================================ */
.hero__stats {
	margin-top: var(--s-7);
	display: flex;
	gap: var(--s-5);
	align-items: center;
	flex-wrap: wrap;
}
.hero-stat { display: flex; flex-direction: column; gap: 4px; }
.hero-stat__num {
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 32px;
	line-height: 1;
	color: var(--anthrazit);
}
.hero-stat--highlight .hero-stat__num { color: var(--success-ink); }
.hero-stat__lbl {
	font-size: 13px;
	color: var(--text-muted);
}
.hero-stat__sep {
	width: 1px;
	height: 32px;
	background: var(--border);
}

.section-head {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: var(--s-5);
	align-items: end;
	margin-bottom: var(--s-7);
}
.section-head h2 { font-size: var(--fs-xl); margin-top: 8px; }
.section-head__lead { color: var(--text-muted); margin-top: 10px; max-width: 640px; }
.section-head__action { flex-shrink: 0; align-self: end; }
.section-head--centered {
	grid-template-columns: 1fr;
	text-align: center;
	max-width: 720px;
	margin-inline: auto;
}
.section-head--centered .section-head__lead { margin-inline: auto; }
@media (max-width: 700px) {
	.section-head { grid-template-columns: 1fr; }
	.section-head__action { justify-self: start; }
}

.home-bezirke {
	display: grid;
	gap: 12px;
	grid-template-columns: 1fr;
}
@media (min-width: 640px) { .home-bezirke { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .home-bezirke { grid-template-columns: repeat(3, 1fr); } }
.home-bezirk {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	padding: 16px 20px;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 18px 6px 18px 8px;
	text-decoration: none;
	color: inherit;
	transition: border-color .12s ease, box-shadow .12s ease;
}
.home-bezirke > .home-bezirk:nth-child(3n+2) { border-radius: 6px 20px 8px 20px; }
.home-bezirke > .home-bezirk:nth-child(3n+3) { border-radius: 18px 18px 6px 8px; }
.home-bezirk:hover {
	border-color: var(--talea-cyan-200);
	box-shadow: var(--shadow-sm);
	text-decoration: none;
}
.home-bezirk__name { font-weight: 700; color: var(--anthrazit); }
.home-bezirk__stats { font-size: 13px; color: var(--text-muted); }
.home-bezirk__stats strong { color: var(--success-ink); }

.traeger-grid {
	display: grid;
	gap: var(--s-5);
	grid-template-columns: 1fr;
}
@media (min-width: 800px) { .traeger-grid { grid-template-columns: repeat(2, 1fr); } }
.traeger-card {
	background: #fff;
	border: 1px solid var(--border);
	border-top: 4px solid var(--talea-cyan);
	border-radius: 22px 8px 22px 12px;
	padding: var(--s-6);
	box-shadow: var(--shadow-sm);
}
.traeger-grid > .traeger-card:nth-child(2) {
	border-top-color: var(--sec-lindgruen);
	border-radius: 8px 22px 12px 22px;
}
.traeger-card__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
	gap: 12px;
}
.traeger-card__head h3 { font-size: var(--fs-md); }
.traeger-card__bezirke { color: var(--text-muted); margin-bottom: 14px; font-size: 14px; }
.traeger-card__wgs {
	list-style: none;
	padding: 0;
	margin: 0 0 var(--s-4);
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.traeger-card__wgs a {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 12px;
	padding: 8px 0;
	border-bottom: 1px dashed var(--border);
	color: var(--anthrazit);
	font-weight: 600;
	text-decoration: none;
	font-size: 14px;
}
.traeger-card__wgs li:last-child a { border-bottom: 0; }
.traeger-card__wgs a:hover { color: var(--primary-ink); }
.traeger-card__wg-meta { color: var(--text-muted); font-weight: 400; font-size: 13px; }
.traeger-card__more {
	color: var(--primary-ink);
	font-weight: 700;
	font-size: 14px;
	text-decoration: none;
}
.traeger-card__more:hover { text-decoration: underline; }

/* ============================================================
 * Zitate-Sektion (Startseite)
 * ============================================================ */
.zitate-section {
	position: relative;
	overflow: hidden;
}
.zitate-section__blob {
	position: absolute;
	width: 500px; height: 500px;
	top: -160px; right: -140px;
	background: radial-gradient(circle, rgba(84,189,163,.22), rgba(84,189,163,0) 65%);
	border-radius: 999px;
	filter: blur(60px);
	pointer-events: none;
	z-index: 0;
}
.zitate-grid {
	position: relative;
	z-index: 1;
	display: grid;
	gap: var(--s-6);
	grid-template-columns: 1fr;
}
@media (min-width: 800px) {
	.zitate-grid {
		grid-template-columns: repeat(3, 1fr);
		align-items: start;
	}
	/* mittleres Zitat leicht angehoben und größer für Rhythmus */
	.zitate-grid .zitat--2 { margin-top: -24px; }
}
.zitat {
	position: relative;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 22px 8px 22px 8px;
	padding: var(--s-7) var(--s-6) var(--s-5);
	margin: 0;
	box-shadow: 0 12px 32px rgba(11,58,82,.06);
	transition: transform .35s ease, box-shadow .25s ease;
}
.zitat--1 { transform: rotate(-1.2deg); border-radius: 22px 8px 22px 12px; }
.zitat--2 { transform: rotate( .6deg); border-radius: 8px 22px 12px 22px; background: var(--talea-cyan-50); border-color: var(--talea-cyan-200); }
.zitat--3 { transform: rotate(-.4deg); border-radius: 22px 22px 8px 12px; }
.zitat:hover { transform: rotate(0deg) translateY(-4px); box-shadow: var(--shadow-md); }
@media (prefers-reduced-motion: reduce) {
	.zitat, .zitat:hover { transform: none; transition: none; }
}
.zitat__mark {
	position: absolute;
	top: -18px; left: 18px;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 96px;
	line-height: 1;
	color: var(--talea-cyan);
	opacity: .35;
	pointer-events: none;
	user-select: none;
}
.zitat__text {
	font-size: 17px;
	line-height: 1.55;
	color: var(--anthrazit);
	margin: 0;
	quotes: none;
}
.zitat__cite {
	margin-top: var(--s-4);
	padding-top: var(--s-3);
	border-top: 1px dashed var(--border);
	display: flex;
	flex-direction: column;
	gap: 2px;
	font-style: normal;
}
.zitat__name { font-weight: 700; color: var(--anthrazit); font-size: 14px; }
.zitat__role { font-size: 13px; color: var(--text-muted); }

/* ============================================================
 * 404-Seite
 * ============================================================ */
.notfound {
	position: relative;
	overflow: hidden;
	padding: var(--s-9) 0;
}
.notfound__blob {
	position: absolute;
	border-radius: 999px;
	filter: blur(70px);
	opacity: .55;
	pointer-events: none;
	z-index: 0;
}
.notfound__blob--a {
	width: 460px; height: 460px;
	top: -160px; right: -140px;
	background: radial-gradient(circle, rgba(0,159,227,.32), rgba(0,159,227,0) 65%);
}
.notfound__blob--b {
	width: 380px; height: 380px;
	bottom: -160px; left: -120px;
	background: radial-gradient(circle, rgba(84,189,163,.28), rgba(84,189,163,0) 65%);
}
.notfound__inner {
	position: relative;
	z-index: 1;
	display: grid;
	gap: var(--s-8);
	grid-template-columns: 1fr;
	align-items: start;
}
@media (min-width: 900px) {
	.notfound__inner {
		grid-template-columns: 1.4fr 1fr;
		gap: var(--s-9);
	}
}
.notfound__mark {
	display: inline-block;
	font-family: var(--font-body);
	font-weight: 700;
	font-size: clamp(72px, 12vw, 128px);
	line-height: 1;
	color: var(--talea-cyan);
	opacity: .18;
	letter-spacing: -0.03em;
	margin-bottom: 14px;
}
.notfound h1 {
	font-size: clamp(28px, 4vw, 40px);
	line-height: 1.1;
	max-width: 640px;
}
.notfound__lead {
	color: var(--text-muted);
	margin-top: 14px;
	font-size: var(--fs-md);
	max-width: 560px;
}
.notfound__search {
	margin-top: var(--s-6);
	display: flex;
	gap: 8px;
	max-width: 520px;
}
.notfound__search .input { flex: 1; }
.notfound__quick {
	margin-top: var(--s-5);
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.notfound__hints {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: var(--s-6);
	box-shadow: var(--shadow-sm);
}
.notfound__hints-title {
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--text-muted);
	margin: 0 0 var(--s-3);
}
.notfound__links {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.notfound__links a {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 10px 12px;
	border-radius: 10px;
	text-decoration: none;
	color: var(--anthrazit);
	transition: background .12s ease;
}
.notfound__links a:hover { background: var(--talea-cyan-50); color: var(--primary-ink); text-decoration: none; }
.notfound__link-cat {
	font-size: 11px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--talea-cyan);
	font-weight: 700;
}
.notfound__link-title { font-size: 15px; font-weight: 600; line-height: 1.3; }

/* ============================================================
 * Standorte-Übersicht (/standorte/)
 * ============================================================ */
.standorte-body {
	background: var(--bg-soft);
	padding: var(--s-8) 0 var(--s-10);
}
.standorte-body__group-title {
	font-size: var(--fs-lg);
	margin: 0 0 var(--s-5);
	color: var(--anthrazit);
	display: inline;
}
.standorte-body__more {
	margin-top: var(--s-9);
}
.standorte-body__more summary {
	cursor: pointer;
	list-style: none;
	padding: 12px 0;
	color: var(--primary-ink);
}
.standorte-body__more summary::-webkit-details-marker { display: none; }
.standorte-body__more summary::before {
	content: "▸";
	display: inline-block;
	margin-right: 8px;
	transition: transform .15s ease;
}
.standorte-body__more[open] summary::before {
	transform: rotate(90deg);
}
.standorte-body__more[open] { margin-top: var(--s-8); }
.standorte-body__seo { margin-top: var(--s-9); }

.bezirk-grid {
	display: grid;
	gap: var(--s-5);
	grid-template-columns: 1fr;
}
@media (min-width: 640px) {
	.bezirk-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
	.bezirk-grid { grid-template-columns: repeat(3, 1fr); }
}
.bezirk-grid--compact { margin-top: var(--s-4); }

.bezirk-tile {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 22px 8px 22px 12px;   /* Default, via nth-child variiert */
	padding: var(--s-6);
	box-shadow: var(--shadow-sm);
	display: flex;
	flex-direction: column;
	gap: var(--s-4);
	transition: box-shadow .25s ease, transform .35s ease, border-color .2s ease;
}
/* Alternierende organische Radien + Polaroid-Rotation für die Tiles */
.bezirk-grid > .bezirk-tile:nth-child(3n+1) { border-radius: 22px 8px 22px 12px; transform: rotate(-.5deg); }
.bezirk-grid > .bezirk-tile:nth-child(3n+2) { border-radius: 8px 24px 8px 24px; transform: rotate( .4deg); }
.bezirk-grid > .bezirk-tile:nth-child(3n+3) { border-radius: 22px 22px 8px 12px; transform: rotate(-.2deg); }
.bezirk-tile:hover {
	box-shadow: var(--shadow-card-hover);
	border-color: var(--talea-cyan-200);
	transform: rotate(0deg) translateY(-4px);
}
@media (prefers-reduced-motion: reduce) {
	.bezirk-grid > .bezirk-tile,
	.bezirk-tile:hover { transform: none; transition: none; }
}
.bezirk-tile--empty {
	background: var(--gray-50);
	box-shadow: none;
	opacity: .8;
}
.bezirk-tile--empty:hover { transform: rotate(0deg); box-shadow: none; border-color: var(--border); }

.bezirk-tile__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	text-decoration: none;
	color: inherit;
}
.bezirk-tile__head:hover { text-decoration: none; }
.bezirk-tile__name {
	font-size: var(--fs-lg);
	line-height: 1.15;
	margin: 0;
	color: var(--anthrazit);
}
.bezirk-tile__head:hover .bezirk-tile__name { color: var(--primary-ink); }
.bezirk-tile__link {
	color: var(--talea-cyan);
	font-weight: 700;
	font-size: 20px;
	flex-shrink: 0;
}

.bezirk-tile__stats {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	padding: 12px 0;
	border-top: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
	margin: 0;
}
.bezirk-tile__stats > div { display: flex; flex-direction: column; gap: 2px; }
.bezirk-tile__stats dt {
	font-size: 11px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--text-muted);
	font-weight: 700;
	margin: 0;
}
.bezirk-tile__stats dd {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	color: var(--anthrazit);
}

.bezirk-tile__ortsteile h3 {
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--text-muted);
	margin: 0 0 8px;
}
.bezirk-tile__ortsteile ul {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.bezirk-tile__ortsteile a {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 6px 10px;
	border-radius: 8px;
	font-size: 14px;
	color: var(--anthrazit);
	text-decoration: none;
	transition: background .12s ease;
}
.bezirk-tile__ortsteile a:hover {
	background: var(--talea-cyan-50);
	color: var(--primary-ink);
	text-decoration: none;
}
.bezirk-tile__count { font-size: 12px; color: var(--text-faint); }

.bezirk-tile__cta {
	margin-top: auto;
	color: var(--primary-ink);
	font-weight: 700;
	font-size: 14px;
	text-decoration: none;
}
.bezirk-tile__cta:hover { text-decoration: underline; }

.bezirk-tile__empty {
	color: var(--text-muted);
	font-size: 14px;
	margin: 0;
}
.bezirk-tile__empty a { color: var(--primary-ink); font-weight: 700; }

/* ============================================================
 * Pflegegrad-Rechner
 * ============================================================ */
.rechner-hero {
	background: linear-gradient(180deg, #f7fbfe 0%, #e9f5fc 50%, #fff 100%);
	padding: var(--s-9) 0 var(--s-11);
}
.rechner-hero .container { max-width: 880px; }
.rechner-hero__intro { text-align: center; margin-bottom: var(--s-7); }
.rechner-hero__intro h1 { margin-top: 16px; font-size: clamp(32px, 4vw, var(--fs-3xl)); }
.rechner-hero__lead {
	font-size: var(--fs-md);
	color: var(--text-muted);
	margin: 12px auto 0;
	max-width: 640px;
}
.rechner-shell { min-height: 320px; }

.rechner-card {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-xl);
	box-shadow: var(--shadow-lg);
	padding: var(--s-8);
}
.rechner-step__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: var(--s-4);
}
.rechner-step__pct {
	font-size: 13px;
	color: var(--text-muted);
	font-weight: 700;
}
.rechner-progress {
	height: 6px;
	background: var(--gray-100);
	border-radius: 99px;
	overflow: hidden;
	margin-bottom: var(--s-6);
}
.rechner-progress__fill {
	height: 100%;
	background: var(--talea-cyan);
	transition: width .3s ease;
}
.rechner-step__q { font-size: var(--fs-xl); margin-bottom: var(--s-5); line-height: 1.2; }
.rechner-opts { display: flex; flex-direction: column; gap: 10px; }
.rechner-opt {
	background: #fff;
	border: 1.5px solid var(--border-strong);
	border-radius: 12px;
	padding: 18px 22px;
	text-align: left;
	font-size: 16px;
	font-weight: 600;
	color: var(--anthrazit);
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
	transition: border-color .12s ease, background .12s ease, transform .05s ease;
}
.rechner-opt:hover { border-color: var(--talea-cyan); background: var(--talea-cyan-50); }
.rechner-opt:active { transform: translateY(1px); }
.rechner-opt.is-selected {
	border-color: var(--talea-cyan);
	background: var(--talea-cyan-50);
}
.rechner-opt__check {
	color: var(--sec-lindgruen);
	font-weight: 700;
	font-size: 18px;
	min-width: 20px;
	text-align: right;
}
.rechner-step__nav {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: var(--s-6);
	gap: 12px;
	flex-wrap: wrap;
}
.rechner-step__hint {
	font-size: 12px;
	color: var(--text-faint);
}

/* Ergebnis */
.rechner-result__head { text-align: center; margin-bottom: var(--s-6); }
.rechner-result__badge {
	background: var(--sec-lindgruen);
	color: #0d3a30;
}
.pg-donut {
	--pg-deg: 0deg;
	width: 140px;
	height: 140px;
	border-radius: 999px;
	background: conic-gradient(var(--talea-cyan) var(--pg-deg), var(--gray-100) 0);
	margin: var(--s-5) auto var(--s-4);
	display: grid;
	place-items: center;
}
.pg-donut__inner {
	width: 108px; height: 108px;
	background: #fff;
	border-radius: 999px;
	display: grid;
	place-items: center;
	text-align: center;
}
.pg-donut__lbl {
	display: block;
	font-size: 12px;
	color: var(--text-muted);
	letter-spacing: .04em;
}
.pg-donut__num {
	display: block;
	font-size: 48px;
	font-weight: 700;
	color: var(--primary-ink);
	line-height: 1;
}
.rechner-result__desc {
	color: var(--text-muted);
	max-width: 480px;
	margin: 0 auto;
}

.rechner-result__cost {
	background: var(--bg-soft);
	border: 1px solid var(--border);
	border-radius: 14px;
	padding: var(--s-5);
	margin-bottom: var(--s-5);
}
.rechner-result__cost h3 { font-size: var(--fs-md); margin-bottom: 12px; }
.rechner-result__cost p { color: var(--text-muted); font-size: 15px; margin-bottom: 14px; }
.rechner-cost-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
	counter-reset: cost;
}
.rechner-cost-list li {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	font-size: 14px;
}
.rechner-cost-list li::before {
	counter-increment: cost;
	content: counter(cost) ".";
	color: var(--talea-cyan);
	font-weight: 700;
	flex-shrink: 0;
	min-width: 18px;
}
.rechner-cost-note {
	color: var(--text-muted);
	font-size: 14px;
	margin-top: 14px !important;
	font-style: italic;
}
.rechner-result__cta {
	background: var(--bg-dark);
	border-radius: 14px;
	padding: var(--s-6);
	color: #fff;
}
.rechner-result__cta h3 { color: #fff; font-size: 20px; margin-bottom: 8px; }
.rechner-result__cta p { color: rgba(255,255,255,.78); font-size: 14px; margin-bottom: 16px; }
.rechner-result__cta-row { display: flex; gap: 10px; flex-wrap: wrap; }
.btn--on-dark { border-color: rgba(255,255,255,.3); color: #fff; }
.btn--on-dark:hover { border-color: #fff; color: #fff; }
.rechner-result__reset { text-align: center; margin-top: 18px; }
.rechner-reset {
	background: none;
	border: 0;
	color: var(--text-muted);
	cursor: pointer;
	font-size: 13px;
	text-decoration: underline;
}

.rechner-trust {
	display: flex;
	gap: 18px;
	justify-content: center;
	margin-top: var(--s-7);
	flex-wrap: wrap;
}

/* ============================================================
 * Ratgeber-Hub
 * ============================================================ */
.ratgeber-hero {
	background: var(--bg-soft);
	border-bottom: 1px solid var(--border);
	padding: var(--s-9) 0 var(--s-6);
}
.ratgeber-hero__intro { text-align: center; max-width: 720px; margin: 0 auto; }
.ratgeber-hero__intro h1 { margin-top: 16px; font-size: clamp(30px, 4vw, var(--fs-3xl)); }
.ratgeber-hero__lead { font-size: var(--fs-md); color: var(--text-muted); margin-top: 12px; }

.ratgeber-body { padding: var(--s-8) 0 var(--s-10); }
.ratgeber-cats {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: var(--s-7);
}
.ratgeber-cats .chip {
	padding: 8px 16px;
	background: #fff;
	color: var(--anthrazit);
	border: 1px solid var(--border);
	text-decoration: none;
	transition: background .12s ease, color .12s ease, border-color .12s ease;
}
.ratgeber-cats .chip:hover { border-color: var(--talea-cyan); color: var(--primary-ink); text-decoration: none; }
.ratgeber-cats .chip.is-active {
	background: var(--talea-cyan);
	border-color: var(--talea-cyan);
	color: #fff;
}

.ratgeber-featured {
	display: grid;
	grid-template-columns: 1fr;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 28px 10px 22px 14px;
	overflow: hidden;
	margin-bottom: var(--s-7);
	text-decoration: none;
	color: inherit;
	transition: box-shadow .2s ease, transform .2s ease;
}
.ratgeber-featured:hover {
	box-shadow: var(--shadow-card-hover);
	transform: translateY(-2px);
	text-decoration: none;
}
.ratgeber-featured__cover {
	background: linear-gradient(135deg, var(--talea-cyan) 0%, var(--sec-lindgruen) 100%);
	padding: var(--s-8);
	color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 300px;
}
.ratgeber-featured__eyebrow {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	opacity: .85;
}
.ratgeber-featured__cover h2 {
	color: #fff;
	font-size: clamp(24px, 3vw, 34px);
	margin-top: 12px;
	line-height: 1.2;
}
.ratgeber-featured__cover p { color: rgba(255,255,255,.88); margin-top: 12px; font-size: 16px; }
.ratgeber-featured__meta {
	padding: var(--s-7);
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: var(--s-4);
}
@media (min-width: 900px) {
	.ratgeber-featured { grid-template-columns: 1.2fr 1fr; }
}

.ratgeber-grid {
	display: grid;
	gap: var(--s-5);
	grid-template-columns: 1fr;
}
@media (min-width: 640px) { .ratgeber-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .ratgeber-grid { grid-template-columns: repeat(3, 1fr); } }

.ratgeber-card {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 22px 8px 22px 12px;
	padding: var(--s-5);
	text-decoration: none;
	color: inherit;
	display: flex;
	flex-direction: column;
	gap: 12px;
	box-shadow: var(--shadow-sm);
	transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
.ratgeber-grid > .ratgeber-card:nth-child(3n+2) { border-radius: 8px 24px 8px 24px; }
.ratgeber-grid > .ratgeber-card:nth-child(3n+3) { border-radius: 22px 22px 8px 12px; }
.ratgeber-related__grid > .ratgeber-card:nth-child(3n+2) { border-radius: 8px 24px 8px 24px; }
.ratgeber-related__grid > .ratgeber-card:nth-child(3n+3) { border-radius: 22px 22px 8px 12px; }
.ratgeber-card:hover {
	box-shadow: var(--shadow-card-hover);
	border-color: var(--talea-cyan-200);
	transform: translateY(-2px);
	text-decoration: none;
}
.ratgeber-card h3 {
	font-size: var(--fs-md);
	line-height: 1.25;
	margin: 4px 0 0;
	color: var(--anthrazit);
}
.ratgeber-card p {
	color: var(--text-muted);
	font-size: 14px;
	flex: 1;
}
.ratgeber-card__foot {
	display: flex;
	justify-content: space-between;
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px dashed var(--border);
	font-size: 12px;
	color: var(--text-faint);
}
.ratgeber-card__foot span:last-child { color: var(--primary-ink); font-weight: 700; }

/* Ratgeber-Artikel */
.ratgeber-article { background: var(--bg-soft); padding: var(--s-8) 0 var(--s-10); }
.ratgeber-article__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--s-7);
}
.ratgeber-article__main { max-width: 720px; }
.ratgeber-article__header {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: var(--s-7);
	margin-bottom: var(--s-5);
}
.ratgeber-article__header h1 {
	font-size: clamp(28px, 4vw, 40px);
	line-height: 1.1;
	margin-top: 14px;
}
.ratgeber-article__meta {
	display: flex;
	gap: 12px;
	margin-top: 18px;
	color: var(--text-muted);
	font-size: 14px;
	flex-wrap: wrap;
}
.ratgeber-article__meta [aria-hidden] { opacity: .5; }

.ratgeber-article__content {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: var(--s-7) var(--s-7);
	font-size: 17px;
	line-height: 1.7;
	color: #2a3540;
}
.ratgeber-article__content .lead { font-size: 19px; line-height: 1.55; color: var(--anthrazit); }
.ratgeber-article__content p { margin-bottom: 14px; }
.ratgeber-article__content p:last-child { margin-bottom: 0; }
.ratgeber-article__content h2 {
	font-size: 24px;
	margin-top: 32px;
	margin-bottom: 12px;
	color: var(--anthrazit);
	scroll-margin-top: 100px;
}
.ratgeber-article__content h3 {
	font-size: 19px;
	margin-top: 24px;
	margin-bottom: 10px;
	color: var(--anthrazit);
}
.ratgeber-article__content ul,
.ratgeber-article__content ol {
	padding-left: 20px;
	margin-bottom: 14px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.ratgeber-article__content blockquote {
	margin: 32px 0;
	padding: 20px 24px;
	background: var(--bg-soft);
	border-left: 4px solid var(--talea-cyan);
	border-radius: 8px;
	color: var(--anthrazit);
	font-style: italic;
	font-size: 18px;
}
.ratgeber-article__content a {
	color: var(--primary-ink);
	text-decoration: underline;
}

.ratgeber-article__cta {
	margin-top: var(--s-7);
	background: var(--bg-dark);
	color: #fff;
	padding: var(--s-6);
	border-radius: var(--r-lg);
}
.ratgeber-article__cta h2 { color: #fff; font-size: var(--fs-lg); margin-bottom: 8px; }
.ratgeber-article__cta p { color: rgba(255,255,255,.82); margin-bottom: 16px; }
.ratgeber-article__cta-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.ratgeber-article__cta-actions .btn-ghost { border-color: rgba(255,255,255,.3); color: #fff; }

.ratgeber-related { margin-top: var(--s-8); }
.ratgeber-related h2 { font-size: var(--fs-lg); margin-bottom: var(--s-5); }
.ratgeber-related__grid {
	display: grid;
	gap: var(--s-5);
	grid-template-columns: 1fr;
}
@media (min-width: 700px) { .ratgeber-related__grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .ratgeber-related__grid { grid-template-columns: repeat(3, 1fr); } }

.ratgeber-article__aside { display: none; }
.ratgeber-toc {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	padding: var(--s-5);
}
.ratgeber-toc h4 {
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--text-muted);
	margin-bottom: 14px;
}
.ratgeber-toc ol {
	padding-left: 18px;
	color: var(--primary-ink);
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 14px;
}
.ratgeber-toc a { color: inherit; }
@media (min-width: 1100px) {
	.ratgeber-article__grid { grid-template-columns: 1fr 260px; align-items: start; }
	.ratgeber-article__aside { display: block; }
	.ratgeber-toc { position: sticky; top: 120px; }
}

/* ============================================================
 * Über-uns
 * ============================================================ */
.ueber-hero {
	background: linear-gradient(180deg, #f7fbfe, #fff);
	padding: var(--s-9) 0 var(--s-8);
}
.ueber-hero__intro { text-align: center; max-width: 880px; margin: 0 auto; }
.ueber-hero__intro h1 {
	font-size: clamp(30px, 5vw, 46px);
	margin-top: 18px;
	line-height: 1.1;
}
.ueber-hero__lead {
	font-size: 18px;
	color: var(--text-muted);
	margin: 18px auto 0;
	max-width: 720px;
}

.ueber-values { padding: var(--s-8) 0; }
.ueber-values__grid {
	display: grid;
	gap: var(--s-5);
	grid-template-columns: 1fr;
}
@media (min-width: 800px) { .ueber-values__grid { grid-template-columns: repeat(3, 1fr); } }
.ueber-value {
	background: #fff;
	padding: var(--s-6);
	border: 1px solid var(--border);
	border-radius: 14px;
	box-shadow: var(--shadow-sm);
}
.ueber-value__mark {
	width: 44px; height: 44px;
	border-radius: 12px;
	background: var(--talea-cyan-50);
	display: grid; place-items: center;
	margin-bottom: 16px;
	color: var(--talea-cyan);
	font-weight: 700;
	font-size: 20px;
}
.ueber-value h2 { font-size: var(--fs-md); margin-bottom: 8px; }
.ueber-value p { color: var(--text-muted); font-size: 15px; }

.ueber-verbund { background: var(--bg-section); padding: var(--s-9) 0; }
.ueber-verbund__head { text-align: center; margin-bottom: var(--s-7); }
.ueber-verbund__head h2 { font-size: var(--fs-xl); margin-top: 10px; }
.ueber-verbund__head p { color: var(--text-muted); margin-top: 12px; max-width: 640px; margin-inline: auto; }

.ueber-stats {
	display: grid;
	gap: var(--s-4);
	grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 800px) { .ueber-stats { grid-template-columns: repeat(4, 1fr); } }
.ueber-stat {
	background: #fff;
	padding: var(--s-5);
	border-radius: 12px;
	text-align: center;
	border: 1px solid var(--border);
}
.ueber-stat__num {
	display: block;
	font-size: 36px;
	font-weight: 700;
	color: var(--talea-cyan);
	line-height: 1;
}
.ueber-stat__lbl {
	display: block;
	color: var(--text-muted);
	margin-top: 6px;
	font-size: 14px;
}

.ueber-kontakt { padding: var(--s-9) 0; }
.ueber-kontakt__grid {
	display: grid;
	gap: var(--s-8);
	grid-template-columns: 1fr;
}
@media (min-width: 1024px) { .ueber-kontakt__grid { grid-template-columns: 1fr 1fr; } }
.ueber-kontakt__intro h2 { margin-top: 10px; font-size: var(--fs-xl); }
.ueber-kontakt__intro > p {
	color: var(--text-muted);
	margin-top: 14px;
	font-size: 17px;
}

.kontakt-rows {
	margin-top: var(--s-6);
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.kontakt-row {
	display: flex;
	gap: 14px;
	padding: 16px;
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 12px;
}
.kontakt-row__icon {
	width: 42px; height: 42px;
	border-radius: 10px;
	background: var(--talea-cyan-50);
	display: grid; place-items: center;
	color: var(--talea-cyan);
	flex-shrink: 0;
}
.kontakt-row__lbl {
	font-size: 12px;
	color: var(--text-muted);
	text-transform: uppercase;
	letter-spacing: .05em;
	font-weight: 700;
}
.kontakt-row__val {
	font-size: 17px;
	font-weight: 700;
	color: var(--anthrazit);
	margin-top: 2px;
	text-decoration: none;
	display: block;
}
.kontakt-row__val:hover { color: var(--primary-ink); }
.kontakt-row__sub { font-size: 13px; color: var(--text-muted); margin-top: 2px; }

/* ============================================================
 * Beratung-Seite (/beratung/)
 * ============================================================ */
.beratung-hero {
	background: linear-gradient(180deg, #f7fbfe, #fff);
	padding: var(--s-9) 0 var(--s-8);
}
.beratung-hero__intro { max-width: 780px; }
.beratung-hero__intro h1 {
	margin-top: 16px;
	font-size: clamp(30px, 5vw, 46px);
	line-height: 1.1;
}
.beratung-hero__lead {
	font-size: 18px;
	color: var(--text-muted);
	margin-top: 16px;
	max-width: 640px;
}
.beratung-hero__lead strong { color: var(--success-ink); }
.beratung-hero__actions {
	margin-top: var(--s-6);
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}
.beratung-hero__hint {
	margin-top: 12px;
	font-size: 13px;
	color: var(--text-muted);
}
.beratung-values { padding: var(--s-8) 0; }

.beratung-faq { padding: var(--s-9) 0; }
.faq-list {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.faq-item {
	background: #fff;
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: 16px 20px;
	transition: box-shadow .12s ease;
}
.faq-item[open] { box-shadow: var(--shadow-sm); }
.faq-item summary {
	cursor: pointer;
	list-style: none;
	font-weight: 700;
	color: var(--anthrazit);
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
	content: "＋";
	color: var(--talea-cyan);
	font-weight: 700;
	transition: transform .15s ease;
}
.faq-item[open] summary::after { content: "−"; }
.faq-item p {
	margin-top: 10px;
	color: var(--text-muted);
	line-height: 1.6;
}
.faq-item a { color: var(--primary-ink); }

/* ============================================================
 * Cookie-Consent — Banner, Modal, Widget
 * ============================================================ */
.consent-banner {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 90;
	background: #fff;
	border-top: 1px solid var(--border);
	box-shadow: 0 -12px 32px rgba(15,30,45,.10);
	animation: consent-slide-up .25s ease-out;
}
@keyframes consent-slide-up {
	from { transform: translateY(100%); }
	to   { transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
	.consent-banner { animation: none; }
}
.consent-banner__inner {
	max-width: var(--container-wide);
	margin: 0 auto;
	padding: var(--s-5) var(--s-6);
	display: grid;
	gap: var(--s-4);
	grid-template-columns: 1fr;
}
@media (min-width: 900px) {
	.consent-banner__inner {
		grid-template-columns: 1fr auto;
		align-items: center;
	}
}
.consent-banner__title {
	font-size: 16px;
	margin: 0 0 4px;
	color: var(--anthrazit);
}
.consent-banner__lead {
	color: var(--text-muted);
	font-size: 14px;
	margin: 0;
	line-height: 1.5;
}
.consent-banner__links {
	margin: 6px 0 0;
	font-size: 12px;
	color: var(--text-faint);
}
.consent-banner__links a { color: var(--text-muted); text-decoration: underline; }
.consent-banner__actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	align-items: center;
}
.consent-banner__actions .btn { flex: 1 1 auto; min-width: 130px; }
@media (min-width: 900px) {
	.consent-banner__actions .btn { flex: 0 0 auto; }
}

/* Modal */
.consent-modal {
	position: fixed;
	inset: 0;
	z-index: 100;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}
@media (min-width: 700px) {
	.consent-modal { align-items: center; }
}
.consent-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(15,30,45,.45);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
}
.consent-modal__panel {
	position: relative;
	background: #fff;
	width: 100%;
	max-width: 640px;
	max-height: 90vh;
	overflow-y: auto;
	border-radius: 16px 16px 0 0;
	box-shadow: var(--shadow-lg);
	display: flex;
	flex-direction: column;
	animation: consent-slide-up .25s ease-out;
}
@media (min-width: 700px) {
	.consent-modal__panel {
		border-radius: 16px;
		max-height: 85vh;
	}
}
.consent-modal__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: var(--s-6);
	border-bottom: 1px solid var(--border);
	gap: 12px;
}
.consent-modal__head h2 { font-size: var(--fs-lg); margin: 0; }
.consent-modal__close {
	background: none;
	border: 0;
	font-size: 28px;
	line-height: 1;
	color: var(--text-muted);
	cursor: pointer;
	padding: 4px 8px;
	border-radius: 8px;
}
.consent-modal__close:hover { background: var(--gray-100); color: var(--anthrazit); }
.consent-modal__lead {
	padding: var(--s-5) var(--s-6) 0;
	color: var(--text-muted);
	font-size: 14px;
}
.consent-modal__foot {
	padding: var(--s-5) var(--s-6);
	border-top: 1px solid var(--border);
	display: flex;
	flex-direction: column;
	gap: var(--s-3);
	background: var(--bg-soft);
}
.consent-modal__hint { font-size: 12px; color: var(--text-muted); margin: 0; }
.consent-modal__hint a { color: var(--primary-ink); }
.consent-modal__actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	justify-content: flex-end;
}
.consent-modal__actions .btn { flex: 1 1 auto; }
@media (min-width: 500px) {
	.consent-modal__actions .btn { flex: 0 0 auto; }
}

/* Kategorien-Karten (Modal & Widget) */
.consent-cats {
	padding: var(--s-5) var(--s-6);
	display: flex;
	flex-direction: column;
	gap: var(--s-4);
}
.consent-cat {
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: var(--s-4);
	background: #fff;
}
.consent-cat__head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
}
.consent-cat__title {
	font-weight: 700;
	color: var(--anthrazit);
	cursor: pointer;
	font-size: 15px;
}
.consent-cat__required {
	background: var(--sec-lindgruen-50);
	color: var(--success-ink);
	font-size: 11px;
	padding: 4px 10px;
}
.consent-cat__desc {
	color: var(--text-muted);
	font-size: 13px;
	line-height: 1.5;
	margin: 8px 0 0;
}
.consent-cat__toggle input[type="checkbox"] {
	width: 20px;
	height: 20px;
	accent-color: var(--talea-cyan);
	cursor: pointer;
}
.consent-cat__toggle input[type="checkbox"]:disabled { opacity: .5; cursor: not-allowed; }

/* Widget auf Cookie-Seite */
.consent-widget-mount { margin-bottom: var(--s-5); }
.consent-widget {
	background: var(--talea-cyan-50);
	border: 1px solid var(--talea-cyan-200);
	border-radius: var(--r-lg);
	overflow: hidden;
}
.consent-widget__head { padding: var(--s-5) var(--s-6) 0; }
.consent-widget__head h3 { font-size: var(--fs-md); margin: 0 0 6px; }
.consent-widget__head p { color: var(--text-muted); font-size: 14px; margin: 0; }
.consent-widget .consent-cats { padding: var(--s-5) var(--s-6); }
.consent-widget__foot {
	padding: var(--s-4) var(--s-6);
	background: rgba(255,255,255,.6);
	border-top: 1px solid var(--talea-cyan-200);
	display: flex;
	gap: 12px;
	align-items: center;
	flex-wrap: wrap;
}
.consent-widget__msg {
	color: var(--success-ink);
	font-size: 14px;
	font-weight: 700;
	margin: 0;
}
