.header-img {width: 100%;height: 240px;object-fit: cover; object-position: 50% 40%;}
@media (max-width: 900px){.header-img {object-position: 50% 43%;}}

#verein-ueber, #verein-vorstand, #verein-abteilungen {
  padding: 2rem 1rem;
  border-radius: 12px;
  margin-bottom: 4rem;
}

/* Block 1: Über den Verein */
.about-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:2rem;align-items:center}
.about-image{border-radius:10px;overflow:hidden;box-shadow:0 8px 24px rgba(0,0,0,.06)}
.about-image img{display:block;width:100%;height:auto}
@media (max-width:900px){.about-grid{grid-template-columns:1fr}}

/* Block 2: Vorstand & Ansprechpartner */
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.card{background:#fff;border:1px solid #e9e9e9;border-radius:10px;padding:1rem 1.2rem;box-shadow:0 3px 10px rgba(0,0,0,.03)}
.card h3{font-size:1.05rem;margin-bottom:.25rem}
.card .role{font-size:.9rem;color:var(--primary-dark);margin-bottom:.35rem}
.card .meta{font-size:.85rem;color:var(--text-muted)}
.card a{color:var(--primary-dark);text-decoration:none}
.card a:hover{text-decoration:underline}
.card .photo {
  width: 80%;
  aspect-ratio: 1 / 1;
  border-radius: 8px;
  overflow: hidden;
  margin: 0.7rem auto;
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}

.card .photo img {width: 100%;height: 100%;object-fit: cover;display: block;}

@media (max-width:1024px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.cards{grid-template-columns:1fr}}

/* Block 3: Abteilungen */
.depts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:.5rem}
.dept{background:#fff;border:1px solid #e9e9e9;border-radius:10px;padding:1rem 1.2rem;box-shadow:0 3px 10px rgba(0,0,0,.03);display:flex;flex-direction:column;gap:.5rem}
.dept h3{font-size:1rem}
.dept p{font-size:.92rem;color:var(--text)}
.dept a{margin-top:auto;font-weight:600;font-size:.9rem;color:var(--primary-dark);text-decoration:none}
.dept a:hover{text-decoration:underline}
@media (max-width:1024px){.depts{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.depts{grid-template-columns:1fr}}

/* Bilderfluid in Texten (falls gesetzt) */
figure[class^="fig_aktuell_"] img{width:100%;height:auto;display:block}

