.project-gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(1rem, 2vw, 1.5rem);
}

.project-gallery-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #c9d9df;
    border-radius: var(--radius);
    background: #edf5f7;
}

.project-gallery-photo {
    position: relative;
    isolation: isolate;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background: #dfe8e8;
}

.project-gallery-picture {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.project-gallery-picture-bottom {
    object-position: center bottom;
}

.project-gallery-brand {
    position: absolute;
    inset: .8rem auto auto .8rem;
    display: block;
    width: min(6rem, 36%);
    padding: .4rem .48rem;
    border: 1px solid #d8e3e8;
    border-radius: 6px;
    background: var(--white);
}

.project-gallery-brand img {
    width: 100%;
}

.project-gallery-caption {
    flex: 1;
    position: relative;
    padding: clamp(1rem, 1.7vw, 1.35rem);
    border-top: 3px solid var(--blue);
}

.project-gallery-caption::before {
    content: "";
    position: absolute;
    inset: -3px auto auto 0;
    width: 3rem;
    height: 3px;
    background: var(--cyan);
}

.project-gallery-caption strong {
    display: block;
    color: var(--ink);
    font: 800 clamp(1.02rem, 1.4vw, 1.2rem)/1.3 Manrope, system-ui, sans-serif;
    letter-spacing: -.025em;
}

.project-gallery-caption p {
    margin-top: .35rem;
    color: var(--muted);
    font-size: .9rem;
    line-height: 1.5;
}

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