/* ------------------------------------------------------------------
   Hinweiskästen und Knöpfe (Vorschlag 12.10.2026, Wunsch Bee):
   1) Hinweiskästen gibt es nur in Grün und Blau. Beide sehen gleich aus:
      heller Hintergrund, dunklerer Strich links, gerade Ecken.
      Kästen auf Leistungsseiten bleiben kräftig gefärbt, außer sie enthalten
      organisatorische Hinweise für Patienten (Klasse frame-hinweis, z. B. Vorsorge).
      Ausnahme: Stellenanzeigen (Seiten page47 und page36) bleiben, wie sie sind.
      Alle anderen Kästen (bunte Kästen, Kacheln, Ablauf, Rahmen) bleiben unverändert.
   2) Alle Knöpfe eckig mit leicht abgerundeten Ecken (6px), auch „Senden“.
      Einzige Ausnahme: der Telefonnummer-Knopf bleibt rund.
   Rücknahme: diese Datei aus den Seiten entfernen.
   ------------------------------------------------------------------ */
:root{
  --hinweis-gruen-hell:#eaf6e6; --hinweis-gruen-strich:#30ab09; --hinweis-gruen-schrift:#1f7a0a;
  --hinweis-blau-hell:#e3effa;  --hinweis-blau-strich:#005aaa; --hinweis-blau-schrift:#005aaa;
}

