/* ------------------------------------------------------------------
   Nachträgliche Korrekturen zum Original-Stylesheet.
   Bewusst in einer eigenen Datei, damit style.css und responsive.css
   unverändert bleiben und sich alles mit einer Zeile zurücknehmen lässt.
   ------------------------------------------------------------------ */

/* 1) Wellenrand am Header
      Vorher: background-size: auto bei einem 2000x139-Bild und fester
      Elementhöhe. Dadurch wurde die Welle je nach Fensterbreite
      abgeschnitten oder falsch positioniert statt zu skalieren. */
#header::after {
    background-size: 100% 100%;
    background-position: left bottom;
}

@media screen and (max-width: 767px) {
    #header::after {
        background-position: left bottom;
        background-size: 100% 100%;
    }
}

/* 2) Rundgang-Galerie
      Wie im Original: Bibliothek "Justified Gallery" (js/justified-gallery.js)
      rechnet bündige Reihen mit gleichmäßigen 2px-Abständen (Blocksatz).
      Die frühere reine CSS-Annäherung ergab je nach Bildschirmbreite
      ungleiche Abstände und ausgefranste Zeilenenden (Sabine, iPad).
      Regeln unten 1:1 aus dem Original-Stylesheet. */
.frame-gridgallery > .rahmen { opacity: 1; }
.ce-gridgallery { margin: 20px 0 10px; }
.justified-gallery{width:100%;position:relative;overflow:hidden;}
.justified-gallery > a,.justified-gallery > div,.justified-gallery > figure{position:absolute;display:inline-block;overflow:hidden;opacity:0.1;margin:0;padding:0;}
.justified-gallery > a > img,.justified-gallery > div > img,.justified-gallery > figure > img,.justified-gallery > a > a > img,.justified-gallery > div > a > img,.justified-gallery > figure > a > img{position:absolute;top:50%;left:50%;margin:0;padding:0;border:none;opacity:0;max-width:none;}
.justified-gallery > .entry-visible{opacity:1;background:none;}
.justified-gallery > .entry-visible > img,.justified-gallery > .entry-visible > a > img{opacity:1;transition:opacity 500ms ease-in;}
.justified-gallery > .jg-filtered{display:none;}
.justified-gallery > .spinner{position:absolute;bottom:0;margin-left:-24px;padding:10px 0 10px 0;left:50%;opacity:1;overflow:initial;}
.justified-gallery > .spinner > span{display:inline-block;opacity:0;width:8px;height:8px;margin:0 4px 0 4px;background-color:#000;border-radius:6px;}

/* 3) Aktuelles-Liste: Bilder brachen aus ihrem Artikel aus
      Das Vorschaubild ist nach rechts gesetzt (float), der Textbereich
      nach links. Ohne abschliessende Regel umschliesst der Artikel seine
      eigenen Elemente nicht - die Bilder rutschten in die folgenden
      Meldungen durch und stapelten sich am rechten Rand.
      Diese Regel steht im Original-Stylesheet, fehlt im Export. */
.news .article::after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* 4) Startseite: Legotisch-Bild zu klein
      Bild hatte feste width="450" height="450"-Attribute und rendert dadurch
      immer bei 450x450px, obwohl die Nachbarspalte (Notfall-Box) 600px breit
      ist - kein responsives Mitwachsen. Die festen Attribute wurden am
      img-Tag entfernt, hier die passende Größenregel: volle Spaltenbreite,
      Seitenverhältnis bleibt quadratisch. */
.legotisch-square {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

/* 5) Kachel-Höhenausgleich (Leistungen-Überblick, Tipps/Infothek, Impfungen,
      Vorsorgen/Allergietest/Desensibilisierung)
      Original nutzt ein JavaScript ("equalize"), das pro Zeile allen Boxen
      dieselbe Pixel-Höhe zuweist. Diese Datei fehlt im Rebuild komplett -
      die Boxen sind deshalb unterschiedlich hoch (z. B. 265/188/367px statt
      367/367/367px bei Vorsorge). Jede .row.equalize wird zum eigenen
      Flex-Container, wodurch sich ihre Spalten automatisch auf die Höhe der
      höchsten Spalte STRECKEN - pro Zeile, ganz ohne JS. Live gegen die
      Vorsorge-Seite getestet: 265/188/367px -> 367/367/367px.
      Betrifft alle Boxen-Typen (frame-bluebox, frame-buntebox, ...), da an
      der Spalten-/Zeilen-Struktur angesetzt wird, nicht am Box-Typ. */
.row.equalize {
    display: flex;
    flex-wrap: wrap;
    float: none;
}

.row.equalize > [class*="col-"] {
    float: none;
    display: flex;
}

/* 6) FAQ-Akkordeon (Immunsystem-Therapie: Darmmikrobiom, MIT, Mikronährstofftherapie)
      Original nutzt jQuery UI Accordion mit farbig durchgewürfelten Buttons
      ("buntes Akkordeon" - genau das war Sabines Wunsch). Im Rebuild fehlte
      dafür jede Struktur: die Fragen waren komplett unsichtbar, nur die
      Antworten standen unmarkiert untereinander. jQuery UI ist im Rebuild
      bereits geladen; js/faq-akkordeon.js initialisiert die neue Markup-
      Struktur (siehe HTML-Dateien der drei Seiten). Diese CSS-Regeln sind
      identisch zum Original übernommen (Farb- und Icon-Optik), nur an die
      eigene Selector-Struktur (.cnmc-accordion.faq statt .ui-accordion)
      angepasst. Die Farbvariablen (--gelb, --blau, --coral, ...) existieren
      bereits in style.css. */
.cnmc-accordion.faq {
    float: left;
    clear: both;
    width: 100%;
}

.cnmc-accordion.faq > h3 {
    float: left;
    clear: both;
    width: 100%;
    border: none;
    text-align: left;
    color: var(--darkblue);
    font-family: 'Caveat Brush';
    font-weight: 400;
    font-size: 20px;
    padding: 7px 45px 9px 10px;
    margin: 5px 0 0 0;
    position: relative;
    cursor: pointer;
    z-index: 1;
    transition: ease all 0.3s;
    list-style: none;
}

.cnmc-accordion.faq > h3::before,
.cnmc-accordion.faq > h3::after {
    content: '';
    border-radius: 5px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--gelb);
    position: absolute;
    z-index: -1;
    transition: 0.3s;
}

