/* --- MEDIA QUERY FÜR MOBILE & TOUCH-GERÄTE --- */
@media (max-width: 768px), (pointer: coarse) {
    body {
        /* Erlaubt der Seite das ganz normale, natürliche Scrollen */
        overflow-y: auto;
        overflow-x: hidden;
        height: auto !important;
        background-position: center center;
        height: 100%;
        margin: 0;
        min-height: 100vh;
    }

    .ldc-layout,
    .ldgroup-layout {
        flex: 1 0 auto; /* Drückt den Footer nach unten, solange wenig Inhalt da ist */
        height: auto !important; 
        max-height: none !important;
        overflow: visible !important;
        padding: 10px !important;
    }

    /* 3. Der Footer schließt immer sauber ab */
    .ldc-footer {
        flex-shrink: 0; /* Verhindert, dass der Footer zusammengedrückt wird */
        position: static !important; /* Kein Festkleben am Bildschirmrand! */
        width: 100% !important;    }

    .ldgroup-layout .box_legal {
        width: 100% !important;
        max-width: 100% !important;
    }    /* --- Überschrift (Analog zu .flyer-hero im VHS-Kursbuch) --- */
    .ldgroup-layout .flyer-hero {
        padding: 0;
    }

    .ldgroup-layout .flyer-hero h1 {
    color: var(--ldgroup-color-dark) !important;
        font-size: 2rem;
        margin: 0; /* Wichtig: margin auf 0 setzen, um keine Lücken zu erzeugen */
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    }
    .ldgroup-layout .legal_container_content {
        font-size: 0.5rem;
    }
    .ldgroup-layout .legal_container h2 {
        font-size: 1.2rem;
    }

}