/* ============================================================
   LAYOUT: Grid-Struktur (Desktop)
   ============================================================ */

main {
    max-width: 1200px;
    margin: 20px auto 40px;
    padding: 0 16px;
}

.grid-main {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(0, 1.5fr);
    gap: 24px;
    margin-bottom: 32px;
}

.grid-secondary {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-bottom: 32px;
}

.grid-third {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(0, 2fr);
    gap: 24px;
    margin-bottom: 32px;
}

/* ============================================================
   LAYOUT: Grid-Struktur für die Galerie
   ============================================================ */

.grid-gallery {
    display: grid;
    grid-template-columns: 260px 1fr; /* Links schmal, rechts flexibel */
    gap: 24px;
    margin-bottom: 32px;
    align-items: start;
}

@media (max-width: 800px) {
    .grid-gallery {
        grid-template-columns: 1fr;
    }
}