/* ============================================================
   Plantilla de GALERÍA — estilos propios (además de css/style.css)
   ============================================================ */

.gallery-item {
  display: block;
  border: none;
  background: none;
  padding: 0;
  cursor: zoom-in;
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.gallery-item:hover, .gallery-item:focus-visible {
  transform: translateY(-3px);
  box-shadow: var(--shadow-card);
}
.gallery-item .img-frame { margin-bottom: 0; }
.gallery-item .gallery-caption {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--tao-ink);
  margin-top: 0.5rem;
  text-align: center;
}

#lightboxModal .modal-content {
  background: var(--tao-ink);
  border: none;
}
#lightboxModal .modal-body { padding: 1.5rem; }
#lightboxModal .lightbox-img-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 220px;
  max-height: 72vh;
  background: #000;
  border-radius: var(--radius);
  overflow: hidden;
}
#lightboxModal .lightbox-img-wrap img {
  display: block;
  max-width: 100%;
  max-height: 72vh;
  width: auto;
  height: auto;
  object-fit: contain;
}
#lightboxModal .btn-close { filter: invert(1); }
#lightboxModal .modal-caption {
  color: rgba(255, 255, 255, 0.85);
  text-align: center;
  margin-top: 1rem;
  font-size: 0.92rem;
}