/* ============================================================================
 * VATERWELTEN — Hauptstylesheet
 * Aufbau:
 *   1. Schriftarten (lokal)
 *   2. Design-Tokens (CSS-Variablen aus dem CI Manual)
 *   3. Reset / Basics
 *   4. Typografie
 *   5. Layout & Container
 *   6. Header & Hauptnavigation
 *   7. Buttons & Links
 *   8. Hero
 *   9. Sektionen (Home + generic)
 *  10. Karten (Standorte, Angebote, Beiträge)
 *  11. Filter-Leiste
 *  12. Listen / Detailseiten
 *  13. Formulare & FluentForms-Anpassung
 *  14. Footer
 *  15. Utilities
 *  16. Print
 * ========================================================================= */

/* ---------------------------------------------------------------------------
 * 1. SCHRIFTARTEN — lokal, OFL-lizenziert
 * ------------------------------------------------------------------------ */
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('../fonts/Outfit-Regular.woff2') format('woff2');
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('../fonts/Outfit-SemiBold.woff2') format('woff2');
}
@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('../fonts/Outfit-Bold.woff2') format('woff2');
}

/* ---------------------------------------------------------------------------
 * 2. DESIGN-TOKENS — exakt aus dem CI Manual (Stand 27.02.23)
 * ------------------------------------------------------------------------ */
:root {
	/* Primärfarben */
	--vw-orange: #ee8f50;
	--vw-dunkelblau: #1e2d3c;

	/* Sekundärfarben */
	--vw-pfirsich: #eebe8e;
	--vw-pastelblau: #9ebfb5;
	--vw-graublau: #2c4759;
	--vw-lichtgelb: #f2e498;

	/* Neutralfarben */
	--vw-anthrazit: #323232;
	--vw-mittelgrau: #969696;
	--vw-hellgrau: #f4f4f4;
	--vw-weiss: #ffffff;

	/* Semantisch */
	--vw-text: var(--vw-dunkelblau);
	--vw-text-muted: var(--vw-mittelgrau);
	--vw-bg: var(--vw-weiss);
	--vw-bg-soft: #faf6f1;       /* abgeleitet aus Pfirsich, sehr dezent */
	--vw-border: #e6e2dc;

	/* Typografie */
	--vw-font: 'Outfit', Arial, system-ui, -apple-system, sans-serif;
	--vw-fs-100: 0.875rem;       /* 14px — Kleingedrucktes */
	--vw-fs-200: 1rem;           /* 16px — Body Default */
	--vw-fs-300: 1.125rem;       /* 18px — Lead */
	--vw-fs-400: 1.375rem;       /* 22px — H4 / Auszeichnung */
	--vw-fs-500: 1.75rem;        /* 28px — H3 */
	--vw-fs-600: 2.25rem;        /* 36px — H2 */
	--vw-fs-700: 3rem;           /* 48px — H1 */
	--vw-fs-800: 4rem;           /* 64px — Hero auf Desktop */

	--vw-lh-tight: 1.05;
	--vw-lh-snug: 1.25;
	--vw-lh-normal: 1.5;
	--vw-lh-relaxed: 1.65;

	/* Abstände — auf einer 8er-Skala */
	--vw-sp-1: 0.25rem;          /*  4px */
	--vw-sp-2: 0.5rem;           /*  8px */
	--vw-sp-3: 0.75rem;          /* 12px */
	--vw-sp-4: 1rem;             /* 16px */
	--vw-sp-5: 1.5rem;           /* 24px */
	--vw-sp-6: 2rem;             /* 32px */
	--vw-sp-7: 3rem;             /* 48px */
	--vw-sp-8: 4rem;             /* 64px */
	--vw-sp-9: 6rem;             /* 96px */
	--vw-sp-10: 8rem;            /* 128px */

	/* Container */
	--vw-container: 1280px;
	--vw-container-narrow: 800px;

	/* Radien — modern, ruhig */
	--vw-radius-sm: 6px;
	--vw-radius-md: 12px;
	--vw-radius-lg: 24px;
	--vw-radius-pill: 999px;

	/* Schatten — nur sehr dezent */
	--vw-shadow-sm: 0 1px 2px rgba(30, 45, 60, 0.06);
	--vw-shadow-md: 0 6px 24px rgba(30, 45, 60, 0.08);
	--vw-shadow-lg: 0 18px 48px rgba(30, 45, 60, 0.12);

	/* Übergänge */
	--vw-transition: 0.2s ease;

	/* Header-Höhe (für Anker-Offsets etc.) */
	--vw-header-height: 88px;
}

