.espacio-destacadas {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-rows: clamp(120px, 15vw, 190px);
  gap: var(--space-3);
}
.espacio-foto {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
  border: 0;
  border-radius: var(--radius-lg);
  background: var(--color-surface);
  box-shadow: none;
  cursor: zoom-in;
}
/* Es un <button> por accesibilidad: se anulan el brillo, el brinco y el degradado del botón global. */
.espacio-foto::after { display: none; }
.espacio-foto:hover, .espacio-foto:active { transform: none; box-shadow: none; background: var(--color-surface); }
.espacio-foto img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 700ms var(--ease-out);
}
@media (hover: hover) and (pointer: fine) {
  .espacio-foto:hover img { transform: scale(1.05); }
}
/* Composición: una grande, una mediana, dos pequeñas. Con menos de cuatro, cada una a su celda. */
.espacio-destacadas .espacio-foto:nth-child(1) { grid-column: span 4; grid-row: span 3; }
.espacio-destacadas .espacio-foto:nth-child(2) { grid-column: span 2; grid-row: span 2; }
.espacio-destacadas .espacio-foto:nth-child(3) { grid-column: span 2; grid-row: span 1; }
.espacio-destacadas .espacio-foto:nth-child(4) { grid-column: span 3; grid-row: span 2; }
.espacio-destacadas .espacio-foto:nth-child(5) { grid-column: span 3; grid-row: span 2; }

.espacio-galeria {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-rows: clamp(100px, 13vw, 160px);
  grid-auto-flow: dense;
  gap: var(--space-3);
  margin-top: var(--space-3);
}
.espacio-galeria .espacio-foto:nth-child(5n + 1) { grid-column: span 3; grid-row: span 2; }
.espacio-galeria .espacio-foto:nth-child(5n + 2) { grid-column: span 3; grid-row: span 1; }
.espacio-galeria .espacio-foto:nth-child(5n + 3) { grid-column: span 3; grid-row: span 1; }
.espacio-galeria .espacio-foto:nth-child(5n + 4) { grid-column: span 2; grid-row: span 2; }
.espacio-galeria .espacio-foto:nth-child(5n + 5) { grid-column: span 4; grid-row: span 2; }
/* Si la última foto cae sola en su fila, ocupa todo el ancho en vez de dejar un hueco. */
.espacio-galeria .espacio-foto:last-child:nth-child(5n + 1), .espacio-galeria .espacio-foto:last-child:nth-child(5n + 4) { grid-column: 1 / -1; }

@media (max-width: 700px) {
  .espacio-destacadas { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 38vw; }
  .espacio-destacadas .espacio-foto:nth-child(n) { grid-column: span 1; grid-row: span 1; }
  .espacio-destacadas .espacio-foto:nth-child(1) { grid-column: span 2; grid-row: span 2; }
  .espacio-destacadas .espacio-foto:nth-child(4), .espacio-destacadas .espacio-foto:nth-child(5) { grid-column: span 2; }
  .espacio-galeria { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 38vw; }
  .espacio-galeria .espacio-foto:nth-child(n) { grid-column: span 1; grid-row: span 1; }
  .espacio-galeria .espacio-foto:nth-child(5n + 1), .espacio-galeria .espacio-foto:nth-child(5n + 4), .espacio-galeria .espacio-foto:nth-child(5n + 5) { grid-column: span 2; }
}

.espacio-visor { width: min(96vw, 1100px); max-height: 94dvh; padding: 0; background: transparent; border: 0; overflow: visible; }
.espacio-visor::backdrop { background: rgba(0, 0, 0, .86); }
.espacio-visor img { display: block; max-width: 100%; max-height: 90dvh; margin: 0 auto; border-radius: var(--radius-md); }
.espacio-visor-cerrar { position: absolute; top: -44px; right: 0; width: 40px; height: 40px; padding: 0; font-size: var(--text-xl); border-radius: var(--radius-full); }
