/* ==========================================
   legacy-mapping.css – v2
   
   ========================================== */

   .content-gallery--cols-3 {
        min-width: 53.5%; 
   }

   .content-gallery--cols-3 > ul li:nth-child(3n) figure {
        padding-right: 0;
   }

 /* ---------- ALTES .ce_text → NEU .content-text + .rte ---------- */

.ce_text,
.content-text .rte {
    line-height: 1.6;
    margin-bottom: 2rem;
    color: #222; 
}

.content-text h3,
.content-text h2 {
    margin-top: 2rem;
}

/* ---------- ALTES .image_container.float_left → NEU .media.media--left + figure ---------- */

.media--left {
    float: left;
    margin: 0 2rem 2rem 0;
}

.media--above {
    display: block;
    margin-bottom: 2rem;
}

.media figure {
    margin: 0;
    display: inline-block;
}

.media img {
    max-width: 100%;
    height: auto;
}

/* Bildunterschrift */
.media figcaption,
.caption {
    text-align: center;
    font-style: italic;
    font-size: 0.95rem;
    margin-top: 0.5rem;
    color: #666;
}

/* ---------- ALTE .block-Klasse: spacing für Textblöcke ---------- */

.block,
.content-text {
    margin-bottom: 3rem;
}

/* ---------- LIGHTBOX LINK ---------- */

.cboxElement {
    display: inline-block;
    border: none;
    text-decoration: none;
}

/* ---------- ALT: .float_left → ersetzt durch media--left ---------- */

.float_left {
    float: left;
    margin-right: 2rem;
}

.float_above {
    display: block;
    margin-bottom: 2rem;
}

/* ---------- RESPONSIVE FIXES ---------- */

@media screen and (max-width: 768px) {
    .media--left,
    .float_left {
        float: none;
        display: block;
        margin: 0 auto 2rem auto;
    }

    .content-text .rte {
        font-size: 1rem;
    }
}


/* ==========================================
   legacy-mapping.css – v3
   Flexbox-Erweiterung für Zweispaltigkeit
   ========================================== */

/* ---------- TEXTELEMENTE ---------- */
.ce_text,
.content-text .rte {
    
    line-height: 1.6;
    margin-bottom: 2rem;
    color: #222;
}

.content-text h3,
.content-text h2 {
    
    font-weight: 600;
    margin-top: 2rem;
}

/* ---------- MEDIA-CONTAINER ---------- */
.media--left {
    /* Fallback für alte float_logik */
    float: left;
    margin: 0 2rem 2rem 0;
}

.media--above {
    display: block;
    margin-bottom: 2rem;
}

.media figure {
    margin: 0;
    display: inline-block;
}

.media img {
    max-width: 100%;
    height: auto;
}

/* ---------- FLEXBOX-ZWEISPALTIGKEIT ---------- */
.content-text.media.media--left {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
    flex-wrap: wrap;
}

.content-text.media.media--left figure {
    flex: 0 0 auto;
    max-width: 52%;
}

.content-text.media.media--left .rte {
    flex: 1 1 0;
    min-width: 240px;
}

/* ---------- figcaption ---------- */
.media figcaption,
.caption {
    text-align: center;
    font-style: italic;
    font-size: 0.95rem;
    margin-top: 0.5rem;
    color: #666;
}

/* ---------- BLOCKS & MISC ---------- */
.block,
.content-text {
    margin-bottom: 3rem;
}

.cboxElement {
    display: inline-block;
    border: none;
    text-decoration: none;
}

.float_left {
    float: left;
    margin-right: 2rem;
}

.float_above {
    display: block;
    margin-bottom: 2rem;
}

/* ---------- RESPONSIVE ---------- */
@media screen and (max-width: 768px) {
    .media--left,
    .float_left {
        float: none;
        display: block;
        margin: 0 auto 2rem auto;
    }

    .content-text.media.media--left {
        flex-direction: column;
    }

    .content-text.media.media--left figure,
    .content-text.media.media--left .rte {
        max-width: 100%;
        flex: 1 1 100%;
    }

    .content-text .rte {
        font-size: 1rem;
        padding-left: 40px;
        padding-right: 40px;

    }
    
}

.content-gallery figure {
	padding-right: 40px;
	padding-bottom: 40px;
}

.content-image {
    position: relative;
}

.videobox {
    display: block; 
}
.videobox > div {
    max-width: 40%;
    display: inline-block;
    vertical-align: top;
}

.videobox video {
    max-width: 100%;
}

.videobox .content-player {
    max-width: 50%;
}

@media screen and (max-width: 768px) { 
    .videobox > div, .videobox > .content-player {
        display: block;
        width: 100% !important;
        max-width: 100% !important;
    }
    
    .videobox .content-text {
        padding-left: 0;
        margin-top: 40px;
    }

    .videobox .rte {
        padding-left: 0;
        padding-right: 0;
    }
    #home figcaption, 
    #philosophie figcaption, 
    #backwaren figcaption, #geschaefte figcaption, #aktuelles figcaption, #kontakt figcaption, #impressum figcaption {
        top: 20%;
        font-size: 30px;
    }

    
    .storewrap .rte {
        padding-left: 0;
        padding-right: 0;
    }

    .content-text figure {
        padding-left: 40px;
        padding-right: 40px;
    }

    .content-gallery{
        padding-left: 40px;
    }

    .content-gallery + div h3 {
        padding-left: 40px;
    }
}

#aktuelles > .content-image:first-child {
    margin-bottom: 3rem;
}

.as_h1 {
    font-size: 1.8333em !important;
}

.as_h2 {
    font-size: 1.6667em !important;
}