/* ---------------------------------------------------------------------------
 * 3. RESET / BASICS
 * ------------------------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }

html {
	scroll-behavior: smooth;
	scroll-padding-top: var(--vw-header-height);
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

body {
	margin: 0;
	font-family: var(--vw-font);
	font-size: var(--vw-fs-200);
	line-height: var(--vw-lh-normal);
	color: var(--vw-text);
	background: var(--vw-bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

img, svg, video, canvas, iframe { max-width: 100%; height: auto; }
img { display: block; }

button { font: inherit; cursor: pointer; }

/* Fokus-Stil — sichtbar und CI-konform */
:focus-visible {
	outline: 3px solid var(--vw-orange);
	outline-offset: 2px;
	border-radius: 2px;
}

/* Skip-Link */
.vw-skiplink {
	position: absolute;
	top: -100px;
	left: var(--vw-sp-4);
	z-index: 9999;
	padding: var(--vw-sp-3) var(--vw-sp-5);
	background: var(--vw-dunkelblau);
	color: var(--vw-weiss);
	text-decoration: none;
	border-radius: var(--vw-radius-sm);
	transition: top var(--vw-transition);
}
.vw-skiplink:focus { top: var(--vw-sp-3); }

/* Screen-Reader-Only */
.vw-screen-reader-text {
	border: 0;
	clip: rect(1px,1px,1px,1px);
	-webkit-clip-path: inset(50%);
	clip-path: inset(50%);
	height: 1px; width: 1px;
	margin: -1px; overflow: hidden;
	padding: 0; position: absolute;
	word-wrap: normal !important;
}

/* ---------------------------------------------------------------------------
 * 4. TYPOGRAFIE
 * ------------------------------------------------------------------------ */
h1, h2, h3, h4, h5, h6 {
	margin: 0 0 var(--vw-sp-4);
	font-weight: 600;          /* SemiBold per CI für Headlines */
	line-height: var(--vw-lh-tight);
	color: var(--vw-dunkelblau);
	text-wrap: balance;
}
h1 { font-size: var(--vw-fs-700); }
h2 { font-size: var(--vw-fs-600); }
h3 { font-size: var(--vw-fs-500); }
h4 { font-size: var(--vw-fs-400); }
h5 { font-size: var(--vw-fs-300); }
h6 { font-size: var(--vw-fs-200); text-transform: uppercase; letter-spacing: 0.05em; }

p { margin: 0 0 var(--vw-sp-4); max-width: 70ch; }
strong, b { font-weight: 700; }

a {
	color: var(--vw-dunkelblau);
	text-decoration: underline;
	text-underline-offset: 2px;
	text-decoration-thickness: 1px;
	transition: color var(--vw-transition);
}
a:hover { color: var(--vw-orange); }

ul, ol { margin: 0 0 var(--vw-sp-4); padding-left: 1.5em; }
li { margin-bottom: var(--vw-sp-2); }

blockquote {
	margin: var(--vw-sp-6) 0;
	padding: var(--vw-sp-5) var(--vw-sp-6);
	border-left: 4px solid var(--vw-orange);
	background: var(--vw-bg-soft);
	font-size: var(--vw-fs-300);
	font-weight: 700;        /* Bold per CI für Auszeichnungen */
	border-radius: 0 var(--vw-radius-md) var(--vw-radius-md) 0;
}
blockquote p:last-child { margin-bottom: 0; }

small, .vw-small {
	font-size: var(--vw-fs-100);
	letter-spacing: -0.01em;   /* CI: Kleingedrucktes mit -10 Tracking */
}

hr {
	border: 0;
	border-top: 1px solid var(--vw-border);
	margin: var(--vw-sp-7) 0;
}

::selection { background: var(--vw-lichtgelb); color: var(--vw-dunkelblau); }

/* ---------------------------------------------------------------------------
 * 5. LAYOUT & CONTAINER
 * ------------------------------------------------------------------------ */
.vw-container {
	width: 100%;
	max-width: var(--vw-container);
	margin-inline: auto;
	padding-inline: var(--vw-sp-5);
}
.vw-container--narrow { max-width: var(--vw-container-narrow); }

