/*
  lesbild.css -- Fassung v15, 08.11.2026. Paket 28 "Lesbarkeit portalweit" (K22, Festlegungen 53 und 54), Nachpakete 28b, 29, 29b.
  v15 (Paket 29b, Ralf 08.11.2026: "Das Beihilfelogo ist wie ein Kuckuck, der alle anderen verdraengt"): Die Klinikliste unter
  Lexikonartikeln (_subtmpl/plugins/lists_kliniken_lexikon.html) setzt das Kaertchen OHNE die 130 px der anderen Vorlagen; mit
  der Zellbreite auto aus v14 wuchs es dort auf seine volle Bildbreite (300 px bei 1280, 253 px bei 992, /therapie/aquajogging-
  8155.html). Jetzt: Kaertchen ueberall hoechstens 13 rem, Zelle ab 992 px fest 16 rem (gemessen: 130 px Kaertchen, 160 px Zelle
  in beiden Listen, 0 ueberdeckte Logos). Geladen als ?v=4.
  v14 (Paket 29, Ralf 08.11.2026): Einleitungskaesten des Lexikons neu angeordnet -- Ueberschrift links, das Lexikonbild
  kleiner rechtsbuendig daneben, der Text ueber die volle Breite, ab 992 px in zwei Spalten, mehr Luft zur Suchmaske.
  Gemessen vorher: zwei Spalten im alten Kasten (col-8 neben dem Bild) haetten den Text nur um 10 px verkuerzt (Spalten
  324 px, 34 Zeichen je Zeile), der Weissraum unter dem Bild waere geblieben. Dazu (Abschnitt 5) Bilder im Beschreibungstext
  eines Klinikprofils hoechstens spaltenbreit (Klinik 3872, 159 px Ueberlauf am Telefon) und das Kaertchen "Beihilfefaehig"
  in den Klinikeintraegen der Listen mit eigener Zellbreite (lag 15 bis 48 px ueber dem Nachbarlogo). Geladen als ?v=3.
  v13 (Ralf 07.11.2026 abends, "Schriftbild der beiden Spalten arg ungleichmaessig"): Startseite ab 1200 px Flattersatz mit
  Silbentrennung statt Umbruchsperre fuer alle Verweise -- gemessen am Zeilenende im Mittel 30 statt 77 px frei, 2 statt 13
  Zeilen mit mehr als 60 px; nur "Portal-Verbesserungen" bleibt beisammen. Telefon unveraendert. Geladen als ?v=2.
  Dazu (Ralf): die Startseitenkaesten bekommen den Rahmenschatten wie alle anderen Kaesten. Und (Probe 28b): am Telefon lief
  die Anmeldeseite seit Paket 28 um 15 px ueber -- verschachtelte Bootstrap-Zeilen, Gegenregel in Abschnitt 8.
  v12 (Ralf 07.11.2026 abends): Einleitungstexte des Gesundheitslexikons (div.help-text ueber den Listen Fachgebiete,
  Krankheiten, Therapien und in den Reitern von /gesundheitslexikon.html) im Lesebild; die feste Hoehe 300 px mit
  overflow:hidden aus index.css 721 faellt, sonst schnitte die groessere Schrift den Text unten ab.
  v11 (Ralf 07.11.2026, gekuerzter Willkommenstext in zwei Spalten): Startseite ab 1200 px -- Ueberschrift 3,0 rem statt
  2,06 em (33 px), damit sie einzeilig neben der Ampel steht (gemessen: Kasten 895 px, Ueberschrift bei 30 px 862 px);
  Willkommenstext zweispaltig mit Trennlinie, damit neben der Ampel kein Weissraum bleibt. Darunter einspaltig wie bisher.
  In den zwei Spalten brechen die Verweise nicht um ("Portal-" / "Verbesserungen" stand sonst auf zwei Zeilen; auf dem
  Telefon nicht, dort waere "Beschreibung haeufiger Krankheiten" bei 320 px breiter als die Spalte); auf dem Telefon
  Ueberschrift 2,6 rem statt 33 px -- drei Zeilen ohne Trennung statt vier mit "Gesund-heitsfoerderung".
  v10 (Nachpruefung Fable 07.11.2026, werkstatt\gegenpruefung-p28-fable-v02.md): SOLL 1 Rahmenregel wieder ohne
  :not(.index), die Startseitenkaesten verlieren ihren Schatten ueber eine eigene Regel -- sonst wurden die grauen
  Kaesten der Anmelde- und Registrierungsseiten weiss; KANN 3 die letzten ausdruecklichen 300 (Reiterlisten im Klinik-
  und Kurortprofil, Kurortliste, Kurortkonto) ebenfalls auf 400.
  v09 (Gegenpruefung Fable 07.11.2026, werkstatt\gegenpruefung-p28-fable-v01.md, und Ralf): MUSS 1 alte Lexikonspalte
  auf dem Telefon ohne die -15 px der Bootstrap-Zeile; MUSS 2 Startseitenkaesten (.content.index) ohne Rahmen, Schatten
  und Telefonabstaende -- nur der Willkommenstext (.index2 .text) steht nach Ralf im Lesebild; SOLL 5 die ausdruecklichen
  300 (index.css, mobil.css, kurorte_show.html, Kurortkonto) auf 400, Startseite ausgenommen; SOLL 6 Sprungverweise der
  Reha-Qualitaet bleiben Portalblau fett (Navigation); KANN 9 Ersatztext fuer Vorleseprogramme, Rahmen nur bei Tastatur.
  v08 (Restfragen, Ralf 07.11.2026): Grundstaerke des ganzen Portals 400 statt 300 (index.css Zeile 97), auch der
  Text der Seitenleiste; Krankheitskacheln zeigen fuenf statt vier Zeilen. Kopfleiste grau und Silbentrennung auf dem
  Telefon waren schon drin und bleiben.
  v07: Inhaltsverzeichnis der 19 Ratgeber eingeklappt (Ralf 07.11.2026) -- die Vorlagen tragen dazu details/summary
  (werkstatt\inhalt_einklappen.py); hier die Leiste "Inhalt  anzeigen" mit Pfeil, Tastaturrahmen, ohne Browsermarke.
  Nur ASCII in dieser Datei (Umlaute als CSS-Escape), weil der Server CSS ohne Zeichensatz ausliefern kann.
  v06: alte Lexikonspalte ohne den Innenabstand der Bootstrap-Spalte (Text 624 statt 594 px); Kacheltext der
  Krankheitskacheln volle Kachelbreite statt 75 % aus index.css (stand dadurch links aus der Mitte).
  v05 (Ralf nach der Abnahmeseite, drei Aenderungen): (A) Spalte 624 px wie beim Spiegel statt 584 (62,4 rem), Fotos
  in Ratgeber, Lexikonartikel und alter Lexikonspalte so breit wie die Spalte; (B) Logoleiste der Qualitaetszeichen
  (.kk-zq-mini) in der Spalte und in zwei Zeilen zu vier; (C) Fliesstext in Kacheln schon in Merriweather --
  Uebersicht Reha-Qualitaet (.kk-zq-gruppe, .kk-zq-zeile) und Krankheitskacheln (.haeufige_krankheiten).
  v04: Autorenzeile der Ratgeber (.krankheiten > .subtitle) steht in der Spalte statt am linken Rand.
  v03 (nur Telefon): Ausgleich Y1 aus mobil.css (.krankheiten -15 px rechts) aufgehoben, weil der Innenabstand des
  Behaelters jetzt ueberall 16 px ist; Klinikliste unter einem Lexikonartikel bekommt 15 px Innenabstand fuer die
  Bootstrap-Zeilen; Lexikonartikel mit 16 statt 18 px Rand wie alle Leseseiten; breite Tabellen wischen waagerecht.
  v02: Grundgroesse html 62,5 % statt der festen 10 px aus Bootstrap 3 -- bei Standardeinstellung des Browsers
  unveraendert 10 px, folgt aber einer groesseren Grundschrift; alle rem-Werte auf diese Basis umgerechnet
  (1rem = 10 px; v01 hatte 1rem = 16 px angenommen, Probe ergab 10,6 px Lesetext). Dazu Ueberschriften in
  Listenpunkten (Datenschutz) und in der alten Lexikon-Textspalte in Roboto Slab, Bilder dort hoechstens
  spaltenbreit, Lexikonartikel auf dem Telefon gegen die !important-Regeln aus mobil.css. v01 in ..\..\..\archiv\.

  Eingebunden in applix/www/tmpl/_subtmpl/head.html nach mobil.css: <link rel='stylesheet' href='/appserv/lesbild.css?v=1'>.
  Eigene Datei, damit weder index.css noch include_version in libs/www.pm getauscht werden muessen; der Zaehler ?v=N
  steht in der Zeile selbst. Rueckweg: die Zeile in head.html entfernen.

  Festlegung 53 (am Bild abgenommen 07.11.2026): Lesetext Merriweather 400, #000, 17/30 px, Laufweite +0,01 em, Spalte 584 px
  (65 Zeichen; seit v05 nach Ralf 624 px wie beim Spiegel, rund 69 Zeichen), Absatz 24 px; Telefon 16/27 px, Weiss ueber die volle Breite, 16 px Rand. Ueberschriften Roboto Slab fett,
  farbig wie bisher, hoechstens spaltenbreit. Verweise im Lesetext: Textfarbe, 1 px Linie #5c5a58, 1 px Abstand, beim
  Darueberfahren Portalblau. Rahmung aussen #f1efed, innen Weiss mit Schatten; Text und Bilder als Block mittig.
  Alle Schriften vom eigenen Server (/appserv/schriften/, fontsource 5.3, Teilmenge Latein; OFL 1.1 bzw. Apache 2.0).
  Groessen in rem (Festlegung Ralf 07.11.2026).

  Geltung (Festlegung Ralf 07.11.2026): Erklaer-, Ratgeber- und Rechtsseiten (.content_static), Lexikonartikel
  (.lexikon_beitrag, alte Textspalte .detail_show .row.text), Klinikprofil nur Schrift und Zeile (.klinik_text),
  Kurortseite nur die Fliesstexte der Karten. Die Regeln greifen an Absaetzen, Listen und Ueberschriften DIREKT im
  Lesekasten, damit Kacheln, Formulare und Teaser (die ihre Absaetze in eigene Kaesten setzen) unberuehrt bleiben.
*/

