/**
 * 📐 Positioning Utilities
 * Flexbox, Zentrierung, Z-Index
 */

/* ═══════════════════════════════════════════════════════════
   CENTERED CONTAINER (container-zentrieren.html.twig)
   ═══════════════════════════════════════════════════════════ */

.layout-center-wrapper {
    grid-column: 1 / -1;
    display: flex;
    justify-content: center;
    width: 100%;
    margin: 20px 0;
    pointer-events: none;
}

.layout-center-wrapper > * {
    pointer-events: auto;
    max-width: var(--max-w);
}

/* ═══════════════════════════════════════════════════════════
   VIERTEL-KACHEL SPACER (index.html.twig)
   ═══════════════════════════════════════════════════════════ */

.viertel-kachel-spacerbox {
    flex: 0 0 22%;
    min-width: 250px;
}

@media (max-width: 800px) {
    .viertel-kachel-spacerbox {
        flex: 0 0 45%;
    }
}

@media (max-width: 500px) {
    .viertel-kachel-spacerbox {
        flex: 0 0 95%;
    }
}