.cnmc-accordion.faq > h3::after {
    background: var(--green);
    right: 100%;
    transition-delay: 0.2s;
}

.cnmc-accordion.faq > h3:nth-of-type(8n+2)::before { background: var(--blau); }
.cnmc-accordion.faq > h3:nth-of-type(8n+3)::before { background: var(--coral); }
.cnmc-accordion.faq > h3:nth-of-type(8n+4)::before { background: var(--lila); }
.cnmc-accordion.faq > h3:nth-of-type(8n+5)::before { background: var(--orange); }
.cnmc-accordion.faq > h3:nth-of-type(8n+6)::before { background: var(--hellgrün); }
.cnmc-accordion.faq > h3:nth-of-type(8n+7)::before { background: var(--hellblau); }
.cnmc-accordion.faq > h3:nth-of-type(8n+8)::before { background: var(--rosa); }
/* Überblick Immunsystem-Therapie (Bee 21.10.2026): kein Flieder und weniger Grün,
   4. Frage Orange wie die Kästen unter „Unser Vorgehen“. Aufklappen bleibt wie überall. */
#c-faq-ueberblick .cnmc-accordion.faq > h3:nth-of-type(8n+4)::before { background: var(--orange); }

#inhaltsbereich .cnmc-accordion.faq > h3:hover,
#inhaltsbereich .cnmc-accordion.faq > h3.ui-state-active {
    color: #fff;
}

.cnmc-accordion.faq > h3:hover::after,
.cnmc-accordion.faq > h3.ui-state-active::after {
    right: 0;
}

.cnmc-accordion.faq > h3 .ui-accordion-header-icon {
    position: absolute;
    height: 20px;
    width: 20px;
    border-radius: 50%;
    border: 2px solid var(--darkblue);
    top: 11px;
    right: 5px;
}

.cnmc-accordion.faq > h3 .ui-accordion-header-icon::before,
.cnmc-accordion.faq > h3 .ui-accordion-header-icon::after {
    content: '';
    position: absolute;
    left: calc(50% - 5px);
    height: 2px;
    width: 10px;
    background: var(--darkblue);
    top: calc(50% - 1px);
    transition: 0.2s;
}

.cnmc-accordion.faq > h3 .ui-accordion-header-icon::after {
    transform: rotate(90deg);
}

.cnmc-accordion.faq > h3.ui-state-active .ui-accordion-header-icon::after {
    transform: rotate(0deg);
}

.cnmc-accordion.faq > h3:hover .ui-accordion-header-icon,
.cnmc-accordion.faq > h3.ui-state-active .ui-accordion-header-icon {
    border: 2px solid #fff;
}

.cnmc-accordion.faq > h3:hover .ui-accordion-header-icon::before,
.cnmc-accordion.faq > h3:hover .ui-accordion-header-icon::after,
.cnmc-accordion.faq > h3.ui-state-active .ui-accordion-header-icon::before,
.cnmc-accordion.faq > h3.ui-state-active .ui-accordion-header-icon::after {
    background: #fff;
}

.cnmc-accordion.faq .ui-accordion-content {
    float: left;
    clear: both;
    width: calc(100% - 20px);
    padding: 5px 10px 20px 10px;
    background: #f5f5f5;
}
/* Abstand in der aufgeklappten Antwort oben = unten (Bee 21.10.2026, alle FAQ-Bereiche) */
#inhaltsbereich .cnmc-accordion.faq > .ui-accordion-content { padding-top: 20px; padding-bottom: 20px; }
#inhaltsbereich .cnmc-accordion.faq > .ui-accordion-content .ce-bodytext > :last-child { margin-bottom: 0; }

.cnmc-accordion.faq .ui-accordion-content .frame {
    margin: 0;
}


/* ------------------------------------------------------------------
   Nachtrag 04.10.2026 (Sabines Screenshot-Liste vom 01.10.)
   ------------------------------------------------------------------ */

/* 7) Slider-Punkte (News-Slider Startseite, Benefits-Slider Jobs)
      Die "Bommel"-Punkte standen schon in style.css, wurden aber von
      owl.theme.default.min.css (lädt danach) mit background:none
      überschrieben - die Punkte waren dadurch unsichtbar. */
.owl-carousel button.owl-dot {
    background: url(../fileadmin/cn_website/images/bommel-news.svg) center center / contain no-repeat;
}
@media (max-width: 700px) {
    .frame-bildslider .owl-dots button {
        background: transparent;
    }
    .frame-bildslider .owl-dots button.active {
        background: var(--green);
    }
}

/* 8) Benefits-Slider: Die Slider-Einstellungen (Punkte, Anzahl je
      Bildschirmbreite) stehen wie im Original als unsichtbare Liste im
      Element - die Liste selbst darf nicht angezeigt werden. */
.frame-bildslider .ce-bodytext { display: none; }

/* 9) Startseite: Legotisch-Bild so breit wie die Notfall-Box darüber */
#c193 .ce-gallery,
#c193 .ce-gallery .ce-row,
#c193 .ce-gallery .ce-column,
#c193 .ce-gallery figure,
#c193 .ce-gallery picture {
    width: 100%;
    max-width: none;
    float: none;
    display: block;
    margin-left: 0;
    margin-right: 0;
}
#c193 .legotisch-square {
    display: block;
    width: 100%;
    max-width: none;
}

/* 10) Aktuelles - Einzelansicht wie im Original:
       Trennlinie unter dem Titel, Teaser grau, Bild klein rechts neben dem Text.
       (Regeln aus dem Original-Stylesheet der News-Erweiterung) */
.news-single .footer {
    clear: both;
    border-top: 1px solid #eee;
    margin: 5px 0 20px;
    padding: 10px 0 0;
    color: #888;
}
.news-single .footer p { margin: 0; line-height: 1em; }
.news-single .teaser-text {
    font-size: 15px;
    color: #888;
    margin: 0 0 10px;
}
.news-single .article .news-img-wrap {
    float: right;
    width: 282px;
    margin: 0 0 0 25px;
}
.news-single .article .news-img-wrap img {
    float: none;
    display: block;
    width: auto;      /* wie im Original: kleine Bilder nicht vergroessern */
    max-width: 100%;
    height: auto;
}
.news-single .news-backlink-wrap { clear: both; padding-top: 30px; }
/* Einzelbeitrag (Tablet/PC, Bild rechts neben dem Text): Oberkante Bild buendig mit
   der Oberkante der ersten Zeile daneben (Text oder Zwischenueberschrift), Bee 12.10.2026 */
