/* =========================================================
   BaTTV · Personen, Gremien und Präsidium
   gemeinsames Stylesheet für alle Seiten (battv-kontakte.js)
   ========================================================= */
.battv-k, .battv-k * { box-sizing: border-box; }
.battv-k {
  --k-text: #0b1f3a; --k-blau: #0b3c6f; --k-hell: #edf5fb; --k-orange: #e98b00; --k-gelb: #f5b400;
  --k-creme: #fff8e1; --k-linie: rgba(11,31,58,.10); --k-leise: rgba(11,31,58,.62);
  width: 100%; margin: 1.25rem 0 2.5rem; color: var(--k-text);
}
.battv-k a::before, .battv-k a::after { content: none !important; display: none !important; }

/* Kopf */
.battv-k-kopf {
  display: grid; grid-template-columns: 52px minmax(0,1fr); gap: .95rem; align-items: center;
  margin: 0 0 1rem; padding: 1.1rem 1.2rem; background: #fff; border: 1px solid var(--k-linie);
  border-top: 4px solid var(--k-gelb); border-radius: 1rem; box-shadow: 0 .3rem .85rem rgba(11,31,58,.05);
}
.battv-k-kopf-ico { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px;
  color: var(--k-blau); background: var(--k-hell); border: 1px solid rgba(11,60,111,.14); border-radius: .78rem; }
