/*
 Theme Name: Astra Child
 Theme URI:  https://louisianawandering.com
 Description: Child theme for Astra — portfolio project templates
 Author:      Josh Otwell
 Template:    astra
 Version:     1.0.0
 Text Domain: astra-child
*/

/* Basic structure tweaks */
.lw-project-hero img {
    width: 100%;
    height: auto;
    display: block;
}

.lw-project-hero-content {
    margin-top: 1.5rem;
}

/*.lw-project-gallery {
    margin-top: 3rem;
}

.lw-project-image-block {
    margin-bottom: 2rem;
}*/

/*.lw-project-image-block img {
    width: 100%;
    height: auto;
    display: block;
}

.lw-project-image-block figcaption {
    font-size: 0.9rem;
    opacity: 0.8;
    margin-top: .5rem;
}*/

.lw-project-notes {
    margin-top: 4rem;
}

.lw-back-link {
    margin-top: 2rem;
}

.lw-project-archive-grid {
    display: grid;
    gap: 2rem;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

/* --- Portfolio Project Gallery --- */

.lw-project-gallery {
    width: 100%;
    max-width: 900px;        /* keeps a readable width */
    margin: 0 auto;          /* centers the whole gallery */
    padding: 2rem 1rem;
}

/*.lw-project-image-set {
    display: grid;
    gap: 1.25rem;
    margin-bottom: 3rem;
}*/

/* mobile-first: single-column */
/*.lw-project-image {
    width: 100%;
    height: auto;
    border-radius: 6px;
    display: block;
}*/

/*.lw-project-image-set {
    display: grid !important;
    grid-auto-flow: row;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.5rem !important;
    margin-bottom: 3rem;

}

.lw-project-image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 6px;
    margin: 0;
}*/

/* --- Tablet (≥600px): 2-column sets --- */
@media (min-width: 600px) {
    .lw-project-image-set {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* --- Desktop (≥900px): 3-column sets --- */
@media (min-width: 900px) {
    .lw-project-image-set {
        grid-template-columns: repeat(3, 1fr);
    }
}

.lw-project-gallery .lw-project-image-set {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
    margin-bottom: 3rem;
}

.lw-project-gallery .lw-project-image {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 6px;
}