header.scrolled {
  background: rgba(0, 0, 0, 0.75);
  backdrop-filter: blur(6px);
  transition: background 0.3s ease, backdrop-filter 0.3s ease;

}

.project-gallery {
  padding: 2rem 5vw;
  margin-top: calc(var(--h) + 3.5rem); /* 80 px (altura del header) + 28 px */
}

.gallery-row {
  display: flex;
  gap: 1rem;
  margin-bottom: 1rem;
}

.gallery-row img {
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
  display: block;
}

.gallery-row.one img { width: 100%; }
.gallery-row.two img { width: calc(50% - 0.5rem); }
.gallery-row.three img { width: calc(33.33% - 0.66rem); 
}


.gallery-row img {
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
  display: block;
  box-sizing: border-box;
}

.project-gallery a { text-decoration: none; }

/* =============================================================== */
/*  MÓVIL – cada fila de la galería ocupa 100 % y apila las fotos   */
@media (max-width: 768px){

  /* Fila en columna para evitar huecos */
  .gallery-row{
    flex-direction: column;
  }

  /* Cualquier hijo (a, img, div…) ocupa todo el ancho */
  .gallery-row > *{
    flex: 0 0 100% !important;
    width: 100% !important;
  }

  /* Asegura que la imagen rellena su contenedor */
  .gallery-row img{
    width: 100%       !important;
    height: auto;
    display: block;             /* quita el espacio inline */
  }

  /* Separación vertical entre fotos */
  .gallery-row > * + *{
    margin-top: 1rem;
  }
}