/* 1. Ajustes base */
body, html {
  height: 100%;
  margin: 0;
  color: #777;
  font-family: "Lato", sans-serif;
}

/* 2. Propiedades comunes para todas las secciones parallax */
.bgimg-1, .bgimg-2, .bgimg-3 {
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* 3. Tus imágenes específicas (AQUÍ ES DONDE CAMBIAS LAS RUTAS) */
.bgimg-1 {
  /* Usamos tu ruta local */
  background-image: url("IMAGENES/catedralplasencia.jpg");
  height: 100vh; /* Forzamos 100% de la altura visual de la pantalla */
}

.bgimg-2 {
  background-image: url("IMAGENES/foto2.jpg");
  min-height: 400px;
}

.bgimg-3 {
  background-image: url("IMAGENES/foto3.jpg");
  min-height: 400px;
}

/* 4. Estilos de texto */
.w3-wide { letter-spacing: 10px; }
.w3-hover-opacity { cursor: pointer; }

/* Ajuste para que todas las fotos de la galería midan lo mismo */
.w3-col img {
  height: 250px;       /* Ajusta esta altura a tu gusto (ej. 200px o 300px) */
  object-fit: cover;   /* Recorta la imagen para que llene el espacio sin estirarse */
  width: 100%;         /* Asegura que ocupe todo el ancho de la columna */
}

/* 5. Ajuste para móviles (Desactivar fixed para evitar errores) */
@media only screen and (max-device-width: 1024px) {
  .bgimg-1, .bgimg-2, .bgimg-3 {
    background-attachment: scroll;
    height: 500px; /* En móviles es mejor una altura fija */
  }
}


  /* Clase para que la imagen se agrande suavemente */
  .imagen-enlace-zoom {
    transition: transform 0.3s ease; /* Hace que el cambio sea suave (0.3 segundos) */
    cursor: pointer;
  }
  
  .imagen-enlace-zoom:hover {
    transform: scale(1.05); /* Agranda la imagen un 5% al pasar el ratón */
  }