.vw-section {
	padding-block: var(--vw-sp-9);
}
.vw-section--soft { background: var(--vw-bg-soft); }
.vw-section--dark {
	background: var(--vw-dunkelblau);
	color: var(--vw-weiss);
}
.vw-section--dark h1, .vw-section--dark h2, .vw-section--dark h3,
.vw-section--dark h4, .vw-section--dark h5, .vw-section--dark h6 {
	color: var(--vw-weiss);
}
.vw-section--dark a { color: var(--vw-pfirsich); }
.vw-section--dark a:hover { color: var(--vw-orange); }

.vw-section-eyebrow {
	display: inline-block;
	font-size: var(--vw-fs-100);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--vw-orange);
	margin-bottom: var(--vw-sp-3);
}

.vw-grid {
	display: grid;
	gap: var(--vw-sp-6);
}
.vw-grid--2 { grid-template-columns: repeat(2, 1fr); }
.vw-grid--3 { grid-template-columns: repeat(3, 1fr); }
.vw-grid--auto { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }

.vw-site-main { min-height: 50vh; outline: none; }

/* ---------------------------------------------------------------------------
 * 6. HEADER & HAUPTNAVIGATION
 * ------------------------------------------------------------------------ */
.vw-site-header {
	position: sticky;
	top: 0;
	z-index: 100;
	background: var(--vw-weiss);
	border-bottom: 1px solid var(--vw-border);
}
.vw-site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--vw-sp-5);
	min-height: var(--vw-header-height);
}
.vw-site-branding__link {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	padding-block: var(--vw-sp-3);
}
.vw-logo--full { height: 44px; width: auto; }
.vw-logo--mark { height: 40px; width: auto; }

.vw-primary-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: var(--vw-sp-6);
}
.vw-primary-menu li { margin: 0; }
.vw-primary-menu a {
	display: inline-block;
	padding: var(--vw-sp-2) 0;
	text-decoration: none;
	font-weight: 600;
	color: var(--vw-dunkelblau);
	border-bottom: 2px solid transparent;
	transition: border-color var(--vw-transition), color var(--vw-transition);
}
.vw-primary-menu a:hover,
.vw-primary-menu .current-menu-item > a,
.vw-primary-menu .current_page_item > a,
.vw-primary-menu .current-menu-parent > a {
	color: var(--vw-orange);
	border-bottom-color: var(--vw-orange);
}

/* Mobile-Toggle */
.vw-nav-toggle {
	display: none;
	align-items: center;
	gap: var(--vw-sp-2);
	background: transparent;
	border: 0;
	padding: var(--vw-sp-2) var(--vw-sp-3);
	font-weight: 600;
	color: var(--vw-dunkelblau);
}
.vw-nav-toggle__bars {
	display: inline-block;
	width: 24px;
	height: 18px;
	position: relative;
}
.vw-nav-toggle__bars span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background: currentColor;
	border-radius: 2px;
	transition: transform var(--vw-transition), opacity var(--vw-transition), top var(--vw-transition);
}
.vw-nav-toggle__bars span:nth-child(1) { top: 0; }
.vw-nav-toggle__bars span:nth-child(2) { top: 8px; }
.vw-nav-toggle__bars span:nth-child(3) { top: 16px; }
.vw-nav-toggle[aria-expanded="true"] .vw-nav-toggle__bars span:nth-child(1) { top: 8px; transform: rotate(45deg); }
.vw-nav-toggle[aria-expanded="true"] .vw-nav-toggle__bars span:nth-child(2) { opacity: 0; }
.vw-nav-toggle[aria-expanded="true"] .vw-nav-toggle__bars span:nth-child(3) { top: 8px; transform: rotate(-45deg); }

/* Menü-CTA: einzelner Eintrag im Hauptmenü als Button (z. B. „Community") */
.vw-primary-menu li.vw-menu-cta { margin-left: var(--vw-sp-3); }
.vw-primary-menu li.vw-menu-cta > a {
	padding: 0.625rem 1.25rem;
	background: var(--vw-orange);
	color: var(--vw-weiss);
	border: 2px solid var(--vw-orange);
	border-radius: var(--vw-radius-pill);
	border-bottom: 2px solid var(--vw-orange);
	font-weight: 700;
	transition: background var(--vw-transition), color var(--vw-transition), border-color var(--vw-transition);
}
.vw-primary-menu li.vw-menu-cta > a:hover,
.vw-primary-menu li.vw-menu-cta.current-menu-item > a,
.vw-primary-menu li.vw-menu-cta.current_page_item > a {
	background: var(--vw-dunkelblau);
	color: var(--vw-weiss);
	border-color: var(--vw-dunkelblau);
}

