.project-gallery-grid button.project-gallery-trigger {
    position:relative;
    display:block;
    width:100%;
    height:clamp(190px,22vw,330px);
    padding:0;
    overflow:hidden;
    border:0;
    border-radius:14px;
    background:#dcebe0;
    cursor:zoom-in;
}
.project-gallery-grid button.project-gallery-trigger:first-child { grid-column:span 2; }
.project-gallery-grid button.project-gallery-trigger img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.project-gallery-grid button.project-gallery-trigger:hover img { transform:scale(1.05); }

.project-lightbox[hidden] { display:none; }
.project-lightbox { position:fixed; z-index:1000; inset:0; display:grid; place-items:center; padding:28px; }
.project-lightbox-backdrop { position:absolute; inset:0; background:rgba(2,22,24,.9); }
.project-lightbox-dialog { position:relative; z-index:1; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:20px; width:min(1160px,100%); }
.project-lightbox-dialog figure { display:grid; justify-items:center; gap:12px; max-width:100%; margin:0; }
.project-lightbox-image { display:block; max-width:min(86vw,1000px); max-height:82vh; border-radius:12px; object-fit:contain; box-shadow:0 24px 70px rgba(0,0,0,.3); }
.project-lightbox-dialog figcaption { display:grid; gap:5px; color:#d9f5df; font-size:.85rem; font-weight:700; text-align:center; }
.project-lightbox-dialog figcaption small { color:rgba(217,245,223,.7); font-size:.7rem; letter-spacing:.1em; order:3; }
.project-lightbox-dialog figcaption strong { font:800 1rem var(--heading-font); }
.project-lightbox-dialog figcaption span { color:rgba(255,255,255,.8); font-size:.85rem; font-weight:400; line-height:1.45; }
.project-lightbox-control,.project-lightbox-close { display:grid; place-items:center; border:1px solid rgba(255,255,255,.45); background:rgba(255,255,255,.12); color:#fff; cursor:pointer; }
.project-lightbox-control { width:48px; height:48px; border-radius:50%; font-size:1rem; }
.project-lightbox-control:hover,.project-lightbox-close:hover { background:#0c9a51; border-color:#0c9a51; }
.project-lightbox-control:disabled { opacity:.35; cursor:default; }
.project-lightbox-close { position:absolute; z-index:2; top:-55px; right:0; width:42px; height:42px; border-radius:50%; }
.project-lightbox-open { overflow:hidden; }

@media (max-width:760px) {
    .project-gallery-grid button.project-gallery-trigger:first-child { grid-column:auto; }
    .project-gallery-grid button.project-gallery-trigger { height:235px; }
    .project-lightbox { padding:18px; }
    .project-lightbox-dialog { grid-template-columns:42px minmax(0,1fr) 42px; gap:8px; }
    .project-lightbox-image { max-width:calc(100vw - 100px); max-height:76vh; }
    .project-lightbox-close { top:-52px; right:0; }
}