/* === GALERÍA MASONRY === */
.gdl-galeria {
  column-count: 3;          /* número de columnas en pantallas grandes */
  column-gap: 12px;         /* espacio entre columnas */
}

@media (max-width: 1024px) {
  .gdl-galeria {
    column-count: 2;        /* tablet */
  }
}

@media (max-width: 640px) {
  .gdl-galeria {
    column-count: 1;        /* móvil */
  }
}

/* Cada elemento de la galería se comporta como bloque dentro del masonry */
.gdl-item-wrapper {
  display: inline-block;
  width: 100%;
  margin-bottom: 12px;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
}

/* Imágenes: mantienen proporción natural */
.gdl-item-wrapper img {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
  transition: none !important; /* sin zoom */
  border-radius: 8px;
}

/* === BOTÓN DESCARGA === */
.gdl-item-wrapper .gdl-descargar {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 36px;
  height: 36px;
  border-radius: 50%;          
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 16px;
  z-index: 10;
  opacity: 0;
  transition: opacity 0.3s ease, background 0.2s;
  pointer-events: none;
}

/* Mostrar el icono solo al pasar el ratón */
.gdl-item-wrapper:hover .gdl-descargar {
  opacity: 1;
  pointer-events: auto;
}

/* Hover sobre el icono */
.gdl-item-wrapper .gdl-descargar:hover {
  background: rgba(0, 0, 0, 0.9);
}

/* Efecto sutil al pasar el ratón por la imagen */
.gdl-item-wrapper:hover img {
  filter: brightness(0.9);
  transition: filter 0.2s ease;
}