@media (min-width: 801px) {
    .news-single .article .news-img-wrap { margin-top: 7px; }
    .news-single .news-text-wrap > h2:first-child { padding-top: 0; }
    /* Beitrag beginnt mit einem Bild statt Text: Bilder oben gleich hoch */
    .news-single .detailtext:has(.news-text-wrap > p:first-child > img:first-child) .news-img-wrap { margin-top: 0; }
}
@media (max-width: 800px) {
    .news-single .article .news-img-wrap {
        float: left;
        width: 100%;
        max-width: 400px;
        margin: 0 0 20px 0;
    }
}

/* 11) Aktuelles-Liste: "Weiterlesen" klebte auf der Trennlinie.
       Abstand unter jedem Artikel wie im Original (News-Erweiterung). */
.news .article {
    padding-bottom: 15px;
    margin-bottom: 15px;
}
.news .article:last-child {
    padding-bottom: 0;
    margin-bottom: 0;
}

/* Gut lesbarer Knopf: normale Groß-/Kleinschreibung mit Pfeil (z. B. Seite Darmmikrobiom) */
a.more.more--lesbar {
    text-transform: none;
    font-size: 17px;
    line-height: 1.4;
    padding: 14px 24px 14px 26px;
}
a.more.more--lesbar::after {
    content: "\00a0\00a0→";
}
a.more.more--lesbar .zusammen {
    white-space: nowrap; /* "pathologischem Darmmikrobiom" bleibt in einer Zeile */
}
@media (max-width: 480px) {
    a.more.more--lesbar {
        font-size: 15px;
        padding: 12px 16px;
    }
}

/* Wie Original (2026-10-08): Briefsymbol vor der E-Mail-Adresse oben rechts
   (unser Spamschutz macht daraus einen mailto-Link, die Original-Regel greift nur bei href="#") */
.info ul li a[href^='mailto']::before{content:'';background:url(../fileadmin/cn_website/images/mail.svg);width:20px;height:20px;display:block;float:left;margin-top:3px;margin-right:10px;}

