.project-gallery { background: #e9e8e1; }
.gallery-grid { columns: 3; column-gap: 24px; }
.gallery-item { break-inside: avoid; margin: 0 0 28px; }
.gallery-link { display: block; position: relative; overflow: hidden; background: #242829; }
.gallery-link img { display: block; width: 100%; height: auto; transition: transform .35s ease; }
.gallery-link:hover img { transform: scale(1.025); }
.gallery-link:focus-visible { outline: 3px solid #a74b09; outline-offset: 4px; }
.gallery-zoom { position: absolute; bottom: 12px; right: 12px; display: grid; place-items: center; width: 40px; height: 40px; background: #ff8000; color: #121416; font-size: 24px; }
.gallery-item figcaption { display: flex; gap: 12px; padding-top: 12px; font-size: 13px; line-height: 1.5; color: #303633; }
.gallery-item figcaption > span { color: #a74b09; font-weight: 700; }
.gallery-dialog { box-sizing: border-box; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 24px; border: 0; background: #121416f5; color: #fff; }
.gallery-dialog:not([open]) { display: none; }
.gallery-dialog[open] { display: grid; place-items: center; }
.gallery-dialog::backdrop { background: #121416; }
.gallery-viewer { width: min(1200px, 100%); height: 100%; min-height: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.gallery-dialog button { flex-shrink: 0; display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #ffffff55; background: #222629; color: #fff; font: inherit; font-size: 26px; cursor: pointer; }
.gallery-dialog button:hover { background: #ff8000; color: #121416; }
.gallery-dialog button:focus-visible { outline: 2px solid #ff963f; outline-offset: 3px; }
.gallery-dialog .gallery-close { align-self: flex-end; }
.gallery-full-image { display: block; flex: 1; min-height: 0; width: 100%; object-fit: contain; }
.gallery-controls { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; flex-shrink: 0; }
.gallery-details { text-align: center; }
.gallery-details > span { color: #ff963f; font-size: 12px; letter-spacing: .12em; }
.gallery-details p { margin: 5px 0 0; color: #f1f1ed; font-size: 14px; line-height: 1.4; }
body.gallery-open { overflow: hidden; }
@media (min-width: 861px) and (max-width: 1100px) { .site-header .header-contact { display: none; } }
@media (min-width: 1101px) and (max-width: 1400px) { .site-header .brand-description { display: none; } }
@media (max-width: 860px) { .gallery-grid { columns: 2; column-gap: 18px; } }
@media (max-width: 520px) {
    .gallery-grid { columns: 1; }
    .gallery-dialog { padding: 12px; padding-bottom: max(12px, env(safe-area-inset-bottom)); }
    .gallery-details p { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .gallery-link img { transition: none; } }
