/* BFVL Core – oeffentliches Design-System (Handoff-Frontend.md §1-2).
   Bewusst themeunabhaengig: laeuft schon jetzt auf neuen BB-Seiten,
   ohne dass das neue Theme vorzeitig aktiviert werden muss. Wird beim
   Umschalten (Moment X) 1:1 weiterverwendet. */

@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700&family=Barlow+Condensed:wght@500;600;700&display=swap');

:root {
	--bfvl-anthrazit: #16181d;
	--bfvl-anthrazit-tief: #111318;
	--bfvl-rot: #d81e28;
	--bfvl-rot-hover: #b3161f;
	--bfvl-hellgrau: #f6f5f2;
	--bfvl-text: #14161a;
	--bfvl-text-grau: #6b6b6b;
	--bfvl-text-grau-hell: #9aa0a8;
	--bfvl-gruen: #43c463;
}

.bfvl-seite { background: var(--bfvl-hellgrau); color: var(--bfvl-text); font-family: 'Barlow', system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
.bfvl-seite a { color: var(--bfvl-rot); text-decoration: none; }
.bfvl-seite a:hover { color: var(--bfvl-rot-hover); text-decoration: underline; }

.bfvl-container { max-width: 1180px; margin: 0 auto; padding: 0 24px; }

/* Bildschirmfuellende Seiten: jede Seite liegt als eine einzelne .bfvl-seite
   in einer Beaver-Builder-Zeile, die faelschlich auf "Fixed Width" (1100px)
   statt "Full Width" stand - daher der boxed statt bildschirmfuellende Look.
   Die Lesebreite der einzelnen Abschnitte wird bereits von den eigenen
   Layout-Klassen (bfvl-container, bfvl-fwd-*, bfvl-vorstand-liste, etc.)
   sichergestellt, daher kann die BB-Zeile selbst bedenkenlos auf volle
   Breite gesetzt werden. */
.fl-row-fixed-width:has(.bfvl-seite),
.fl-row-content-wrap:has(.bfvl-seite) {
	max-width: none !important;
	width: 100% !important;
}

.bfvl-eyebrow { display: block; font-family: 'Barlow', sans-serif; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--bfvl-rot); font-weight: 600; }

.bfvl-h1, .bfvl-h2, .bfvl-h3 { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; margin: 0; color: var(--bfvl-text); line-height: 1; }
.bfvl-h1 { font-size: 52px; line-height: .96; }
.bfvl-h2 { font-size: 34px; }
.bfvl-h3 { font-size: 26px; }
.bfvl-lead { font-family: 'Barlow', sans-serif; font-size: 16.5px; line-height: 1.55; color: var(--bfvl-text-grau); }