/* Wie Original: Knopf "Cookie-Einstellungen" bei der Google-Karte */
.cookie_einstellungen{background:#6c757d;color:#fff;border-radius:3px;-webkit-appearance:none;appearance:none;padding:11px 20px 10px;border:0;cursor:pointer;font-family:inherit;font-size:16px;margin:5px;}
.cookie_einstellungen:hover{background:#5a6268;}

/* 10.10.2026: Fragen-Akkordeon nicht breiter als die Seite (Innenabstand zählt zur Breite, wie im Original) */
.cnmc-accordion.faq > h3 {
    box-sizing: border-box;
}

/* Team: Steckbrief Dr. Eichhorn in Qualifikationen und Mitgliedschaften getrennt;
   beide Listen bleiben rechts neben dem Foto (PC/Tablet) */
@media (min-width: 768px) {
    #c21 .ce-bodytext { overflow: hidden; }
}
#c21 .steckbrief-titel { margin: 22px 0 6px; }

/* Leistungen im Überblick: Sprungleiste, Karten mit Symbol und Foto (von Bee freigegeben, Variante B) */
.lz-sprung { margin: 0; }
.lz-sprung-frame > .rahmen { padding-top: 0 !important; padding-bottom: 10px !important; }
#inhaltsbereich .lz-sprung ul { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; margin: 0; list-style: none; justify-content: flex-start; }
#inhaltsbereich .lz-sprung li { margin: 0; padding: 0; }
#inhaltsbereich .lz-sprung li::before { display: none; }
#inhaltsbereich .lz-sprung a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px 8px 10px; border-radius: 999px; background: #fff; border: 2px solid var(--darkblue); color: var(--darkblue); text-decoration: none !important; font-weight: 700; line-height: 1.2; transition: background .2s, color .2s; }
#inhaltsbereich .lz-sprung a:hover, #inhaltsbereich .lz-sprung a:focus-visible { background: var(--darkblue); color: #fff; }
.lz-sprung a:hover img, .lz-sprung a:focus-visible img { filter: invert(1); }
.lz-sprung img { width: 26px; height: 26px; }
#c609 .lz-karte { scroll-margin-top: 130px; }
#c609 .lz-karte > .rahmen { position: relative; border-radius: 16px; box-shadow: 0 6px 18px rgba(1,35,67,.10); transition: transform .2s, box-shadow .2s; }
#c609 .lz-karte > .rahmen:hover { transform: translateY(-4px); box-shadow: 0 12px 26px rgba(1,35,67,.16); }
#c609 .lz-icon { display: flex; align-items: center; justify-content: center; width: 72px; height: 72px; border-radius: 50%; background: #fff; margin: -2px 0 12px; box-shadow: 0 3px 10px rgba(1,35,67,.12); }
#c609 .lz-icon img { width: 44px; height: 44px; }
#c609 .lz-foto { display: none; }
#c609 .frame-buntebox li a { font-weight: 700; text-decoration-thickness: 2px; text-underline-offset: 3px; }
/* Variante Fotos */
#c609.lz-variante-fotos .lz-foto { display: block; margin: -20px -20px 0; border-radius: 16px 16px 0 0; overflow: hidden; aspect-ratio: 16 / 10; }
#c609.lz-variante-fotos .lz-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
#c609.lz-variante-fotos .lz-icon { position: relative; margin: -36px 0 10px; }
@media (max-width: 767px) {
    #inhaltsbereich .lz-sprung ul { justify-content: flex-start; }
    #inhaltsbereich .lz-sprung a { padding: 6px 12px 6px 8px; font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { #c609 .lz-karte > .rahmen { transition: none; } #c609 .lz-karte > .rahmen:hover { transform: none; } }

/* Zeile „Ärztlich verfasst“ auf den Immunsystem-Seiten (von Bee freigegeben) */
.verfasst { font-size: 15px; color: #4a5a6a; margin: 10px 0 30px; }
.verfasst a { color: inherit; text-decoration: underline; }
/* 10.10.2026 (Technik-Paket): gleiches Bild Mikronährstoffe als leichtere Datei (1,3 MB -> 0,2 MB) */
.frame-mikrotherapie::after { background-image: url(../fileadmin/cn_website/images/mikronaehrstoffe-800.webp); }
/* 23.10.2026 (Bee): passende Größe je Gerät, gleich scharf; Bild 400 px breit (PC), 300 px (bis 1230), 200 px (bis 1150) */
.frame-mikrotherapie::after { background-image: image-set(url(../fileadmin/cn_website/images/mikronaehrstoffe-400.webp) 1x, url(../fileadmin/cn_website/images/mikronaehrstoffe-800.webp) 2x); }
@media (max-width: 1230px) { .frame-mikrotherapie::after { background-image: image-set(url(../fileadmin/cn_website/images/mikronaehrstoffe-400.webp) 1x, url(../fileadmin/cn_website/images/mikronaehrstoffe-600.webp) 2x, url(../fileadmin/cn_website/images/mikronaehrstoffe-800.webp) 3x); } }
@media (max-width: 1150px) { .frame-mikrotherapie::after { background-image: image-set(url(../fileadmin/cn_website/images/mikronaehrstoffe-400.webp) 1x, url(../fileadmin/cn_website/images/mikronaehrstoffe-400.webp) 2x, url(../fileadmin/cn_website/images/mikronaehrstoffe-600.webp) 3x); } }

/* 10.10.2026: Einleitungssatz Praxisrundgang (von Bee freigegeben) */
.rundgang-intro { max-width: 900px; margin: 0 0 25px; }

/* 10.10.2026 Handyansicht: Sprechzeiten-Tabelle – Wochentag als eigene Zeile, Uhrzeiten darunter ungetrennt */
@media (max-width: 767px) {
    .ce-bodytext figure.table table,
    .ce-bodytext figure.table tbody { display: block; width: 100%; }
    .ce-bodytext figure.table tr { display: flex; flex-wrap: wrap; column-gap: 18px; padding: 6px 8px; }
    .ce-bodytext figure.table td { display: block; padding: 0; max-width: none; width: auto; }
    .ce-bodytext figure.table td:first-child { flex: 0 0 100%; }
    .ce-bodytext figure.table td + td { white-space: nowrap; }
}

/* 10.10.2026 Handyansicht: zweispaltige Kästen (z. B. Praxis-App) auf dem Handy untereinander statt abgeschnitten */
@media (max-width: 767px) {
    .multicontent > .rahmen > .tx_cn-columns .row > div { width: 100%; }
    .multicontent > .rahmen > .tx_cn-columns .row > div > div { width: 100%; margin-left: 0; margin-right: 0; }
    .multicontent > .rahmen > .tx_cn-columns .row > div + div { margin-top: 20px; }
}

/* Startseite, Handy (Bee 03.11.2026): Abstand über „Spezialpraxis für Immunsystem-Therapie“ genau so groß wie über „Beliebte Leistungsangebote“ (70px).
   Ersetzt die Verkleinerung vom 10.10.2026 (10px). */
@media (max-width: 767px) {
    #c264 { padding-bottom: 56px; }
}

/* 11.10.2026 Puzzleteile „IGel“ und „Asthma“: auf Handy und kleinem Tablet (bis 900px) als Puzzleteil wie am PC statt als Fähnchen, ca. 80 % groß */
@media (max-width: 900px) {
    .frame-kacheln .col- .frame-igel::before,
    .frame-leistungskacheln .col- .frame-igel::before {
        background: url(../fileadmin/cn_website/images/puzzel-grau.svg) center center/cover no-repeat;
        border: 0; left: -1px; top: -1px; width: 44px; height: 44px; transform: none;
    }
    .frame-kacheln .col- .frame-igel::after,
    .frame-leistungskacheln .col- .frame-igel::after {
        background: url(../fileadmin/cn_website/images/puzzel-igel.svg) center center/cover no-repeat;
        font-size: 18px; padding: 6px 12px 16px 4px; left: -13px; top: -17px; transform: rotate(-13deg);
    }
    .frame-kacheln .col- .frame-igel::after { top: -21px; }

    .frame-leistungskacheln .col- .frame-layout-1:not(.frame-igel)::before,
    .frame-leistungskacheln .col- .frame-layout-1.frame-igel > div::before {
        background: var(--grau); border: 0; top: -1px; width: auto; height: 44px; transform: none;
    }
    .frame-leistungskacheln .col- .frame-layout-1:not(.frame-igel)::before {
        -webkit-mask: url(../fileadmin/cn_website/images/puzzel-asthma_small.svg) center center/cover no-repeat;
        mask: url(../fileadmin/cn_website/images/puzzel-asthma_small.svg) center center/cover no-repeat;
        left: -1px; aspect-ratio: 275.73 / 186.07;
    }
    .frame-leistungskacheln .col- .frame-layout-1.frame-igel > div::before {
        -webkit-mask: url(../fileadmin/cn_website/images/puzzel-asthma_big.svg?v=20261108) center center/cover no-repeat;
        mask: url(../fileadmin/cn_website/images/puzzel-asthma_big.svg?v=20261108) center center/cover no-repeat;
        left: 27px; aspect-ratio: 315.11 / 186.07;
    }
    .frame-leistungskacheln .col- .frame-layout-1:not(.frame-igel)::after {
        background: url(../fileadmin/cn_website/images/puzzel-asthma_small.svg) center center/cover no-repeat;
        font-size: 18px; height: 38px; padding: 6px 14px 0 5px; left: -13px; top: -21px; transform: rotate(-13deg);
    }
    .frame-leistungskacheln .col- .frame-layout-1.frame-igel > div::after {
        background: url(../fileadmin/cn_website/images/puzzel-asthma_big.svg?v=20261108) center center/cover no-repeat;
        font-size: 18px; height: 38px; padding: 6px 14px 0 14px; left: 30px; top: -35px; transform: rotate(-19deg);
    }
}

/* Gruß „Ihr Praxisteam“ am Ende jedes Aktuelles-Beitrags:
   gleicher Schriftzug wie in der Dankesnachricht nach dem Kontaktformular
   (schräg, grün, mit geschwungenem Strich darunter) */
p.praxis-gruss {
    font-family: 'Caveat Brush', cursive;
    font-size: 30px;
    line-height: 1.1;
    color: #1f7a0a;
    display: inline-block;
    transform: rotate(-3deg);
    transform-origin: left center;
    margin: 36px 0 10px !important; /* Abstand zum Text darüber, auch unter Tabellen */
    padding-bottom: 8px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M4 8 C 50 2, 120 2, 196 6' fill='none' stroke='%231f7a0a' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") bottom/100% 10px no-repeat;
}
@media (max-width: 480px) {
    p.praxis-gruss { font-size: 26px; }
}

/* Hinweis Neue Patienten (Bee 12.10.2026): blauer Hinweiskasten <div class="kasten kasten--blau">, Regeln in css/kaesten.css */

/* Kontakt (Bee 12.10.2026): „Route planen“ am PC rechts unter dem Formular, damit beide Spalten etwa gleich lang sind; Handy/Tablet bleibt er bei der Adresse */
#inhaltsbereich .route-rechts { display: none; }
@media (min-width: 992px) {
    #inhaltsbereich .route-links { display: none; }
    #inhaltsbereich .route-rechts { display: block; margin-top: 24px; }
}

/* Ganzkörperlungenfunktion, rotes Band „Wann ist eine Ganzkörperlungenfunktion sinnvoll?“ (Bee 13.10.2026):
   gezeichnete Lunge nach rechts (dort nicht vom Text verdeckt), Atemluft gespiegelt nach links hinter den Text */
#c628 > div > .ce-textpic > .ce-gallery > div:nth-child(1) { left: auto; right: 5%; transform: translateY(-10%) rotate(10deg); }
#c628 > div > .ce-textpic > .ce-gallery > div:nth-child(2) { right: auto; left: calc(5% + 50px); transform: translateY(20%) rotate(-20deg) scaleX(-1); }
@media (max-width: 1200px) {
    #c628 > div > .ce-textpic > .ce-gallery > div:nth-child(1) { left: auto; right: 20px; }
    #c628 > div > .ce-textpic > .ce-gallery > div:nth-child(2) { right: auto; left: 20px; }
}
@media (max-width: 560px) {
    #c628 > div > .ce-textpic > .ce-gallery > div:nth-child(1) { left: auto; right: -20px; }
    #c628 > div > .ce-textpic > .ce-gallery > div:nth-child(2) { right: auto; left: -20px; }
}

/* Google-Bewertung, Kontaktseite (Bee 14.10.2026): dunkelblauer Knopf mit gelben Sternen, einfacher Link ohne Google-Skript.
   Tablet und PC unter den Kontaktdaten (PC seit 28.10.2026, Bee), Handy am Seitenende. Kein QR-Code auf der Website. */
#inhaltsbereich .bewertung-sterne { color: #ffd23f; letter-spacing: 2px; margin-right: 8px; white-space: nowrap; }
#inhaltsbereich .bewertung-knopf a.more.knopf-blau { background: #005aaa; color: #fff; }
#inhaltsbereich .bewertung-knopf a.more.knopf-blau:hover { background: #012343; }
#inhaltsbereich .bewertung-rechts { display: none; }
@media (min-width: 992px) {
    /* Das Formular schwebt (float); der Abstand über „Route planen“ schob es bisher 24px nach unten.
       Jetzt beginnt es oben bündig mit „Dr. med. Renate Eichhorn“. */
    #inhaltsbereich .route-rechts { clear: both; margin-top: 0; padding-top: 24px; }
}

/* Kontakt, nur Handy (Bee 19.10.2026): „Bewerten“ und „Route planen“ ganz ans Ende der Seite, unter das Formular; Reihenfolge wie bisher (erst Bewerten, dann Route). Tablet und PC unverändert. */
/* Seit 03.11.2026 (Bee): „Bewerten“ auch am Handy unter der E-Mail-Adresse, über den Sprechzeiten; nur „Route planen“ bleibt am Seitenende. */
@media (max-width: 599px) {
    #inhaltsbereich .route-links { display: none; }
    #c39 > .rahmen { display: flex; flex-direction: column; }
    #inhaltsbereich .route-rechts { display: block; order: 2; margin-top: 24px; }
}

/* Zeile „Ärztlich verfasst und geprüft …“ (Bee 14.10.2026): klein, grau, wenig Abstand; auf Tablet/PC in einer Zeile */
#inhaltsbereich .frame.frame-verfasst { margin-top: 32px; }
#inhaltsbereich .frame-verfasst .verfasst { font-size: 13px; line-height: 1.4; color: #4a5a6a; margin: 0 0 0 20px; }
@media (min-width: 768px) and (max-width: 991px) { #inhaltsbereich .frame-verfasst .verfasst { font-size: 12px; margin-left: 0; } }
@media (max-width: 599px) { #inhaltsbereich .frame.frame-verfasst { margin-top: 24px; } }
/* Seiten, die mit dieser Zeile enden: weniger Weiß bis zum Fußbereich (sonst 100px) */
#inhaltsbereich:has(> .frame-verfasst:last-child) ~ #footer { margin-top: 48px; }

/* Tablet hoch und quer (Bee 15.10.2026): lange Internet-Adressen umbrechen statt abschneiden;
   Handy quer: Seite nicht seitlich verschiebbar (ausgeblendetes Termine-Kästchen rechts) */
.ce-bodytext a{overflow-wrap:anywhere}
.frame-zwei .ce-bodytext > p{break-inside:avoid}
@media (max-height:600px){.slidein:not(:has(.frame.open)){overflow:hidden}}

/* Seitencheck 15.10.: größere Tippfläche für Links in Listen (unsichtbar, Layout bleibt gleich) */
.ce-bodytext li > a:not([href^="tel:"]):not([data-mail]) { padding-top: 6px; padding-bottom: 6px; }

/* Seitencheck 15.10. (Bee): nur Allergietest – erstes Bild beginnt bündig mit der Überschrift „Allergietest“ */
@media (min-width: 901px) { .page16 #c290 .ce-gallery { margin-top: 20px; } }

/* Bee 20.10.: nur Vorsorge U0–J2 – Abstand vor „Vorsorge U0“ so groß wie vor „Vorsorge U2 – J2“ */
.page22 #c458 h1 { margin-bottom: 0; }

/* Startseite „Patienteninformation“ (Bee 20.10.2026): Knopf „Patienteninfos“ direkt unter dem Text, darunter der Kasten „Neue Patienten“;
   am PC/Tablet quer steht der Kasten unten bündig mit dem roten Notfall-Kasten rechts */
@media (min-width: 992px) {
  #c286 .tx_cn-columns > .row { display: flex; align-items: stretch; }
  #c286 .tx_cn-columns > .row > .col-50 { float: none; }
  #c286 .row > .col-50:first-child { display: flex; flex-direction: column; }
  #c286 .row > .col-50:first-child > #c287 { float: none; margin-bottom: 0; }
  #c286 .row > .col-50:first-child > #c287,
  #c286 .row > .col-50:first-child > #c287 > .rahmen,
  #c286 .row > .col-50:first-child > #c287 .ce-textpic,
  #c286 .row > .col-50:first-child > #c287 .ce-bodytext { display: flex; flex-direction: column; flex: 1 1 auto; }
  #c286 #c287 .ce-bodytext > .neue-patienten { margin-top: auto; margin-bottom: 0; }
}
/* Quellen-Kasten (Vorschlag, Bee 14.10.2026): unauffällig grau, so breit wie der Inhalt darüber, kompakt; über „Ärztlich verfasst und geprüft“ */
#inhaltsbereich .frame.frame-quellen { margin-top: 32px; }
#inhaltsbereich .frame.frame-quellen + .frame.frame-verfasst { margin-top: 8px; }
#inhaltsbereich .frame.frame-quellen + .frame.frame-verfasst .verfasst { margin-left: 14px; }
#inhaltsbereich .frame-quellen .quellen { background: #f1f3f5; border: 0; border-radius: 12px; padding: 8px 14px; margin: 0; }
#inhaltsbereich .frame-quellen .quellen h2 { font-family: inherit; font-size: 13px; font-weight: 700; line-height: 1.4; color: #4a5a6a !important; margin: 0 0 3px; }
#inhaltsbereich .frame-quellen .quellen ul { list-style: none; margin: 0; padding: 0; }
#inhaltsbereich .frame-quellen .quellen li { font-size: 13px; line-height: 1.4; color: #4a5a6a; margin: 0 0 2px; padding: 0; }
#inhaltsbereich .frame-quellen .quellen li:last-child { margin-bottom: 0; }
#inhaltsbereich .frame-quellen .quellen li::before { content: none; display: none; }
#inhaltsbereich .frame-quellen .quellen a { color: #4a5a6a; text-decoration: underline; }
#inhaltsbereich .frame-quellen .quellen a:hover { color: #012343; }
@media (max-width: 599px) { #inhaltsbereich .frame.frame-quellen { margin-top: 24px; } #inhaltsbereich .frame.frame-quellen + .frame.frame-verfasst { margin-top: 8px; } }
@media (min-width: 768px) and (max-width: 991px) { #inhaltsbereich .frame-quellen .quellen h2, #inhaltsbereich .frame-quellen .quellen li { font-size: 12px; } }

/* Bee 23.10.: nur Vorsorge U0–J2 – engerer Abstand vor „Vorsorge U0“ (zurücknehmen: diese Regel löschen) */
.page22 #c289 { margin-top: 20px; }

/* Leistungskacheln Startseite: Symbole groesser, bunte Kacheln bleiben gleich hoch – dafuer weniger Abstand ueber/unter dem Symbol (Bee 29.10.2026) */
#inhaltsbereich .frame-leistungskacheln .col- > .frame { padding-top: 25px; height: calc(100% - 65px); }
#inhaltsbereich .frame-leistungskacheln .col- .ce-gallery { margin-bottom: 15px; }
#inhaltsbereich .frame-leistungskacheln .col- img { height: 130px; width: auto; max-height: none; }
@media (max-width: 900px){
  #inhaltsbereich .frame-leistungskacheln .col- > .frame { padding-top: 15px; height: calc(100% - 40px); }
  #inhaltsbereich .frame-leistungskacheln .col- .ce-gallery { margin-bottom: 10px; }
  #inhaltsbereich .frame-leistungskacheln .col- img { height: 130px; }
}
@media (max-width: 800px){ #inhaltsbereich .frame-leistungskacheln .col- img { height: 115px; } }
@media (max-width: 700px){ #inhaltsbereich .frame-leistungskacheln .col- img { height: 95px; } }
@media (max-width: 599px){
  #inhaltsbereich .frame-leistungskacheln .col- > .frame { padding-top: 45px; height: calc(100% - 50px); }
  #inhaltsbereich .frame-leistungskacheln .col- .ce-gallery { margin-bottom: 5px; }
  #inhaltsbereich .frame-leistungskacheln .col- img { height: 90px; }
}
@media (max-width: 450px){ #inhaltsbereich .frame-leistungskacheln .col- img { height: 70px; } }
/* Wichtige Hinweise: Symbole oben buendig mit der Ueberschrift (Bee 29.10.2026) */
@media (min-width: 901px){ #inhaltsbereich .frame-icon-text .ce-textpic > .ce-gallery { padding-top: 57px; } }
@media (min-width: 801px) and (max-width: 900px){ #inhaltsbereich .frame-icon-text .ce-textpic > .ce-gallery { padding-top: 17px; } }
/* Allgemeine Hinweise: hellgraue Flaeche, weisse Karten mit farbigem Streifen oben (Bee 29.10.2026) */
body.page42 #c647::before { background: #f4f6f8 !important; }
body.page42 #c647 .frame-buntebox > .rahmen > .frame:not(.frame-notfall) { border: none !important; background: #fff !important; box-shadow: 0 6px 20px rgba(1,35,67,.08) !important; border-top: 6px solid var(--karte, #ff7b00) !important; border-radius: var(--ecke, 12px) !important; }
body.page42 #c647 #c590 { --karte: #ff7b00; } body.page42 #c647 #c592 { --karte: #005aaa; } body.page42 #c647 #c593 { --karte: #30ab09; }
/* Allgemeine Hinweise: Eicheln bei den Vorteilen der Praxis-App gruen wie sonst bei Aufzaehlungen (Bee 05.11.2026) */
body.page42 #c647 #c593 ul li::before { background-image: url(../fileadmin/cn_website/images/acorn.svg) !important; }
/* Allgemeine Hinweise: Sprungleiste, Anruf-Knopf nur am Handy, Route planen (Vorschlag 29.10.2026) */
body.page42 .hinweise-sprung > .rahmen { padding-top: 10px !important; padding-bottom: 30px !important; }
body.page42 #inhaltsbereich .lz-sprung a { padding: 8px 16px; }
body.page42 #c601, body.page42 #c599, body.page42 #c645, body.page42 #c647, body.page42 #c597, body.page42 #c600, body.page42 #c644 { scroll-margin-top: 130px; }
body.page42 .anruf-knopf { display: none; }
@media (max-width: 767px){ body.page42 .anruf-knopf { display: block; margin-top: 16px; } }
body.page42 .route-hinweise { margin-top: 20px; }
body.page42 #inhaltsbereich .anruf-knopf a.more { background: #ff7b00 !important; color: #012343 !important; }
body.page42 #inhaltsbereich .anruf-knopf a.more:hover, body.page42 #inhaltsbereich .anruf-knopf a.more:focus { background: #e86f00 !important; }
/* Leistungen im Ueberblick: ohne Eichhoernchen-Bild, Text nicht ueber die ganze Breite (Bee 29.10.2026) */
body #c317 .ce-bodytext > p { max-width: 820px; }
/* Aktuelles-Uebersicht: jeder Beitrag als weisse Karte mit gruenem Streifen oben, hellgrauer Grund (Bee 29.10.2026) */
body.page36 #inhaltsbereich:has(.news-list-container) { background: #f4f6f8; }
body.page36 #inhaltsbereich .news .news-list-container .article { background: #fff; border-radius: var(--ecke, 12px); border: none !important; border-top: 6px solid #30ab09 !important; box-shadow: 0 6px 20px rgba(1,35,67,.08); padding: 28px 32px !important; margin-bottom: 28px !important; }
@media (min-width: 768px){ body.page36 #inhaltsbereich .news .news-list-container .article { display: flow-root; } }
@media (max-width: 767px){ body.page36 #inhaltsbereich .news .news-list-container .article { padding: 22px 20px !important; margin-bottom: 22px !important; } }

/* Allgemeine Hinweise, grauer Kasten „Wie erreichen Sie uns?“, nur Handy (Bee 03.11.2026):
   grauer Rand über der Überschrift und unter dem roten Notfallkasten jeweils halbiert (vorher 110px / 100px). */
@media (max-width: 767px) {
    body.page42 #c647 { padding-top: 45px; padding-bottom: 50px; }
}

/* Textlinks in farbigen Kästen: dunkle Schrift, unterstrichen (grün wäre auf Orange/Blau schlecht lesbar), Bee 07.11.2026 */
#inhaltsbereich a.link-dunkel{color:#012343;text-decoration:underline;text-underline-offset:3px;}
#inhaltsbereich a.link-dunkel:hover{text-decoration-thickness:2px;}

/* Startseite: roter Knopf "Immunsystem-Therapie im Überblick" mit Doppelpfeil wie bei "Leistungen A-Z" (Bee 07.11.2026) */
#inhaltsbereich a.more.more--lesbar.more--rot{background:var(--rot) !important;color:#fff !important;}
#inhaltsbereich p.knopf-immun{margin:30px 0 60px;}

/* Einheitlicher Zurück-Knopf (Vorschlag 07.11.2026): weiß mit grünem Rahmen, Pfeil links, beim Darüberfahren grün gefüllt */
#inhaltsbereich a.zurueck-knopf{display:inline-flex;align-items:center;gap:10px;padding:11px 22px 11px 18px;border:2px solid var(--green-schrift,#1f7a0a);border-radius:6px;background:#fff;color:var(--green-schrift,#1f7a0a);font-weight:700;font-size:17px;line-height:1.3;text-decoration:none !important;transition:background .2s,color .2s;}
#inhaltsbereich a.zurueck-knopf::before{content:"←";font-size:22px;line-height:1;position:relative;top:-2px;text-decoration:none;}
#inhaltsbereich a.zurueck-knopf:hover,#inhaltsbereich a.zurueck-knopf:focus-visible{background:var(--green-schrift,#1f7a0a);color:#fff;}
#inhaltsbereich .frame-zurueck{margin:50px 0 0;}

/* Einheitlicher einfacher Pfeil statt Doppelpfeil (Vorschlag 07.11.2026) */
.frame-kachelbtn .rahmen::after,
.frame-intro .image-caption::after{background:none !important;content:"→" !important;font-weight:700;line-height:1;width:auto !important;height:auto !important;}
.frame-kachelbtn .rahmen::after{color:#fff;font-size:30px;right:20px;bottom:14px;}
.frame-intro .image-caption::after{color:#fff;font-size:34px;}
/* Bunte Kacheln: kleiner Pfeil oben rechts, damit man auch am Handy sieht, dass sie anklickbar sind */
.frame-leistungskacheln .col- > .frame{position:relative;}
.frame-leistungskacheln .col- > .frame .ce-bodytext::after{content:"→";position:absolute;right:20px;bottom:14px;color:inherit;font-size:30px;font-weight:700;line-height:1;}
@media (max-width: 767px){.frame-leistungskacheln .col- > .frame .ce-bodytext::after{right:10px;bottom:6px;font-size:24px;}}
/* Link „zu unserer Kontaktseite“: Pfeil dahinter, als Teil des Links (07.11.2026) */
a.pfeil-link::after{content:"\00a0→";display:inline-block;text-decoration:none;}
/* Startseite 07.11.2026 (Bee): rote Kachel „Leistungen A-Z“ eckig wie alle Kacheln, Titel in derselben Schrift wie der rote Knopf; roter Knopf wird beim Darüberfahren grün */
#inhaltsbereich div.frame-kachelbtn div.rahmen{border-radius:0 !important;}
.frame-kachelbtn .rahmen strong{font-size:17px;font-weight:700;}
#inhaltsbereich a.more.more--lesbar.more--rot:hover,#inhaltsbereich a.more.more--lesbar.more--rot:focus-visible{background:var(--green-schrift,#1f7a0a) !important;color:#fff !important;}
/* 07.11.2026 (Bee): weiße 5-px-Linien zwischen farbigen Bereichen entfernt (Lungenfunktion, Überblick, Darm) */
#inhaltsbereich .frame-bg-icon + .frame-layout-4,
#inhaltsbereich .frame-bg-icon + .frame-bg-teddy{border-top:0;}
#inhaltsbereich .frame-darm + .frame-bg-icon{margin-top:0;}

/* 08.11.2026 (Bee, iPhone-Prüfung): IGel-Puzzleteil quadratisch wie die Zeichnung, damit die rechte Ausbuchtung nicht abgeschnitten wird */
.frame-kacheln .col- .frame-igel::after,
.frame-leistungskacheln .col- .frame-igel::after { box-sizing: border-box; width: 54px; height: 54px; }
@media (max-width: 900px) {
    .frame-kacheln .col- .frame-igel::after,
    .frame-leistungskacheln .col- .frame-igel::after { width: 48px; height: 48px; }
}
/* Quellen-Kästen mit mehreren Quellen: Punkt + Abstand (Bee 10.11.2026); eine einzelne Quelle bleibt ohne Punkt */
#inhaltsbereich .frame-quellen .quellen ul li:not(:only-child) { position: relative; padding-left: 14px; margin: 0 0 8px; }
#inhaltsbereich .frame-quellen .quellen ul li:not(:only-child):last-child { margin-bottom: 0; }
#inhaltsbereich .frame-quellen .quellen ul li:not(:only-child)::before { content: ""; display: block; position: absolute; left: 2px; top: .62em; width: 5px; height: 5px; border-radius: 50%; background: #4a5a6a; }
/* Graue Bereiche und Quellen-Kästen (Bee 11.11.2026): sichtbarer Abstand oben = unten.
   Die Überschrift am Anfang hatte 10px Extra-Polster oben. Startseite bewusst NICHT (Spezialpraxis/Beliebte von Bee abgestimmt). */
#inhaltsbereich :is(#c195,#c410,#c140,#c439,#c440,#c533,#c426) h2:first-of-type { padding-top: 0; }
#inhaltsbereich .frame-quellen .quellen h2 { padding-top: 0; }
#inhaltsbereich :is(#c195,#c410,#c140,#c439,#c440,#c533) h2:first-of-type { margin-top: -4px !important; } /* Luft der großen Schrift über den Buchstaben ausgleichen */
@media (min-width: 768px) { #inhaltsbereich :is(#c195,#c410,#c140,#c439,#c440,#c533) h2:first-of-type { margin-top: -5px !important; } }
#inhaltsbereich :is(#c195,#c426) .ce-gallery { margin-bottom: 0; }
#inhaltsbereich #c195 .ce-gallery .ce-row { vertical-align: top; } /* keine Schriftlücke unter dem Clown-Bild am Handy */ /* Bild als unterstes Element: kein Extra-Abstand unten */
#inhaltsbereich #c426 .ce-bodytext > :last-child { margin-bottom: 0; }
/* TCM, oranger Bereich, auch am PC (Bee 11.11.2026): oben gleich viel Abstand wie unten, wie am 20.10. für Handy/Tablet */
@media (min-width: 992px) { #inhaltsbereich #c643 #c632 h2 { padding-top: 0 !important; } #c643.frame-bg-color { padding-top: 92px; } }
/* Impfplan-Kasten Tablet/PC (Bee 11.11.2026): unten so viel Abstand wie oben */
@media (min-width: 768px) and (max-width: 900px) { #inhaltsbereich #c329 .ce-gallery { margin-bottom: 11px !important; } }
@media (min-width: 901px) { #inhaltsbereich #c329 .ce-gallery { margin-bottom: 0 !important; } }
/* Allgemeine Hinweise „Wie erreichen Sie uns?“, Handy (Vorschlag 11.11.2026): unten so viel Abstand wie oben */
@media (max-width: 767px) { body.page42 #c647 { padding-bottom: 41px; } }
/* Tablet (Bee 11.11.2026): feiner Strich unter jedem Kopfbild am iPad hochkant. Safari zeichnet die unterste Bildpunktreihe der Welle halb durchsichtig,
   darunter blitzt das Foto als Strich durch. Welle 2px über den unteren Rand hinaus (wird abgeschnitten), sichtbar sonst gleich. */
@media (min-width:768px) and (max-width:1099px){#header::after{bottom:-2px!important}}
/* TCM Wasserzeichen (Bee 11.11.2026): beide Zeichen gleich dick (中医 als kräftige Datei) und gleich groß, nie unter Text, Bild oder Kasten.
   Ab 1180px (PC, große Tablets quer): beide 250px wie bisher.
   992–1060 (iPad hochkant): beide 200px, 阴阳 links unter dem Meridian-Bild.
   1061–1179 (ältere/kleine iPads quer): beide 150px, 阴阳 rechts unten (mehr Platz ist dort unter dem Text nicht).
   768–991 (kleinere Tablets hochkant): beide 150px, 阴阳 rechts neben dem Bild. Handy: ausgeblendet wie bisher. */
@media (min-width:992px){.tcm-kinder-kosten .tkk-wz1{width:250px;bottom:0}}
@media (min-width:992px) and (max-width:1060px){.tcm-kinder-kosten .tkk-wz1{width:200px}#c426 .tkk-wz3{width:200px;right:auto;left:7.5%;bottom:0}}
@media (min-width:1061px) and (max-width:1179px){.tcm-kinder-kosten .tkk-wz1{width:150px}#c426 .tkk-wz3{width:150px;bottom:0}}
@media (min-width:768px) and (max-width:991px){.tcm-kinder-kosten .tkk-wz1{width:150px}#c426 .tkk-wz3{width:150px;right:16px}}
/* Lungenfunktion, grauer Bereich „Wie läuft die Untersuchung ab?“ (Clown) auf Tablet hochkant/quer und PC (Bee 11.11.2026): oben und unten deutlich mehr Luft (60 → 100px, wie der rote Bereich darüber am PC), Handy unverändert */
@media (min-width:768px){#inhaltsbereich #c195{padding-top:100px;padding-bottom:100px}}
/* Immunsystem-Überblick, cremefarbener Kasten „Termin & Kontakt“ (Bee 11.11.2026): unten so viel Platz wie oben (vorher 150px, weil letzter Block der Seite). Oben unverändert. */
#inhaltsbereich > #c537.frame-cta-box:last-child { padding-bottom: 76px; }
@media (min-width: 768px) { #inhaltsbereich > #c537.frame-cta-box:last-child { padding-bottom: 78px; } }