/* ---- 0. Grundgroesse: 62,5 % = 10 px bei Standardeinstellung, waechst mit der Browsereinstellung ---- */
html { font-size: 62.5%; }

/* ---- 1. Schriften vom eigenen Server ---- */
@font-face { font-family: 'Merriweather'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('./schriften/merriweather-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Merriweather'; font-style: italic; font-weight: 400; font-display: swap;
  src: url('./schriften/merriweather-latin-400-italic.woff2') format('woff2'); }
@font-face { font-family: 'Merriweather'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('./schriften/merriweather-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Roboto Slab'; font-style: normal; font-weight: 700; font-display: swap;
  src: url('./schriften/roboto-slab-latin-700-normal.woff2') format('woff2'); }

/* ---- 1b. Grundstaerke 400 statt 300 im ganzen Portal (Ralf 07.11.2026); Seitenleiste ebenso ---- */
body { font-weight: 400; }
.container .column_content p { font-weight: 400; }
/* Regeln, die 300 ausdruecklich setzen (index.css 161/165/179, Sortierleisten, 480, 760, 823, 988, 1696, 1710, 1791;
   mobil.css 2309; kurorte_show.html .kp; Kurortkonto .ku und _subtmpl/kurortuser_menu.html .ku-ort, .ku-liste label) --
   Stilbloecke der Vorlagen stehen im body, daher hier hoehere Spezifitaet. Ausgenommen bleibt nur die Startseite
   (index.css 1453, Festlegung 54); index.css 503 setzt 300 an einem leeren ::after und wirkt nicht. */
.header_all .header_lg .outer_top, .header_all .header_lg .top, .header_all .header_lg .top .title,
.kliniken_suche .entry-head .sort a, .kliniken_suche .entry-head .sort form,
.kurorte_suche .entry-head .sort a, .kurorte_suche .entry-head .sort form,
.seite_suche .entry-head .sort a, .suchauftraege_suche .entry-head .sort a, .suchauftraege_suche .entry-head .sort form,
.user p, .userbackend p, .content_static .fachkreise p, .content_static .fachkreise .kritik_outer h3,
.content_static .krankheiten .subtitle a, .content_static .nlp .nlp-vorspann,
.content_body .kp, .content_body .ku, .content_body .ku-feld input, .content_body .ku-upload input,
.klinik_tab .klinik_tab_content_box li, .kurort_info_list, .kurort_tab .kurort_tab_content_box li,
.content_body .ku-leiste .ku-ort, .content_body .ku-liste label { font-weight: 400; }

/* ---- 2. Rahmung: aussen warmes Grau, innen Weiss mit weichem Schatten (portalweit) ---- */
.content_body { background-color: #f1efed; }
.content_body .content_outer .separator { background-color: #f1efed; }
.header_all .header_lg .outer_top, .header_all .header_lg .top { background-color: #f1efed; }
.content_body .content_outer > .content,
.content_body .content_outer > .column_outer { background-color: #fff; box-shadow: 0 1px 4px rgba(0, 0, 0, .1); }
/* Startseitenkaesten: seit v13 MIT Schatten wie alle Kaesten (Ralf 07.11.2026 abends: "Auf der Homepage fehlt bei der
   Rahmung noch der neue Schatten"); die Ausnahme aus v10 (Fable v01 MUSS 2) entfaellt. Die Rahmenregel oben bleibt bewusst
   bei Spezifitaet (0,3,0): ein :not(.index) darin hob sie in v09 auf (0,4,0), und dann verloren die grauen Kaesten der
   Anmelde- und Registrierungsseiten (index.css 1034, 1060) ihr #f9f9f9 (Fable v02 SOLL 1). Die Startseitenkaesten behalten
   ihren Hintergrund selbst (index.css 300, 1481, 1495, 1499); auf dem Telefon bleiben sie ohne die Randverschiebung (Abschnitt 8). */

/* Startseite: nur der Willkommenstext im Lesebild (Ralf 07.11.2026), Kasten und Aufbau bleiben (V11 S5) */
.index2 .first .left .text p { font-family: 'Merriweather', Georgia, serif; font-weight: 400; font-size: 1.7rem;
  line-height: 1.7647; letter-spacing: .01em; color: #000; max-width: 62.4rem; }
.index2 .first .left .text p a { color: #000; text-decoration: none; border-bottom: 1px solid #5c5a58; padding-bottom: 1px; }
.index2 .first .left .text p a:hover { color: #0071ad; border-bottom-color: #0071ad; }
.index2 .first .left .subtitle { font-family: 'Roboto Slab', Georgia, serif; font-weight: 700; }
/* ab 1200 px (Bootstrap lg, Behaelter fest 1140 px): Ueberschrift einzeilig, Text in zwei Spalten (v11) */
@media (min-width: 1200px) {
  .index2 .first .left .subtitle { font-size: 3rem; }
  .index2 .first .left .text { -webkit-column-count: 2; column-count: 2; -webkit-column-gap: 4rem; column-gap: 4rem;
    -webkit-column-rule: 1px solid #dcdad7; column-rule: 1px solid #dcdad7; }
  .index2 .first .left .text p { max-width: none; orphans: 2; widows: 2; }
  .index2 .first .left .text p { -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; text-wrap: pretty; }
  .index2 .first .left .text p a[href*="portal-update"] { white-space: nowrap; }
}
@media (max-width: 767px) {
  .index2 .first .left .subtitle { font-size: 2.6rem; }
}

/* Zertifikatslogos in Klinikeintraegen (kliniken_list_simple.html u. a.: je Logo eine Zelle col-xs-4) nie breiter als ihre
   Zelle -- sonst laeuft das Kaertchen "Beihilfefaehig" in schmalen Spalten ueber das Nachbarlogo (Ralf 07.11.2026, v13). */
.content_body img[src*="/images/zertifikat/"], .content_body img[src*="/images/klinik/logo_"] { max-width: 100%; height: auto; }
/* v14: Das Kaertchen "Beihilfefaehig" (kliniken_show_ajax.html, kliniken_show_ajax_small.html) traegt in der Vorlage
   max-width:130px und steht in einer Zelle col-lg-3 col-md-3, die ab 992 px schmaler ist (Inhalt 78 px bei 992, 115 px bei
   1280) -- die Regel darueber verliert gegen den Inline-Stil. Die Zelle bekommt die Breite des Kaertchens, die Logos daneben
   ruecken nach oder brechen um (gemessen auf /angststoerungen-und-reha.html: 0 statt 2 ueberdeckte Paare bei 992 bis 1440 px).
   Nur Zellen mit col-lg-3, damit das Klinikprofil (col-lg-2 col-md-3) unberuehrt bleibt; ohne :has() bleibt der alte Stand.
   v15: Das Kaertchen ist ueberall hoechstens 13 rem breit (wie der Inline-Stil der anderen Vorlagen und des Klinikprofils), die
   Zelle ab 992 px fest 16 rem statt width:auto -- auto liess es in der Lexikonliste ohne Inline-Stil auf 300 px wachsen. */
.content_body img[src*="/klinik/logo_beihilfe"] { max-width: 100%; max-width: min(100%, 13rem); }
@media (min-width: 992px) {
  .content_body .col-lg-3:has(> a > img[src*="/klinik/logo_beihilfe"]) { width: 16rem; }
}

/* ---- 3. Erklaer-, Ratgeber- und Rechtsseiten (.content_static) ---- */
/* Lesekaesten: der Inhaltskasten selbst, .kk-ze (Reha-Qualitaet) und .infos (Ratgeber Krankheit) */
.content_static .infos { width: auto; margin-left: 0; margin-right: 0; }

.content_static > p,
.content_static > .kk-ze > p,
.content_static .infos > p,
.content_static > ul > li, .content_static > ol > li,
.content_static > .kk-ze > ul > li, .content_static > .kk-ze > ol > li,
.content_static .infos > ul > li, .content_static .infos > ol > li,
.content_static > ul > li > p, .content_static > ol > li > p,
.content_static > table td, .content_static > table th {
  font-family: 'Merriweather', Georgia, serif; font-weight: 400; font-size: 1.7rem; line-height: 1.7647;
  letter-spacing: .01em; color: #000; text-align: left; }

/* Absaetze: Block statt inline-block, Spalte 584 px, mittig */
.content_static > p,
.content_static > .kk-ze > p,
.content_static .infos > p { display: block; width: auto; max-width: 62.4rem; margin: 0 auto 2.4rem; }
.content_static > ul > li > p, .content_static > ol > li > p { display: block; width: auto; margin: 0 0 1.2rem; }

/* Listen und Tabellen in derselben Spalte */
.content_static > ul, .content_static > ol,
.content_static > .kk-ze > ul, .content_static > .kk-ze > ol,
.content_static .infos > ul, .content_static .infos > ol {
  box-sizing: border-box; max-width: 62.4rem; margin: 0 auto 2.4rem; padding-left: 1.4em; }
.content_static > ul li, .content_static > ol li,
.content_static > .kk-ze li, .content_static .infos > ul li, .content_static .infos > ol li { margin-bottom: .8rem; }
.content_static > ul ul, .content_static > ol ol { margin-top: .8rem; padding-left: 1.4em; }
.content_static > table { max-width: 62.4rem; margin-left: auto; margin-right: auto; }

/* Ueberschriften: Roboto Slab fett, Farben bleiben, hoechstens spaltenbreit */
.content_static h1,
.content_static > h2, .content_static > h3, .content_static > h4,
.content_static > .kk-ze > h2, .content_static > .kk-ze > h3, .content_static > .kk-ze > h4,
.content_static .infos > h2, .content_static .infos > h3, .content_static .infos > h4 {
  font-family: 'Roboto Slab', Georgia, serif; font-weight: 700; max-width: 62.4rem; margin-left: auto; margin-right: auto; }
.content_static h1 { font-size: 3.8rem; line-height: 1.15; }
.content_static > h2, .content_static > h3, .content_static > .kk-ze > h2, .content_static > .kk-ze > h3,
.content_static .infos > h2, .content_static .infos > h3 { font-size: 2.4rem; line-height: 1.25; margin-top: 1.4em; margin-bottom: .5em; }
.content_static > h4, .content_static > .kk-ze > h4, .content_static .infos > h4 { font-size: 1.8rem; line-height: 1.3; margin-top: 1.2em; margin-bottom: .4em; }
/* Ueberschriften in Listenpunkten (Datenschutz: Begriffsbestimmungen) */
.content_static > ul > li h2, .content_static > ul > li h3, .content_static > ul > li h4,
.content_static > ol > li h2, .content_static > ol > li h3, .content_static > ol > li h4 {
  font-family: 'Roboto Slab', Georgia, serif; font-weight: 700; letter-spacing: 0; }

/* Kaesten ueber dem Text in die Spalte: Inhaltsverzeichnis der Ratgeber, Steckbrief der Reha-Qualitaet */
.content_static .krankheiten > .menu,
.content_static .krankheiten > .subtitle,
.content_static .kk-ze-kopf { box-sizing: border-box; max-width: 62.4rem; margin-left: auto; margin-right: auto; }

/* Inhaltsverzeichnis der Ratgeber eingeklappt (details/summary in den 19 Vorlagen krank_*-und-reha.html) */
.content_static .krankheiten > .menu > details > summary { display: block; list-style: none; cursor: pointer; }
.content_static .krankheiten > .menu > details > summary::-webkit-details-marker { display: none; }
.content_static .krankheiten > .menu > details > summary > h2 { position: relative; padding-right: 13rem; }
.content_static .krankheiten > .menu > details > summary > h2::after { content: 'anzeigen \25BE';
  content: 'anzeigen \25BE' / 'anzeigen'; position: absolute;
  right: 1.5rem; top: 50%; transform: translateY(-50%); font-size: 1.6rem; font-weight: 400; letter-spacing: .02em; }
.content_static .krankheiten > .menu > details[open] > summary > h2::after { content: 'schlie\00DF en \25B4';
  content: 'schlie\00DF en \25B4' / 'schlie\00DF en'; }
.content_static .krankheiten > .menu > details > summary:hover > h2 { background-color: #005a8a; }
.content_static .krankheiten > .menu > details > summary:focus { outline: 2px solid #0071ad; outline-offset: 2px; }
.content_static .krankheiten > .menu > details > summary:focus:not(:focus-visible) { outline: 0; }

/* Logoleiste der Qualitaetszeichen (zertifikate_mini.html): in der Spalte, zwei Zeilen zu vier */
.content_static .kk-zq-mini { box-sizing: border-box; max-width: 62.4rem; margin-left: auto; margin-right: auto;
  grid-template-columns: repeat(4, 1fr); }

/* Fliesstext in Kacheln schon in der Leseschrift (Ralf, 07.11.2026); Kacheln, Raster und Groessen bleiben */
.content_static .kk-zq-gruppe p, .content_static .kk-zq-zeile,
.content_static .haeufige_krankheiten p {
  font-family: 'Merriweather', Georgia, serif; font-weight: 400; letter-spacing: .01em; color: #000; }
.content_static .kk-zq-gruppe p { font-size: 1.6rem; line-height: 1.6; }
.content_static .kk-zq-zeile { font-size: 1.5rem; line-height: 1.5; }
.content_static .haeufige_krankheiten .haeufige_krankheiten_eintrag > p { width: auto; height: 7.5em; }

/* Fotos im Ratgeber: so breit wie die Spalte, Bildunterschrift Roboto Condensed 14/20 px */
.content_static .infos > a[href$=".jpg"], .content_static .infos > a[href$=".jpeg"],
.content_static .infos > a[href$=".png"], .content_static .infos > a[href$=".webp"] {
  display: block; max-width: 62.4rem; margin: .8rem auto 0; border: 0; }
.content_static .infos > a[href$=".jpg"] img, .content_static .infos > a[href$=".jpeg"] img,
.content_static .infos > a[href$=".png"] img, .content_static .infos > a[href$=".webp"] img {
  display: block; width: 100%; height: auto; }
.content_static .infos > a[href$=".jpg"] + p, .content_static .infos > a[href$=".jpeg"] + p,
.content_static .infos > a[href$=".png"] + p, .content_static .infos > a[href$=".webp"] + p {
  font-family: 'Roboto Condensed', Arial, sans-serif; font-size: 1.4rem; line-height: 1.4286; letter-spacing: 0;
  color: #555; margin: .8rem auto 3.2rem; }

/* ---- 4. Lexikonartikel ---- */
.lexikon_beitrag .lexikon_satz { max-width: 62.4rem; margin-left: auto; margin-right: auto;
  font-size: 1.7rem; line-height: 1.7647; color: #000; }
.lexikon_beitrag .lexikon_text { font-family: 'Merriweather', Georgia, serif; font-weight: 400; letter-spacing: .01em; }
.lexikon_beitrag .lexikon_text p, .lexikon_beitrag .lexikon_text ul, .lexikon_beitrag .lexikon_text ol { margin: 0 0 2.4rem; }
.lexikon_beitrag h1, .lexikon_beitrag .lexikon_text h2, .lexikon_beitrag .lexikon_text h3 {
  font-family: 'Roboto Slab', Georgia, serif; font-weight: 700; letter-spacing: 0; }
.lexikon_beitrag h1 { font-size: 3.8rem; line-height: 1.15; }
.lexikon_beitrag .lexikon_text h2 { font-size: 2.4rem; line-height: 1.25; margin: 2.2em 0 .5em; }
.lexikon_beitrag .lexikon_text h3 { font-size: 2rem; line-height: 1.3; margin: 1.6em 0 .4em; }
/* Einleitungstexte ueber den Lexikonlisten und in den Reitern der Lexikonuebersicht (v12). index.css 721 setzt den
   Kasten auf 300 px mit overflow:hidden; die Mindesthoehe haelt die Logospalte daneben wie bisher. */
.gesundheitslexikon .ubersicht_tab_content .help-text p { font-family: 'Merriweather', Georgia, serif; font-weight: 400;
  font-size: 1.7rem; line-height: 1.7647; letter-spacing: .01em; color: #000; max-width: 62.4rem; }
.gesundheitslexikon .ubersicht_tab_content .help-text p a { color: #000; text-decoration: none;
  border-bottom: 1px solid #5c5a58; padding-bottom: 1px; }
.gesundheitslexikon .ubersicht_tab_content .help-text p a:hover { color: #0071ad; border-bottom-color: #0071ad; }
.gesundheitslexikon .ubersicht_tab_content .help-text p a:focus { outline: 2px solid #0071ad; outline-offset: 2px; }
.gesundheitslexikon .ubersicht_tab_content .help-text h3 { font-family: 'Roboto Slab', Georgia, serif; font-weight: 700; }
/* v14 (Ralf 08.11.2026): Ueberschrift links und auf der Mitte des Lexikonbilds, das kleiner rechtsbuendig daneben steht; Text
   darunter ueber die volle Breite mit groesserem Abstand zur Ueberschrift, mehr Luft zur Suchmaske. Die festen 300 px aus index.css 721/722 fallen fuer Text und Bild; mobil.css V3 (Text und Bild auf
   dem Telefon untereinander, Bild in einem 300 px hohen Kasten) wird damit gegenstandslos. */
/* nur die erste Zeile des Kastens (Text und Bild); die zweite (.row.suche_outer) traegt die Suchmaske und bleibt unberuehrt */
.gesundheitslexikon .ubersicht_tab_content > .row:first-child { position: relative; }
.gesundheitslexikon .ubersicht_tabs .help-text, .gesundheitslexikon .ubersicht_tab_content > .row > .help-text {
  width: 100%; height: auto; min-height: 0; overflow: visible; margin-bottom: 2.4rem; }
.gesundheitslexikon .ubersicht_tab_content > .row > .logo { position: absolute; top: 2rem; right: 15px; width: auto;
  height: auto; padding: 0; overflow: visible; }
.gesundheitslexikon .ubersicht_tab_content > .row > .logo img { display: block; margin: 0 0 0 auto; width: 14rem; height: auto; }
.gesundheitslexikon .ubersicht_tab_content .help-text h3 { display: flex; align-items: center; min-height: 7.4rem;
  margin: 2rem 0 3.2rem; padding-right: 17rem; font-size: 2.4rem; color: #000; }
/* Die alte Uebersicht mit drei Reitern (web_00_gesundheitslexikon.html, nur noch unter ?mod=static erreichbar) steht in
   .content_static: index.css 1573/1577 faerbt dort h3 blau und setzt p auf inline-block mit 75 % Breite -- ein inline-block
   bricht nicht in die naechste Spalte um. Gleichgezogen mit den Listen (dort h3 24 px schwarz, p als Block). */
.gesundheitslexikon .ubersicht_tab_content .help-text p { display: block; width: auto; }
/* ab 992 px zwei Spalten wie der Willkommenstext der Startseite (gemessen bei 1280 px: Spalten 503 px, rund 51 Zeichen) */
@media (min-width: 992px) {
  .gesundheitslexikon .ubersicht_tab_content > .row > .help-text { -webkit-column-count: 2; column-count: 2;
    -webkit-column-gap: 4rem; column-gap: 4rem; -webkit-column-rule: 1px solid #dcdad7; column-rule: 1px solid #dcdad7; }
  .gesundheitslexikon .ubersicht_tab_content .help-text h3 { -webkit-column-span: all; column-span: all; }
  .gesundheitslexikon .ubersicht_tab_content .help-text p { max-width: none; orphans: 2; widows: 2;
    -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; text-wrap: pretty; }
}
.lexikon_beitrag .lexikon_bild figcaption { font-family: 'Roboto Condensed', Arial, sans-serif; font-size: 1.4rem;
  line-height: 1.4286; color: #555; }
/* alte Textspalte (Stichwoerter mit Text, aber ohne Beitrag) */
.detail_show .row.text > div { float: none; max-width: 62.4rem; margin-left: auto; margin-right: auto; padding-left: 0; padding-right: 0;
  font-family: 'Merriweather', Georgia, serif; font-weight: 400; font-size: 1.7rem; line-height: 1.7647;
  letter-spacing: .01em; color: #000; }
.detail_show .row.text p { margin: 0 0 2.4rem; }
.detail_show .row.text h1, .detail_show .row.text h2, .detail_show .row.text h3, .detail_show .row.text h4 {
  font-family: 'Roboto Slab', Georgia, serif; font-weight: 700; letter-spacing: 0; }
.detail_show .row.text .wp-caption { max-width: 100%; width: auto !important; }
.detail_show .row.text img { max-width: 100%; height: auto; }
.detail_show .row.text .wp-caption img { width: 100%; }
.lexikon_beitrag .lexikon_bild img { width: 100%; height: auto; }
.detail_show .row.text .wp-caption-text { font-family: 'Roboto Condensed', Arial, sans-serif; font-size: 1.4rem;
  line-height: 1.4286; letter-spacing: 0; color: #555; }

/* ---- 5. Klinikprofil: nur Schrift und Zeile (Aufbau bleibt bis zum Neubau A0 Teil 2) ---- */
.klinik_text { max-width: 62.4rem; }
/* v14: Bilder im Beschreibungstext hoechstens spaltenbreit (Klinik 3872: 500 px breites Bild, am Telefon 159 px Ueberlauf) */
.klinik_text img { max-width: 100%; height: auto; }
.klinik_text p, .klinik_text li {
  font-family: 'Merriweather', Georgia, serif; font-weight: 400; font-size: 1.7rem; line-height: 1.7647;
  letter-spacing: .01em; color: #000; }

/* ---- 6. Kurortseite: nur die Fliesstexte der Karten ---- */
.kp .kp-text, .kp .kp-heilanzeigen, .kp .kp-lead, .kp .kp-kost p {
  font-family: 'Merriweather', Georgia, serif; font-weight: 400; letter-spacing: .01em; color: #000; }
.kp .kp-text, .kp .kp-heilanzeigen { font-size: 1.7rem; line-height: 1.7647; }
.kp .kp-lead { font-size: 1.8rem; line-height: 1.7; }
.kp .kp-kost p { font-size: 1.5rem; line-height: 1.6; }

/* ---- 7. Verweise im Lesetext: Textfarbe mit feiner Linie (nicht Navigation, Knoepfe, Kacheln, Bildverweise) ---- */
.content_static > p a, .content_static > .kk-ze > p a, .content_static .infos > p a,
.content_static > ul > li a, .content_static > ol > li a, .content_static > .kk-ze li a,
.content_static .infos > ul > li a, .content_static .infos > ol > li a,
.lexikon_beitrag .lexikon_text a, .detail_show .row.text a, .klinik_text a,
.kp .kp-text a, .kp .kp-heilanzeigen a, .kp .kp-lead a, .kp .kp-kost p a {
  color: #000; text-decoration: none; border-bottom: 1px solid #5c5a58; padding-bottom: 1px; }
.content_static > p a:visited, .content_static > .kk-ze > p a:visited, .content_static .infos > p a:visited,
.content_static > ul > li a:visited, .content_static > ol > li a:visited, .content_static > .kk-ze li a:visited,
.content_static .infos > ul > li a:visited, .content_static .infos > ol > li a:visited,
.lexikon_beitrag .lexikon_text a:visited, .detail_show .row.text a:visited, .klinik_text a:visited,
.kp .kp-text a:visited, .kp .kp-heilanzeigen a:visited, .kp .kp-lead a:visited, .kp .kp-kost p a:visited { color: #000; }
.content_static > p a:hover, .content_static > .kk-ze > p a:hover, .content_static .infos > p a:hover,
.content_static > ul > li a:hover, .content_static > ol > li a:hover, .content_static > .kk-ze li a:hover,
.content_static .infos > ul > li a:hover, .content_static .infos > ol > li a:hover,
.lexikon_beitrag .lexikon_text a:hover, .detail_show .row.text a:hover, .klinik_text a:hover,
.kp .kp-text a:hover, .kp .kp-heilanzeigen a:hover, .kp .kp-lead a:hover, .kp .kp-kost p a:hover {
  color: #0071ad; border-bottom-color: #0071ad; text-decoration: none; }
.content_static > p a:focus, .content_static > .kk-ze > p a:focus, .content_static .infos > p a:focus,
.content_static > ul > li a:focus, .content_static > ol > li a:focus, .content_static > .kk-ze li a:focus,
.content_static .infos > ul > li a:focus, .content_static .infos > ol > li a:focus,
.lexikon_beitrag .lexikon_text a:focus, .detail_show .row.text a:focus, .klinik_text a:focus,
.kp .kp-text a:focus, .kp .kp-heilanzeigen a:focus, .kp .kp-lead a:focus, .kp .kp-kost p a:focus {
  outline: 2px solid #0071ad; outline-offset: 2px; }
/* Sprungverweise der Reha-Qualitaet sind Navigation, kein Lesetext: Portalblau fett wie in zertifikate_stil.html */
.content_static > p.kk-zq-sprung a, .content_static > .kk-ze > p.kk-zq-mini-text a, .content_static > p.kk-zq-mini-text a,
.content_static > p.kk-ze-zurueck a, .content_static > .kk-ze > p.kk-ze-zurueck a {
  color: #0071ad; font-weight: 700; border-bottom: 0; padding-bottom: 0; }
/* Ueberschriften mit Verweis behalten ihre Farbe und bekommen keine Linie */
.content_static h2 a, .content_static h3 a, .lexikon_beitrag h2 a, .lexikon_beitrag h3 a { color: inherit; border: 0; }

/* ---- 8. Telefon (Bootstrap xs, unter 768 px): Weiss ueber die volle Breite, 16 px Rand, 16/27 px ---- */
@media (max-width: 767px) {
  .content_body .content_outer:not(.content_outer_breadcrumbs) > .content:not(.index),
  .content_body .content_outer > .column_outer {
    margin-left: -15px; margin-right: -15px; width: auto; padding-left: 1.6rem; padding-right: 1.6rem; }
  .content_body .content_outer > .column_outer > .column > .content { padding-left: 0; padding-right: 0; }
  /* v13: Bootstrap-Zeile direkt in einer Zeile (Anmeldeseite: .content.user_login2 > .row.login_info > .row) -- jede zieht
     -15 px; der alte Innenabstand von 30 px fing das auf, die 16 px seit Paket 28 nicht: 15 px Ueberlauf am Telefon. */
  .content_body .content_outer > .content > .row > .row { margin-left: 0; margin-right: 0; }
  /* v13, Rundgang ueber 70 Seiten am Telefon (werkstatt\ueberlauf-rundgang.js): mobil.css 204 gibt den Suchanfragen 12 px
     Innenabstand mit !important, die Zeilen darin ziehen -15 px -- 3 px Ueberlauf; 15 px gleichen genau aus. */
  .content_body .content_outer > .content.suchauftraege { padding-left: 15px !important; padding-right: 15px !important; }
  /* lange Woerter und Verweise im Lesetext und in Ueberschriften umbrechen statt hinausragen (Mutter-Kind-Kur: Verweis in
     einer Aufzaehlung; HWS-Ratgeber: "(Halswirbelsaeulensyndrom)," in der Ueberschrift) */
  .content_static p, .content_static li, .klinik_text p, .klinik_text li, .lexikon_beitrag .lexikon_satz { overflow-wrap: break-word; }
  .content_static h1, .content_static h2, .content_static h3, .lexikon_beitrag h1 {
    -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; overflow-wrap: break-word; }
  /* Suchergebnisse: "0 Treffer" steht in 28,8 px in einer Spalte col-xs-2 von 65 px (8 px Ueberlauf schon vor Paket 28,
     seither 27) -- Zahl und Wort rechtsbuendig in eigener Breite, die Ueberschrift links daneben oder darueber */
  .content_body .entry-head > .col-xs-10:first-child { width: auto; }
  .content_body .entry-head > .result_count { width: auto; float: right; font-size: 2.2rem; white-space: nowrap; }
  /* Ratgeber: mobil.css Y1 glich mit -15 px den alten rechten Innenabstand von 30 px aus; der ist jetzt 0 */
  .content_static.container.content > .krankheiten { margin-right: 0 !important; }
  /* Klinikliste unter einem Lexikonartikel: Bootstrap-Zeilen brauchen 15 px Innenabstand im Behaelter */
  .content_body .content_outer > .column_outer > .column > .lexikonliste { padding-left: 15px; padding-right: 15px; }
  /* Lexikonartikel: 16 px Rand wie alle Leseseiten (mobil.css AG1 setzte 18 px), Bild weiter randlos */
  .content_body .content_outer .container.lexikon_beitrag { padding-left: 1.6rem !important; padding-right: 1.6rem !important; }
  .lexikon_beitrag .lexikon_bild { margin-left: -1.6rem !important; margin-right: -1.6rem !important; }
  .lexikon_beitrag .lexikon_bild figcaption { padding-left: 1.6rem !important; padding-right: 1.6rem !important; }
  /* alte Lexikonspalte: die Bootstrap-Zeile zieht -15 px, der Behaelter hat nur noch 16 px (Fable MUSS 1) */
  .detail_show .row.text { margin-left: 0; margin-right: 0; }
  /* breite Tabellen wischen waagerecht, statt die Seite zu verbreitern */
  .content_static > table { display: block; max-width: 100%; overflow-x: auto; }

  .content_static > p, .content_static > .kk-ze > p, .content_static .infos > p,
  .content_static > ul > li, .content_static > ol > li,
  .content_static > .kk-ze > ul > li, .content_static > .kk-ze > ol > li,
  .content_static .infos > ul > li, .content_static .infos > ol > li,
  .content_static > ul > li > p, .content_static > ol > li > p,
  .detail_show .row.text > div,
  .klinik_text p, .klinik_text li, .kp .kp-text, .kp .kp-heilanzeigen {
    font-size: 1.6rem; line-height: 1.6875; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
  .lexikon_beitrag .lexikon_satz { font-size: 1.6rem !important; line-height: 1.6875 !important;
    -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
  .gesundheitslexikon .ubersicht_tab_content .help-text p { font-size: 1.6rem; line-height: 1.6875;
    -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
  /* v14: Auf dem Telefon braucht die laengste Ueberschrift ("Alle medizinischen Fachgebiete im Ueberblick") neben dem Bild
     drei Zeilen; damit das Bild trotzdem auf ihrer Mitte steht, werden Ueberschrift und Bild Zellen eines Rasters (der
     Textkasten loest sich dafuer mit display:contents auf, die Absaetze laufen ueber beide Rasterspalten). Ueberschrift 2,1 rem
     wie die Zwischenueberschriften der Ratgeber am Telefon, Bild 8 rem. Die Bootstrap-Zeile verliert ihre -15 px und ihre
     Hilfselemente ::before/::after (sie waeren sonst Rasterzellen); mobil.css V3 setzt beide Kaesten mit !important auf
     100 %, das bleibt im Raster ohne Wirkung. */
  .gesundheitslexikon .ubersicht_tab_content > .row:first-child { display: grid; grid-template-columns: minmax(0, 1fr) auto;
    -webkit-column-gap: 1.6rem; column-gap: 1.6rem; align-items: center; margin-left: 0; margin-right: 0; }
  .gesundheitslexikon .ubersicht_tab_content > .row:first-child::before,
  .gesundheitslexikon .ubersicht_tab_content > .row:first-child::after { display: none; }
  .gesundheitslexikon .ubersicht_tab_content > .row > .help-text { display: contents; }
  .gesundheitslexikon .ubersicht_tab_content > .row > .help-text > h3 { grid-column: 1; grid-row: 1; display: block; min-height: 0;
    padding-right: 0; margin: 2rem 0 2.4rem; font-size: 2.1rem; line-height: 1.25; }
  .gesundheitslexikon .ubersicht_tab_content > .row > .help-text > p { grid-column: 1 / -1; }
  .gesundheitslexikon .ubersicht_tab_content > .row > .help-text > p:last-child { margin-bottom: 2.4rem; }
  .gesundheitslexikon .ubersicht_tab_content > .row > .logo { position: static; grid-column: 2; grid-row: 1; margin: 2rem 0 2.4rem; }
  .gesundheitslexikon .ubersicht_tab_content > .row > .logo img { width: 8rem; }
  .content_static > p, .content_static > .kk-ze > p, .content_static .infos > p,
  .content_static > ul, .content_static > ol, .content_static .infos > ul, .content_static .infos > ol { margin-bottom: 1.6rem; }
  .content_static h1, .lexikon_beitrag h1 { font-size: 2.8rem; }
  .content_static > h2, .content_static > h3, .content_static > .kk-ze > h2, .content_static > .kk-ze > h3,
  .content_static .infos > h2, .content_static .infos > h3, .lexikon_beitrag .lexikon_text h2 { font-size: 2.1rem; }
}