.bfvl-btn { display: inline-block; font-family: 'Barlow', sans-serif; font-weight: 600; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; padding: 12px 20px; border-radius: 8px; cursor: pointer; text-decoration: none !important; border: 1.5px solid transparent; }
.bfvl-btn-primary { background: var(--bfvl-rot); color: #fff !important; }
.bfvl-btn-primary:hover { background: var(--bfvl-rot-hover); }
.bfvl-btn-outline { background: none; border-color: rgba(255,255,255,.35); color: #fff !important; }
.bfvl-btn-outline:hover { background: #fff; color: var(--bfvl-text) !important; }

.bfvl-card { background: #fff; border: 1px solid rgba(20,22,26,.1); border-radius: 13px; transition: box-shadow .18s, border-color .18s; }
.bfvl-card:hover { box-shadow: 0 14px 30px rgba(20,22,26,.12); }

/* Header */
.bfvl-header { position: sticky; top: 0; z-index: 60; background: var(--bfvl-anthrazit); border-bottom: 3px solid var(--bfvl-rot); }
.bfvl-header-inner { max-width: 1180px; margin: 0 auto; padding: 0 24px; height: 74px; display: flex; align-items: center; gap: 20px; }
.bfvl-header-logo { display: flex; align-items: center; gap: 12px; text-decoration: none !important; }
.bfvl-header-logo img { height: 52px; width: auto; display: block; }
.bfvl-header-logo-text { line-height: 1.05; }
.bfvl-header-logo-text b { display: block; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 21px; letter-spacing: .05em; text-transform: uppercase; color: #fff; }
.bfvl-header-logo-text span { display: block; font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--bfvl-text-grau-hell); }
.bfvl-header-nav { margin-left: auto; display: flex; align-items: center; gap: 2px; flex-wrap: wrap; }
.bfvl-header-nav a { font-family: 'Barlow', sans-serif; font-weight: 600; font-size: 13.5px; text-transform: uppercase; letter-spacing: .09em; padding: 9px 13px; color: #dfe2e6 !important; text-decoration: none !important; }
.bfvl-header-nav a:hover { color: #fff !important; }
.bfvl-header-nav a.bfvl-login { margin-left: 10px; display: inline-flex; align-items: center; gap: 7px; background: var(--bfvl-rot); color: #fff !important; font-size: 13px; padding: 10px 16px; border-radius: 7px; }
.bfvl-header-nav a.bfvl-login:hover { background: var(--bfvl-rot-hover); }
@media (max-width: 780px) { .bfvl-header-nav a:not(.bfvl-login) { display: none; } }

/* 118-Band */
.bfvl-118 { background: var(--bfvl-rot); color: #fff; }
.bfvl-118-inner { max-width: 1180px; margin: 0 auto; padding: 20px 24px; display: flex; align-items: center; gap: 26px; flex-wrap: wrap; }
.bfvl-118-dot { width: 12px; height: 12px; border-radius: 50%; background: #fff; animation: bfvlpulse 1.1s ease-in-out infinite alternate; display: inline-block; }
@keyframes bfvlpulse { from { opacity: .35; transform: scale(.85); } to { opacity: 1; transform: scale(1); } }
.bfvl-118-label { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; font-size: 19px; }
.bfvl-118-num { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 46px; line-height: 1; letter-spacing: .02em; }
.bfvl-118-text { font-size: 14px; line-height: 1.45; max-width: 520px; color: #ffe0e1; }

/* Vorstand */
.bfvl-vorstand-liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 22px; }
.bfvl-vs-card { background: #fff; border: 1px solid rgba(20,22,26,.1); border-radius: 13px; padding: 26px 22px 22px; text-align: center; }
.bfvl-vs-photo-wrap { display: flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.bfvl-vs-line { flex: 1; height: 1px; background: rgba(20,22,26,.15); }
.bfvl-vs-photo { width: 84px; height: 84px; border-radius: 50%; object-fit: cover; margin: 0 14px; flex-shrink: 0; }
.bfvl-vs-name { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; font-size: 19px; margin: 0 0 3px; color: var(--bfvl-text); }
.bfvl-vs-rolle { font-size: 13px; color: var(--bfvl-text-grau); margin: 0 0 16px; }
.bfvl-vs-bio { text-align: center; font-size: 13px; line-height: 1.5; color: var(--bfvl-text-grau); }
.bfvl-vs-label { font-weight: 700; color: var(--bfvl-text); margin: 14px 0 4px; font-size: 12.5px; text-transform: uppercase; letter-spacing: .04em; }
.bfvl-vs-label:first-child { margin-top: 0; }
.bfvl-vs-list { list-style: none; margin: 0; padding: 0; }
.bfvl-vs-list li { padding: 4px 0; border-top: 1px solid rgba(20,22,26,.06); }
.bfvl-vs-list li:first-child { border-top: none; }
.bfvl-vs-social { margin-top: 18px; display: flex; justify-content: center; gap: 8px; }
.bfvl-vs-icon { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--bfvl-hellgrau); color: var(--bfvl-text-grau) !important; text-decoration: none !important; }
.bfvl-vs-icon:hover { background: var(--bfvl-rot); color: #fff !important; }
.bfvl-vs-icon svg { width: 15px; height: 15px; fill: currentColor; }

/* FW-Detailseite */
.bfvl-fwd-hero { padding: 54px 0 40px; }
.bfvl-fwd-eyebrow { display: block; font-family: 'Barlow', sans-serif; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: rgba(255,255,255,.8); font-weight: 600; margin-bottom: 10px; }
.bfvl-fwd-h1 { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; font-size: 44px; line-height: 1; color: #fff; margin: 0 0 18px; }
.bfvl-fwd-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.bfvl-fwd-chip { background: rgba(255,255,255,.18); color: #fff; font-size: 12.5px; font-weight: 600; padding: 6px 13px; border-radius: 20px; }
.bfvl-fwd-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 40px; align-items: start; }
@media (max-width: 860px) { .bfvl-fwd-grid { grid-template-columns: 1fr; } }
.bfvl-fwd-foto { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 13px; margin-top: 22px; display: block; }
.bfvl-fwd-sidebar { display: flex; flex-direction: column; gap: 18px; }
.bfvl-fwd-card { padding: 22px; }
.bfvl-fwd-card h4 { font-family: 'Barlow Condensed', sans-serif; text-transform: uppercase; letter-spacing: .06em; font-size: 14px; margin: 0 0 12px; color: var(--bfvl-text-grau); }
.bfvl-fwd-card .bfvl-kommandant { display: flex; align-items: center; gap: 12px; }
.bfvl-fwd-card .bfvl-kommandant img { max-width: 56px; border-radius: 6px; }
.bfvl-fwd-card .bfvl-kommandant p { margin: 0; }
.bfvl-fwd-118 { background: var(--bfvl-rot); color: #fff; border-radius: 13px; padding: 22px; text-align: center; }
.bfvl-fwd-118-num { font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 38px; line-height: 1; }
.bfvl-fwd-118-txt { font-size: 13px; color: #ffe0e1; margin-top: 6px; }

/* Footer */
.bfvl-footer { background: var(--bfvl-anthrazit); color: #c3c7cd; }
.bfvl-footer-inner { max-width: 1180px; margin: 0 auto; padding: 52px 24px 26px; display: grid; grid-template-columns: 1.3fr 1fr 1fr .9fr; gap: 30px; }
.bfvl-footer h4 { font-family: 'Barlow Condensed', sans-serif; text-transform: uppercase; letter-spacing: .06em; font-size: 15px; color: #fff; margin: 0 0 12px; }
.bfvl-footer a { color: #c3c7cd !important; text-decoration: none !important; display: block; font-size: 13.5px; margin-bottom: 7px; }
.bfvl-footer a:hover { color: #fff !important; }
.bfvl-footer-bottom { border-top: 1px solid rgba(255,255,255,.1); padding: 16px 24px; text-align: center; font-size: 12.5px; color: var(--bfvl-text-grau-hell); }
@media (max-width: 860px) { .bfvl-footer-inner { grid-template-columns: 1fr 1fr; } }

/* Sections & Hero */
.bfvl-hero { background: var(--bfvl-anthrazit); color: #fff; }
.bfvl-hero-inner { max-width: 1180px; margin: 0 auto; padding: 60px 24px 40px; display: grid; grid-template-columns: 1.05fr .95fr; gap: 48px; align-items: center; }
.bfvl-hero p { color: #c3c7cd; }
@media (max-width: 860px) { .bfvl-hero-inner { grid-template-columns: 1fr; } }
.bfvl-section { padding: 56px 0; }
.bfvl-section-dark { background: var(--bfvl-anthrazit); color: #fff; border-radius: 14px; padding: 34px 32px; }

/* Jahresprogramm-Ausgabe des Plugins (class-bfvl-jahresprogramm.php) im
   Design-System einfaerben, ohne die PHP-Ausgabe selbst anzufassen. */
.bfvl-seite .bfvl-jahresprogramm { font-family: 'Barlow', sans-serif; color: var(--bfvl-text); }
.bfvl-seite .bfvl-jahresprogramm > p:first-child { background: #fff; border: 1px solid rgba(20,22,26,.1); border-radius: 11px; padding: 14px 18px; color: var(--bfvl-text-grau); font-size: 14px; }
.bfvl-seite .bfvl-jp-eintrag { background: #fff; border: 1px solid rgba(20,22,26,.1); border-radius: 11px; padding: 14px 18px !important; margin-bottom: 10px !important; }
.bfvl-seite .bfvl-jp-eintrag div[style*="background:#2271b1"] { background: var(--bfvl-rot) !important; font-family: 'Barlow', sans-serif; }
.bfvl-seite .bfvl-jp-eintrag hr { border: none; border-top: 1px solid rgba(20,22,26,.08); }
.bfvl-seite .bfvl-jp-eintrag strong { font-family: 'Barlow Condensed', sans-serif; font-size: 18px; text-transform: uppercase; }

.bfvl-seite .bfvl-vorstand-liste h4 { font-family: 'Barlow Condensed', sans-serif; text-transform: uppercase; font-size: 18px; }
.bfvl-seite .bfvl-vorstand-liste p { font-family: 'Barlow', sans-serif; font-size: 13.5px; }

/* Intern-Dashboard */
.bfvl-intern-status { display: flex; align-items: center; justify-content: space-between; gap: 16px; background: #fff; border: 1px solid rgba(20,22,26,.1); border-radius: 10px; padding: 12px 18px; margin-bottom: 22px; font-family: 'Barlow', sans-serif; font-size: 14px; }
.bfvl-intern-status a { font-weight: 600; }
.bfvl-intern-kacheln { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.bfvl-intern-kachel { display: block; background: #fff; border: 1px solid rgba(20,22,26,.1); border-radius: 12px; padding: 20px; text-decoration: none !important; transition: box-shadow .18s, border-color .18s; }
.bfvl-intern-kachel:hover { box-shadow: 0 14px 30px rgba(20,22,26,.12); border-color: rgba(20,22,26,.2); }
.bfvl-intern-kachel-titel { display: block; font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: 19px; text-transform: uppercase; color: var(--bfvl-text); }
.bfvl-intern-kachel-text { display: block; margin-top: 6px; font-family: 'Barlow', sans-serif; font-size: 13px; color: var(--bfvl-text-grau); }
.bfvl-intern-login .login-username label, .bfvl-intern-login .login-password label { font-family: 'Barlow', sans-serif; font-weight: 600; font-size: 12px; text-transform: uppercase; color: var(--bfvl-text-grau); }
.bfvl-intern-login input[type="text"], .bfvl-intern-login input[type="password"] { border-radius: 8px; padding: 8px 10px; }
.bfvl-intern-login input[type="submit"] { background: var(--bfvl-rot); border-color: var(--bfvl-rot); color: #fff; text-transform: uppercase; font-weight: 600; border-radius: 8px; padding: 8px 16px; }
.bfvl-intern-modul-back { display: inline-block; margin-bottom: 16px; font-family: 'Barlow', sans-serif; font-weight: 600; font-size: 13px; }

.bfvl-fw-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 18px;
}

.bfvl-fw-card {
	display: flex;
	flex-direction: column;
	background: #fff;
	border: 1px solid rgba(20, 22, 26, .11);
	border-radius: 12px;
	overflow: hidden;
	text-decoration: none !important;
	color: inherit;
	transition: box-shadow .18s, border-color .18s;
}

.bfvl-fw-card:hover {
	box-shadow: 0 14px 30px rgba(20, 22, 26, .12);
	border-color: rgba(20, 22, 26, .2);
}

.bfvl-fw-card-bar {
	display: block;
	height: 5px;
}

.bfvl-fw-card-body {
	display: block;
	padding: 16px 17px 18px;
}

.bfvl-fw-card-name {
	display: block;
	font-family: 'Barlow Condensed', sans-serif;
	font-weight: 700;
	font-size: 20px;
	line-height: 1.02;
	text-transform: uppercase;
	color: #14161a;
	min-height: 40px;
}

.bfvl-fw-card-badge {
	display: inline-block;
	margin: 8px 0 10px;
	font-family: 'Barlow', sans-serif;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .05em;
	text-transform: uppercase;
	color: #6b6b6b;
	background: #f0efec;
	padding: 3px 8px;
	border-radius: 5px;
}

.bfvl-fw-card-gemeinden {
	display: block;
	font-family: 'Barlow', sans-serif;
	font-size: 13.5px;
	line-height: 1.4;
	color: #4a4a4a;
}

.bfvl-fw-card-link {
	display: block;
	margin-top: 12px;
	font-family: 'Barlow', sans-serif;
	font-size: 13px;
	font-weight: 600;
	color: #d81e28;
}

.bfvl-hinweis {
	font-family: 'Barlow', sans-serif;
	color: #6b6b6b;
}

/* Karte */

.bfvl-karte-wrap {
	display: grid;
	grid-template-columns: 1fr 240px;
	gap: 18px;
	align-items: start;
}

@media (max-width: 720px) {
	.bfvl-karte-wrap {
		grid-template-columns: 1fr;
	}
}

.bfvl-karte-legende {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
	background: #fff;
	border: 1px solid rgba(20, 22, 26, .1);
	border-radius: 12px;
	padding: 10px;
}

.bfvl-karte-legende-item {
	display: flex;
	align-items: center;
	gap: 9px;
	width: 100%;
	text-align: left;
	background: none;
	border: none;
	cursor: pointer;
	padding: 7px 8px;
	border-radius: 7px;
	font-family: 'Barlow', sans-serif;
	font-size: 13.5px;
	color: #14161a;
}

.bfvl-karte-legende-item:hover {
	background: #f6f5f2;
}

.bfvl-karte-legende-dot {
	width: 10px;
	height: 10px;
	border-radius: 3px;
	flex: none;
}

/* Gemeinde-Suche */

.bfvl-gemeinde-suche {
	position: relative;
	max-width: 460px;
}

.bfvl-gemeinde-suche-feld {
	background: #fff;
	border-radius: 12px;
	padding: 7px 7px 7px 16px;
	display: flex;
	align-items: center;
	gap: 10px;
	box-shadow: 0 12px 32px rgba(0, 0, 0, .28);
}

.bfvl-gemeinde-suche-input {
	flex: 1;
	border: none;
	outline: none;
	font-family: 'Barlow', sans-serif;
	font-size: 16px;
	color: #14161a;
	background: none;
}

.bfvl-gemeinde-suche-btn {
	background: #d81e28;
	color: #fff;
	font-family: 'Barlow', sans-serif;
	font-weight: 600;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: .06em;
	padding: 11px 18px;
	border-radius: 8px;
	cursor: pointer;
	flex: none;
}

.bfvl-gemeinde-suche-ergebnisse {
	margin-top: 8px;
	background: #fff;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 12px 32px rgba(0, 0, 0, .28);
}

.bfvl-gemeinde-suche-ergebnis {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 12px;
	text-align: left;
	background: none;
	border: none;
	border-bottom: 1px solid rgba(0, 0, 0, .07);
	padding: 12px 16px;
	cursor: pointer;
	text-decoration: none !important;
	color: inherit;
}

.bfvl-gemeinde-suche-ergebnis:hover {
	background: #f6f5f2;
}

.bfvl-gemeinde-suche-dot {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	flex: none;
}

.bfvl-gemeinde-suche-gemeinde {
	display: block;
	font-family: 'Barlow', sans-serif;
	font-weight: 600;
	font-size: 15px;
	color: #14161a;
}

.bfvl-gemeinde-suche-fw {
	display: block;
	font-family: 'Barlow', sans-serif;
	font-size: 12.5px;
	color: #6b6b6b;
}

.bfvl-gemeinde-suche-pfeil {
	margin-left: auto;
	color: #d81e28;
	font-weight: 700;
}

.bfvl-gemeinde-suche-leer {
	max-width: 460px;
	margin: 10px 2px 0;
	font-family: 'Barlow', sans-serif;
	font-size: 13.5px;
	color: #9aa0a8;
}