@media (max-width: 960px) {
	.vw-logo--full { height: 36px; }
	.vw-nav-toggle { display: inline-flex; }
	.vw-primary-menu {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		flex-direction: column;
		gap: 0;
		padding: var(--vw-sp-4);
		background: var(--vw-weiss);
		border-bottom: 1px solid var(--vw-border);
		box-shadow: var(--vw-shadow-md);
	}
	.vw-primary-menu.is-open { display: flex; }
	.vw-primary-menu a {
		display: block;
		padding: var(--vw-sp-3) 0;
		border-bottom: 1px solid var(--vw-border);
	}
	.vw-primary-menu li:last-child a { border-bottom: 0; }
	.vw-primary-nav { position: relative; }

/* Menü-CTA auf Mobile wie ein normaler Eintrag */
	.vw-primary-menu li.vw-menu-cta { margin-left: 0; }
	.vw-primary-menu li.vw-menu-cta > a {
		padding: var(--vw-sp-3) 0;
		background: transparent;
		color: var(--vw-orange);
		border: 0;
		border-bottom: 1px solid var(--vw-border);
		border-radius: 0;
	}
	.vw-primary-menu li:last-child.vw-menu-cta > a { border-bottom: 0; }
}

/* ---------------------------------------------------------------------------
 * 7. BUTTONS & LINKS
 * ------------------------------------------------------------------------ */
.vw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--vw-sp-2);
	padding: 0.875rem 1.75rem;
	border-radius: var(--vw-radius-pill);
	border: 2px solid transparent;
	font-family: inherit;
	font-weight: 700;
	font-size: var(--vw-fs-200);
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--vw-transition), color var(--vw-transition), border-color var(--vw-transition), transform var(--vw-transition);
}
.vw-btn:hover { transform: translateY(-1px); }

.vw-btn--primary {
	background: var(--vw-orange);
	color: var(--vw-weiss);
}
.vw-btn--primary:hover {
	background: var(--vw-dunkelblau);
	color: var(--vw-weiss);
}

.vw-btn--secondary {
	background: transparent;
	color: var(--vw-dunkelblau);
	border-color: var(--vw-dunkelblau);
}
.vw-btn--secondary:hover {
	background: var(--vw-dunkelblau);
	color: var(--vw-weiss);
}

.vw-btn--ghost {
	background: transparent;
	color: var(--vw-dunkelblau);
	padding-inline: var(--vw-sp-2);
}
.vw-btn--ghost:hover { color: var(--vw-orange); }

.vw-section--dark .vw-btn--secondary {
	color: var(--vw-weiss);
	border-color: var(--vw-weiss);
}
.vw-section--dark .vw-btn--secondary:hover {
	background: var(--vw-weiss);
	color: var(--vw-dunkelblau);
}

.vw-link-arrow {
	display: inline-flex;
	align-items: center;
	gap: var(--vw-sp-2);
	font-weight: 700;
	text-decoration: none;
	color: var(--vw-dunkelblau);
}
.vw-link-arrow::after {
	content: '→';
	transition: transform var(--vw-transition);
}
.vw-link-arrow:hover { color: var(--vw-orange); }
.vw-link-arrow:hover::after { transform: translateX(4px); }

/* ---------------------------------------------------------------------------
 * 8. HERO
 * ------------------------------------------------------------------------ */
.vw-hero {
	position: relative;
	overflow: hidden;
	background: var(--vw-bg-soft);
	padding-block: var(--vw-sp-9);
	isolation: isolate;
}
.vw-hero__inner {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	align-items: center;
	gap: var(--vw-sp-8);
}
.vw-hero__kicker {
	display: inline-block;
	font-size: var(--vw-fs-100);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--vw-orange);
	margin-bottom: var(--vw-sp-3);
}
.vw-hero__title {
	font-size: clamp(2rem, 5vw, var(--vw-fs-800));
	line-height: var(--vw-lh-tight);
	margin-bottom: var(--vw-sp-5);
}
.vw-hero__lead {
	font-size: var(--vw-fs-300);
	line-height: var(--vw-lh-relaxed);
	max-width: 50ch;
	margin-bottom: var(--vw-sp-6);
}
.vw-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vw-sp-4);
}
.vw-hero__visual {
	position: relative;
	aspect-ratio: 4 / 3;
	border-radius: var(--vw-radius-lg);
	overflow: hidden;
	box-shadow: var(--vw-shadow-lg);
}
.vw-hero__visual img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Bühne-Element (CI: abgeschnittener Kreis als Hintergrund) */
.vw-buehne {
	position: absolute;
	z-index: -1;
	pointer-events: none;
	opacity: 0.55;
}
.vw-hero .vw-buehne {
	width: 600px;
	height: 600px;
	right: -150px;
	top: -100px;
}

