.gallery-section { padding: 6.5rem 6vw; background: #121821; overflow: hidden; }
.gallery-section__intro { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-bottom: 1.2rem; border-bottom: 1px solid rgba(255,255,255,.2); color: var(--lime); font: 700 .72rem/1.2 var(--mono); letter-spacing: .08em; }
.gallery-section__heading { display: grid; grid-template-columns: 1.2fr .65fr; align-items: end; gap: 3rem; padding: 2.8rem 0 2.4rem; }
.gallery-section__heading h2 { margin: 0; font-size: clamp(3.6rem, 8vw, 8.5rem); font-weight: 500; letter-spacing: -.09em; line-height: .83; }
.gallery-section__heading h2 em { color: var(--lime); font-family: var(--serif); font-weight: 400; letter-spacing: -.06em; }
.gallery-section__heading p { max-width: 29rem; margin: 0 0 .55rem; color: rgba(255,255,255,.72); font-size: clamp(1rem, 1.4vw, 1.35rem); line-height: 1.35; }
.gallery-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: clamp(.55rem, .9vw, .85rem); }
.gallery-item, .gallery-item--wide, .gallery-item--tall { position: relative; grid-column: auto; grid-row: auto; min-height: 0; aspect-ratio: 4/5; overflow: hidden; padding: 0; cursor: zoom-in; border: 0; background: #050607; }
.gallery-item img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(1.08) contrast(1.04); transition: transform .7s cubic-bezier(.2,.7,.2,1), filter .5s ease; }
.gallery-item::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 58%, rgba(0,0,0,.42)); opacity: .55; transition: opacity .4s ease; }
.gallery-item span { position: absolute; z-index: 1; right: 1rem; bottom: .85rem; color: white; font: 700 .72rem/1 var(--mono); letter-spacing: .09em; }
.gallery-item:hover img, .gallery-item:focus-visible img { transform: scale(1.055); filter: saturate(1.2) contrast(1.07); }
.gallery-item:hover::after, .gallery-item:focus-visible::after { opacity: .15; }
.gallery-item:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
.gallery-lightbox { position: fixed; z-index: 30; inset: 0; display: grid; place-items: center; padding: 4rem 7vw; background: rgba(4,6,8,.95); opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.gallery-lightbox[aria-hidden="false"] { opacity: 1; pointer-events: auto; }
.gallery-lightbox img { display: block; max-width: min(100%, 75rem); max-height: 84vh; box-shadow: 0 2rem 6rem rgba(0,0,0,.55); object-fit: contain; }
.gallery-lightbox__close { position: absolute; top: 1.5rem; right: 2rem; width: 3rem; height: 3rem; cursor: pointer; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; color: white; background: transparent; font-size: 2rem; line-height: 1; }
.gallery-lightbox__close:hover, .gallery-lightbox__close:focus-visible { border-color: var(--lime); color: var(--lime); }
@media (max-width: 980px) { .gallery-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 760px) { .gallery-section { padding: 5rem 5vw; } .gallery-section__intro { align-items: flex-start; } .gallery-section__intro > p:last-child { display: none; } .gallery-section__heading { grid-template-columns: 1fr; gap: 1.4rem; padding: 2.5rem 0; } .gallery-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: .55rem; } .gallery-item, .gallery-item--wide, .gallery-item--tall { aspect-ratio: 3/4; } .gallery-lightbox { padding: 5rem 1.2rem 1.2rem; } .gallery-lightbox__close { top: 1rem; right: 1rem; } }
