/* =======================================================
   GALERIA
   ======================================================= */
#galeria{position:relative}
#galeria .gallery{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(12px,2vw,18px);
  margin-top:18px; perspective:900px;
}
@media (max-width:1080px){#galeria .gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){#galeria .gallery{grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}}

#galeria .gallery figure{
  position:relative; margin:0; border-radius:14px; overflow:hidden; isolation:isolate; background:#0f0f0f;
  border:1px solid rgba(255,223,138,.2); box-shadow:0 12px 28px rgba(0,0,0,.45);
  aspect-ratio:4/3; transform-style:preserve-3d; transition:transform .25s var(--ease-smooth), box-shadow .25s, border-color .2s, filter .2s;
  content-visibility:auto; contain-intrinsic-size:260px 360px;
}
#galeria .gallery figure::after{
  content:""; position:absolute; inset:-1px; border-radius:inherit; padding:1px; background:var(--gold-grad);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; opacity:.7; pointer-events:none;
}
#galeria .gallery figure > a{display:block; width:100%; height:100%; text-decoration:none; color:inherit; line-height:0; cursor:pointer}
#galeria .gallery img{width:100%; height:100%; object-fit:cover; display:block; transform:scale(1); transition:transform .4s var(--ease-smooth), filter .4s; filter:saturate(1.02) contrast(1.02)}
#galeria .gallery figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:10px 12px; font-size:.98rem; text-align:center; color:#ede8d2;
  -webkit-backdrop-filter:blur(6px) saturate(120%); backdrop-filter:blur(6px) saturate(120%);
  background:linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(12,12,12,.55) 40%,rgba(12,12,12,.75) 100%);
  border-top:1px solid rgba(255,223,138,.14);
}
#galeria .gallery figure:hover{
  transform:translateY(-6px) rotateX(2deg) rotateY(-2deg);
  box-shadow:0 22px 50px rgba(232,199,103,.16),0 14px 36px rgba(0,0,0,.55); border-color:rgba(255,223,138,.35);
}
#galeria .gallery figure:hover img{transform:scale(1.04); filter:saturate(1.06) brightness(1.02)}
#galeria .gallery figure:focus-within{outline:2px solid #ffe29a; outline-offset:3px}
body.is-scrolling .gallery figure{box-shadow:0 6px 16px rgba(0,0,0,.35)}
@media (max-width:760px){#galeria .gallery figure{border-radius:12px; aspect-ratio:4/3}}