@media (max-width: 960px) {
	.vw-hero__inner { grid-template-columns: 1fr; gap: var(--vw-sp-6); }
	.vw-hero { padding-block: var(--vw-sp-7); }
}

/* ---------------------------------------------------------------------------
 * 9. SEKTIONEN
 * ------------------------------------------------------------------------ */
.vw-section-header {
	max-width: 720px;
	margin-bottom: var(--vw-sp-7);
}
.vw-section-header h2 { margin-bottom: var(--vw-sp-3); }
.vw-section-header p {
	font-size: var(--vw-fs-300);
	color: var(--vw-text);
	max-width: 60ch;
}

.vw-twocol {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--vw-sp-8);
	align-items: center;
}
.vw-twocol--reverse > :first-child { order: 2; }
.vw-twocol__media {
	border-radius: var(--vw-radius-lg);
	overflow: hidden;
	box-shadow: var(--vw-shadow-md);
}
.vw-twocol__media img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }

@media (max-width: 800px) {
	.vw-twocol { grid-template-columns: 1fr; gap: var(--vw-sp-6); }
	.vw-twocol--reverse > :first-child { order: 0; }
}

/* Werte-Liste (Sektion „Bildungsauftrag & Haltung") */
.vw-werte {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: var(--vw-sp-5);
	list-style: none;
	margin: 0;
	padding: 0;
}
.vw-werte li {
	margin: 0;
	padding: var(--vw-sp-5);
	background: var(--vw-weiss);
	border: 1px solid var(--vw-border);
	border-radius: var(--vw-radius-md);
}
.vw-werte__title {
	font-weight: 700;
	font-size: var(--vw-fs-300);
	color: var(--vw-orange);
	margin-bottom: var(--vw-sp-2);
}

/* Mitglied-CTA */
.vw-mitglied-cta {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--vw-sp-5);
}
.vw-mitglied-cta__card {
	padding: var(--vw-sp-7);
	background: var(--vw-weiss);
	border-radius: var(--vw-radius-lg);
	border: 1px solid var(--vw-border);
}
.vw-mitglied-cta__card--accent {
	background: var(--vw-dunkelblau);
	color: var(--vw-weiss);
	border-color: var(--vw-dunkelblau);
}
.vw-mitglied-cta__card--accent h3 { color: var(--vw-weiss); }
@media (max-width: 800px) {
	.vw-mitglied-cta { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------------
 * 10. KARTEN
 * ------------------------------------------------------------------------ */
.vw-card {
	display: flex;
	flex-direction: column;
	height: 100%;
	background: var(--vw-weiss);
	border: 1px solid var(--vw-border);
	border-radius: var(--vw-radius-md);
	overflow: hidden;
	transition: transform var(--vw-transition), box-shadow var(--vw-transition);
}
.vw-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--vw-shadow-md);
}
.vw-card__media {
	aspect-ratio: 4/3;
	background: var(--vw-bg-soft);
	overflow: hidden;
}
.vw-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--vw-transition);
}
.vw-card:hover .vw-card__media img { transform: scale(1.04); }
.vw-card__body {
	padding: var(--vw-sp-5);
	display: flex;
	flex-direction: column;
	flex: 1;
}
.vw-card__title {
	font-size: var(--vw-fs-400);
	margin-bottom: var(--vw-sp-3);
}
.vw-card__title a { text-decoration: none; color: inherit; }
.vw-card__title a:hover { color: var(--vw-orange); }
.vw-card__excerpt {
	color: var(--vw-text);
	margin-bottom: var(--vw-sp-4);
	flex: 1;
}
.vw-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--vw-sp-2);
	margin-bottom: var(--vw-sp-3);
}

