/*
Theme Name: Twenty Twenty-One Child
Template: twentytwentyone
Version: 3.4
CLEAN GRID FIX + SAFE DESKTOP CENTER
*/

/* =========================================================
   BASIS
========================================================= */

html, body {
    overflow-x: hidden;
    background: #ffffff !important;
}

/* Footer sichtbar */
.footer-widgets,
.widget-area,
.site-footer .widget {
    display: block !important;
}

/* =========================================================
   BEITRÄGE – TYPOGRAFIE
========================================================= */

body.single-post .entry-title {
    font-size: 1.8rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
}

body.single-post .entry-content {
    font-size: 1.2rem !important;
    line-height: 1.6 !important;
}

body.single-post .entry-content p,
body.single-post .entry-content li {
    font-size: inherit !important;
    line-height: inherit !important;
}

/* =========================================================
   BEITRÄGE – DESKTOP ZENTRIERUNG
========================================================= */

@media (min-width: 769px) {

    body.single-post article > img.wp-post-image {
        display: block !important;
        margin: 0 auto 30px auto !important;
    }

    body.single-post .entry-header.mobile-adjust {
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: center !important;
    }

    body.single-post .entry-title {
        text-align: center !important;
    }
}

/* =========================================================
   MOBILE – ABSTÄNDE BILD / H1 / TEXT FIX
========================================================= */

@media (max-width: 768px) {

    /* Bild enger an Titel */
    body.single-post article > img.wp-post-image {
        margin-bottom: 0px !important;
    }

    /* Parent-Theme Header-Abstand entfernen */
    body.single-post .entry-header {
        margin-bottom: 0 !important;
    }

    /* H1 kompakter */
    body.single-post .entry-title {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
    }

    /* Abstand Header → Content neutralisieren */
    body.single-post .entry-header + .entry-content {
        margin-top: 0 !important;
    }

    body.single-post .entry-content {
        margin-top: 0 !important;
    }
}

/* =========================================================
   STARTSEITE – MOBILE GRID FIX
========================================================= */

@media (max-width: 768px) {

    body.page-id-5 .home-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 0 !important;
        width: 100% !important;
    }

    body.page-id-5 .home-grid > * {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.page-id-5 .wp-block-image img {
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }
}

/* =========================================================
   STARTSEITE – DESKTOP GRID
========================================================= */

@media (min-width: 769px) {

    body.page-id-5 .home-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 20px !important;
        width: 100% !important;
        max-width: 1280px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    body.page-id-5 .home-grid > * {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    body.page-id-5 .wp-block-image img {
        width: 100% !important;
        height: auto !important;
        display: block !important;
    }
}

/* =========================================================
   STARTSEITE – ANDERE BILDER
========================================================= */

body.page-id-5 .wp-block-image.size-full:not(.home-grid img) img {
    max-width: 100% !important;
    height: auto !important;
}

/* =========================================================
   LEAFLET – MARKER
========================================================= */

.own-marker {
    background: #d40000;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 3px solid #ffffff;
    box-shadow: 0 0 4px rgba(0,0,0,0.4);
}

/* =========================================================
   MOBILE – BILDER VOLLBREITE
========================================================= */

@media (max-width: 768px) {

    body.single-post .site-main,
    body.single-post .entry-content {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body.single-post .entry-content img {
        width: 100vw !important;
        max-width: 100vw !important;
        margin-left: calc(-50vw + 50%);
        height: auto !important;
        display: block !important;
    }
}