/* seiten.css – Bau 19 (20.10.2026): eigene Regeln für die Seiten, NACH site.css und kopf.css geladen.
   site.css bleibt unverändert. Eigene Klassen (pk-…, mk-…, …), damit nichts mit den alten Regeln kämpft. */

/* ============ A1/A2 Porträtkarte – EINE Regel für alle Personenkästen ============
   Foto links, Text rechts, Person schaut nach rechts (Fassung *-rechts-*) – also zum Text.
   Bild im Format 4:5, unten bündig an der Kartenkante (Büste), oberer Leerraum der Datei abgeschnitten.
   Keine grüne Bildfläche, nichts angeschnitten, Karte so hoch wie Foto bzw. Text. */
.pk-liste{--pk-b:120px;list-style:none;margin:var(--s3) 0;padding:0;display:grid;gap:1rem;grid-template-columns:minmax(0,1fr);max-width:none}
.pk-liste>li.pk{display:grid;grid-template-columns:var(--pk-b) minmax(0,1fr);column-gap:1rem;align-items:center;margin:0;padding:0;max-width:none;
  background:#fff;border:1px solid var(--c-line);border-top:4px solid var(--c-light);border-radius:var(--r);overflow:hidden;min-height:calc(var(--pk-b) * 1.25)}
.seite-fach .pk-liste>li.pk{border-top:2px solid var(--c-green)}
.pk-liste .pk__bild{grid-column:1;grid-row:1;align-self:end;display:block;width:100%;height:auto;max-width:none;margin:0;padding:0;
  aspect-ratio:4/5;object-fit:cover;object-position:50% 100%;background:transparent;border-radius:0}
/* Haarknoten (Katja) und hoher Scheitel (Ramona): etwas weiter oben ansetzen, damit nichts abgeschnitten wird */
.pk-liste .pk__bild[src*="katja"]{object-position:50% 18%}
.pk-liste .pk__bild[src*="ramona"]{object-position:50% 80%}
.pk-liste .pk__bild--frei{object-position:50% 100%}
.pk__text{grid-column:2;grid-row:1;padding:.85rem 1rem .85rem 0;min-width:0}
.pk__name{font:700 1.08rem/1.25 var(--font-head);color:var(--c-green);margin:0 0 .3rem;min-height:0;height:auto;hyphens:manual;letter-spacing:0}
.pk__name *{font:inherit;color:inherit}
.pk__rolle{margin:0 0 .2rem;font-size:.92rem;line-height:1.4;color:var(--c-text)}
.pk__quali{list-style:none;margin:0;padding:0}
.pk__quali>li{margin:0 0 .15rem;padding:0;font:600 .88rem/1.4 var(--font-head);color:var(--c-green-strong);max-width:none}
.pk__quali>li::before{content:none;display:none}
.pk__extra{margin-top:.45rem}
.pk__extra p{margin:0;font-size:.88rem}
@media (min-width:700px){
  .pk-liste{--pk-b:150px;grid-template-columns:repeat(2,minmax(0,1fr))}
  .pk-liste--eins{grid-template-columns:minmax(0,30rem)}
  .pk__name{font-size:1.15rem}
}
@media (min-width:1100px){.pk-liste{--pk-b:160px}}
/* Kliniken „Ihre Ansprechpartnerin“: Karte links, Text rechts */
@media (min-width:900px){
  .abschnitt:has(>.pk-liste--eins){display:grid;grid-template-columns:minmax(0,26rem) minmax(0,1fr);column-gap:var(--s4);align-items:start}
  .abschnitt:has(>.pk-liste--eins)>*{grid-column:2}
  .abschnitt:has(>.pk-liste--eins)>h2{grid-column:1/-1}
  .abschnitt:has(>.pk-liste--eins)>.pk-liste--eins{grid-column:1;grid-row:2/span 6;margin:0;grid-template-columns:minmax(0,1fr)}
  .abschnitt:has(>.pk-liste--eins)>.pk-liste--eins+*{margin-top:0}
}
/* Team „An der Spitze“ im Seitenkopf */
.kopf-spitze .pk-liste{margin:0}
/* Palliativ „Sie erreichen uns“: zwei gleich gebaute Karten */
.pk-liste--zwei{margin-top:0}
.pk-liste--zwei+.kontaktkarte{margin-top:var(--s3)}

/* Personen im Seitenkopf (Leistungen, Wundversorgung): gleicher Bildschnitt 4:5, alle Ecken gleich */
.seitenkopf .kopfperson__eins img{aspect-ratio:4/5!important;height:auto!important;object-fit:cover!important;object-position:50% 100%!important;border-radius:var(--r)!important;background:transparent!important}
.seitenkopf .kopfperson__eins img[src*="ramona"]{object-position:50% 80%!important}
.seitenkopf .kopfperson__eins figcaption{padding-top:calc(var(--kb) * 1.25 * .25)!important}
/* Arzt „Lernen wir uns kennen“: Sandy im selben Schnitt */
#rueckruf .sandy .sandy__bild{display:block;width:100%;max-width:168px;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 100%;padding:0!important;background:transparent!important;border-radius:var(--r)}

/* ============ A3 Kasten „Hier sehen Sie unsere Patientenmappe“ ============
   volle Breite der Spalte, Mappe größer, Satz daneben – kein Loch mehr rechts */
#patientenmappe.mappe-knopf{max-width:none!important;width:100%}
@media (min-width:601px){
  #patientenmappe .mappe-knopf__a{grid-template-columns:auto minmax(0,1fr)!important;grid-template-areas:"titel titel" "bild satz"!important;column-gap:var(--s5)!important;align-items:center!important;align-content:start!important}
  #patientenmappe .mappe-knopf__faecher{zoom:1.4}
  #patientenmappe .mappe-knopf__satz{max-width:34em}
}
/* Arzt-Seite: Kasten steht neben „Zum Herunterladen“ – Mappe groß, Satz darunter */
@media (min-width:901px){
  .melden-unten #patientenmappe .mappe-knopf__a{grid-template-columns:minmax(0,1fr)!important;grid-template-areas:"titel" "bild" "satz"!important;row-gap:var(--s3)!important}
  .melden-unten #patientenmappe .mappe-knopf__faecher{zoom:1.5}
}

/* ============ A5 Doppelte Kontaktblöcke ============
   Am Laptop steht rechts der Kasten „So erreichen Sie uns“. Dann entfällt der zweite Anruf-Block
   (Leistungs-Seiten: „Rufen Sie uns an“ am Ende; Häufige Fragen: Nummer und Zeiten im Kopf).
   Am Handy gibt es den Kasten rechts nicht – dort bleibt der eine Block stehen. */
@media (min-width:1001px){
  .seite-raster:has(>.seitenleiste) .abschnitt--anruf{display:none}
  .seite-raster:has(#h-f1-t):has(>.seitenleiste) .seitenkopf :is(.aktion,.zeiten-zeile){display:none}
}
/* Häufige Fragen: Kasten „Wichtige Kontakte“ mit Abstand zur Fragenliste, Überschrift in Abschnittsgröße */
.fragen+.kasten-ruhig,.abschnitt>.kasten-ruhig{margin-top:var(--s4)}

/* ============ A6 Knöpfe überall gleich: eckig mit kleiner Rundung (wie „Patient melden“, „Überleitungsbogen“) ============ */
main .knopf,main a.knopf,main button.knopf{border-radius:6px!important}

/* ============ B12 Kontakt ============ */
.route-adresse{margin-top:var(--s2)}
.route-adresse .aktion{margin:0 0 .4rem}
.route-adresse .klein{margin:0;max-width:30em}
.abschnitt--notfall{margin-top:0}
.abschnitt--notfall p{margin-bottom:.4rem}

/* ============ B8 Arzt-Seite ============ */
/* Knopf „Wundkonzept ansehen“ im Wund-Abschnitt */
.therapie--wunde .wund-knopf{margin:var(--s2) 0}
/* Kontaktblock oben am Handy kompakt: zwei Spalten statt vier Zeilen untereinander */
@media (max-width:700px){
  .fach-kopf .fakten-zeile{display:grid!important;grid-template-columns:1fr 1fr!important;gap:.9rem 1rem!important;padding:var(--s2) 0!important}
  .fach-kopf .fakten-zeile>div{margin:0!important;padding:0!important;border:0!important;min-width:0}
  .fach-kopf .fakten-zeile dt{margin:0 0 .15rem!important;font-size:.72rem!important;letter-spacing:.04em!important;overflow-wrap:anywhere}
  .fach-kopf .fakten-zeile dd{margin:0!important;font-size:1rem!important;line-height:1.4}
  .fach-kopf .fakten-zeile .trenn-punkt{display:none}
  .fach-kopf .fakten-zeile .fax-link{display:block;font-size:.9rem}
  .fach-kopf .fakten-zeile .zeiten{font-size:.88rem!important;column-gap:.5rem!important}
  .fach-kopf .fakten-zeile .zeiten *{font-size:inherit!important}
}
.seite-arzt .therapien article.therapie--wunde .wund-knopf{grid-column:1;margin:var(--s2) 0 0}
.seite-arzt .therapien article.therapie--wunde>details>.verordnen{grid-column:2;grid-row:1 / span 2}

/* ============ Zusatz (Bertram 14:58): Fließtext der Patientenseiten eine Stufe größer (+1 px) ============
   Nur am <body class="… seite-lesen"> (Patientenseiten). Überschriften, Knöpfe, Kopf und Fuß bleiben unverändert.
   Zeilenhöhe ist in site.css ohne Einheit gesetzt und wächst daher mit. */
.seite-lesen main :is(p,li):not([class]):not(nav *):not(.pk *){font-size:calc(1.0625rem + 1px)}
.seite-lesen main .vorspann p:not([class]){font-size:calc(1.15rem + 1px)}
.seite-lesen main .mehr-dazu__inhalt,.seite-lesen main .frage__antwort{font-size:calc(1rem + 1px)}
.seite-lesen main :is(.mehr-dazu__inhalt,.frage__antwort) :is(p,li):not([class]){font-size:inherit}
.seite-lesen main .vorspann .mehr-dazu__inhalt{font-size:calc(1.15rem + 1px)}
.seite-lesen main .frage__antwort{font-size:calc(1.0625rem + 1px)}
.seite-lesen main .kontakt__rumpf p:not([class]){font-size:calc(.95rem + 1px)}

/* Team: Vorname in Handschrift wie bisher (Bertram: dezent, „kleine Liebelei“) – Nachname normal */
.pk__name.name-hand .vorname{display:block;font-family:var(--font-hand);font-weight:700;font-size:1.65rem;line-height:1.1;color:var(--c-green);transform:rotate(-2deg);transform-origin:left center;margin-bottom:.15rem}
.pk__name.name-hand .nachname{font:700 1.08rem/1.25 var(--font-head)}
/* Handy: Karte ist durch den Text höher als das Foto – Foto füllt die ganze Kartenhöhe, sonst bleibt Leerraum über dem Kopf (A2) */
@media (max-width:699px){
  .pk-liste .pk__bild{align-self:stretch;height:100%;aspect-ratio:auto;min-height:calc(var(--pk-b) * 1.25)}
}