/* ============================================================
   plate_experts — Experten-Detailseite. Gescoped auf `.plx-expert-detail`.
   Farben/Fonts NUR über CSS-Variablen var(--lr-<token>, <fallback>).
   KEINE Heading-Typo (font-family/-size) an h*.
   ============================================================ */
.plx-expert-detail {
  --plx-ivory-deep:  var(--lr-ivory-deep, #ECE6DB);
  --plx-stone:       var(--lr-stone, #D9CBB8);
  --plx-bronze-deep: var(--lr-bronze-deep, #9C8255);
  --plx-ink:         var(--lr-ink, #2D2D2D);
  --plx-ink-soft:    var(--lr-ink-soft, rgba(45, 45, 45, 0.70));
  --plx-forest:      var(--lr-forest, #4B524C);
  --plx-line:        var(--lr-line, rgba(45, 45, 45, 0.14));
  --plx-font-display: var(--lr-font-display, "Cormorant Garamond", "Times New Roman", serif);
  /* Inhaltsbreite = die des generischen .frame-container. Das Partial rendert
     auch in Theme-Templates ohne eigenes Container-Markup, muss die Frame-Box
     also selbst nachbilden — mit denselben Quellen, damit die linke Kante mit
     dem uebrigen Seiteninhalt und dem Seitenkopf fluchtet. Fallbacks fuer
     Installationen ohne plate_bootstrap. Eine EIGENE Breite hier waere eine
     zweite Breitenquelle (harte Regel im Workspace).
     Zeilenlaengen gehoeren an die Text-Bloecke (rem/ch), nicht hierher. */
  max-width: var(--frame-width-xxl, 1380px);
  margin-inline: auto;
  padding-inline: var(--bs-gap-default, 1.5rem);
}

/* ---------- Kopf: FALLBACK, nicht Regelfall ----------------------------------
   Rendert ausschliesslich, wenn der Aufrufer `showHead=1` uebergibt — also auf
   Installationen OHNE eigenen Theme-Seitenkopf. Wo ein Theme seinen Kopf selbst
   liefert (`showHead=0`), existiert dieses Markup gar nicht; die Regeln hier
   duerfen deshalb NIE gegen einen Theme-Kopf arbeiten.
   Er ist bewusst KEIN randabfallender Medien-Hero — dafuer gibt es den
   generischen Vertrag `pl-pagehero` (EXT:plate_partials/.../Organisms/PageHero) —,
   sondern ein Kopf INNERHALB der Inhaltsbreite:
     - KEINE eigene Inhaltsbreite / kein Seiten-Padding (zweite Breitenquelle);
       die Box liefert das Wurzel-Element als Nachbildung des .frame-container,
     - KEINE Heading-Typo (font-family/-size an h*) — die gehoert dem Theme bzw.
       den plate_bootstrap-Settings-Slots (h1-font-size …).
   ---------------------------------------------------------------------------- */
.plx-expert-detail__hero {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: clamp(1.6rem, 4vw, 4rem);
  align-items: center;
  padding-block: clamp(2rem, 5vw, 4rem);
}
@media (max-width: 720px) {
  .plx-expert-detail__hero { grid-template-columns: 1fr; }
}

.plx-expert-detail__eyebrow {
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.72rem;
  color: var(--plx-bronze-deep);
  margin-bottom: 0.8rem;
}
.plx-expert-detail__name { margin: 0 0 0.6rem; color: var(--plx-ink); }
.plx-expert-detail__specialty {
  margin: 0;
  font-size: 1.1rem;
  color: var(--plx-ink-soft);
}
.plx-expert-detail__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 1.2rem;
}

.plx-expert-detail__photo {
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.plx-expert-detail__avatar {
  aspect-ratio: 1 / 1;
  background: var(--plx-stone);
  display: grid;
  place-items: center;
}
.plx-expert-detail__avatar .plx-ini {
  font-family: var(--plx-font-display);
  font-weight: 300;
  font-size: clamp(3rem, 10vw, 5rem);
  color: var(--plx-forest);
}

.plx-expert-detail__body {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: clamp(1.6rem, 4vw, 3.5rem);
  padding-block: clamp(1.5rem, 4vw, 3rem);
}
@media (max-width: 720px) {
  .plx-expert-detail__body { grid-template-columns: 1fr; }
}
.plx-expert-detail__bio { color: var(--plx-ink); }
.plx-expert-detail__meta { color: var(--plx-ink-soft); }
.plx-expert-detail__meta-title {
  margin: 0 0 0.5rem;
  color: var(--plx-ink);
}
.plx-expert-detail__contact + .plx-expert-detail__memberships { margin-top: 1.6rem; }
.plx-expert-detail__contact a { color: var(--plx-bronze-deep); }

.plx-expert-detail .plx-e-tag {
  font-size: 0.68rem;
  letter-spacing: 0.06em;
  padding: 0.18rem 0.6rem;
  border: 1px solid var(--plx-line);
  border-radius: 999px;
  color: var(--plx-ink-soft);
}