/* ============================================================
   BKS24 Redesign — People / Committee Grid (person-card)
   Quelle: Beirat #4381, Präsidium #4373, Advisory Board #7947,
   Executive Committee & Office #7957. Reihe aus Foto + Name + Rolle + Bio.
   ALLE Regeln unter .bks-rd gescoped (Vertrag §6).
   Nutzt Bestands-Tokens aus redesign.css (--hairline, --bks-blue, --grey-*).
   ============================================================ */

.bks-rd .people-grid { align-items: stretch; }

.bks-rd .person-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 0;
}

/* Portrait — feste 4:5-Bühne, deckt Platzhalter wie auch echte Bilder ab */
.bks-rd .person-card__photo {
  aspect-ratio: 3 / 2;
  width: 100%;
  background: var(--bks-blue-050);
  position: relative;
  overflow: hidden;
}
.bks-rd .person-card__photo img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}
/* Wenn die Seite ein echtes wp:image als Foto einsetzt (figure direkt im
   person-card statt der .photo-Bühne) — gleiche Optik erzwingen. */
.bks-rd .person-card > figure.wp-block-image {
  margin: 0;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: var(--bks-blue-050);
}
.bks-rd .person-card > figure.wp-block-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

.bks-rd .person-card__body {
  padding: 26px 28px 30px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.bks-rd .person-card__name {
  font-size: 20px;
  line-height: 1.25;
  color: var(--ink);
  margin: 0 0 4px;
}
.bks-rd .person-card:hover .person-card__name { color: var(--bks-blue); }

.bks-rd .person-card__role {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--bks-blue);
  margin: 0;
}

.bks-rd .person-card__rule {
  width: 30px;
  height: 2px;
  background: var(--bks-blue);
  margin: 16px 0 18px;
}

.bks-rd .person-card__bio {
  font-size: 15px;
  line-height: 1.6;
  color: var(--grey-700);
  margin: 0;
}

/* Direkte Kontaktzeile (Geschäftsstelle) — bottom-aligned über Karten hinweg.
   Mail entity-kodiert (antispambot) im href, kein Klartext im Quelltext. */
.bks-rd .person-card__contact {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: auto;
  padding-top: 18px;
}
.bks-rd .person-card__contact a {
  font-size: 14px;
  font-weight: 600;
  color: var(--bks-blue);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
}
.bks-rd .person-card__contact a span { overflow-wrap: anywhere; }
.bks-rd .person-card__contact a:hover { color: #b8470f; text-decoration: underline; }
.bks-rd .person-card__contact a:focus-visible { outline: 2px solid rgba(232,106,42,.55); outline-offset: 2px; }
.bks-rd .person-card__contact svg { width: 15px; height: 15px; flex: none; }

/* Office / address line variant — short people without a long bio */
.bks-rd .person-card--compact .person-card__photo { aspect-ratio: 1 / 1; }
.bks-rd .person-card--compact .person-card__bio { font-size: 14px; }

/* Two-up dichtere Variante (Vorstand-Reihe) — Querformat-Fotos, kein Beschnitt */
.bks-rd .people-grid.grid-2 .person-card__photo,
.bks-rd .people-grid.grid-2 .person-card > figure.wp-block-image { aspect-ratio: 3 / 2; }

@media (max-width: 880px) {
  .bks-rd .people-grid.grid-3,
  .bks-rd .people-grid.grid-2 { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 560px) {
  .bks-rd .people-grid.grid-3,
  .bks-rd .people-grid.grid-2 { grid-template-columns: 1fr; }
}

/* Raumfoto (Geschäftsstelle): Hochformat – Ausschnitt nach unten, damit der Tisch sichtbar ist. */
.bks-rd .person-card > figure.wp-block-image.office-room img { object-position: center 58%; }

/* NPL FORUM (#5064): die FS-Forum-Speakerporträts sind quadratisch (500×500).
   Im 3:2-Querformat-Standard werden Köpfe oben/seitlich angeschnitten – hier
   1:1 zeigen, dann sitzt der volle Kopf im Bild. */
.page-id-5064 .bks-rd .person-card > figure.wp-block-image { aspect-ratio: 1 / 1; }
.page-id-5064 .bks-rd .person-card > figure.wp-block-image img { object-position: center center; }
