/* MovitaMed – Layout 130: Bild links / Text rechts.
 * Element: Text & Bilder, Bildausrichtung: links neben dem Text (ohne Umfluss).
 * Als letztes Element direkt im Hauptinhalt platzieren.
 * Der blaue Hintergrund setzt die Footerfarbe hinter der Karte fort.
 */
.movitamed-site .frame.frame-layout-130 {
    --mm-card-background: var(--mm-cream, #f9f7f5);
    --mm-card-color: var(--mm-brown, #462d18);
    --mm-card-overlap: 160px;
    position: relative;
    isolation: isolate;
    overflow: visible;
    width: calc(100% - 64px);
    max-width: var(--mm-content, 1280px);
    margin-inline: auto;
    padding-inline: 0 !important;
    background: transparent !important;
    color: var(--mm-card-color);
}

/* Hintergrundauswahl aus Erscheinungsbild; Standard ist Creme. */
.movitamed-site .frame-layout-130.frame-background-white {
    --mm-card-background: #fff;
}
.movitamed-site .frame-layout-130:is(.frame-background-primary, .frame-background-dark) {
    --mm-card-background: var(--mm-blue, #0a2d4e);
    --mm-card-color: #fff;
}
.movitamed-site .frame-layout-130.frame-background-secondary {
    --mm-card-background: var(--mm-brown, #462d18);
    --mm-card-color: #fff;
}

.movitamed-site .frame-layout-130 > .textpic {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: clamp(24px, 4vw, 52px);
    align-items: start;
    padding: clamp(24px, 3vw, 40px);
    background: var(--mm-card-background);
    color: var(--mm-card-color);
}
.movitamed-site .frame-layout-130 .textpic-item {
    width: 100%;
    min-width: 0;
}
.movitamed-site .frame-layout-130 .textpic-gallery { order: 0; }
.movitamed-site .frame-layout-130 .textpic-text {
    order: 1;
    align-self: center;
    overflow-wrap: anywhere;
}
.movitamed-site .frame-layout-130 .textpic-gallery :is(figure, .gallery, .gallery-row, .gallery-item) {
    width: 100%;
    max-width: none;
    margin: 0;
}
.movitamed-site .frame-layout-130 .textpic-gallery img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0;
}
.movitamed-site .frame-layout-130 .textpic-text > :last-child { margin-bottom: 0; }
.movitamed-site .frame-layout-130 .textpic-text > ul {
    list-style: none;
    padding: 0;
    margin: 24px 0 28px;
}
.movitamed-site .frame-layout-130 .textpic-text > ul > li {
    position: relative;
    margin: 9px 0;
    padding-left: 27px;
}
.movitamed-site .frame-layout-130 .textpic-text > ul > li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--mm-blue, #0a2d4e);
    font-weight: 600;
}
.movitamed-site .frame-layout-130:is(.frame-background-primary, .frame-background-dark, .frame-background-secondary) .textpic-text :is(h1,h2,h3,h4,h5,h6),
.movitamed-site .frame-layout-130:is(.frame-background-primary, .frame-background-dark, .frame-background-secondary) .textpic-text > ul > li::before {
    color: #fff;
}

/* Nur direkt vor dem Footer: keine Lücke unter der Karte.
 * Der blaue Streifen erzeugt die Überlappungsoptik ohne Inhalte zu verdecken.
 * Auf diesem Abschlussblock hat Abstand danach deshalb keine Wirkung.
 */
@media (min-width: 768px) {
    .movitamed-site .mm-page-content:has(> .frame-layout-130:last-child) {
        padding-bottom: 0 !important;
    }
    .movitamed-site .mm-page-content > .frame-layout-130:last-child {
        margin-bottom: 0 !important;
        padding-bottom: 0 !important;
    }
    .movitamed-site .mm-page-content > .frame-layout-130:last-child::before {
        content: "";
        position: absolute;
        z-index: -1;
        pointer-events: none;
        left: calc(50% - 50vw);
        right: calc(50% - 50vw);
        bottom: 0;
        height: var(--mm-card-overlap);
        background: var(--mm-blue, #0a2d4e);
    }
}
@media (max-width: 767px) {
    .movitamed-site .frame.frame-layout-130 { width: calc(100% - 36px); }
    .movitamed-site .frame-layout-130 > .textpic {
        grid-template-columns: minmax(0, 1fr);
        gap: 26px;
        padding: 22px;
    }
}
@media print {
    .movitamed-site .frame-layout-130::before { display: none; }
}

/* Karte weiß */
.movitamed-site .frame-layout-130 > .textpic {
    position: relative;
    isolation: isolate;
    background: #fff;
}

/* Weiße Fläche rechts bis zum Bildschirmrand verlängern */
@media (min-width: 768px) {
    .movitamed-site .frame-layout-130 > .textpic::after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 100%;
        width: max(0px, calc(50vw - 50%));
        background: #fff;
        pointer-events: none;
        z-index: -1;
    }
}

/* Hintergrund hinter dem weißen Block wie beim Slider */
.movitamed-site .mm-page-content:has(> .frame-layout-130:last-child) {
    background-color: var(--mm-cream, #f9f7f5);
}