.vw-badge {
	display: inline-block;
	padding: 0.25em 0.75em;
	border-radius: var(--vw-radius-pill);
	font-size: var(--vw-fs-100);
	font-weight: 700;
	background: var(--vw-pfirsich);
	color: var(--vw-dunkelblau);
}
.vw-badge--orange { background: var(--vw-orange); color: var(--vw-weiss); }
.vw-badge--blau { background: var(--vw-pastelblau); color: var(--vw-dunkelblau); }
.vw-badge--gelb { background: var(--vw-lichtgelb); color: var(--vw-dunkelblau); }
.vw-badge--neutral { background: var(--vw-hellgrau); color: var(--vw-anthrazit); }

/* ---------------------------------------------------------------------------
 * 11. FILTER-LEISTE
 * ------------------------------------------------------------------------ */
.vw-filter {
	background: var(--vw-bg-soft);
	border-radius: var(--vw-radius-md);
	padding: var(--vw-sp-5);
	margin-bottom: var(--vw-sp-7);
}
.vw-filter__form {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)) auto;
	gap: var(--vw-sp-4);
	align-items: end;
}
.vw-filter__field { display: flex; flex-direction: column; gap: var(--vw-sp-2); }
.vw-filter__field label {
	font-size: var(--vw-fs-100);
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}
.vw-filter__field select {
	padding: 0.625rem 0.875rem;
	border: 1px solid var(--vw-border);
	border-radius: var(--vw-radius-sm);
	background: var(--vw-weiss);
	font: inherit;
}
.vw-filter__actions {
	display: flex;
	gap: var(--vw-sp-3);
}
.no-js .vw-filter__actions { display: flex; }

/* Wenn JS aktiv ist und der Filter selbst submitted, blenden wir den Submit-Button aus */
.js .vw-filter__submit { display: none; }

/* ---------------------------------------------------------------------------
 * 12. LISTEN / DETAILSEITEN
 * ------------------------------------------------------------------------ */
.vw-page-header {
	padding-block: var(--vw-sp-8);
	background: var(--vw-bg-soft);
}
.vw-page-header h1 {
	font-size: clamp(var(--vw-fs-600), 4vw, var(--vw-fs-700));
	margin-bottom: var(--vw-sp-3);
}
.vw-page-header__lead {
	font-size: var(--vw-fs-300);
	max-width: 60ch;
}

.vw-detail {
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: var(--vw-sp-7);
	margin-block: var(--vw-sp-8);
}
.vw-detail__sidebar {
	padding: var(--vw-sp-6);
	background: var(--vw-bg-soft);
	border-radius: var(--vw-radius-md);
	align-self: start;
	position: sticky;
	top: calc(var(--vw-header-height) + var(--vw-sp-4));
}
.vw-detail__sidebar h2 {
	font-size: var(--vw-fs-400);
	margin-bottom: var(--vw-sp-4);
}
.vw-detail__sidebar dl { margin: 0; }
.vw-detail__sidebar dt {
	font-size: var(--vw-fs-100);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--vw-text-muted);
	margin-top: var(--vw-sp-4);
}
.vw-detail__sidebar dt:first-child { margin-top: 0; }
.vw-detail__sidebar dd {
	margin: var(--vw-sp-1) 0 0;
}

.vw-detail__content > :first-child { margin-top: 0; }
.vw-detail__hero {
	margin-bottom: var(--vw-sp-6);
	border-radius: var(--vw-radius-lg);
	overflow: hidden;
}
.vw-detail__hero img { width: 100%; height: auto; max-height: 480px; object-fit: cover; }

@media (max-width: 960px) {
	.vw-detail { grid-template-columns: 1fr; }
	.vw-detail__sidebar { position: static; }
}

/* Download-Block (Satzung etc.) */
.vw-download {
	display: flex;
	align-items: center;
	gap: var(--vw-sp-4);
	padding: var(--vw-sp-5);
	background: var(--vw-bg-soft);
	border: 1px solid var(--vw-border);
	border-radius: var(--vw-radius-md);
}
.vw-download__icon {
	flex: none;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var(--vw-orange);
	color: var(--vw-weiss);
	display: grid;
	place-items: center;
	font-size: 1.25rem;
	font-weight: 700;
}
.vw-download__title { font-weight: 700; margin: 0 0 var(--vw-sp-1); }
.vw-download__meta { font-size: var(--vw-fs-100); color: var(--vw-text-muted); margin: 0; }

