/* =========================================================================
   seite-ueber.css  --  Anordnung von /ueber-mich (Umbau R4, E9): Stevens
   Block wie m156-checkliste-landingpage-p4 (Karte mit Foto, Kontakt
   darunter), Platzhalter fuer seinen Text, Google-Bewertungen (Schalter).
   Nur Tokens aus theme.css. R6 (2026-10-27): Stevens Foto steven-tablet im
   Kopf (partials/page-head mit side, am Desktop rechts), steven-telefon in
   der Karte; Gesicht im oberen Drittel, deshalb object-position oben.
   ========================================================================= */
.ueber-person .person-karte__bild img { object-position: 50% 22%; }
/* Kopffoto steven-tablet entfernt (R7 am Handy, 2026-10-29 auch am Desktop: «Das ober foto weg») */
@media (max-width: 63.99rem) { .ueber-person .person-karte { max-width: 62rem; } }
@media (min-width: 64rem) { .ueber-person .person-karte { grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr); gap: 3rem; } }
.person-karte__inhalt { padding: 0 0.25rem 0.5rem; }
.ueber-person__kontakt { margin-top: 1.5rem; }
@media (min-width: 48rem) {
  .ueber-person .person-karte { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 2rem; align-items: center; padding: 1.25rem; }
  .ueber-person .person-karte__bild img, .ueber-person .person-karte__bild .foto-platzhalter { aspect-ratio: 4 / 5; }
  .ueber-person .person-karte__name { margin-top: 0; }
  .ueber-person__kontakt { display: flex; flex-wrap: wrap; gap: 0.25rem 2.5rem; }
}

/* Google-Bewertungen (partials/bewertungen, erst ab einer Bewertung) */
.bewertungen { margin-top: var(--pad-eng); }
.bewertungen__title { color: var(--marine); font: 800 var(--fs-h3)/1.3 var(--font-titel); }
.bewertungen__gesamt { margin-top: 0.25rem; color: var(--text-2); }
.bewertungen__liste { display: grid; gap: var(--gap); margin: 1.25rem 0 1rem; padding: 0; list-style: none; }
@media (min-width: 48rem) { .bewertungen__liste { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.bewertung { display: grid; gap: 1rem; align-content: space-between; padding: 1.25rem; border-radius: var(--r-karte); background: var(--weiss); box-shadow: var(--schatten); }
.bewertung__text { color: var(--marine); }
.bewertung__wer { display: flex; align-items: center; gap: 0.75rem; font-weight: 600; }
.bewertung__bild { width: 2.5rem; height: 2.5rem; border-radius: 50%; }
.bewertung__zeit { display: block; color: var(--text-2); font-size: var(--fs-klein); font-weight: 400; }