/* Vorlage für neue Hinweiskästen: <div class="kasten kasten--gruen"> oder <div class="kasten kasten--blau"> */
.kasten{padding:25px 20px;margin:0 0 20px;color:#012343;border-radius:0;}
#inhaltsbereich .kasten > :first-child{margin-top:0;}
#inhaltsbereich .kasten > :last-child{margin-bottom:0;}
.kasten--gruen{background:var(--hinweis-gruen-hell);border-left:6px solid var(--hinweis-gruen-strich);}
.kasten--blau{background:var(--hinweis-blau-hell);border-left:6px solid var(--hinweis-blau-strich);}
.kasten--gruen h2,.kasten--gruen h3,.kasten--gruen h4,#inhaltsbereich .kasten--gruen a{color:var(--hinweis-gruen-schrift);}
.kasten--blau h2,.kasten--blau h3,.kasten--blau h4,#inhaltsbereich .kasten--blau a{color:var(--hinweis-blau-schrift);}
#inhaltsbereich .kasten--blau a:hover,#inhaltsbereich .kasten--gruen a:hover{color:#012343;}

/* Grüne und kräftig blaue Kästen: Farbe bleibt, nur gerade Ecken (nicht in den Stellenanzeigen) */
body:not(.page47):not(.page36) .frame-gren > .rahmen,
body:not(.page47):not(.page36) .frame-bluebox > .rahmen,
body:not(.page47):not(.page36) blockquote{border-radius:0;}

/* Blaue Kästen mit organisatorischen Hinweisen (Klasse frame-hinweis, bisher nur Vorsorge):
   bisher kräftiges Blau mit weißer Schrift, neu hellblau mit dunkelblauem Strich.
   Allergietest und Desensibilisierung bleiben kräftig blau (Bee 12.10.2026). */
.frame-bluebox.frame-hinweis > .rahmen,
.tx_cn-columns[data-cols="3"] .row > div > .frame-bluebox.frame-hinweis > .rahmen{
  background:var(--hinweis-blau-hell);border-left:6px solid var(--hinweis-blau-strich);border-radius:0;color:#012343;}
.frame-bluebox.frame-hinweis h2,
.frame-bluebox.frame-hinweis h3,
.frame-bluebox.frame-hinweis h4,
.frame-bluebox.frame-hinweis a{color:var(--hinweis-blau-schrift);}
.frame-bluebox.frame-hinweis a:hover{color:#012343;}
.frame-bluebox.frame-hinweis p,
.frame-bluebox.frame-hinweis li{color:#012343;}

/* Alle Knöpfe eckig mit leicht abgerundeten Ecken */
a.more,
a.more.more--lesbar,
button.powermail_submit,
input.powermail_submit,
#inhaltsbereich .frame-cta-box .ce-bodytext a:not(.link-phone),
#inhaltsbereich .lz-sprung a,
.cookie_only-this,
#cookie_einstellungen,
.cookie_einstellungen,
#cookieman-modal .btn,
#footer > .rahmen > .qnavi > li > a,
a.sprunglink{border-radius:6px !important;}

/* Kontakt (Bee 12.10.2026): „Route planen“ am PC linksbündig mit dem Knopf „Senden“ */
@media (min-width: 992px) {
  #inhaltsbereich .route-rechts{padding-left:24px;}
}

/* Kräftige Kästen auf Leistungsseiten in der Farbe des Kopfbilds (Bee 13.10.2026),
   Farben wie bei den Kacheln der Leistungsübersicht und der Impfungen, dunkle Schrift, runde Ecken.
   Allergietest (page16): Gelb wie die Pollen; Desensibilisierung (page17): Flieder */
body.page16 #inhaltsbereich .frame-bluebox > .rahmen{background:var(--gelb);color:#012343;border-radius:var(--ecke);}
body.page17 #inhaltsbereich .frame-bluebox > .rahmen{background:#d5b6d8;color:#012343;border-radius:var(--ecke);}
body.page16 .frame-bluebox h2, body.page16 .frame-bluebox h3, body.page16 .frame-bluebox p, body.page16 .frame-bluebox li, body.page16 .frame-bluebox a,
body.page17 .frame-bluebox h2, body.page17 .frame-bluebox h3, body.page17 .frame-bluebox p, body.page17 .frame-bluebox li, body.page17 .frame-bluebox a{color:#012343;}

/* Einheitliche runde Ecken (Bee 13.10.2026, Vorschlag): alle Kästen, Kacheln, Kärtchen und Formulare
   mit derselben sanften Rundung; Hinweiskästen mit Strich links gerade, rechts rund.
   Knöpfe bleiben bei 6px, Telefonnummer-Knopf rund, Benefit-Kästchen unverändert. */
:root{--ecke:12px; --hinweis-gruen-hell:#dcefd4; --hinweis-blau-hell:#cde2f6;}

/* Hinweiskästen mit Strich (grün und hellblau): links gerade, rechts rund; auch in den Stellenanzeigen */
#inhaltsbereich .kasten,
#inhaltsbereich .frame-gren > .rahmen,
#inhaltsbereich blockquote,
#inhaltsbereich .frame-bluebox.frame-hinweis > .rahmen{border-radius:0 var(--ecke) var(--ecke) 0;}
#inhaltsbereich .frame-gren > .rahmen,
#inhaltsbereich blockquote{background:var(--hinweis-gruen-hell);}
/* Aufzählungen in hellblauen Kästen mit blauen Eicheln */
#inhaltsbereich .frame-bluebox.frame-hinweis ul li::before{background-image:url(../fileadmin/cn_website/images/acorn_blau.svg);}

/* Bunte Kästen, Kacheln, Kärtchen, Ablauf-Schritte, Kontakt-Kästen: dieselbe Rundung */
#inhaltsbereich .frame-buntebox > .rahmen,
#inhaltsbereich .frame-kachelbtn .rahmen,
#c609 .lz-karte > .rahmen,
#inhaltsbereich .frame-ablauf ol li,
#inhaltsbereich .frame-cta-box .row > div,
#inhaltsbereich .news .news-list2-container .article{border-radius:var(--ecke) !important;}
#c609.lz-variante-fotos .lz-foto,
#inhaltsbereich .news .news-list2-container .article .categoryimg{border-radius:var(--ecke) var(--ecke) 0 0 !important;overflow:hidden;}

/* Formulare und Dankeskarte: bleiben hellgrün (große Fläche zarter, Bee 13.10.2026), dieselbe Rundung;
   Eingabefelder bleiben wie sie sind */
#inhaltsbereich .tx-powermail.modern form,
#inhaltsbereich .tx-powermail .formular-danke{border-radius:var(--ecke);}
/* Grüne Kästen (blockquote): der Strich links machte den Kasten 6px zu breit, dadurch wurde die
   rechte Rundung abgeschnitten; Breite um den Strich verringern */
#inhaltsbereich blockquote{width:calc(100% - 46px) !important;}
#inhaltsbereich .frame-gren > .rahmen,
#inhaltsbereich .frame-bluebox.frame-hinweis > .rahmen{box-sizing:border-box;width:100% !important;}

/* Kontakt (Bee 13.10.2026): Sprechstunden als Tabelle wie auf der Startseite; Abstand zum grünen Kasten darunter */
body.page43 #inhaltsbereich .ce-bodytext figure.table{margin-bottom:24px;}
/* Mikroimmuntherapie: grüner Kasten auf orangem Hintergrund hatte statt des Strichs einen grauen Rahmen rundum;
   jetzt wie alle grünen Hinweiskästen */
#inhaltsbereich .frame-gren > .rahmen{border:0 !important;border-left:6px solid var(--hinweis-gruen-strich) !important;}
#inhaltsbereich .frame-bluebox.frame-hinweis ul,#inhaltsbereich .kasten ul,#inhaltsbereich .frame-gren ul,#inhaltsbereich blockquote ul{padding:0 0 0 10px !important;}
/* Alle Strich-Kästen (grün und blau) mit gleichem Innenabstand auf Handy, Tablet und PC */
#inhaltsbereich .kasten,#inhaltsbereich .frame-gren > .rahmen,#inhaltsbereich blockquote,#inhaltsbereich .frame-bluebox.frame-hinweis > .rahmen{padding:25px 20px !important;}
/* Überschriften in Strich-Kästen einheitlich (Bee 13.10., Muster A): Farbe des Kastens */
#inhaltsbereich .frame-gren > .rahmen :is(h2,h3,h4),#inhaltsbereich blockquote :is(h2,h3,h4),#inhaltsbereich .kasten--gruen :is(h2,h3,h4){color:#1f7a0a !important;}
#inhaltsbereich .frame-bluebox.frame-hinweis > .rahmen :is(h2,h3,h4),#inhaltsbereich .kasten--blau :is(h2,h3,h4){color:#005aaa !important;}
/* Überschriften-Standard (Bee 13.10.): H1 Seitentitel 36px (Handy 24px), H2 Abschnitt 30px (Handy 24px),
   H3 Unterabschnitt und jede Überschrift in Kästen/Kacheln 22px (Handy 20px). Schrift überall Caveat Brush. */
#inhaltsbereich h3,
#inhaltsbereich .frame-buntebox :is(h2,h3),
#inhaltsbereich .frame-notfall :is(h2,h3),
#inhaltsbereich .frame-gren > .rahmen :is(h2,h3),#inhaltsbereich blockquote :is(h2,h3),#inhaltsbereich .kasten :is(h2,h3),
#inhaltsbereich .frame-bluebox.frame-hinweis > .rahmen :is(h2,h3),
#inhaltsbereich .cnmc-accordion h3.ui-accordion-header{font-size:22px !important;line-height:1.25 !important;}
@media (max-width:500px){
#inhaltsbereich h3,
#inhaltsbereich .frame-buntebox :is(h2,h3),
#inhaltsbereich .frame-notfall :is(h2,h3),
#inhaltsbereich .frame-gren > .rahmen :is(h2,h3),#inhaltsbereich blockquote :is(h2,h3),#inhaltsbereich .kasten :is(h2,h3),
#inhaltsbereich .frame-bluebox.frame-hinweis > .rahmen :is(h2,h3),
#inhaltsbereich .cnmc-accordion h3.ui-accordion-header{font-size:20px !important;}
}
/* Neue echte Überschriften, die vorher fett gedruckte Absätze waren */
#inhaltsbereich h2.steckbrief-name{margin:0 0 14px;}
#inhaltsbereich h3.steckbrief-titel{margin:18px 0 8px;color:#012343;}
#inhaltsbereich h2.kontakt-sprechzeiten{margin:12px 0 30px;}
#inhaltsbereich p.einleitung-fett{padding-top:21px;}
/* Formular-Knöpfe („Senden“, „Bewerbung senden“) so groß wie alle anderen Knöpfe (Bee 14.10.) */
#inhaltsbereich .tx-powermail.modern button.powermail_submit{width:auto;display:inline-flex;font-size:17px;line-height:1.4;letter-spacing:0;padding:14px 24px 14px 26px;box-shadow:none;}
#inhaltsbereich .tx-powermail.modern button.powermail_submit svg{width:18px;height:18px;}
@media (max-width:480px){#inhaltsbereich .tx-powermail.modern button.powermail_submit{font-size:15px;padding:12px 16px;}}
/* Zweizeilige Seitentitel (eine Überschrift mit zwei Zeilen): zweite Zeile so groß wie die Unterzeile auf den anderen Seiten (Bee 14.10.) */
#inhaltsbereich h1 > span + span{display:block;font-size:30px;line-height:1.3em;margin-top:22px;}
@media (max-width:500px){#inhaltsbereich h1 > span + span{font-size:24px;}}
/* Aktuelles-Einzelbeiträge: alle Bilder im selben Rahmen (PC/Tablet 300 x 300), nichts abgeschnitten (Bee 14.10.) */
@media (min-width:801px){
.news-single .article .news-img-wrap{width:300px !important;}
.news-single .article .news-img-wrap picture img{width:300px !important;height:auto !important;max-width:none !important;}
}
@media (max-width:800px){
.news-single .article .news-img-wrap picture img{width:100% !important;max-width:400px !important;height:auto !important;max-height:360px;object-fit:contain;object-position:left top;}
}
/* „Ihre Befunde“: statt Bild QR-Code und Store-Knöpfe zum Herunterladen der Praxis-App (Bee 14.10.) */
.news-single .article .app-download .app-qr{display:block;width:180px !important;height:auto;margin:0 auto;}
.news-single .article .app-download p{margin:0;text-align:center;}
.news-single .article .app-download .app-qr-text{font-size:15px;line-height:1.4;color:#012343;margin:10px 0 14px;}
.news-single .article .app-download .app-badges{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.news-single .article .app-download .app-badges img{display:block;width:140px !important;height:auto !important;max-width:none;}
.news-single .article .app-badges--handy{display:none;}
@media (min-width:600px) and (max-width:800px){.news-single .article .app-download{width:300px;}}
@media (max-width:599px){
.news-single .article .app-download{display:none;}
.news-single .article .app-badges--handy{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0 0;}
.news-single .article .app-badges--handy img{display:block;width:140px !important;height:auto !important;}
}
/* REGEL (Bee 14.10.): QR-Codes nur auf Tablet und PC, am Handy (unter 600px) nie, auf der ganzen Website */
@media (max-width:599px){
#inhaltsbereich .ce-row:has(img[src*="qr-code"]),#inhaltsbereich figure:has(img[src*="qr-code"]),#inhaltsbereich img[src*="qr-code"]{display:none !important;}
}
/* REGEL (Bee 14.10.): Keine Textzeile über die ganze Breite. Fließtext höchstens 760px breit (ca. 90 Zeichen),
   in Aktuelles-Beiträgen läuft der Text nie unter das Bild */
/* Bee 14.10. 23:11: kürzere Zeilen NUR auf den freigegebenen Seiten (Impressum, Datenschutz, Wichtige Hinweise, Team, alle Aktuelles-Beiträge),
   auf allen anderen Seiten bleibt die Zeilenlänge unverändert */
:is(body.page6,body.page7,body.page42,body.page34) #inhaltsbereich :is(p,.ce-bodytext > ul),html:has(link[rel="canonical"][href*="/praxis/aktuelles/detail/"]) #inhaltsbereich .news-single :is(p,.news-text-wrap > ul){max-width:760px;}
#inhaltsbereich .frame-ablauf .ce-bodytext > ul{max-width:none;}
#inhaltsbereich :is(p,ul,ol).text-center,#inhaltsbereich :is(p,ul,ol)[style*="text-align: center"],#inhaltsbereich :is(p,ul,ol)[style*="text-align:center"]{margin-left:auto;margin-right:auto;}
@media (min-width:801px){html:has(link[rel="canonical"][href*="/praxis/aktuelles/detail/"]) .news-single .article .news-text-wrap{overflow:hidden;}}
/* Wichtige Hinweise, Kasten „Unsere Praxis-App“: Store-Knöpfe links untereinander, QR-Code daneben (Bee 14.10.) */
#c594 .ce-gallery{display:grid;grid-template-columns:auto auto;justify-content:start;align-items:center;column-gap:24px;row-gap:12px;float:none;width:auto;margin:0;}
#c594 .ce-gallery .ce-row{margin:0;}
#c594 .ce-gallery .ce-row:nth-child(1){grid-column:1;grid-row:1;align-self:end;}
#c594 .ce-gallery .ce-row:nth-child(2){grid-column:1;grid-row:2;align-self:start;}
#c594 .ce-gallery .ce-row:nth-child(3){grid-column:2;grid-row:1 / span 2;}
#c594 .ce-gallery figure{margin:0;}
#c593 p.app-flyer{margin-top:20px;}
@media (max-width:599px){#c594 .ce-gallery{grid-template-columns:auto auto;column-gap:12px;}#c594 .ce-gallery .ce-row:nth-child(2){grid-column:2;grid-row:1;align-self:end;}}
/* Ausnahmen Zeilenlänge (Bee 14.10.): Infothek-Banner bleibt über die volle Breite mittig; Rundgang-Einleitung linksbündig so breit wie die Bilder;
   TCM und Darmmikrobiom ohne Ausnahme, also mit ihren ursprünglichen Breiten (Bee 15.10.) */
#inhaltsbereich #c189 p{max-width:none;}
#inhaltsbereich p.rundgang-intro{max-width:none;}
/* Wichtige Hinweise: Kästen mit Bild links behalten ihre ursprüngliche Breite 720px, sonst rutscht Text neben die Überschrift (Bee 15.10.) */
body.page42 #inhaltsbereich .frame-icon-text .ce-textpic .ce-bodytext > :is(p,ul){max-width:720px;}
/* Mikroimmuntherapie, oranger Bereich „Diagnostik & Individualisierung“ (Bee 14.10.2026):
   wieder genau wie auf der Live-Seite, also KEIN grüner Hinweiskasten, sondern durchsichtig
   mit zartem grauem Rahmen (PC) bzw. grauem Strich oben (Tablet/Handy), Überschrift dunkelblau
   in derselben Größe wie die Überschrift daneben. Gilt für jeden .frame-gren im orangen Bereich. */
#inhaltsbereich .frame-bg-icon.frame-layout-3 .frame-gren > .rahmen{
  background:none !important;border:5px solid rgba(0,0,0,.1) !important;border-radius:var(--ecke) !important;
  padding:25px 20px !important;box-sizing:content-box;width:calc(96% - 50px) !important;}
#inhaltsbereich .frame-bg-icon.frame-layout-3 .frame-gren > .rahmen :is(h2,h3,h4){color:var(--darkblue) !important;}
#inhaltsbereich .frame-bg-icon.frame-layout-3 .frame-gren > .rahmen h2{font-size:30px !important;line-height:1.3 !important;}
@media (max-width:991px){
  #inhaltsbereich .frame-bg-icon.frame-layout-3 .frame-gren > .rahmen{
    width:100% !important;box-sizing:border-box;border:0 !important;border-top:5px solid rgba(0,0,0,.1) !important;
    border-radius:0 !important;padding:20px 0 0 0 !important;}
}
@media (max-width:500px){
  #inhaltsbereich .frame-bg-icon.frame-layout-3 .frame-gren > .rahmen h2{font-size:24px !important;}
}

/* REGEL (Bee 14.10.2026): In ALLEN Kästen auf allen Seiten ist der Abstand unten (letzte Zeile bis Kastenende)
   genauso groß wie oben (Kastenanfang bis erste Zeile). Dafür: kein Außenabstand unter dem letzten und über dem
   ersten Inhalt, Überschrift am Kastenanfang ohne Extra-Abstand oben, Innenabstand unten = oben. */
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :last-child,
#inhaltsbereich .kasten > :last-child,
#inhaltsbereich blockquote > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :last-child > :last-child,
#inhaltsbereich .kasten > :last-child > :last-child,
#inhaltsbereich blockquote > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :last-child > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :last-child > :last-child > :last-child,
#inhaltsbereich .kasten > :last-child > :last-child > :last-child,
#inhaltsbereich blockquote > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :last-child > :last-child > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .kasten > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich blockquote > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .kasten > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich blockquote > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .kasten > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich blockquote > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .kasten > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich blockquote > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child{margin-bottom:0 !important;}
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :first-child:not(.lz-foto),
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :first-child:not(.lz-foto),
#inhaltsbereich .kasten > :first-child:not(.lz-foto),
#inhaltsbereich blockquote > :first-child:not(.lz-foto),
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :first-child:not(.lz-foto),
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich .kasten > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich blockquote > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich .kasten > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich blockquote > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich .kasten > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich blockquote > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto),
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto) > :first-child:not(.lz-foto){margin-top:0 !important;}
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > header:first-child > :is(h2,h3,h4):first-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > header:first-child > :is(h2,h3,h4):first-child,
#inhaltsbereich .kasten > header:first-child > :is(h2,h3,h4):first-child,
#inhaltsbereich blockquote > header:first-child > :is(h2,h3,h4):first-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > header:first-child > :is(h2,h3,h4):first-child{padding-top:0 !important;}
/* Strich-Kästen und Kacheln in einer Reihe: gleich hoch, aber der Inhalt läuft nie mehr über den Kasten hinaus
   (vorher feste Höhe, dadurch war unten kaum oder gar kein Abstand) */
#inhaltsbereich :is(.frame-gren,.frame-bluebox.frame-hinweis) > .rahmen{height:auto !important;min-height:100%;}
/* Kästen im orangen/lila Bereich (z. B. Praxis-App): am Handy unten derselbe Abstand wie oben */
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame{padding-bottom:20px !important;}
/* Kästen mit Spalten: auch in jeder Spalte kein Außenabstand unter dem letzten Inhalt */
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen .row > [class*="col-"] > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen .row > [class*="col-"] > :last-child > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen .row > [class*="col-"] > :last-child > :last-child > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame .row > [class*="col-"] > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame .row > [class*="col-"] > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame .row > [class*="col-"] > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .kasten .row > [class*="col-"] > :last-child,
#inhaltsbereich .kasten .row > [class*="col-"] > :last-child > :last-child,
#inhaltsbereich .kasten .row > [class*="col-"] > :last-child > :last-child > :last-child,
#inhaltsbereich .kasten .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .kasten .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .kasten .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich blockquote .row > [class*="col-"] > :last-child,
#inhaltsbereich blockquote .row > [class*="col-"] > :last-child > :last-child,
#inhaltsbereich blockquote .row > [class*="col-"] > :last-child > :last-child > :last-child,
#inhaltsbereich blockquote .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich blockquote .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich blockquote .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) .row > [class*="col-"] > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) .row > [class*="col-"] > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) .row > [class*="col-"] > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child > :last-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) .row > [class*="col-"] > :last-child > :last-child > :last-child > :last-child > :last-child > :last-child{margin-bottom:0 !important;}
#inhaltsbereich :is(.frame-gren,.frame-bluebox,.frame-buntebox:not(.frame-type-shortcut)) > .rahmen > :is(h2,h3,h4):first-child,
#inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame > :is(h2,h3,h4):first-child,
#inhaltsbereich .kasten > :is(h2,h3,h4):first-child,
#inhaltsbereich blockquote > :is(h2,h3,h4):first-child,
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) > :is(h2,h3,h4):first-child{padding-top:0 !important;}
/* Graue Bänder mit Bildkacheln: unter der letzten Kachelreihe kein Extra-Abstand */
#inhaltsbereich .frame-layout-4:is(.frame-default,.frame-zwei,.frame-benefits,.frame-leistungen) .ce-gallery > .ce-row:last-child{padding-bottom:0 !important;}
/* Bunte Quadrate „Bausteine der Immunsystem-Therapie“: unten so viel Abstand wie oben */
#inhaltsbereich .frame-igel .ce-gallery figcaption{padding-bottom:0 !important;}
/* Formulare: unten so viel Abstand wie oben */
#inhaltsbereich .tx-powermail form .powermail_fieldwrap_type_submit{margin-bottom:0 !important;}
#inhaltsbereich .tx-powermail form{padding-bottom:28px !important;}
#inhaltsbereich .frame-igel .ce-gallery{padding-bottom:30px !important;}
@media (min-width:1200px){#inhaltsbereich .frame-igel .ce-gallery{padding-bottom:36px !important;}}
/* Mikroimmuntherapie, oranger Bereich: am Handy/Tablet ist das kein Kasten (nur Strich oben), dort bleibt die Überschrift wie live */
@media (max-width:991px){#inhaltsbereich .frame-bg-icon.frame-layout-3 .frame-gren > .rahmen > header:first-child > :is(h2,h3,h4):first-child{padding-top:10px !important;}}
/* TCM (Bee 15.10.): grauer Bereich, „Kinder“ + Kosten-Box nebeneinander, zarte Wasserzeichen */
.tkk-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.tkk-grid .ce-bodytext h2{float:none}
#inhaltsbereich .tkk-grid .kasten h2{font-size:22px;line-height:1.3;margin:0 0 16px}
.tkk-grid .kasten > :last-child,.tkk-grid .ce-bodytext > :last-child{margin-bottom:0}
#c426.tcm-grau{background:var(--grau);padding:80px 0;margin-top:60px;position:relative;overflow:hidden;z-index:1}
#c426.tcm-grau + #c643{margin-top:0}
#c643 + .tcm-kinder-kosten{margin-top:0}
.tcm-kinder-kosten{position:relative;overflow:hidden;padding:100px 0;z-index:1}
.tkk-wz{position:absolute;opacity:.05;z-index:-1;pointer-events:none}
/* TCM: Wasserzeichen als chinesische Schriftzeichen 中医 (unter dem Kosten-Kasten, frei lesbar) und 阴阳 (Bee 05.11.2026) */
.tkk-wz1{bottom:10px;right:calc(5% + 40px);width:200px;transform:rotate(-4deg)}
@media (max-width:900px){.tkk-wz1{width:160px}}
.tkk-wz3{bottom:12px;right:5%;width:250px;transform:rotate(-3deg)}
@media (max-width:900px){.tkk-grid{grid-template-columns:1fr;gap:30px}}
@media (max-width:767px){#c426.tcm-grau{padding:50px 0;margin-top:40px}.tcm-kinder-kosten{padding:60px 0 40px}#inhaltsbereich .tkk-grid .kasten h2{font-size:20px}.tkk-wz1{width:320px}.tkk-wz2{width:200px}.tkk-wz3{width:170px}}

/* Mikronährstofftherapie (Bee 15.10.): Kacheln 1 grün / 3 blau, Abschnitt „Darm & Mikronährstoffe“ im grünen Verlauf wie Darmmikrobiom/Impfung, rosa Bereich Bild links, zarte Wasserzeichen */
#c571 ol li:nth-child(1){background:var(--hellgrün)!important;border-color:var(--hellgrün)!important}
#c571 ol li:nth-child(1)::after{background:var(--hellgrün)!important}
#c571 ol li:nth-child(3){background:var(--blau)!important;border-color:var(--blau)!important}
#c571 ol li:nth-child(1):hover,#c571 ol li:nth-child(3):hover{background:transparent!important}
#c572.mnt-gruen{background:linear-gradient(315deg,var(--hellgrün) 0%,var(--green40) 100%),#fff;padding:80px 0;margin-top:100px;position:relative;overflow:hidden;z-index:1}
#c572.mnt-gruen + *{margin-top:0}
.mnt-wz-rahmen{position:relative;z-index:1;overflow-x:clip}
.mnt-wz{position:absolute;opacity:.05;z-index:-1;pointer-events:none}
.mnt-wz1{right:4%;top:0;width:280px;transform:rotate(-8deg)}
.mnt-wz2{right:6%;top:50%;width:280px;transform:translateY(-50%) rotate(-6deg)}
#inhaltsbereich #c572 a.more{background:var(--orange)!important;color:var(--darkblue)!important}
#inhaltsbereich #c572 a.more:hover{background:var(--green-schrift)!important;color:#fff!important}
#c569 > .rahmen > header,#c569 .ce-bodytext{max-width:720px;margin-left:auto}
#c569::after{background-position:left max(50px, calc(50vw - 600px)) center!important}
@media (max-width:1150px){#c569::after{background-position:20px calc(100% - 20px)!important}}
@media (max-width:1000px){#c569 > .rahmen > header,#c569 .ce-bodytext{margin-left:0}#c569::after{background-position:center center!important}}
@media (max-width:767px){#c572.mnt-gruen{padding:50px 0;margin-top:60px}.mnt-wz1{width:200px}.mnt-wz2{width:200px}}

/* Team (Bee 15.10.): Cremeton, Kärtchen, farbige Ringe, gemeinsame Kanten */
body.page34 #c21,body.page34 #c23,body.page34 #c60{background:#fefce7;margin:0!important;position:relative}
body.page34 #c21{padding:60px 0 70px;background:#fffef7!important}
body.page34 #c23{padding:40px 0}
body.page34 #c60{padding:20px 0 100px}
body.page34 #footer{margin-top:0}
body.page34 #c21 .ce-bodytext h2.steckbrief-name{margin-bottom:24px;float:none}
body.page34 #c21 .ce-bodytext h3.steckbrief-titel{margin-top:0}
body.page34 .steckbrief-karte{background:#fff;border-radius:12px;padding:26px 30px;box-shadow:0 6px 24px rgba(1,35,67,.08);margin-bottom:24px}
body.page34 .steckbrief-karte > :last-child{margin-bottom:0}
body.page34 .karte-blau{border-left:6px solid var(--blue)}
body.page34 .karte-gruen{border-left:6px solid var(--green)}
body.page34 #c21 .ce-gallery img{box-shadow:0 0 0 8px var(--blue),0 8px 24px rgba(0,0,0,.12)!important}
body.page34 #c23 .ce-textpic{display:flex;flex-direction:row-reverse;align-items:center;justify-content:flex-start;gap:50px;margin:30px 0 0}
body.page34 #c23 .ce-gallery{float:none;width:auto;margin:0;flex:0 0 auto}
body.page34 #c23 .ce-bodytext{flex:1;background:#fff;border-radius:12px;padding:28px 32px;box-shadow:0 6px 24px rgba(1,35,67,.08);border-left:6px solid var(--orange)}
body.page34 #c23 .ce-bodytext::before{content:"Praxismanagerin";display:inline-block;background:var(--orange);color:var(--darkblue);font-family:"Caveat Brush",cursive;font-size:22px;padding:2px 14px;border-radius:6px;margin-bottom:12px}
body.page34 #inhaltsbereich #c23 .ce-bodytext p,body.page34 #inhaltsbereich #c60 > .rahmen > .ce-textpic > .ce-bodytext p{max-width:none;text-align:left!important;margin:0;font-size:18px;line-height:1.6}
body.page34 #c60 > .rahmen > .ce-textpic > .ce-bodytext{margin:30px 0 0;background:#fff;border-radius:12px;padding:24px 32px;box-shadow:0 6px 24px rgba(1,35,67,.08);border-left:6px solid var(--blau)}
body.page34 .frame-team .ce-gallery{gap:40px 30px}
body.page34 #c60 .ce-gallery{display:grid;grid-template-columns:repeat(4,250px);justify-content:space-between;margin-top:50px}
body.page34 #c60 .ce-gallery .ce-row,body.page34 #c23 .ce-gallery .ce-row{width:250px}
body.page34 .frame-team .ce-gallery img{box-shadow:0 0 0 8px var(--ring,#a0e98c),0 8px 24px rgba(0,0,0,.12)!important}
body.page34 #c23 .ce-row{--ring:var(--orange)}
body.page34 #c60 .ce-row:nth-child(1){--ring:var(--hellgrün)}
body.page34 #c60 .ce-row:nth-child(2){--ring:var(--blau)}
body.page34 #c60 .ce-row:nth-child(3){--ring:var(--coral)}
body.page34 #c60 .ce-row:nth-child(4){--ring:var(--lila)}
body.page34 #c60 .ce-row:nth-child(5){--ring:var(--hellblau)}
body.page34 #c60 .ce-row:nth-child(6){--ring:var(--rosa)}
body.page34 #c60 .ce-row:nth-child(7){--ring:var(--green)}
body.page34 .frame-team figcaption{font-family:"Caveat Brush",cursive;font-size:26px!important;color:var(--darkblue);margin-top:14px}
@media (max-width:1150px){body.page34 #c60 .ce-gallery{grid-template-columns:repeat(4,minmax(0,220px))}body.page34 #c60 .ce-gallery .ce-row{width:100%}}
@media (max-width:991px){body.page34 #c60 .ce-gallery{grid-template-columns:repeat(2,minmax(0,280px));justify-content:space-around}}
@media (max-width:767px){body.page34 #c21{padding:40px 0 50px}body.page34 #c60{padding:10px 0 60px}body.page34 #c23 .ce-textpic{flex-direction:column-reverse;gap:30px}body.page34 #c23 .ce-gallery .ce-row{width:220px}body.page34 #c60 .ce-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px;margin-top:40px}body.page34 .steckbrief-karte,body.page34 #c23 .ce-bodytext,body.page34 #c60 > .rahmen > .ce-textpic > .ce-bodytext{padding:22px 20px}body.page34 .frame-team figcaption{font-size:22px!important}body.page34 .frame-team .ce-gallery img{box-shadow:0 0 0 6px var(--ring,#a0e98c),0 6px 18px rgba(0,0,0,.12)!important}}
/* Team: am Handy und Tablet hochkant erst das Foto von Dr. Eichhorn, dann Name und Kästen, wie bei Martina (Bee 15.10.) */
@media (max-width:991px){body.page34 #c21 .ce-textpic{display:flex;flex-direction:column}body.page34 #c21 .ce-gallery{order:-1;float:none;width:auto;margin:0 0 36px;display:flex;justify-content:center}}
/* Startseite „Beliebte Leistungsangebote“ am Handy (Bee 15.10.): Zeichnungen in allen vier Kästen unter die grauen Puzzle-Aussparungen rücken; Kästen bleiben gleich hoch */
@media (max-width:599px){.frame-leistungskacheln .col- > .frame{padding-top:45px;padding-bottom:5px}}
/* Kopfbilder am Handy (Bee 15.10.): Welle flacher und dezenter; Eichhörnchen-Kopfbilder so hoch wie alle anderen (Foto-Teil),
   ohne Eichhörnchen (Bee 11.10.: am Handy erlaubt), damit es auch nicht über dem geöffneten Menü liegt.
   Vorsorge: Zwischenbild höher, damit die Kinder ganz zu sehen sind. */
@media (max-width:767px){
#header::after{height:45px!important}
#header.eich{padding-top:0!important}
#header.eich .image img{width:100%;height:66.6667vw;object-fit:cover;object-position:100% 50%}
#header.eich .eichkopf{display:none}
#inhaltsbereich .frame-layout-20 > .rahmen .ce-gallery{padding-top:50%}
}
/* Handy-Menü (Bee 15.10.): gut lesbar, die aktuelle Seite immer deutlich markiert.
   Hauptpunkte weiß, aufgeklappter Bereich hellgrün, Unterpunkte sehr hell mit dunkelblauer Schrift,
   aktuelle Seite dunkelgrün mit weißer, fetter Schrift. */
@media (max-width:1040px){
#oben .navi .hnavi > li > a{background:#fff!important;color:var(--darkblue)!important;border-bottom:1px solid #d6ebcd!important}
#oben .navi .hnavi > li.ifsub[data-toggled="on"] > a,#oben .navi .hnavi > li.act.ifsub > a{background:#e3f3dc!important;color:var(--darkblue)!important;font-weight:700}
#oben .navi .hnavi > li.act:not(.ifsub) > a{background:var(--green-schrift)!important;color:#fff!important;font-weight:700}
#oben .navi .hnavi li.ifsub::before,#oben .navi .hnavi li.ifsub::after,#oben .navi .hnavi li.act.ifsub::before,#oben .navi .hnavi li.act.ifsub::after{background:var(--darkblue)!important}
#oben .navi .hnavi .unavi,#oben .navi .hnavi li.act .unavi{background:#f5faf2!important;border-top:0!important}
#oben .navi .hnavi .unavi li,#oben .navi .hnavi li.act .unavi li{background:transparent!important;border-top:0!important;border-bottom:1px solid #d6ebcd!important}
#oben .navi .hnavi .unavi li a,#oben .navi .hnavi li.act .unavi li a{background:transparent!important;color:var(--darkblue)!important;opacity:1!important;padding-left:36px;width:calc(100% - 56px);border-bottom:0!important}
#oben .navi .hnavi .unavi li.act a,#oben .navi .hnavi li.act .unavi li.act a{background:var(--green-schrift)!important;color:#fff!important;font-weight:700}
}

/* Welle (Bee 15.10. abends): durchscheinend wie dünnes Papier, auf allen Seiten in allen Ansichten; Eichhörnchen-Kopfbilder nur Foto ohne Farbfläche */
#header::after{background:url(/fileadmin/cn_website/images/welle-einfach.svg?v=2) left bottom/100% 100% no-repeat!important;height:80px!important}@media (min-width:1440px){#header::after{height:100px!important}}@media (max-width:767px){#header::after{height:45px!important}}
@media (max-width:767px){#header:has(.eichkopf-impf) .image img{width:243.90vw!important;max-width:none!important;height:66.6667vw!important;object-fit:cover!important;object-position:100% 0%!important;margin-left:-143.90vw!important}#header:has(.eichkopf-impf) .image{overflow:hidden}#header:has(.eichkopf-des) .image img{width:256.41vw!important;max-width:none!important;height:66.6667vw!important;object-fit:cover!important;object-position:100% 0%!important;margin-left:-156.41vw!important}#header:has(.eichkopf-des) .image{overflow:hidden}#header:has(.eichkopf-mit) .image img{width:270.27vw!important;max-width:none!important;height:66.6667vw!important;object-fit:cover!important;object-position:100% 0%!important;margin-left:-170.27vw!important}#header:has(.eichkopf-mit) .image{overflow:hidden}}
/* Job-Anzeigen am Handy: kein großer weißer Abstand oben, Überschrift nicht unter den Seitenknöpfen (Bee 15.10.) */
@media (max-width:767px){body:has(.frame-jobsdetail) #header.sub{height:30px!important;min-height:0!important}body:has(.frame-jobsdetail) #inhaltsbereich > .frame:first-child{margin-top:35px}body:has(.frame-jobsdetail) #inhaltsbereich h1{padding-right:28px}}
/* Jobs Benefits-Slider Handy: alle Punkte sichtbar, aktiver Punkt gefüllt; Bildchen bleiben (Bee 15.10.) */
@media (max-width:700px){.frame-bildslider .owl-carousel .owl-dots button.owl-dot{border:2px solid var(--green)!important;background:transparent!important;width:12px;height:12px;margin:0 4px 4px}.frame-bildslider .owl-carousel .owl-dots button.owl-dot.active{background:var(--green)!important}}
/* Zwischenbilder Handy: höher, Bild steht fest im Rahmen (kein mitlaufender Ausschnitt), Ausschnitt je Bild so, dass alles Wichtige zu sehen ist (Bee 15.10.) */
@media (max-width:767px){
#inhaltsbereich .frame-layout-20 > .rahmen .ce-gallery{padding-top:63%}
#inhaltsbereich .frame-layout-20 .ce-gallery.zw_fixed{background-attachment:scroll!important;background-size:cover!important;background-position:center 10%!important}
body.page19 #inhaltsbereich .frame-layout-20 .ce-gallery.zw_fixed,body.page18 #inhaltsbereich .frame-layout-20 .ce-gallery.zw_fixed{background-position:center 50%!important}
}
/* TCM Handy: Kräuter-Wasserzeichen im grauen Bereich würde unter das Meridian-Bild rutschen; PC/Tablet behalten es (Bee 15.10.) */
@media (max-width:767px){#c426 .tkk-wz3{display:none}}
/* Impfung Handy: Ausschnitt A (ganzer Kopf, kein Blau), ausnahmsweise flachere Welle (Bee 15.10.) */
@media (max-width:767px){#header:has(.eichkopf-impf) .image img{width:270.27vw!important;margin-left:-170.27vw!important;object-position:100% 20%!important}#header:has(.eichkopf-impf)::after{height:22px!important}}
/* Zwischenbilder Handy: Eichhörnchen (Mikronährstoff) und Darmbakterien größer, weniger Hintergrund (Bee 15.10.) */
@media (max-width:767px){body.page19 #inhaltsbereich .frame-layout-20 .ce-gallery.zw_fixed{background-size:140% auto!important;background-position:center 40%!important}body.page18 #inhaltsbereich .frame-layout-20 .ce-gallery.zw_fixed{background-size:150% auto!important;background-position:center 50%!important}}
/* Handy-/Tablet-Menü: reicht immer bis ganz unten an den Bildschirmrand, weißer Hintergrund, nichts von der Seite schiebt sich darunter hervor (Bee 15.10.) */
@media (max-width:1040px){#oben .navi .hnavi{max-height:none!important;height:calc(100vh - 115px);height:calc(100dvh - 115px);background:#fff;box-sizing:border-box;padding-bottom:env(safe-area-inset-bottom);overscroll-behavior:contain}}
@media (max-width:560px){#oben .navi .hnavi{height:calc(100vh - 89px);height:calc(100dvh - 89px)}}
@media (max-width:1040px){body:has(.mob_button.mobnavvisible) :is(#header,#inhaltsbereich,#footer){visibility:hidden}}
/* Welle am Tablet (Bee 15.10. spät): niedriger, damit sie im Verhältnis zum Bild so viel bedeckt wie am Handy */
@media (min-width:768px) and (max-width:1040px){#header::after{height:48px!important}}@media (min-width:1041px) and (max-width:1439px) and (hover:none) and (pointer:coarse){#header::after{height:66px!important}}
/* Handy (Bee 16.10.): Impfung „Individueller Impfplan“ kompakter, Abstand oben und unten gleich */
@media (max-width:767px){#c329{padding-top:41px!important;padding-bottom:50px!important}#c329 .ce-gallery{margin-bottom:0!important}}
/* Handy (Bee 16.10.): Bilder in „Mit 18 Jahren…“ und „Zeckenimpfung“ so breit wie in den anderen Beiträgen */
@media (max-width:800px){.news-single .article .news-img-wrap img[src*="IMG_1970_news-detail"],.news-single .article .news-img-wrap img[src*="zecke_news-detail"]{width:100%!important;max-width:400px!important;height:auto!important}}
/* Impressum und Datenschutz am Handy: kein großer weißer Abstand oben, wie bei den Job-Anzeigen (Bee 16.10.) */
@media (max-width:767px){body.page6 #header.sub,body.page7 #header.sub{height:30px!important;min-height:0!important}body.page6 #inhaltsbereich > .frame:first-child,body.page7 #inhaltsbereich > .frame:first-child{margin-top:35px}body.page6 #inhaltsbereich h1,body.page7 #inhaltsbereich h1{padding-right:28px}}
/* Impfung Kopfbild am Handy (Bee 16.10.): genau der Ausschnitt des Live-Originals (ganzes Bild, scharf), normale flache Welle wie überall */
@media (max-width:767px){#header:has(.eichkopf-impf) .image img{width:100%!important;max-width:100%!important;height:66.6667vw!important;margin-left:0!important;object-fit:cover!important;object-position:50% 50%!important}#header:has(.eichkopf-impf)::after{height:45px!important}}

/* Startseite (Bee 20.10.2026): Neupatienten-Kasten unter dem Knopf „Patienteninfos“, am PC unten bündig mit dem roten Notfallkasten */
@media (min-width: 768px) {
  #c286 .row:has(#c287) { display: flex; align-items: stretch; }
  #c286 .row:has(#c287)::before, #c286 .row:has(#c287)::after { display: none; }
  #c286 .col-50:has(> #c287) { display: flex; flex-direction: column; }
  #c287, #c287 > .rahmen, #c287 .ce-textpic { flex: 1; display: flex; flex-direction: column; }
  #c286 .col-50:has(> #c288) { display: flex; flex-direction: column; }
  #c288, #c288 > .rahmen { flex: 1; }
  #c287 .ce-bodytext { flex: 1; display: flex; flex-direction: column; }
  #c287 .neue-patienten { margin-top: auto; margin-bottom: 0; }
}

/* TCM, oranger Bereich (Bee 20.10.): Handy/Tablet oben gleich viel Abstand wie unten (vorher oben 10px Überschrift-Polster extra) */
@media (max-width:991px){#inhaltsbereich #c643 #c632 h2{padding-top:0 !important}#c643.frame-bg-color{padding-top:92px}}
/* Jugendarbeitsschutz am Handy: mehr Abstand zwischen grünem Kasten und Text darunter (Bee 20.10.) */
@media (max-width:767px){body #c358{margin-top:16px}}
/* KOPFBILD-STANDARD (Bee 24.10.), nur Seiten mit Klasse kopf-cover (zuerst Vorsorge):
   Handy unverändert. Tablet (768–1099): Höhe = Breite / 2,62, Welle = 1/5 der Bildhöhe.
   Laptop (1100–1499): wie bisher (Breite / 3, bisherige Welle).
   Großer PC (ab 1500): Höhe = Breite / 2,62, aber höchstens bis 70 % der Bildschirmhöhe (nie unter 500), Welle = 1/5. Keine feste 500-px-Grenze mehr.
   Bild füllt die Fläche (object-fit), oben verankert. */
@media (min-width:768px){
#header.kopf-cover{max-height:none}
#header.kopf-cover img{height:var(--kh);width:100%;object-fit:cover;object-position:50% 0}
}
@media (min-width:768px) and (max-width:1099px){
#header.kopf-cover{--kh:max(300px,calc(100vw / 2.62))}
#header.kopf-cover::after{height:calc(var(--kh) * .2)!important}
}
@media (min-width:1100px) and (max-width:1499px){#header.kopf-cover{--kh:calc(100vw / 3)}}
@media (min-width:1500px){
#header.kopf-cover{--kh:max(500px,min(calc(100vw / 2.62),calc(70vh - 26px)))}
#header.kopf-cover::after{height:calc(var(--kh) * .2)!important}
}
/* Startseite Handy (Bee 26.10.): Schriftzug tiefer, linksbündig mit dem Seitentext, „Babys, Kids und Teens“ als eigene Zeile */
@media (max-width:767px){body.page1 #header .ce-bodytext{bottom:8px;left:20px;width:calc(100% - 64px)}body.page1 #header .h1-teil{display:block}}
@media (max-width:359px){body.page1 #header .ce-bodytext h1 strong{font-size:23px}}
/* Startseite, kleine Handys quer (Bee 26.10.): Kopfbild nur so hoch, dass Bild und Schriftzug sofort sichtbar sind; Schrift wie hochkant */
@media (max-width:767px) and (orientation:landscape){body.page1 #header .image img{height:max(200px,calc(100vh - 140px));object-fit:cover;object-position:50% 12%}body.page1 #header .ce-bodytext h1{font-size:20px;line-height:1.2em}body.page1 #header .ce-bodytext h1 strong{font-size:26px}}
/* Immunsystem-Überblick (Bee 26.10.): außer Handy und Tablet hochkant den Jungen so weit hoch, dass die Haare direkt unter dem Menü am Bildrand sind.
   Bilddatei „breit“ ist höher als die Fläche; Haaransatz liegt bei 12,25 % der Bildbreite, Verschiebung = verdeckte Menühöhe minus diese Lage. */
@media (min-width:768px) and (max-width:1099px) and (orientation:landscape){#header.kopf-haarkante img{object-position:50% calc(23px - 12.25vw)}}
@media (min-width:1100px){#header.kopf-haarkante img{object-position:50% calc(90px - 12.25vw)}}
/* Eichhörnchen-Kopfbilder Mikroimmuntherapie, Desensibilisierung, FeNO am Handy (Bee 28.10.): eigene scharfe Handy-Dateien mit genau dem bisherigen Ausschnitt, werden ganz gezeigt */
@media (max-width:767px){#header:has(.eichkopf-mit) .image img,#header:has(.eichkopf-des) .image img,#header:has(.eichkopf-feno) .image img{width:100%!important;max-width:100%!important;height:66.6667vw!important;margin-left:0!important;object-fit:cover!important;object-position:50% 50%!important}}

/* Mikroimmuntherapie (page15), oranger Bereich (Bee 29.10.2026): Kasten „Diagnostik & Individualisierung“
   mit orangem Rahmen wie die Diagnostik-Kästen bei TCM, auch auf Tablet und Handy als ganzer Kasten. */
body.page15 #inhaltsbereich .frame-bg-icon.frame-layout-3 .frame-gren > .rahmen{border-color:#ff7b00 !important;}
@media (max-width:991px){
  body.page15 #inhaltsbereich .frame-bg-icon.frame-layout-3 .frame-gren > .rahmen{
    border:5px solid #ff7b00 !important;border-radius:var(--ecke) !important;padding:20px !important;}
}

/* Mikronährstofftherapie (Bee 29.10.2026): Salatschüssel oben größer und näher am Text,
   mit Abstand zu den Knöpfen am rechten Rand (Telefon, E-Mail, Video; ab 768px sichtbar). */
@media (min-width:1200px){.mnt-wz1{right:auto;left:calc(50% + 190px);width:360px}}
@media (min-width:992px) and (max-width:1199px){.mnt-wz1{right:auto;left:calc(50% + 150px);width:280px}}
@media (min-width:768px) and (max-width:991px){.mnt-wz1{right:70px}}

/* Darmmikrobiom (page18), grüner Bereich (Bee 29.10.2026): Darm-Symbol rechts unten höher,
   damit es ganz im grünen Bereich bleibt und als Darm zu erkennen ist. */
body.page18 .frame-bg-icon > div > .ce-textpic > .ce-gallery > div:nth-child(2){bottom:45px;transform:rotate(20deg);}
/* Darmmikrobiom: Stethoskop oben links etwas tiefer, damit es ganz zu sehen ist (Bee 29.10.2026). */
body.page18 .frame-bg-icon > div > .ce-textpic > .ce-gallery > div:nth-child(1){top:40px;transform:rotate(-10deg);}

/* Handy (Bee 29.10.2026, Test): blasse Wasserzeichen-Symbole am Handy ausgeblendet, damit es ruhiger wirkt. */
@media (max-width:767px){
  .mnt-wz,.tkk-wz,
  .tx_cn-multicontent.frame-bg-icon .row > div:first-child .ce-gallery > div:nth-child(1),
  .tx_cn-multicontent.frame-bg-icon .row > div:first-child .ce-gallery > div:nth-child(2),
  .frame-bg-icon > div > .ce-textpic > .ce-gallery > div:nth-child(1),
  .frame-bg-icon > div > .ce-textpic > .ce-gallery > div:nth-child(2){display:none !important;}
}
/* Team: 7 Fotos ohne Lücke, keiner allein (Bee 04.11.): ab Tablet 4 oben + 3 versetzt darunter, am Handy versetzt im Zickzack */
@media (min-width:768px){body.page34 #c60 .ce-gallery{grid-template-columns:repeat(8,minmax(0,1fr));column-gap:max(30px,calc((100% - 1000px)/3));justify-content:stretch}body.page34 #c60 .ce-gallery .ce-row{width:auto;grid-column:span 2}body.page34 #c60 .ce-row:nth-child(5){grid-column:2/span 2}body.page34 #c60 .ce-row:nth-child(6){grid-column:4/span 2}body.page34 #c60 .ce-row:nth-child(7){grid-column:6/span 2}}
@media (min-width:768px) and (max-width:1150px){body.page34 #c60 .ce-gallery{column-gap:max(30px,calc((100% - 880px)/3))}}
@media (min-width:768px) and (max-width:991px){body.page34 #c60 .ce-gallery{column-gap:24px}}
@media (max-width:767px){body.page34 #c60 .ce-gallery{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:30px}body.page34 #c60 .ce-gallery .ce-row{grid-row:span 2}body.page34 #c60 .ce-row:nth-child(odd){grid-column:1}body.page34 #c60 .ce-row:nth-child(even){grid-column:2;grid-row:auto/span 2}body.page34 #c60 .ce-row:nth-child(1){grid-row:1/span 2}body.page34 #c60 .ce-row:nth-child(2){grid-row:2/span 2}body.page34 #c60 .ce-row:nth-child(3){grid-row:3/span 2}body.page34 #c60 .ce-row:nth-child(4){grid-row:4/span 2}body.page34 #c60 .ce-row:nth-child(5){grid-row:5/span 2}body.page34 #c60 .ce-row:nth-child(6){grid-row:6/span 2}body.page34 #c60 .ce-row:nth-child(7){grid-row:7/span 2}}
/* Jugendarbeitsschutz (Bee 05.11.): Kasten „Berechtigungsschein“ blau statt grün, passend zum blauen Kopfbild;
   Aufbau unverändert, nur die Farben der hellblauen Strich-Kästen */
body.page33 #inhaltsbereich #c357 > .rahmen{background:var(--hinweis-blau-hell) !important;border-left-color:var(--hinweis-blau-strich) !important;}
body.page33 #inhaltsbereich #c357 > .rahmen :is(h2,h3,h4),body.page33 #inhaltsbereich #c357 a{color:var(--hinweis-blau-schrift) !important;}
body.page33 #inhaltsbereich #c357 ul li::before{background-image:url(../fileadmin/cn_website/images/acorn_blau.svg);}
/* Team (Bee 06.11.): Foto Dr. Eichhorn ab Tablet senkrecht mittig links neben dem blauen Kasten „Qualifikationen“; Handy unverändert */
@media (min-width:768px){body.page34 #c21 .ce-textpic{display:grid;grid-template-columns:400px minmax(0,1fr);column-gap:40px;align-items:center}body.page34 #c21 .ce-textpic::before,body.page34 #c21 .ce-textpic::after{display:none}body.page34 #c21 .ce-bodytext{display:contents}body.page34 #inhaltsbereich #c21 .ce-gallery{grid-column:1;grid-row:2;order:0;float:none;width:auto;margin:0 0 24px!important;display:flex;justify-content:center}body.page34 #inhaltsbereich #c21 .ce-gallery .ce-row{margin:0!important}body.page34 #c21 h2.steckbrief-name{grid-column:2;grid-row:1}body.page34 #c21 .karte-blau{grid-column:2;grid-row:2}body.page34 #c21 .karte-gruen{grid-column:2;grid-row:3}}
@media (min-width:768px) and (max-width:991px){body.page34 #c21 .ce-textpic{grid-template-columns:250px minmax(0,1fr);column-gap:32px}body.page34 #c21 .ce-gallery img{width:250px;height:250px}}

/* 07.11.2026 (Bee): einheitliche Ecken 12px auch bei den Schritt-Kästen auf TCM (page20) und Darm (page18), vorher 20px. */
body.page20 #inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame,
body.page18 #inhaltsbereich .frame-buntebox.frame-type-shortcut > .rahmen > .frame{border-radius:var(--ecke);}
/* Handy: Telefon/E-Mail-Zeile steht nur im Menü (das Programm verschiebt sie dorthin); vorher nicht oben anzeigen, sonst springt die Kopfleiste (Bee 07.11.2026) */
@media (max-width:560px){#oben > .info{display:none}}
/* Karte: Breite per CSS statt width="100%" im HTML (Code-Prüfung, Bee 07.11.2026) */
iframe[data-type="maps"]{width:100%}
/* Datenschutz-Link im Zustimmungs-Satz beider Formulare unterstreichen wie alle Text-Links (Barrierefreiheit, Bee 07.11.2026) */
.tx-powermail a[href*="datenschutz"]{text-decoration:underline;text-underline-offset:2px}
/* Seitlicher Kontakt-Kasten: erst zeigen, wenn er an seinem Platz ist, damit beim Laden nichts rutscht (Bee 07.11.2026) */
.slidein:not(:has(> .frame.show)),.slidein > .frame:not(.show){visibility:hidden}
/* Ausdrucken (Bee 08.11.2026): Kopfzeile nur einmal oben, keine Bedienelemente, Fotos kleiner, Kästen nicht zerteilen */
@media print{
  #oben{position:static !important;box-shadow:none !important}
  .slidein,.slideinmob,.nach-oben,.sprunglink,#cookieman-modal,.popup,#header,.tx-powermail,iframe,.zurueck-knopf{display:none !important}
  body,#inhaltsbereich{padding-top:0 !important;margin-top:0 !important}
  .ce-gallery img{max-height:7cm !important;width:auto !important;height:auto !important;max-width:100% !important}
  img{max-height:7cm;object-fit:contain}
  img[src*=".svg"],.ce-gallery img[src*=".svg"]{max-height:3cm !important}
  figure{break-inside:avoid}
  h1,h2,h3{break-after:avoid}
}
/* Handy quer (Bee 08.11.2026): oberer Balken schmaler, damit mehr Platz für den Inhalt bleibt */
@media (orientation: landscape) and (max-height: 500px) and (max-width: 1023px) {
  #oben .logo img { height: 40px !important; width: auto !important; }
  #oben .logo { margin-top: 6px !important; margin-bottom: 6px !important; padding-top: 0 !important; padding-bottom: 0 !important; }
  #oben .mob_button { transform: translateY(-12px) scale(.8); transform-origin: right center; }
  #oben .navi .hnavi { height: calc(100vh - 79px); height: calc(100dvh - 79px); }
}