/* ==============================================
   BRASERO — GALERÍA CSS
   ============================================== */
.gallery-section { padding: 4rem clamp(1.5rem,5vw,6rem) 7rem; background: var(--carbon); }
.gallery-filters { display:flex; gap:.75rem; flex-wrap:wrap; margin-bottom:3rem; }
.gal-filter { padding:.55rem 1.4rem; background:transparent; border:1px solid var(--line); color:var(--muted); font-family:var(--font-body); font-size:.72rem; font-weight:500; letter-spacing:.14em; text-transform:uppercase; border-radius:3px; cursor:pointer; transition:all var(--transition); }
.gal-filter:hover,.gal-filter.active { background:var(--ember); border-color:var(--ember); color:var(--carbon); }

.gallery-grid { columns:3; column-gap:8px; }
.gal-item { break-inside:avoid; overflow:hidden; margin-bottom:8px; position:relative; cursor:pointer; }
.gal-item img { width:100%; display:block; transition:transform .5s ease,filter .5s ease; filter:brightness(.78) saturate(.85); }
.gal-item:hover img { transform:scale(1.04); filter:brightness(.92) saturate(1); }

.lightbox { position:fixed; inset:0; background:rgba(14,10,7,.97); z-index:9000; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transition:opacity .35s ease; backdrop-filter:blur(8px); }
.lightbox.active { opacity:1; pointer-events:all; }
.lightbox img { max-width:90vw; max-height:85vh; object-fit:contain; animation:lbIn .3s ease both; }
@keyframes lbIn { from{opacity:0;transform:scale(.95)} to{opacity:1;transform:scale(1)} }
.lightbox__close,.lightbox__prev,.lightbox__next { position:fixed; background:none; border:1px solid var(--line); color:var(--cream); font-size:1.6rem; cursor:pointer; width:48px; height:48px; display:flex; align-items:center; justify-content:center; transition:all var(--transition); border-radius:3px; }
.lightbox__close { top:1.5rem; right:1.5rem; font-size:1.9rem; }
.lightbox__prev { left:1.5rem; top:50%; transform:translateY(-50%); }
.lightbox__next { right:1.5rem; top:50%; transform:translateY(-50%); }
.lightbox__close:hover,.lightbox__prev:hover,.lightbox__next:hover { background:var(--ember); border-color:var(--ember); color:var(--carbon); }

@media(max-width:820px){ .gallery-grid{columns:2} }
@media(max-width:480px){ .gallery-grid{columns:1} }
