/* arzt-gemein.css – Bau 21 (20.10.2026): gemeinsame Bausteine der drei Arzt-Muster A/B/C.
   Nach site.css, kopf.css und seiten.css geladen. Eigene Klassen az-…, damit nichts mit alten Regeln kämpft.
   Farben: Ärzte = Weiß. Beere nur für „Patient melden“, die Linie bei der Wundversorgung und den Arzt-Wegweiser.
   Keine rosa Flächen. */

.arzt20{--rand-patient:#D3C3A5;--rand-arzt:#A3264B;--rand-klinik:#9FB8C8;--rand-pflege:#B99E6E;
  --flaeche-patient:#F4EFE6;--flaeche-klinik:#EAF1F5;--flaeche-pflege:#EAE1D1}

/* ---------- Muster-Schild (nur zum Vergleichen) ---------- */
.muster-schild{background:#3B3B39;color:#fff;font:400 .88rem/1.3 var(--font-body)}
.muster-schild .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1rem;min-height:40px;padding-top:.3rem;padding-bottom:.3rem}
.muster-schild strong{color:#fff;font:700 .95rem/1 var(--font-head);letter-spacing:.02em}
.muster-schild__wahl{display:flex;gap:.35rem}
.muster-schild a{display:inline-grid;place-items:center;min-width:2.2rem;min-height:28px;padding:0 .5rem;border:1px solid rgba(255,255,255,.55);border-radius:4px;color:#fff;font:700 .95rem/1 var(--font-head);text-decoration:none}
.muster-schild a:hover{background:rgba(255,255,255,.15);color:#fff}
.muster-schild a[aria-current]{background:#fff;color:#262625;border-color:#fff}
.muster-schild__satz{color:#D8D8D4;font-size:.82rem}
@media (max-width:600px){.muster-schild__satz{display:none}}

/* ---------- Brotkrumen + Wegweiser „Für wen?“ ---------- */
.az-pfad{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem 2rem;padding-top:1.1rem;padding-bottom:.4rem}
.arzt20 .az-pfad .brotkrumen{margin:0;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:.25rem}
.az-wege{display:flex;align-items:center;gap:.7rem}
.az-wege__titel{margin:0;font:600 .9rem/1.2 var(--font-head);color:var(--c-mute);white-space:nowrap}
.arzt20 .az-wege ul{list-style:none;margin:0;padding:0;display:flex;gap:.45rem;max-width:none}
.arzt20 .az-wege li{margin:0;padding:0;max-width:none}
.az-weg{--rand:var(--c-line);display:flex;flex-direction:column;align-items:center;gap:.2rem;width:5.4rem;padding:.4rem .25rem .35rem;
  background:#fff;border:1.5px solid var(--rand);border-radius:8px;text-decoration:none;color:var(--c-fg);font:700 .86rem/1.15 var(--font-head);
  transition:background-color .15s,box-shadow .15s}
.az-weg img{width:46px;height:46px;border-radius:6px;object-fit:cover;background:#fff}
.az-weg--patient{--rand:var(--rand-patient);--hell:var(--flaeche-patient)}
.az-weg--arzt{--rand:var(--rand-arzt);--hell:#fff}
.az-weg--klinik{--rand:var(--rand-klinik);--hell:var(--flaeche-klinik)}
.az-weg--pflege{--rand:var(--rand-pflege);--hell:var(--flaeche-pflege)}
.az-weg:hover{background:var(--hell);color:var(--c-fg);box-shadow:0 0 0 1px var(--rand)}
.az-weg[aria-current]{box-shadow:0 0 0 1.5px var(--rand);border-width:1.5px}
.az-weg[aria-current] span{color:var(--c-fg)}

/* ---------- Kopf: Überschrift links, Wundmappe rechts ---------- */
.az-kopf{padding:clamp(1rem,2vw,1.6rem) 0 clamp(1.8rem,3vw,2.6rem)}
.az-kopf__in{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:clamp(2rem,6vw,6rem);align-items:center}
.arzt20 .az-kopf h1{font-size:clamp(2.1rem,1.3rem + 2.7vw,3.7rem);line-height:1.06;max-width:16ch;margin:0 0 1.2rem;letter-spacing:-.01em}
.arzt20 .az-kopf .lead{font-size:clamp(1.12rem,1rem + .35vw,1.3rem);margin:0 0 1.1rem;max-width:30em}
.arzt20 .az-merksatz{margin:0;max-width:none;border-left:3px solid var(--c-green);padding:.15rem 0 .15rem 1rem;font:600 1.12rem/1.4 var(--font-body);color:var(--c-fg)}
.arzt20 .az-knoepfe{display:flex;flex-wrap:wrap;gap:.75rem;margin:1.8rem 0 0;max-width:none}
.az-knoepfe .btn{min-height:54px;padding-left:1.5rem;padding-right:1.5rem;font-size:1.05rem}
.az-mappe{width:clamp(220px,25vw,350px);margin:0}
.az-mappe__a{display:block;text-decoration:none;color:var(--c-link)}
.arzt20 .az-mappe img{width:100%;height:auto;border:1px solid var(--c-line);border-radius:3px;box-shadow:0 12px 30px rgba(38,38,37,.12);background:#fff}
.az-mappe__hinweis{display:inline-flex;align-items:center;gap:.4rem;margin-top:.8rem;font:600 1rem/1.3 var(--font-body);color:var(--c-link)}
.az-mappe__hinweis::before{content:"";width:1.05em;height:1.05em;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5M11 8v6M8 11h6'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5M11 8v6M8 11h6'/%3E%3C/svg%3E") center/contain no-repeat}
.az-mappe__a:hover .az-mappe__hinweis{text-decoration:underline}
.az-rest{display:none!important}

/* ---------- Kontaktzeile ---------- */
.arzt20 .az-fakten{display:flex;flex-wrap:wrap;gap:.8rem clamp(1.5rem,4vw,3.5rem);margin:0;padding:1rem 0;border-top:1px solid var(--c-green);border-bottom:1px solid var(--c-line)}
.arzt20 .az-fakten>div{margin:0;min-width:0}
.arzt20 .az-fakten dt{margin:0 0 .1rem;font:400 .85rem/1.3 var(--font-body);color:var(--c-mute)}
.arzt20 .az-fakten dd{margin:0;font:600 1.05rem/1.4 var(--font-body);color:var(--c-fg);max-width:none}
.arzt20 .az-fakten dd a{color:var(--c-green-strong)}
.arzt20 .az-fakten .zeiten{display:flex;gap:0 1rem;flex-wrap:wrap;font-weight:400}
.arzt20 .az-fakten .zeiten abbr{min-width:0;margin-right:.35rem}

/* ---------- Abschnitte ---------- */
.arzt20 .fach-abschnitt.az-abschnitt{padding-top:clamp(2.5rem,4vw,3.75rem);padding-bottom:clamp(2.5rem,4vw,3.75rem)}
.arzt20 .az-abschnitt>.wrap>p,.arzt20 .az-abschnitt>p{max-width:40em}
.arzt20 .fach-abschnitt.az-abschnitt:not(.flaeche){background:#fff}

/* ---------- Strukturierte Wundversorgung: kurz, Beere-Linie ---------- */
.az-wunde{border-left:4px solid var(--c-berry);padding:.1rem 0 .1rem clamp(1rem,2vw,1.6rem)}
.arzt20 .az-wunde__titel{margin:0 0 .5rem;color:var(--c-fg);font-size:clamp(1.45rem,1.2rem + 1vw,2rem)}
.arzt20 .az-wunde__satz{margin:0;max-width:44em;font-size:1.08rem}
.az-wunde__klappen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem 1rem;align-items:start;margin-top:1rem;max-width:56rem}
.arzt20 .az-wunde__mehr{margin:0}
.arzt20 .az-wunde__mehr .punkte{margin-bottom:0}
@media (max-width:760px){.az-wunde__klappen{grid-template-columns:minmax(0,1fr)}}

/* ---------- Klappen-Zeilen (Therapien, in A auch „So melden“) ---------- */
.az-zeilen{border-top:1px solid var(--c-line)}
.az-zeile{border-bottom:1px solid var(--c-line)}
.az-zeile>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:1rem;min-height:64px;padding:.9rem .4rem .9rem 0}
.az-zeile>summary::-webkit-details-marker{display:none}
.az-zeile>summary::after{content:"";flex:none;margin-left:auto;width:11px;height:11px;border-right:2px solid var(--c-green);border-bottom:2px solid var(--c-green);transform:translateY(-3px) rotate(45deg);transition:transform .2s var(--ease)}
.az-zeile[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
.az-zeile>summary:hover .az-zeile__titel{color:var(--c-green-strong)}
.arzt20 .az-zeile__titel{display:flex;align-items:center;gap:.7rem;margin:0;font-size:clamp(1.15rem,1.05rem + .35vw,1.35rem);color:var(--c-fg)}
.arzt20 .az-zeile__titel .anker{position:absolute}
.az-zeile__titel .icon{color:var(--c-green);width:1.15em;height:1.15em}
.az-zeile__inhalt{padding:0 0 1.6rem calc(1.15em + .7rem)}
.arzt20 .az-zeile__inhalt>p{max-width:44em}
.az-verordnen{margin-top:1rem;max-width:46rem;background:var(--c-tint);border-radius:4px;padding:.9rem 1.2rem .3rem}
.arzt20 .az-verordnen__titel{margin:0 0 .5rem;font:700 1.05rem/1.3 var(--font-head);color:var(--c-green-strong)}
.arzt20 .az-verordnen .punkte li{max-width:none}
@media (max-width:600px){.az-zeile__inhalt{padding-left:0}}

/* ---------- Schritte „So melden Sie“ ---------- */
.az-schritte{list-style:none;margin:0;padding:0;counter-reset:schritt;max-width:none}
.arzt20 .az-schritte>li{counter-increment:schritt;position:relative;margin:0;max-width:none}
.az-schritte>li::before{content:counter(schritt);display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--c-green);color:#fff;font:700 1.05rem/1 var(--font-head)}
.arzt20 .az-schritte h3,.arzt20 .az-schritte h4{margin:.6rem 0 .35rem;font:700 1.12rem/1.3 var(--font-head);color:var(--c-fg)}
.arzt20 .az-schritte p{margin:0;max-width:40em}
/* „Mehr“ in den Schritten */
.az-mehr>summary{list-style:none;display:inline-flex;align-items:center;gap:.35rem;min-height:44px;cursor:pointer;font:600 .95rem/1.2 var(--font-body);color:var(--c-link)}
.az-mehr>summary::-webkit-details-marker{display:none}
.az-mehr>summary::after{content:"+";font:700 1.15rem/1 var(--font-head)}
.az-mehr[open]>summary::after{content:"–"}
.arzt20 .az-mehr p{font-size:.98rem;padding-bottom:.3rem}

/* ---------- Unterlagen-Karten (Grundform: Zeile mit kleinem Blatt links) ---------- */
.arzt20 .az-karten{list-style:none;margin:0;padding:0;display:grid;gap:.75rem;max-width:none}
.arzt20 .az-karte{margin:0;padding:0;max-width:none;background:#fff;border:1px solid var(--c-line);border-top:2px solid var(--c-green);border-radius:4px;display:flex;flex-direction:column}
.az-karte__a{display:grid;align-content:start;grid-template-columns:72px minmax(0,1fr);gap:.9rem;align-items:center;padding:.8rem .9rem;text-decoration:none;color:var(--c-text);flex:1}
.az-karte__bild{display:grid;place-items:center;height:80px}
.arzt20 .az-karte__bild img{max-width:100%;max-height:80px;width:auto;height:auto;border:1px solid var(--c-line);border-radius:2px;box-shadow:0 3px 10px rgba(38,38,37,.12);transform:none}
.az-karte__text{display:flex;flex-direction:column;gap:.1rem;min-width:0}
.az-karte__titel{font:700 1.1rem/1.2 var(--font-head);color:var(--c-fg)}
.az-karte__wofuer{font-size:.93rem;line-height:1.35;color:var(--c-text)}
.az-karte__tun{margin-top:.3rem;font:600 .95rem/1.3 var(--font-body);color:var(--c-link)}
.az-karte__a:hover .az-karte__tun{text-decoration:underline}
.az-karte__a:hover .az-karte__titel{color:var(--c-green-strong)}
.az-karte__zweit{display:block;padding:.6rem .9rem;border-top:1px solid var(--c-line);font:600 .92rem/1.3 var(--font-body);color:var(--c-link);text-decoration:none}
.az-karte__zweit:hover{text-decoration:underline;background:var(--c-tint)}
.arzt20 .az-karte__hinweis{margin:0;padding:.55rem .9rem .7rem;border-top:1px solid var(--c-line);font-size:.84rem;line-height:1.4;color:var(--c-mute);max-width:none}

/* ---------- Team: Fotos präsenter ---------- */
@media (min-width:1100px){.arzt20 .az-team .pk-liste{--pk-b:190px}.arzt20 .az-team .pk__name{font-size:1.25rem}.arzt20 .az-team .pk__quali>li{font-size:.95rem}}

/* ---------- Handy ---------- */
@media (max-width:760px){
  .az-pfad{flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:.7rem;padding-top:.8rem}
  .az-pfad>*{min-width:0}
  .arzt20 .az-pfad .brotkrumen{flex-direction:row;align-items:center;justify-content:space-between}
  .az-wege__titel{display:none}
  .arzt20 .az-wege ul{width:100%}
  .arzt20 .az-wege li{flex:1 1 0;min-width:0}
  .az-weg{width:100%;font-size:.8rem;padding:.35rem .15rem .3rem}
  .az-weg img{width:40px;height:40px}
  /* Kopf: Überschrift und Mappe nebeneinander, Rest darunter */
  .az-kopf__in{grid-template-columns:minmax(0,1fr) 108px;column-gap:1rem;align-items:start}
  .az-kopf__text{display:contents}
  .arzt20 .az-kopf h1{grid-column:1;grid-row:1;font-size:clamp(1.85rem,1.2rem + 3vw,2.3rem);margin-bottom:.8rem;align-self:center}
  .az-mappe{grid-column:2;grid-row:1;width:108px}
  .az-mappe__hinweis{font-size:.82rem;margin-top:.45rem;line-height:1.2}
  .arzt20 .az-kopf .lead,.arzt20 .az-merksatz,.arzt20 .az-knoepfe{grid-column:1/-1}
  .arzt20 .az-kopf .lead{margin-top:.6rem}
  .arzt20 .az-knoepfe{margin-top:1.2rem}
  .az-knoepfe .btn{flex:1 1 100%}
  .arzt20 .az-fakten{display:grid;grid-template-columns:1fr 1fr;gap:.8rem 1rem}
  .arzt20 .az-fakten dd{font-size:1rem}
  .arzt20 .az-fakten .zeiten{display:block}
  .arzt20 .az-fakten .zeiten>span{display:block}
  .arzt20 .az-fakten .zeiten>span>*{display:inline-block}
}
@media (prefers-reduced-motion:reduce){.az-zeile>summary::after,.az-weg{transition:none}}