/* Embed-Container (FundraisingBox, Borlabs-Wrapper) */
.vw-embed {
	background: var(--vw-bg-soft);
	border: 1px dashed var(--vw-border);
	border-radius: var(--vw-radius-md);
	padding: var(--vw-sp-6);
	min-height: 200px;
}
.vw-embed__hint {
	color: var(--vw-text-muted);
	font-size: var(--vw-fs-100);
	margin: 0;
}

/* ---------------------------------------------------------------------------
 * 13. FORMULARE & FluentForms-Anpassung
 * ------------------------------------------------------------------------ */
.vw-form-wrap { max-width: 600px; }

input[type="text"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="search"],
textarea, select {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 1px solid var(--vw-border);
	border-radius: var(--vw-radius-sm);
	background: var(--vw-weiss);
	font: inherit;
	color: inherit;
}
input:focus, textarea:focus, select:focus {
	outline: 3px solid var(--vw-orange);
	outline-offset: 1px;
	border-color: var(--vw-orange);
}

/* FluentForms — sanftes Anpassen, falls aktiv */
.fluentform .ff-el-input--label label { font-weight: 600; }
.fluentform .ff-btn-submit {
	background: var(--vw-orange) !important;
	color: var(--vw-weiss) !important;
	border: 0 !important;
	border-radius: var(--vw-radius-pill) !important;
	padding: 0.875rem 1.75rem !important;
	font-weight: 700 !important;
}
.fluentform .ff-btn-submit:hover {
	background: var(--vw-dunkelblau) !important;
}

/* ---------------------------------------------------------------------------
 * 14. FOOTER
 * ------------------------------------------------------------------------ */
.vw-site-footer {
	margin-top: var(--vw-sp-9);
	padding-block: var(--vw-sp-8) var(--vw-sp-5);
	background: var(--vw-dunkelblau);
	color: var(--vw-weiss);
}
.vw-site-footer a { color: var(--vw-pfirsich); text-decoration: none; }
.vw-site-footer a:hover { color: var(--vw-orange); text-decoration: underline; }

.vw-footer-grid {
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr 1fr;
	gap: var(--vw-sp-7);
	margin-bottom: var(--vw-sp-7);
}
.vw-footer-logo .vw-logo--full { height: 36px; margin-bottom: var(--vw-sp-4); }
.vw-footer-claim {
	font-size: var(--vw-fs-300);
	font-weight: 600;
	color: var(--vw-pfirsich);
	max-width: 28ch;
}
.vw-footer-heading {
	font-size: var(--vw-fs-100);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--vw-weiss);
	margin-bottom: var(--vw-sp-4);
}
.vw-footer-menu, .vw-social-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.vw-footer-menu li { margin-bottom: var(--vw-sp-2); }
.vw-social-list { display: flex; gap: var(--vw-sp-3); }
.vw-social-list a {
	display: inline-grid;
	place-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.08);
	transition: background var(--vw-transition);
}
.vw-social-list a:hover { background: var(--vw-orange); }
.vw-social-icon { width: 20px; height: 20px; fill: currentColor; }
.vw-site-footer .vw-social-list a { color: var(--vw-weiss); }

.vw-footer-address address { font-style: normal; line-height: var(--vw-lh-relaxed); margin-bottom: var(--vw-sp-3); }

.vw-footer-bottom {
	padding-top: var(--vw-sp-5);
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	font-size: var(--vw-fs-100);
	color: rgba(255, 255, 255, 0.7);
}
.vw-footer-bottom p { margin: 0; }

@media (max-width: 800px) {
	.vw-footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 480px) {
	.vw-footer-grid { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------------
 * 15. UTILITIES
 * ------------------------------------------------------------------------ */
.vw-mt-0 { margin-top: 0; }
.vw-mb-0 { margin-bottom: 0; }
.vw-text-center { text-align: center; }
.vw-text-muted { color: var(--vw-text-muted); }

@media (max-width: 600px) {
	:root { --vw-header-height: 72px; }
	.vw-section { padding-block: var(--vw-sp-7); }
	.vw-site-footer { padding-block: var(--vw-sp-7) var(--vw-sp-4); }
}

/* ---------------------------------------------------------------------------
 * 16. PRINT
 * ------------------------------------------------------------------------ */
@media print {
	.vw-site-header, .vw-site-footer, .vw-nav-toggle, .vw-buehne { display: none !important; }
	body { color: #000; }
	a { color: #000; text-decoration: underline; }
	.vw-card { break-inside: avoid; box-shadow: none; border: 1px solid #ccc; }
}