/* Zweit-Entwurf: Trier-Optik (leicht, editorial, Grossbuchstaben) mit Mainzer Daten */

/* Schriften: Cormorant traegt die Ueberschriften, Poppins den Fliesstext.
   Feine Serife in gemischter Schreibweise statt geometrischer Versalien,
   das ist der eigentliche Hebel fuer die weiche, weibliche Wirkung. */
@font-face { font-family: "Lora"; font-weight: 400; font-display: swap; src: url("../schrift/lora-400.woff2") format("woff2"); }
@font-face { font-family: "Lora"; font-weight: 500; font-display: swap; src: url("../schrift/lora-500.woff2") format("woff2"); }
@font-face { font-family: "Cormorant"; font-weight: 400; font-display: swap; src: url("../schrift/cormorant-400.woff2") format("woff2"); }
@font-face { font-family: "Cormorant"; font-weight: 500; font-display: swap; src: url("../schrift/cormorant-500.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 300; font-display: swap; src: url("../schrift/poppins-300.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 400; font-display: swap; src: url("../schrift/poppins-400.woff2") format("woff2"); }
@font-face { font-family: "Poppins"; font-weight: 500; font-display: swap; src: url("../schrift/poppins-500.woff2") format("woff2"); }

/* Bruecke: rund 25 Layoutregeln weiter unten nennen noch "Josefin Sans"
   (Navigation, Knoepfe, Wochentage, Namen). Der Name zeigt jetzt auf
   Poppins, damit keine einzige Layoutzeile angefasst werden muss. */
@font-face { font-family: "Josefin Sans"; font-weight: 300; font-display: swap; src: url("../schrift/poppins-400.woff2") format("woff2"); }
@font-face { font-family: "Josefin Sans"; font-weight: 400; font-display: swap; src: url("../schrift/poppins-500.woff2") format("woff2"); }

/* Farben: gleiche Familie wie die Referenz praxis-szwei.de, deutlich
   kraeftiger gesaettigt. Gemessen nach WCAG 2.1:
     Beere #a80f4e auf Weiss 7,38 zu 1 (vorher #ac3c65 nur 5,85)
     Weisser Text auf Knopf #b81c58 6,28 zu 1 (vorher 4,82)
     Beere auf Rose zart #f0dae4 5,58 zu 1
   Rose zart musste eine Spur heller werden, sonst waere die kraeftigere
   Beere darauf unter die Mindestanforderung von 4,5 zu 1 gefallen. */
:root {
  --creme: #fbf4f7;
  --weiss: #ffffff;
  --rose-block: #b81c58;
  --rose-zart: #f0dae4;
  --beere: #a80f4e;
  --beere-tief: #5a0f2b;
  --ink: #2b0015;
  --ink-soft: #2b0015;
  --linie: rgba(43, 0, 21, 0.16);
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html:focus-within { scroll-behavior: smooth; }
body {
  font-family: "Poppins", "Segoe UI", sans-serif;
  font-weight: 400; color: var(--ink); background: var(--weiss);
  font-size: 16.5px; line-height: 1.8;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
}
h1, h2, h3, h4 {
  font-family: "Cormorant", Georgia, serif;
  font-weight: 500; line-height: 1.24;
  text-transform: none; letter-spacing: 0.005em;
  -webkit-hyphens: manual; hyphens: manual; overflow-wrap: break-word;
  text-wrap: balance;
}
h1, h2, h3 { color: var(--beere); }
img { max-width: 100%; display: block; }
a { color: var(--beere); }
.mitte { max-width: 1140px; margin: 0 auto; padding: 0 24px; }

/* Kopf: schlicht weiss, Logo links, Burger rechts wie Trier */
.t-kopf { position: sticky; top: 0; z-index: 50; background: var(--weiss); border-bottom: 1px solid var(--linie); }
.t-kopf-innen { display: flex; align-items: center; gap: 20px; height: 88px; }
.t-marke { display: flex; align-items: center; gap: 14px; text-decoration: none; color: var(--ink); }
.t-marke img { height: 56px; }
.t-marke b { font-family: "Josefin Sans", sans-serif; font-weight: 400; font-size: 16px; letter-spacing: 0.12em; text-transform: uppercase; display: block; }
.t-marke span { font-size: 11.5px; color: var(--ink-soft); letter-spacing: 0.06em; }
.t-menue { display: flex; gap: 26px; margin-left: auto; }
.t-menue a {
  text-decoration: none; color: var(--ink);
  font-family: "Josefin Sans", sans-serif; font-weight: 400;
  font-size: 13px; letter-spacing: 0.16em; text-transform: uppercase;
  padding: 6px 0; border-bottom: 1px solid transparent; white-space: nowrap;
}
.t-menue a:hover { border-bottom-color: var(--beere); }
.t-burger { display: none; }

/* Schwebende Kontakt-Kreise rechts wie Trier: weiss, dezent */
.t-seitenleiste {
  position: fixed; right: 18px; top: 42%; z-index: 60;   /* immer vor der Kopfzeile (z-index 50) */
  display: flex; flex-direction: column; gap: 12px;
}
.t-seitenleiste a {
  width: 72px; height: 72px; border-radius: 50%;
  background: var(--weiss); color: var(--ink);
  border: 1px solid var(--linie);
  box-shadow: 0 6px 20px rgba(43, 34, 38, 0.10);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  text-decoration: none; text-align: center;
  transition: transform .15s ease, box-shadow .2s ease;
}
.t-seitenleiste a:hover { transform: scale(1.06); box-shadow: 0 10px 26px rgba(43, 34, 38, 0.16); }
.t-seitenleiste svg { width: 26px; height: 26px; }
.t-seitenleiste .mini { font-family: "Josefin Sans", sans-serif; font-size: 8px; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1.3; }
.t-seitenleiste a:not(:first-child) .mini { display: none; }   /* am Rechner nur "Termin buchen" beschriftet */

/* Hero: Collage mit Farbbloecken und Logokarte wie Trier */
.t-collage-zone { background: var(--weiss); padding: 56px 0 40px; position: relative; overflow: hidden; }
.t-wasserzeichen {
  position: absolute; left: -60px; bottom: -40px;
  height: 380px; opacity: 0.10; pointer-events: none;
}
.t-collage {
  position: relative; max-width: 900px; margin: 0 auto;
  display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 54px; gap: 0;
}
.t-block-rose { grid-column: 3 / 11; grid-row: 2 / 9; background: var(--rose-block); }
.t-block-zart { grid-column: 1 / 6; grid-row: 1 / 6; background: var(--rose-zart); }
.t-collage img { width: 100%; height: 100%; object-fit: cover; }
.t-c-links { grid-column: 1 / 4; grid-row: 2 / 8; z-index: 2; }
.t-c-rechts { grid-column: 8 / 12; grid-row: 1 / 6; z-index: 2; }
.t-c-unten { grid-column: 5 / 9; grid-row: 6 / 10; z-index: 2; }
.t-logokarte {
  grid-column: 4 / 8; grid-row: 2 / 6; z-index: 3; min-width: 0;
  background: var(--creme); box-shadow: 0 16px 44px rgba(43, 34, 38, 0.14);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
  padding: 18px; text-align: center;
}
.t-logokarte img { width: 64px; height: auto; object-fit: contain; }
.t-logokarte span {
  font-family: "Josefin Sans", sans-serif; font-weight: 300;
  font-size: 15px; letter-spacing: 0.18em; text-transform: uppercase; line-height: 1.6;
  max-width: 100%; overflow-wrap: break-word;
}
.t-logokarte b { font-weight: 400; display: block; font-size: 17px; }

/* Willkommen: zentrierte Caps wie Trier */
.t-willkommen { text-align: center; padding: 48px 0 72px; }
.t-willkommen h1 { font-size: clamp(24px, 3vw, 36px); max-width: 26ch; margin: 0 auto 10px; }
.t-willkommen .gruss {
  font-family: "Josefin Sans", sans-serif; font-weight: 300;
  font-size: clamp(17px, 2vw, 23px); letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--beere); margin-bottom: 28px;
}
.t-willkommen p.text { max-width: 62ch; margin: 0 auto 30px; color: var(--ink-soft); }

/* Trier-Knopf: flacher Rose-Block mit Caps */
.t-knopf {
  display: inline-block; background: var(--rose-block); color: #fff;
  font-family: "Josefin Sans", sans-serif; font-weight: 400;
  font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase;
  text-decoration: none; padding: 16px 34px;
  transition: background .2s ease, color .2s ease;
}
.t-knopf:hover { background: var(--beere-tief); color: #fff; }

/* Abschnitte */
.t-abschnitt { padding: 84px 0; }
.t-abschnitt.creme { background: var(--creme); }
.t-kopfzeile { text-align: center; max-width: 72ch; margin: 0 auto 52px; }
.t-kopfzeile h2 { font-size: clamp(21px, 2.4vw, 29px); margin-bottom: 14px; }
.t-kopfzeile p { color: var(--ink-soft); }

/* Aerztinnen wie Trier mobil: Foto mit versetztem Rahmen, Caps-Name, Blockknopf */
.t-team { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px; max-width: 1020px; margin: 0 auto; }
.t-person { text-align: center; }
.t-person .rahmung { position: relative; margin: 0 auto 26px; max-width: 260px; }
.t-person .rahmung::after {
  content: ""; position: absolute; inset: 14px -14px -14px 14px;
  border: 1px solid var(--rose-block); z-index: 0;
}
.t-person figure { position: relative; z-index: 1; background: var(--rose-zart); aspect-ratio: 3 / 3.4; overflow: hidden; }
.t-person img { width: 100%; height: 100%; object-fit: contain; object-position: bottom; padding-top: 12px; }
.t-person h4 { font-size: 16px; letter-spacing: 0.16em; margin-bottom: 6px; }
.t-person .rolle { font-size: 13.5px; color: var(--ink-soft); display: block; margin-bottom: 16px; }
.t-person .t-knopf { padding: 12px 22px; font-size: 11.5px; }

/* Leistungskarten: Foto, Caps-Titel, mittig sitzendes Plus */
.t-karten { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px; }
.t-karte {
  text-decoration: none; color: var(--ink); background: var(--weiss); position: relative;
  overflow: hidden; box-shadow: 0 6px 18px rgba(43, 0, 21, 0.06);
  transition: box-shadow .35s ease, transform .35s ease;
}
.creme .t-karte { box-shadow: 0 10px 30px rgba(43, 0, 21, 0.08); }
.t-karte img.foto {
  width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
  transition: transform .7s cubic-bezier(0.16, 1, 0.3, 1);
}
.t-karte h4 {
  font-size: 12.5px; letter-spacing: 0.14em; text-align: center;
  padding: 34px 16px 20px; position: relative;
  -webkit-hyphens: auto; hyphens: auto; overflow-wrap: break-word;
  transition: color .25s ease;
}
.t-karte .plus {
  position: absolute; top: -21px; left: 50%;
  width: 42px; height: 42px; border-radius: 50%;
  background: var(--weiss); border: 1px solid var(--linie); color: var(--beere);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 300; line-height: 1;
  box-shadow: 0 4px 14px rgba(43, 0, 21, 0.10);
  transform: translateX(-50%);
  transition: background .25s ease, color .25s ease, border-color .25s ease, transform .35s ease;
}
.t-karte:hover { transform: translateY(-5px); box-shadow: 0 18px 38px rgba(43, 0, 21, 0.15); }
.t-karte:hover img.foto { transform: scale(1.06); }
.t-karte:hover .plus { background: var(--beere); border-color: var(--beere); color: #fff; transform: translateX(-50%) rotate(90deg); }
.t-karte:hover h4 { color: var(--beere); }
.t-karte:focus-visible { outline: 2px solid var(--beere); outline-offset: 3px; }

/* Sanftes Erscheinen beim Scrollen */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .55s ease, transform .55s cubic-bezier(0.16, 1, 0.3, 1); }
.reveal.sichtbar { opacity: 1; transform: none; }

/* Bilder erscheinen langsam und leicht aus der Groesse heraus, einzeln nacheinander */
.reveal-bild { overflow: hidden; }
.reveal-bild img,
.reveal-bild > figure > img,
.reveal-bild > .rahmung figure img {
  opacity: 0; transform: scale(1.07);
  transition: opacity 1.15s ease, transform 1.7s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}
.reveal-bild.sichtbar img,
.reveal-bild.sichtbar > figure > img,
.reveal-bild.sichtbar > .rahmung figure img { opacity: 1; transform: none; }

img.reveal-bild {
  opacity: 0; transform: scale(1.07);
  transition: opacity 1.15s ease, transform 1.7s cubic-bezier(0.16, 1, 0.3, 1);
}
img.reveal-bild.sichtbar { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  .reveal-bild img,
  .reveal-bild > figure > img,
  .reveal-bild > .rahmung figure img { opacity: 1; transform: none; transition: none; }
  .t-karte, .t-karte img.foto, .t-karte .plus { transition: none; }
  .t-karte:hover { transform: none; }
  .t-karte:hover img.foto { transform: none; }
}

/* Wir bieten mehr */
.t-mehr { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; }
.t-mehr .t-karte h4 { font-size: 14px; padding: 34px 20px 8px; }
.t-mehr .t-karte p { font-size: 14px; color: var(--ink-soft); padding: 0 40px 20px 16px; }

/* Sprechzeiten */
.t-zeiten { max-width: 620px; margin: 0 auto; }
.t-zeiten table { width: 100%; border-collapse: collapse; }
.t-zeiten td { padding: 13px 8px; border-bottom: 1px solid var(--linie); }
.t-zeiten td:first-child { font-family: "Josefin Sans", sans-serif; font-weight: 400; letter-spacing: 0.12em; text-transform: uppercase; font-size: 13.5px; width: 40%; }
.t-zeiten .hinweisz { font-size: 14px; color: var(--ink-soft); margin-top: 20px; text-align: center; }

/* Kontakt */
.t-kontakt { display: grid; grid-template-columns: minmax(0, 1fr); gap: 52px; justify-items: center; text-align: center; }
.t-kontakt .t-routen { justify-content: center; }
.t-kontakt h3 { font-size: 18px; margin-bottom: 16px; }
.t-kontakt address { font-style: normal; color: var(--ink-soft); margin-bottom: 16px; }
.t-kontakt .tel {
  font-family: "Josefin Sans", sans-serif; font-weight: 400;
  font-size: 26px; letter-spacing: 0.08em; color: var(--ink); text-decoration: none;
  display: inline-block; margin-bottom: 8px;
}
.t-kontakt .meta { font-size: 14px; color: var(--ink-soft); margin-bottom: 24px; }
.t-kontakt .karte { display: block; box-shadow: 0 14px 40px rgba(43, 34, 38, 0.12); }
.t-routen { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 18px; }
.t-routen .t-knopf { padding: 12px 22px; font-size: 11.5px; background: var(--rose-zart); color: var(--ink); }
.t-routen .t-knopf:hover { background: var(--beere-tief); color: #fff; }

/* Fusszeile hell wie Trier */
.t-fuss { background: var(--creme); border-top: 1px solid var(--linie); padding: 40px 0 28px; }
.t-fuss-innen { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.t-fuss img { height: 52px; }
.t-fuss .klein { font-size: 12.5px; color: var(--ink-soft); letter-spacing: 0.04em; }
.t-fuss a { color: var(--ink-soft); }

/* Mobil */
@media (max-width: 1080px) {
  .t-menue { display: none; position: absolute; top: 88px; left: 0; right: 0; background: var(--weiss); border-bottom: 1px solid var(--linie); flex-direction: column; gap: 0; padding: 10px 24px 18px; }
  .t-menue a { padding: 13px 0; border-bottom: 1px solid var(--linie); }
  .menue-auf .t-menue { display: flex; }
  .t-burger {
    display: inline-flex; align-items: center; justify-content: center;
    margin-left: auto; width: 46px; height: 46px;
    background: none; border: 1px solid var(--linie); border-radius: 50%;
    font-size: 19px; color: var(--ink); cursor: pointer;
  }
  .t-karten { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .t-mehr { grid-template-columns: 1fr; max-width: 460px; margin: 0 auto; }
  .t-team { grid-template-columns: 1fr; max-width: 320px; gap: 44px; }
  .t-kontakt { grid-template-columns: 1fr; }
  .t-logokarte span { font-size: 12.5px; }
  .t-logokarte b { font-size: 14px; }
  .t-logokarte img { width: 52px; }
}
@media (max-width: 700px) {
  .t-abschnitt { padding: 56px 0; }
  .t-collage { grid-auto-rows: 34px; }
  .t-logokarte { grid-column: 4 / 10; gap: 5px; padding: 9px; }
  .t-logokarte span { font-size: 8px; letter-spacing: 0.08em; line-height: 1.5; }
  .t-logokarte b { font-size: 9.5px; }
  .t-logokarte img { width: 27px; }
  /* Schnellkontakt bleibt seitlich rechts; das Skript setzt ihn beim Seitenstart
     unter Urlaubsblock und Kopfzeile, damit er keinen Text verdeckt */
  .t-seitenleiste { right: 7px; gap: 10px; }
  .t-seitenleiste a { width: 54px; height: 54px; }
  .t-seitenleiste svg { width: 23px; height: 23px; }
  .t-seitenleiste .mini { display: none; }
  .t-karten { gap: 14px; }
  .t-karte h4 { font-size: 11px; padding: 28px 10px 14px; }
  .t-karte .plus { width: 34px; height: 34px; top: -17px; font-size: 17px; }
  .t-mehr .t-karte h4 { padding: 28px 16px 8px; }
  .t-willkommen h1 { font-size: clamp(18px, 5.4vw, 26px); letter-spacing: 0.1em; }
  .t-willkommen .gruss { font-size: clamp(14px, 4vw, 18px); letter-spacing: 0.14em; }
  .t-kopfzeile h2 { font-size: clamp(17px, 5vw, 22px); letter-spacing: 0.1em; }
  .t-marke span span { display: none; }
  .t-marke img { height: 44px; }
  .t-marke b { font-size: 13px; }
}

/* ===== Unterseiten: Trier-Optik fuer die uebernommenen Inhaltsbausteine ===== */

.rahmen { max-width: 1140px; margin: 0 auto; padding: 0 24px; }
.abschnitt { padding-top: 72px; padding-bottom: 72px; }

.seiten-buehne { position: relative; min-height: 280px; display: flex; align-items: flex-end; overflow: hidden; }
.seiten-buehne > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(43, 0, 21, 0.72), rgba(43, 0, 21, 0.18) 55%, transparent); }
.seiten-buehne-inhalt { position: relative; width: 100%; padding: 36px 24px 30px; color: #fff; max-width: 1140px; margin: 0 auto; }
.seiten-buehne-inhalt h1 { color: #fff; font-size: clamp(21px, 2.6vw, 30px); margin-bottom: 8px; }
.seiten-buehne-inhalt p { color: #f0dbe4; font-size: 15px; max-width: 60ch; }
.seiten-intro { max-width: 68ch; color: var(--ink-soft); padding-top: 26px; }

.abschnitt-kopf { max-width: 70ch; margin-bottom: 40px; }
.abschnitt-kopf h2 { font-size: clamp(19px, 2.2vw, 26px); margin-bottom: 10px; }
.abschnitt-kopf p { color: var(--ink-soft); }

.gruppe { margin-bottom: 56px; scroll-margin-top: 110px; }
.gruppe-banner { position: relative; overflow: hidden; min-height: 160px; display: flex; align-items: flex-end; margin-bottom: 20px; }
.gruppe-banner > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.banner-scrim { position: absolute; inset: 0; background: linear-gradient(to top, rgba(43, 0, 21, 0.72), rgba(43, 0, 21, 0.14) 60%, transparent); }
.banner-text { position: relative; padding: 16px 22px; color: #fff; }
.banner-text h2, .banner-text h3 { color: #fff; font-size: 17px; margin-bottom: 4px; }
.banner-text p { color: #f0dbe4; font-size: 13.5px; max-width: 60ch; }

.anker-nav.anker-quer { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 44px; }
.anker-quer a {
  font-family: "Josefin Sans", sans-serif; font-weight: 400;
  font-size: 11.5px; letter-spacing: 0.14em; text-transform: uppercase;
  text-decoration: none; color: var(--ink);
  border: 1px solid var(--linie); background: var(--weiss);
  padding: 9px 16px;
}
.anker-quer a:hover { background: var(--rose-zart); border-color: var(--rose-block); }

details.extra { background: var(--weiss); border: 1px solid var(--linie); margin-bottom: 10px; padding: 0 22px; }
details.extra summary {
  cursor: pointer; list-style: none;
  font-family: "Josefin Sans", sans-serif; font-weight: 400;
  font-size: 13.5px; letter-spacing: 0.12em; text-transform: uppercase;
  padding: 16px 0; display: flex; justify-content: space-between; align-items: center; gap: 12px;
}
details.extra summary::-webkit-details-marker { display: none; }
details.extra summary::after { content: "+"; font-size: 18px; font-weight: 300; color: var(--beere); transition: transform .2s ease; }
details.extra[open] summary::after { transform: rotate(45deg); }
details.extra p { font-size: 14.5px; color: var(--ink-soft); padding-bottom: 16px; }
details.extra > div { margin-bottom: 8px; }

.fahrplan-zone { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 48px; align-items: start; }
.fahrplan { position: relative; max-width: 760px; }
.fahrplan::before { content: ""; position: absolute; left: 150px; top: 8px; bottom: 8px; width: 1px; background: var(--rose-block); }
.etappe { display: grid; grid-template-columns: 128px 44px 1fr; margin-bottom: 24px; }
.etappe-wann {
  text-align: right; font-family: "Josefin Sans", sans-serif; font-weight: 400;
  font-size: 13.5px; letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--beere); padding-top: 18px;
}
.etappe-wann small { display: block; font-family: "Poppins", sans-serif; font-weight: 300; font-size: 11.5px; color: var(--ink-soft); text-transform: none; letter-spacing: 0.02em; }
.etappe-punkt { position: relative; }
.etappe-punkt::before { content: ""; position: absolute; left: 17px; top: 24px; width: 11px; height: 11px; border-radius: 50%; background: var(--beere); border: 2px solid var(--weiss); }
.etappe-karte { background: var(--weiss); border: 1px solid var(--linie); padding: 18px 22px; }
.etappe-karte h3 { font-size: 13.5px; letter-spacing: 0.1em; margin-bottom: 6px; }
.etappe-karte p { font-size: 14px; color: var(--ink-soft); }
.etappe-laufend .etappe-karte { background: var(--rose-zart); border-color: var(--rose-block); }
.etappe-laufend .etappe-punkt::before { background: var(--rose-block); }
.trimester-marke { display: grid; grid-template-columns: 128px 44px 1fr; margin: 36px 0 20px; }
.trimester-marke span {
  grid-column: 3; justify-self: start;
  font-family: "Josefin Sans", sans-serif; font-weight: 400;
  font-size: 11.5px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--beere); background: var(--rose-zart); padding: 6px 16px;
}
.fahrplan-kompakt { margin: 18px 0 12px; max-width: 640px; }
.fahrplan-kompakt::before { left: 150px; }
.fahrplan-kompakt .etappe { margin-bottom: 14px; }
.fahrplan-kompakt .etappe-karte { padding: 13px 17px; }

.embryo-buehne { position: sticky; top: 130px; aspect-ratio: 1 / 1; width: 100%; }
.embryo-buehne img { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transform: scale(0.82); transition: opacity .55s cubic-bezier(0.16, 1, 0.3, 1), transform .55s cubic-bezier(0.16, 1, 0.3, 1); }
.embryo-buehne img.aktiv { opacity: 1; transform: scale(1); }
.embryo-buehne img[data-stufe="0"].aktiv { transform: scale(0.55); }
.embryo-buehne img[data-stufe="1"].aktiv { transform: scale(0.72); }
.embryo-buehne img[data-stufe="2"].aktiv { transform: scale(0.87); }
.embryo-label { position: absolute; bottom: -36px; left: 0; right: 0; text-align: center; font-family: "Josefin Sans", sans-serif; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-soft); }
.embryo-mini { display: none; }
@media (prefers-reduced-motion: reduce) { .embryo-buehne img { transition: none; } }

.extra-gitter { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; align-items: start; }
.extra-spalte h3 { font-size: 15px; letter-spacing: 0.14em; margin-bottom: 14px; }

.team-gruppe { margin-bottom: 56px; }
.team-gruppe h2 { font-size: clamp(18px, 2vw, 24px); margin-bottom: 26px; }
.team-gitter-gross { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px; }
.spalten-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 780px; }
.person-flach { text-align: center; }
.person-flach figure { background: var(--rose-zart); aspect-ratio: 3 / 3.4; overflow: hidden; margin-bottom: 12px; }
.person-flach img { width: 100%; height: 100%; object-fit: contain; object-position: bottom; padding-top: 10px; }
.person-flach b { font-family: "Josefin Sans", sans-serif; font-weight: 400; font-size: 13px; letter-spacing: 0.12em; text-transform: uppercase; display: block; }
.person-flach span { font-size: 13px; color: var(--ink-soft); }
.person { text-align: center; }
.person figure { background: var(--rose-zart); aspect-ratio: 3 / 3.6; overflow: hidden; margin-bottom: 16px; }
.person img { width: 100%; height: 100%; object-fit: contain; object-position: bottom; padding-top: 14px; }
.person b { font-family: "Josefin Sans", sans-serif; font-weight: 400; font-size: 14px; letter-spacing: 0.12em; text-transform: uppercase; display: block; }
.person span { font-size: 13.5px; color: var(--ink-soft); }
.bio-slot { margin-top: 10px; font-size: 13px; font-style: italic; color: var(--ink-soft); border: 1px dashed var(--rose-block); padding: 9px 13px; }
.team-fuss { text-align: center; margin-top: 36px; }

.pillen { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.pillen span { background: var(--weiss); border: 1px solid var(--linie); padding: 8px 16px; font-size: 13px; }
.pillen-akzent span { background: var(--rose-zart); border-color: var(--rose-block); }

.kontakt-gitter { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.karte-bild { display: block; box-shadow: 0 14px 40px rgba(43, 34, 38, 0.12); }
.route-knoepfe { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.cta-zweit {
  display: inline-block; background: var(--rose-zart); color: var(--ink);
  font-family: "Josefin Sans", sans-serif; font-weight: 400;
  font-size: 11.5px; letter-spacing: 0.16em; text-transform: uppercase;
  text-decoration: none; padding: 12px 22px; border: none;
}
.cta-zweit:hover { background: var(--beere-tief); color: #fff; }
.tel-pill {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--rose-block); color: #fff; text-decoration: none;
  font-family: "Josefin Sans", sans-serif; font-weight: 400;
  font-size: 12.5px; letter-spacing: 0.16em; text-transform: uppercase;
  padding: 14px 26px;
}
.tel-pill:hover { background: var(--beere-tief); color: #fff; }
.tel-pill svg { width: 15px; height: 15px; }
.kontakt-tel { font-family: "Josefin Sans", sans-serif; font-weight: 400; font-size: 24px; letter-spacing: 0.08em; color: var(--ink); text-decoration: none; display: inline-block; margin-bottom: 8px; }
.kontakt-daten h2 { font-size: 18px; margin-bottom: 14px; }
.kontakt-daten address { font-style: normal; color: var(--ink-soft); margin-bottom: 14px; }
.kontakt-meta { font-size: 13.5px; color: var(--ink-soft); margin-bottom: 20px; }

.hinweis { background: var(--creme); border: 1px solid var(--linie); padding: 16px 22px; margin-top: 34px; display: flex; gap: 14px; align-items: flex-start; font-size: 14px; color: var(--ink-soft); }
.hinweis svg { flex-shrink: 0; width: 18px; height: 18px; color: var(--beere); margin-top: 3px; }
.cta-band { background: var(--rose-zart); padding: 44px 36px; text-align: center; }
.cta-band h2 { font-size: clamp(18px, 2.2vw, 24px); margin-bottom: 10px; }
.cta-band p { color: var(--ink-soft); margin-bottom: 22px; }
.cta-band-foto { position: relative; overflow: hidden; padding: 0; }
.cta-band-foto > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cta-band-foto .banner-scrim { background: linear-gradient(to top, rgba(43, 0, 21, 0.84), rgba(43, 0, 21, 0.45)); }
.cta-band-inhalt { position: relative; padding: 48px 36px; }
.cta-band-foto h2 { color: #fff; }
.cta-band-foto p { color: #f0dbe4; }
.leistung-artikel { margin-bottom: 38px; scroll-margin-top: 110px; }
.leistung-artikel h3 { font-size: 14px; letter-spacing: 0.12em; margin-bottom: 10px; }
.leistung-artikel p, .leistung-artikel ul { color: var(--ink-soft); font-size: 14.5px; margin-bottom: 10px; max-width: 68ch; }
.leistung-artikel ul { padding-left: 22px; }
.seite-kopf { padding-top: 56px; padding-bottom: 6px; max-width: 62ch; }
.seite-kopf h1 { font-size: clamp(20px, 2.6vw, 28px); margin-bottom: 12px; }
.seite-kopf p { color: var(--ink-soft); }
.seite-kopf .gruss { color: var(--beere); font-family: "Josefin Sans", sans-serif; letter-spacing: 0.14em; text-transform: uppercase; font-size: 15px; margin-bottom: 8px; }
[id] { scroll-margin-top: 110px; }

@media (max-width: 900px) {
  .fahrplan-zone { grid-template-columns: 1fr; }
  .embryo-buehne { display: none; }
  .embryo-mini { display: block; float: right; width: 70px; height: 70px; margin: 0 0 6px 10px; }
  .embryo-mini[data-stufe="0"] { transform: scale(0.55); }
  .embryo-mini[data-stufe="1"] { transform: scale(0.7); }
  .embryo-mini[data-stufe="2"] { transform: scale(0.85); }
  .extra-gitter { grid-template-columns: 1fr; }
  .kontakt-gitter { grid-template-columns: 1fr; }
  .team-gitter-gross { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .spalten-3 { grid-template-columns: 1fr; max-width: 280px; margin: 0 auto; }
}
@media (max-width: 700px) {
  .fahrplan::before, .fahrplan-kompakt::before { left: 21px; }
  .etappe, .trimester-marke { grid-template-columns: 44px 1fr; }
  .etappe-wann { grid-column: 2; text-align: left; padding: 0 0 4px; }
  .etappe-wann small { display: inline; margin-left: 8px; }
  .etappe-punkt { grid-column: 1; grid-row: 1 / span 2; }
  .etappe-karte { grid-column: 2; }
  .trimester-marke span { grid-column: 2; }
  .seiten-buehne { min-height: 220px; }
}

/* ===== Das sind wir: Gruppenfoto + Teamgeschichte ===== */
.t-wir { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.t-wir-foto .rahmung { position: relative; }
.t-wir-foto .rahmung::after {
  content: ""; position: absolute; inset: 16px -16px -16px 16px;
  border: 1px solid var(--rose-block); z-index: 0;
}
.t-wir-foto figure { position: relative; z-index: 1; margin: 0; overflow: hidden; background: var(--rose-zart); }
.t-wir-foto img { display: block; width: 100%; height: auto; }
.t-wir-text h3 { font-size: clamp(17px, 2vw, 22px); margin-bottom: 14px; }
.t-wir-text p { color: var(--ink-soft); margin-bottom: 14px; }
.t-wir-text .t-knopf { margin-top: 8px; }
@media (max-width: 900px) {
  .t-wir { grid-template-columns: 1fr; gap: 40px; }
  .t-wir-foto .rahmung { max-width: 560px; margin: 0 auto; }
}

/* Hinweis und Knopf zur psychotherapeutischen Praxis in Wiesbaden */
.wiesbaden-hinweis {
  max-width: 720px; margin: 22px auto 0; text-align: center;
  color: var(--ink-soft); font-size: 15px;
}
.wiesbaden-knopf { text-align: center; margin-top: 16px; }

/* ===== Feineinstellung Schrift ==========================================
   Nur Schriftwerte: Familie, Schnitt, Groesse, Laufweite, Schreibweise.
   Keine Abstaende, kein Raster, kein neues Element.
   Zwei Regeln dahinter: Cormorant steht nirgends unter 18px, weil seine
   Haarstriche darunter wegbrechen. Alles Kleinere laeuft in Poppins.
   ====================================================================== */

/* Grosse Ueberschriften: Cormorant laeuft optisch klein, deshalb groesser
   als die bisherigen Versalzeilen */
.t-willkommen.t-willkommen h1 { font-size: clamp(32px, 4vw, 50px); letter-spacing: 0.005em; }
.t-kopfzeile.t-kopfzeile h2 { font-size: clamp(28px, 3.2vw, 40px); letter-spacing: 0.005em; }
.abschnitt-kopf.abschnitt-kopf h2 { font-size: clamp(26px, 3vw, 36px); }
.seiten-buehne-inhalt.seiten-buehne-inhalt h1 { font-size: clamp(30px, 3.6vw, 44px); }
.seite-kopf.seite-kopf h1 { font-size: clamp(28px, 3.2vw, 40px); }
.cta-band.cta-band h2 { font-size: clamp(25px, 2.8vw, 32px); }
.t-wir-text.t-wir-text h3 { font-size: clamp(23px, 2.5vw, 30px); }
.t-kontakt.t-kontakt h3 { font-size: 25px; }
.kontakt-daten.kontakt-daten h2 { font-size: 25px; }
.t-person.t-person h4 { font-size: 22px; letter-spacing: 0.005em; }
.extra-spalte.extra-spalte h3 { font-size: 21px; letter-spacing: 0.005em; }
.leistung-artikel.leistung-artikel h3 { font-size: 21px; letter-spacing: 0.005em; }
.banner-text.banner-text h2, .banner-text.banner-text h3 { font-size: 22px; letter-spacing: 0.005em; }

/* Die Grusszeile: aus gesperrten Versalien wird eine ruhige Serifenzeile */
.t-willkommen .gruss.gruss,
.seite-kopf .gruss.gruss {
  font-family: "Cormorant", Georgia, serif;
  font-weight: 400; text-transform: none; letter-spacing: 0.01em;
}
.t-willkommen .gruss.gruss { font-size: clamp(22px, 2.6vw, 31px); }
.seite-kopf .gruss.gruss { font-size: 22px; }

/* Kleine Titel unter 18px: nicht Cormorant, sondern Poppins */
.t-karte.t-karte h4,
.etappe-karte.etappe-karte h3 {
  font-family: "Poppins", "Segoe UI", sans-serif;
  font-weight: 500; letter-spacing: 0.01em; text-transform: none;
}
.t-karte.t-karte h4 { font-size: 15.5px; }
.etappe-karte.etappe-karte h3 { font-size: 16px; }

/* Lesetexte, die bisher bei 13,5 bis 14,5px standen */
.t-willkommen.t-willkommen p.text { font-size: 17px; }
.seiten-buehne-inhalt.seiten-buehne-inhalt p { font-size: 16.5px; }
details.extra.extra p { font-size: 16px; }
.leistung-artikel.leistung-artikel p,
.leistung-artikel.leistung-artikel ul { font-size: 16px; }
.etappe-karte.etappe-karte p { font-size: 15.5px; }
.hinweis.hinweis { font-size: 15.5px; }
.t-zeiten.t-zeiten .hinweisz { font-size: 15.5px; }
.t-kontakt.t-kontakt .meta { font-size: 15.5px; }
.kontakt-meta.kontakt-meta { font-size: 15.5px; }
.banner-text.banner-text p { font-size: 15px; }
.pillen.pillen span { font-size: 15px; }
.t-person.t-person .rolle { font-size: 15px; }
.person.person span { font-size: 15px; }
.person-flach.person-flach span { font-size: 15px; }
.wiesbaden-hinweis.wiesbaden-hinweis { font-size: 16px; }
.t-fuss.t-fuss .klein { font-size: 13.5px; }

/* Grossbuchstaben bleiben dort, wo sie Ordnung stiften: Navigation,
   Knoepfe, Wochentage, Namen. Sie werden groesser und etwas kraeftiger. */
.t-marke.t-marke b { font-size: 16px; letter-spacing: 0.08em; }
.t-marke.t-marke span { font-size: 12.5px; }
.t-menue.t-menue a { font-size: 14px; letter-spacing: 0.1em; }
.t-knopf.t-knopf { font-size: 13.5px; letter-spacing: 0.12em; }
.t-person.t-person .t-knopf,
.t-routen.t-routen .t-knopf { font-size: 12.5px; }
.tel-pill.tel-pill { font-size: 13.5px; letter-spacing: 0.12em; }
.t-zeiten.t-zeiten td:first-child { font-size: 14.5px; letter-spacing: 0.09em; }
details.extra.extra summary { font-size: 14.5px; letter-spacing: 0.07em; }
.person.person b { font-size: 14.5px; letter-spacing: 0.07em; }
.person-flach.person-flach b { font-size: 14px; letter-spacing: 0.07em; }
.t-kontakt.t-kontakt .tel { font-family: "Cormorant", Georgia, serif; font-size: 34px; letter-spacing: 0.02em; }

@media (max-width: 700px) {
  .t-willkommen.t-willkommen h1 { font-size: clamp(27px, 7.4vw, 34px); }
  .t-willkommen .gruss.gruss { font-size: clamp(20px, 5.6vw, 25px); }
  .t-kopfzeile.t-kopfzeile h2 { font-size: clamp(24px, 6.4vw, 30px); }
  .t-karte.t-karte h4 { font-size: 14.5px; }
  .t-person.t-person h4 { font-size: 20px; }
  .t-marke.t-marke b { font-size: 14.5px; }
}

/* ===== Korrekturen aus der Pruefung vom 28.08.2026 ======================
   Stellen, die der Schriftumbau uebersehen hatte, plus zwei Folgefehler
   der neuen Bild-Einblendung.
   ====================================================================== */

/* Die Logokarte in der Bildcollage trug als einzige prominente Stelle noch
   die alten gesperrten Versalien, und mobil schrumpfte sie auf 8px */
.t-logokarte.t-logokarte span {
  font-family: "Cormorant", Georgia, serif; font-weight: 400;
  text-transform: none; letter-spacing: 0.02em; font-size: 18px; line-height: 1.45;
}
.t-logokarte.t-logokarte b { font-weight: 500; font-size: 22px; }

/* Sprungnavigation der Leistungsseite: einzige Orientierung auf der
   laengsten Seite, stand bei 11,5px */
.anker-quer.anker-quer a { font-size: 14px; letter-spacing: 0.08em; }

/* Zeitangaben im Vorsorge-Fahrplan: hier steht die eigentliche Sachinfo */
.etappe-wann.etappe-wann { font-size: 15px; letter-spacing: 0.07em; }
.etappe-wann.etappe-wann small { font-size: 13.5px; }

/* Das overflow:hidden der Bild-Einblendung kappte den versetzten
   Zierrahmen um das Gruppenfoto */
.t-wir-foto.reveal-bild, .t-person .rahmung.reveal-bild { overflow: visible; }

/* Auf Impressum und Datenschutz stand die Ueberschrift auf einer anderen
   Achse als der Text darunter */
.seite-kopf.seite-kopf { max-width: 820px; }

/* Der Wiesbaden-Hinweis stand mittig unter einem linksbuendigen Absatz */
.wiesbaden-hinweis.wiesbaden-hinweis {
  text-align: left; max-width: 68ch; margin-left: 0; margin-right: 0;
}
.wiesbaden-knopf.wiesbaden-knopf { text-align: left; }

@media (max-width: 700px) {
  .t-logokarte.t-logokarte span { font-size: 13px; line-height: 1.4; }
  .t-logokarte.t-logokarte b { font-size: 15.5px; }
}

/* Zwei Knoepfe nebeneinander, etwa Terminbuchung und Telefon */
.knopf-paar { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 22px; }
.t-knopf-zweit { background: var(--rose-zart); color: var(--ink); }
.t-knopf-zweit:hover { background: var(--beere-tief); color: #fff; }

/* Die Aufklapptitel sind die haeufigste Ueberschrift der Leistungsseite und
   standen als einzige noch in der alten Handschrift: Grotesk, Versalien,
   dunkel. Sie bekommen dieselbe Serife und dieselbe Farbe wie alle anderen
   Ueberschriften. 19px, weil Cormorant darunter zu zart wird. */
details.extra.extra summary {
  font-family: "Cormorant", Georgia, serif;
  font-weight: 500; font-size: 19px;
  text-transform: none; letter-spacing: 0.01em;
  color: var(--beere);
}
@media (max-width: 700px) {
  details.extra.extra summary { font-size: 18px; }
}

/* Bildraster im Plasmage-Abschnitt: vier Spalten, mobil zwei */
.plasmage-raster {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px; margin: 22px 0 6px;
}
.plasmage-raster figure { margin: 0; min-width: 0; }
.plasmage-raster img {
  width: 100%; height: auto; aspect-ratio: 4 / 2.5;
  object-fit: cover; border-radius: 4px;
}
.plasmage-raster figcaption {
  font-size: 13px; color: var(--ink-soft); text-align: center;
  margin-top: 7px; letter-spacing: 0.01em;
}
@media (max-width: 700px) {
  .plasmage-raster { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .plasmage-raster figcaption { font-size: 12.5px; }
}

/* Sprunglink: unsichtbar, bis jemand mit der Tastatur navigiert */
.sprunglink {
  position: absolute; left: 12px; top: -60px; z-index: 100;
  background: var(--beere); color: #fff; text-decoration: none;
  padding: 12px 22px; font-size: 14px;
  transition: top .15s ease;
}
.sprunglink:focus { top: 12px; }

/* Sichtbarer Fokusrahmen fuer Tastaturbedienung */
a:focus-visible, button:focus-visible, summary:focus-visible {
  outline: 3px solid var(--beere); outline-offset: 3px;
}

/* ===== Runde 2, Aenderungen vom 31.08.2026 =============================== */

/* Logo-Zeile: weichere Serife statt Grotesk in Versalien */
.t-marke.t-marke b {
  font-family: "Lora", Georgia, serif;
  font-weight: 500; font-size: 18px;
  text-transform: none; letter-spacing: 0.005em;
}
@media (max-width: 700px) {
  .t-marke.t-marke b { font-size: 15.5px; }
}

/* Kartentitel, die die Praxis in einer Zeile lesen moechte */
.t-karte.t-karte h4 { text-wrap: balance; }
.t-karte.t-karte h4 .zusammen { white-space: nowrap; }

/* Hinweiszeile ganz oben, von der Praxis selbst pflegbar.
   Bewusst ruhig statt laufend: bewegter Text ist schwer zu lesen und wird
   ueberlesen, genau das war der Schwachpunkt der alten Laufschrift. */
.t-hinweiszeile { background: var(--beere-tief); color: #fff; }
.t-hinweiszeile-innen { padding: 11px 24px; text-align: center; }
.t-hinweiszeile span { font-size: 14.5px; line-height: 1.6; display: inline-block; }
.t-hinweiszeile:empty, .t-hinweiszeile.leer { display: none; }
@media (max-width: 700px) {
  .t-hinweiszeile-innen { padding: 10px 18px; }
  .t-hinweiszeile span { font-size: 13.5px; }
}

/* Platzhalterkachel fuer eine Leistung, die es noch nicht gibt */
.t-karte-platzhalter { cursor: default; background: var(--creme); }
.t-karte-platzhalter:hover { transform: none; box-shadow: none; }
.platzhalter-flaeche {
  aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center;
  background: var(--rose-zart); color: var(--beere);
}
.platzhalter-flaeche svg { width: 46px; height: 46px; opacity: .55; }
.platzhalter-hinweis {
  display: block; font-family: "Poppins", sans-serif; font-weight: 400;
  font-size: 12.5px; color: var(--ink-soft); opacity: .72; margin-top: 4px;
  letter-spacing: 0.02em;
}

/* Die drei Titel, die die Praxis einzeilig haben moechte, brauchen etwas
   weniger Schrift, sonst laufen sie aus der Karte heraus. Damit das Raster
   einheitlich bleibt, gilt die Groesse fuer alle Kartentitel. */
.t-karte.t-karte h4 { font-size: 13.5px; }
.t-karte.t-karte h4 .zusammen { font-size: 12.5px; letter-spacing: 0; }
@media (max-width: 900px) {
  .t-karte.t-karte h4 .zusammen { white-space: normal; font-size: 13.5px; }
}

/* "Dres. med." darf nicht am Zeilenende auseinandergerissen werden */
.t-willkommen.t-willkommen h1 .zusammen { white-space: nowrap; font-size: inherit; letter-spacing: inherit; }

/* ===== Urlaubs- und Vertretungshinweis =================================
   Ersetzt die schmale Hinweiszeile. Die Praxis braucht hier Platz fuer
   den Zeitraum und die Liste der vertretenden Praxen. Der ganze Block
   verschwindet, wenn kein Zeitraum eingetragen ist. */
.t-hinweisblock { background: var(--beere-tief); color: #fff; }
.t-hinweisblock-innen { padding: 20px 24px 22px; text-align: center; }
.hinweis-titel {
  font-family: "Cormorant", Georgia, serif; font-weight: 500;
  font-size: 23px; line-height: 1.3; margin-bottom: 6px;
}
.hinweis-text { font-size: 14.5px; line-height: 1.65; max-width: 70ch; margin: 0 auto; opacity: .93; }
.hinweis-vertretung {
  list-style: none; display: flex; flex-wrap: wrap; justify-content: center;
  gap: 10px 28px; margin: 16px auto 0; max-width: 900px;
}
.hinweis-vertretung li {
  display: flex; flex-direction: column; align-items: center; gap: 1px;
  font-size: 13.5px; line-height: 1.5;
}
.hinweis-vertretung b { font-weight: 500; font-size: 14.5px; }
.hinweis-vertretung span { opacity: .85; }
.hinweis-vertretung a { color: #fff; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 700px) {
  .t-hinweisblock-innen { padding: 16px 18px 18px; }
  .hinweis-titel { font-size: 20px; }
  .hinweis-text { font-size: 13.5px; }
  .hinweis-vertretung { flex-direction: column; gap: 12px; margin-top: 14px; }
}

/* Urlaubsblock nach dem Juli-Muster der Praxis: Anrede, Zeitraum, Rueckkehr,
   dann die vertretenden Praxen mit Fachbezeichnung, Adresse und Telefon */
.hinweis-anrede { font-size: 15px; opacity: .9; margin-bottom: 4px; }
.t-hinweisblock .hinweis-titel { font-size: 21px; max-width: 34ch; margin: 0 auto 6px; }
.hinweis-vertretung { gap: 14px 22px; align-items: flex-start; }
.hinweis-vertretung li { flex: 1 1 200px; max-width: 260px; }
.hinweis-vertretung b { margin-bottom: 2px; }
.hinweis-vertretung span { font-size: 13px; }
@media (max-width: 700px) {
  .t-hinweisblock .hinweis-titel { font-size: 18px; }
  .hinweis-vertretung li { max-width: none; }
}

/* Urlaubsblock am Handy: Eintraege nicht dehnen, lange Fachbezeichnungen
   umbrechen, Zeitraum eine Stufe kleiner */
@media (max-width: 700px) {
  .hinweis-vertretung { display: flex; flex-direction: column; gap: 14px; align-items: stretch; }
  .hinweis-vertretung li { flex: none; width: 100%; max-width: 100%; }
  .hinweis-vertretung b, .hinweis-vertretung span, .hinweis-vertretung a { overflow-wrap: anywhere; }
  .t-hinweisblock .hinweis-titel { font-size: 17px; max-width: 100%; }
  .hinweis-anrede { font-size: 14px; }
}

/* Handy: Logokarte mit weniger Innenabstand, damit "Gemeinschaftspraxis" in
   eine Zeile passt; Kopfzeilen-Name bricht nur vor "Flick" um */
@media (max-width: 700px) {
  .t-logokarte.t-logokarte { padding: 12px 10px; }
  .t-logokarte.t-logokarte b { font-size: 14.5px; letter-spacing: 0; }
  .t-logokarte.t-logokarte span { font-size: 12.5px; letter-spacing: 0; }
  .t-marke.t-marke b { font-size: 14.5px; letter-spacing: 0; line-height: 1.25; }
}
.t-marke b .zusammen { white-space: nowrap; }

/* Die Regel ".t-marke span span { display:none }" blendet am Handy die
   Unterzeile aus, trifft aber auch den Umbruchschutz im Namen. Der bleibt sichtbar. */
@media (max-width: 700px) {
  .t-marke.t-marke b .zusammen { display: inline; }
}

/* Der Umbruchschutz im Namen soll genauso aussehen wie der Rest des Namens */
.t-marke.t-marke b .zusammen { font: inherit; letter-spacing: inherit; color: inherit; }

/* Nennung des Studios in der Fusszeile, von der Praxis ausdruecklich zugesagt */
.t-fuss .umsetzung { color: var(--ink-soft); opacity: .7; text-decoration: none; }
.t-fuss .umsetzung:hover { opacity: 1; text-decoration: underline; }

/* Fusszeile am Handy: Zeilen untereinander statt einer langen Kette mit
   haengenden Trennpunkten; die Studio-Nennung bleibt in einem Stueck */
@media (max-width: 700px) {
  .t-fuss-innen { flex-direction: column; align-items: flex-start; gap: 14px; }
  .t-fuss .trenner { display: none; }
  .t-fuss .fuss-adresse, .t-fuss .klein a { display: block; }
  .t-fuss .klein a { padding: 2px 0; }
  .t-fuss .umsetzung { white-space: nowrap; margin-top: 4px; }
}

/* Ankunft ueber eine Sprungmarke (z. B. Menue "Kontakt" von einer anderen Seite):
   Die Seite bleibt unsichtbar, bis sie an der Zielstelle steht, und der dort
   sichtbare Inhalt erscheint sofort statt eingeblendet zu werden. */
html.anker-lade body { visibility: hidden; }
.reveal.sofort,
.reveal.sofort img,
.reveal.sofort > figure > img,
.reveal.sofort > .rahmung figure img { transition: none !important; }

/* Schnellkontakt: liegt per z-index immer vor der Kopfzeile; das Skript schiebt den Stapel
   zusaetzlich unter die Kopfzeile, wenn dafuer Platz ist (Urlaubsblock beim Seitenstart). */
