/* css/layout.css */
.container {
    width: 90%;
    max-width: 1200px;
    margin: 0 auto;
}

.section {
    padding: var(--space-lg) 0;
}

@media (min-width: 768px) {
    .section {
        padding: var(--space-xl) 0;
    }
}

.section__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-md);
}

@media (min-width: 768px) {
    .section__grid {
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
        gap: var(--space-lg);
    }

    /* Support for alternating layouts or mobile-first image ordering */
    .about__grid-container {
        grid-template-areas: "text image";
    }

    .about__text {
        grid-area: text;
    }

    .about__image {
        grid-area: image;
    }
}

/* Feature grid (3 cols) */
.features__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-md);
    margin-top: var(--space-md);
}

@media (min-width: 768px) {
    .features__grid {
        grid-template-columns: repeat(3, 1fr);
        align-items: center;
    }
}

/* Gallery grid */
.gallery__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-xs);
    margin-top: var(--space-md);
}

@media (min-width: 768px) {
    .gallery__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Contact layout */
.contact__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-md);
}

@media (min-width: 768px) {
    .contact__grid {
        grid-template-columns: 1fr 1fr;
        align-items: flex-start;
    }
}