.battv-k-kopf-ico svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.battv-k-eyebrow { display: block; margin: 0 0 .15rem; color: var(--k-orange); font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.battv-k-kopf h2 { margin: 0 0 .22rem; font-size: 1.45rem; font-weight: 800; line-height: 1.18; letter-spacing: -.015em; color: var(--k-text); }
.battv-k-kopf p { margin: 0; color: rgba(11,31,58,.64); font-size: .82rem; line-height: 1.5; }

/* Suche, Sortierung, Filter */
.battv-k-werkzeuge { display: grid; grid-template-columns: minmax(0,1fr) 220px; gap: .8rem; margin: 0 0 .75rem;
  padding: .85rem; background: #fff; border: 1px solid rgba(11,31,58,.09); border-radius: .9rem; box-shadow: 0 .2rem .65rem rgba(11,31,58,.04); }
.battv-k-feld { display: flex; flex-direction: column; gap: .3rem; margin: 0; }
.battv-k-feld > span { font-size: .64rem; font-weight: 800; letter-spacing: .055em; text-transform: uppercase; }
.battv-k-feld input, .battv-k-feld select { width: 100%; min-height: 43px; margin: 0; padding: .62rem .75rem; color: var(--k-text);
  background: #fff; border: 1px solid rgba(11,31,58,.16); border-radius: .62rem; font-size: .83rem; }
.battv-k-feld input:focus, .battv-k-feld select:focus { border-color: var(--k-orange); outline: 3px solid rgba(233,139,0,.15); outline-offset: 1px; }
.battv-k-filter { display: flex; flex-wrap: wrap; gap: .42rem; margin: 0 0 .7rem; }
.battv-k-filter button { min-height: 34px; margin: 0; padding: .42rem .68rem; color: var(--k-blau); background: var(--k-hell);
  border: 1px solid rgba(11,60,111,.11); border-radius: .55rem; font-size: .68rem; font-weight: 750; cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease, transform .15s ease; }
.battv-k-filter button:hover { background: var(--k-creme); border-color: rgba(233,139,0,.25); transform: translateY(-1px); }
.battv-k-filter button.ist-aktiv { color: var(--k-text); background: var(--k-gelb); border-color: var(--k-gelb); }
.battv-k-filter button:focus-visible, .battv-k a:focus-visible { outline: 3px solid rgba(233,139,0,.3); outline-offset: 2px; }
.battv-k-anzahl { display: inline-flex; align-items: center; min-height: 28px; margin: 0 0 .8rem; padding: .3rem .55rem;
  color: var(--k-leise); background: #fff; border: 1px solid rgba(11,31,58,.08); border-radius: 999px; font-size: .67rem; font-weight: 700; }
.battv-k-leer { grid-column: 1 / -1; padding: 1.25rem; color: var(--k-leise); background: #fff; border: 1px solid rgba(11,31,58,.09);
  border-top: 3px solid var(--k-gelb); border-radius: .85rem; }

/* Personenkarten */
.battv-k-raster { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .85rem; }
.battv-k-person { display: grid; grid-template-columns: 128px minmax(0,1fr); min-height: 205px; overflow: hidden; background: #fff;
  border: 1px solid var(--k-linie); border-top: 4px solid var(--k-gelb); border-radius: .95rem; box-shadow: 0 .25rem .75rem rgba(11,31,58,.055);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.battv-k-person:hover, .battv-k-karte:hover { border-color: rgba(233,139,0,.34); box-shadow: 0 .6rem 1.2rem rgba(11,31,58,.10); transform: translateY(-2px); }
.battv-k-bild { position: relative; min-height: 100%; overflow: hidden; background: var(--k-hell); border-right: 1px solid rgba(11,31,58,.07); }
.battv-k-foto { position: absolute; inset: 0; width: 100% !important; height: 100% !important; margin: 0 !important; object-fit: cover; object-position: center top; }
.battv-k-platzhalter { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: 1rem;
  color: rgba(11,31,58,.44); font-size: .75rem; font-weight: 700; text-align: center; }
.battv-k-inhalt { display: flex; flex-direction: column; min-width: 0; padding: .85rem .88rem .78rem; }
.battv-k-person .battv-k-name { margin: 0 0 .42rem; font-size: .94rem; font-weight: 800; line-height: 1.28; color: var(--k-text); }
.battv-k-funktionen { margin: 0 0 .2rem; padding: 0; list-style: none; }
.battv-k-funktionen li { position: relative; margin: 0 0 .18rem; padding-left: .72rem; color: rgba(11,31,58,.67); font-size: .7rem; line-height: 1.38; }
.battv-k-funktionen li::before { position: absolute; top: .53em; left: 0; width: .25rem; height: .25rem; background: var(--k-orange); border-radius: 50%; content: ""; }

/* Kontaktzeilen (alle Karten) */
.battv-k-kontakt { display: flex; flex-direction: column; gap: .3rem; margin-top: auto; padding-top: .55rem; border-top: 1px solid rgba(11,31,58,.08); }
.battv-k-zeile { display: grid; grid-template-columns: 27px minmax(0,1fr); gap: .42rem; align-items: center; min-width: 0;
  color: var(--k-blau) !important; font-size: .67rem; font-weight: 700; line-height: 1.35; text-decoration: none !important; overflow-wrap: break-word; }
.battv-k-zeile strong, .battv-k-zeile small { display: block; }
.battv-k-zeile small { color: var(--k-leise); font-size: .62rem; font-weight: 600; }
a.battv-k-zeile:hover { color: var(--k-orange) !important; }
a.battv-k-zeile:hover .battv-k-ico { color: var(--k-orange); background: var(--k-creme); border-color: rgba(233,139,0,.2); }
.battv-k-zeile--text { font-weight: 600; color: var(--k-leise) !important; }
.battv-k-zeile--hinweis { align-items: start; font-weight: 600; color: rgba(11,31,58,.58) !important; }
.battv-k-ico { display: flex; align-items: center; justify-content: center; width: 27px; height: 27px; color: var(--k-blau);
  background: var(--k-hell); border: 1px solid rgba(11,60,111,.12); border-radius: .46rem; }
.battv-k-ico svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* Gremienseite */
.battv-k-sprung { display: grid; grid-template-columns: repeat(auto-fill,minmax(170px,1fr)); gap: .55rem; margin: 0 0 1.4rem; padding: .75rem;
  background: #fff; border: 1px solid rgba(11,31,58,.09); border-radius: .9rem; }
.battv-k-sprung a { display: flex; align-items: center; justify-content: space-between; gap: .5rem; min-height: 38px; padding: .48rem .6rem;
  color: var(--k-blau) !important; background: var(--k-hell); border: 1px solid rgba(11,60,111,.11); border-radius: .55rem;
  font-size: .7rem; font-weight: 750; text-decoration: none !important; }
.battv-k-sprung a:hover { background: var(--k-creme); border-color: rgba(233,139,0,.25); }
.battv-k .battv-k-sprung a::after { display: block !important; content: "↓" !important; color: var(--k-orange) !important; font-weight: 800; }
.battv-k .battv-k-sprung a:visited, .battv-k a.battv-k-zeile:visited { color: var(--k-blau) !important; }
.battv-k-gremium { margin-top: 2.1rem; scroll-margin-top: 110px; }
.battv-k-gremium:first-of-type, .battv-k-sprung + .battv-k-gremium { margin-top: 1.2rem; }
.battv-k-gremium > h3 { position: relative; margin: 0 0 .15rem; padding-left: .85rem; font-size: 1.12rem; font-weight: 800; color: var(--k-text); }
.battv-k-gremium > h3::before { position: absolute; top: .12rem; bottom: .12rem; left: 0; width: 3px; background: var(--k-gelb); border-radius: 999px; content: ""; }
.battv-k-intro { margin: 0 0 .75rem; padding-left: .85rem; color: rgba(11,31,58,.61); font-size: .76rem; line-height: 1.45; }
.battv-k-unter { position: relative; margin: 1.35rem 0 .65rem; padding: 0 0 .38rem; border-bottom: 1px solid rgba(11,31,58,.09); font-size: .88rem; font-weight: 800; color: var(--k-text); }
.battv-k-unter::after { position: absolute; bottom: -1px; left: 0; width: 42px; height: 2px; background: var(--k-gelb); content: ""; }
.battv-k-karten { display: grid; grid-template-columns: repeat(auto-fill,minmax(250px,1fr)); gap: .8rem; }
.battv-k-karten--foto { grid-template-columns: repeat(auto-fill,minmax(340px,1fr)); gap: 1rem; }
.battv-k-karten--ehrung { grid-template-columns: repeat(auto-fill,minmax(170px,1fr)); }
.battv-k-karte { position: relative; display: flex; overflow: hidden; min-height: 125px; background: #fff; border: 1px solid var(--k-linie);
  border-top: 3px solid var(--k-gelb); border-radius: .85rem; box-shadow: 0 .22rem .65rem rgba(11,31,58,.045);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.battv-k-karte .battv-k-inhalt { flex: 1 1 auto; padding: .85rem; }
.battv-k-rolle { margin: 0 0 .18rem; color: var(--k-orange); font-size: .59rem; font-weight: 800; line-height: 1.3; letter-spacing: .055em; text-transform: uppercase; }
.battv-k-karte .battv-k-name { margin: 0 0 .4rem; font-size: .9rem; font-weight: 800; line-height: 1.3; color: var(--k-text); }
.battv-k-firma, .battv-k-zusatz { margin: -.1rem 0 .45rem; color: rgba(11,31,58,.58); font-size: .68rem; font-weight: 600; line-height: 1.4; }
.battv-k-karte--offen { background: rgba(11,31,58,.018); border-top-color: rgba(11,31,58,.25); }
.battv-k-karte--offen .battv-k-rolle { color: rgba(11,31,58,.5); }
.battv-k-karte--offen .battv-k-name { color: rgba(11,31,58,.55); font-style: italic; }
.battv-k-karte--foto { display: grid; grid-template-columns: 145px minmax(0,1fr); min-height: 220px; border-top-width: 4px; }
.battv-k-karte--foto .battv-k-inhalt { padding: 1rem; }
.battv-k-karte--foto .battv-k-rolle { font-size: .64rem; }
.battv-k-karte--foto .battv-k-name { font-size: 1rem; margin-bottom: .75rem; }
.battv-k-karte--ehrung { flex-direction: column; justify-content: center; min-height: 90px; padding: .75rem; text-align: center; }
.battv-k-karte--ehrung .battv-k-name { margin-bottom: .1rem; font-size: .84rem; }
.battv-k-label { color: rgba(11,31,58,.5); font-size: .65rem; font-weight: 600; }
.battv-k-karte--ehrung .battv-k-zusatz { margin: .25rem 0 0; font-size: .6rem; }

/* Responsiv */
@media (max-width: 899.98px) { .battv-k-raster { grid-template-columns: 1fr; } }
/* kompakte Namensliste (z. B. Präsidium im erweiterten Vorstand) */
.battv-k-kompakt { display: flex; flex-wrap: wrap; gap: .45rem; margin: 0 0 .4rem; padding: 0; list-style: none; }
.battv-k-kompakt li { display: flex; flex-direction: column; margin: 0; padding: .5rem .75rem; background: #fff;
  border: 1px solid var(--k-linie); border-left: 3px solid var(--k-gelb); border-radius: .6rem; }
.battv-k-kompakt strong { color: var(--k-text); font-size: .8rem; }
.battv-k-kompakt span { color: var(--k-leise); font-size: .66rem; font-weight: 600; }

/* Kombi-Seite: Reiter Gremien | Personen */
.battv-k-reiter { display: flex; gap: .3rem; margin: 0 0 1rem; padding: .3rem; background: #fff;
  border: 1px solid rgba(11,31,58,.09); border-radius: .9rem; }
.battv-k-reiter button { flex: 1 1 0; min-height: 42px; margin: 0; padding: .55rem .8rem; color: var(--k-blau); background: transparent;
  border: 0; border-radius: .65rem; font: inherit; font-size: .82rem; font-weight: 800; cursor: pointer; }
.battv-k-reiter button:hover { background: var(--k-hell); }
.battv-k-reiter button.ist-aktiv { color: var(--k-text); background: var(--k-gelb); }
.battv-k-reiter button:focus-visible { outline: 3px solid rgba(233,139,0,.3); outline-offset: 2px; }
.battv-k-teil[hidden] { display: none !important; }
.battv-k-teil .battv-k-sprung { margin-top: 0; }
.battv-k-person .battv-k-firma { margin: -.15rem 0 .4rem; }

@media (max-width: 767.98px) {
  .battv-k-werkzeuge { grid-template-columns: 1fr; }
  .battv-k-karten--foto { grid-template-columns: 1fr; }
  .battv-k-karte--foto { grid-template-columns: 120px minmax(0,1fr); min-height: 200px; }
}
@media (max-width: 519.98px) {
  .battv-k-kopf { grid-template-columns: 44px minmax(0,1fr); gap: .75rem; padding: .9rem; }
  .battv-k-kopf-ico { width: 44px; height: 44px; }
  .battv-k-kopf h2 { font-size: 1.25rem; }
  .battv-k-person { grid-template-columns: 105px minmax(0,1fr); min-height: 175px; }
  .battv-k-inhalt { padding: .72rem; }
  .battv-k-sprung { grid-template-columns: 1fr 1fr; }
  .battv-k-karte--foto { grid-template-columns: 105px minmax(0,1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .battv-k-person, .battv-k-karte, .battv-k-filter button { transition: none; }
  .battv-k-person:hover, .battv-k-karte:hover, .battv-k-filter button:hover { transform: none; }
}

.battv-k-zeile > span { min-width: 0; overflow-wrap: break-word; }

/* ---- V1.9: Foto als festes Hochformat-Porträt oben links ----------------
   Spalte bleibt weiß, Bild immer 3:4, egal wie hoch die Karte wird.          */
.battv-k .battv-k-bild { position: relative; display: block; min-height: 0; padding: 14px 0 14px 14px;
  background: #fff !important; border-right: 0 !important; overflow: visible; }
.battv-k .battv-k-foto { position: static !important; display: block; inset: auto; width: 100% !important;
  height: auto !important; aspect-ratio: 3 / 4; margin: 0 !important; object-fit: cover; object-position: center 20%;
  border-radius: .7rem; background: var(--k-hell); }
.battv-k .battv-k-bild .battv-k-platzhalter { position: static; display: flex; align-items: center; justify-content: center;
  width: 100%; aspect-ratio: 3 / 4; background: var(--k-hell); border-radius: .7rem; }
.battv-k-person { grid-template-columns: 118px minmax(0,1fr) !important; min-height: 0 !important; }
.battv-k-karte--foto { grid-template-columns: 130px minmax(0,1fr) !important; min-height: 0 !important; }
@media (max-width: 519.98px) {
  .battv-k-person, .battv-k-karte--foto { grid-template-columns: 96px minmax(0,1fr) !important; }
  .battv-k .battv-k-bild { padding: 12px 0 12px 12px; }
}

/* ---- V1.8: Sprungleiste Gremien = gleiche Optik wie Personen-Filter ----- */
.battv-k-sprung { display: flex !important; flex-wrap: wrap; gap: .42rem; margin: 0 0 .7rem; padding: 0;
  background: transparent; border: 0; border-radius: 0; }
.battv-k-sprung a { display: inline-flex; min-height: 34px; padding: .42rem .68rem; gap: .35rem;
  background: var(--k-hell); border: 1px solid rgba(11,60,111,.11); border-radius: .55rem; font-size: .68rem; font-weight: 750;
  transition: background-color .15s ease, transform .15s ease; }
.battv-k-sprung a:hover { background: var(--k-creme); transform: translateY(-1px); }
.battv-k .battv-k-sprung a::after { font-size: .75rem; }
@media (max-width: 519.98px) { .battv-k-sprung { display: flex !important; } }

/* ---- V1.10: viele Kontaktzeilen nebeneinander statt untereinander -------- */
.battv-k-person .battv-k-kontakt, .battv-k-karte--foto .battv-k-kontakt {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(195px, 1fr)); column-gap: .9rem; row-gap: .3rem; align-items: start; }
@media (max-width: 519.98px) {
  .battv-k-person .battv-k-kontakt, .battv-k-karte--foto .battv-k-kontakt { grid-template-columns: 1fr; }
}
.battv-k-kontakt .battv-k-zeile--hinweis { grid-column: 1 / -1; }

/* ---- V1.12: Funktionen zweispaltig (ab 3 Funktionen, gleiche Spalten wie Kontakte) ---- */
.battv-k-person .battv-k-funktionen { display: grid; grid-template-columns: repeat(auto-fill, minmax(195px, 1fr)); column-gap: .9rem; }
@media (max-width: 519.98px) {
  .battv-k-person .battv-k-funktionen { grid-template-columns: 1fr; }
}

/* ---- V1.13: einheitliche Leisten ohne Pfeil -------------------------------- */
.battv-k .battv-k-sprung a::after { content: none !important; display: none !important; }

/* ---- V1.13: Gremien als leicht gerahmte Fläche ----------------------------- */
.battv-k-gremium { margin-top: 1.4rem; padding: 1.15rem 1.2rem 1.25rem; background: rgba(255,255,255,.55);
  border: 1px solid rgba(11,31,58,.08); border-radius: 1rem; box-shadow: 0 .2rem .7rem rgba(11,31,58,.035); }
.battv-k-gremium:first-of-type, .battv-k-sprung + .battv-k-gremium { margin-top: 1rem; }
@media (max-width: 519.98px) { .battv-k-gremium { padding: .9rem .75rem 1rem; } }

/* EV: Satz statt Präsidiums-Kacheln */
.battv-k-verweis { display: flex; gap: .55rem; align-items: flex-start; margin: .2rem 0 1rem; padding: .7rem .85rem;
  color: var(--k-leise); background: var(--k-hell); border-radius: .7rem; font-size: .76rem; line-height: 1.5; }
.battv-k-verweis strong { color: var(--k-text); }
.battv-k-verweis .battv-k-ico { flex: 0 0 auto; }

/* Lightbox */
.battv-k .battv-k-foto { cursor: zoom-in; }
.battv-k .battv-k-foto:focus-visible { outline: 3px solid rgba(233,139,0,.45); outline-offset: 2px; }
.battv-k-lb { position: fixed; inset: 0; z-index: 10000; display: none; align-items: center; justify-content: center;
  padding: 1.5rem; background: rgba(11,31,58,.82); cursor: zoom-out; }
.battv-k-lb.ist-offen { display: flex; }
.battv-k-lb figure { margin: 0; text-align: center; cursor: default; }
.battv-k-lb img { display: block; max-width: min(92vw, 640px); max-height: 82vh; width: auto; height: auto;
  border-radius: .9rem; box-shadow: 0 1rem 3rem rgba(0,0,0,.35); background: #fff; }
.battv-k-lb figcaption { margin-top: .7rem; color: #fff; font: 700 .95rem/1.3 inherit; font-family: inherit; }
.battv-k-lb-zu { position: absolute; top: 1rem; right: 1rem; width: 44px; height: 44px; margin: 0; padding: 0;
  color: #0b1f3a; background: #f5b400; border: 0; border-radius: 50%; font-size: 1.6rem; line-height: 1; cursor: pointer; }
