#hero-particles {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5; /* Asegurar que esté entre el fondo y el contenido del Hero */
    pointer-events: none; /* No bloquear clics en los botones del Hero */
    mix-blend-mode: screen; /* Efecto de fusión para que la luz sea más espiritual */
}

/* Opcional: Parallax sutil en la imagen de fondo actual si no lo tiene */
.hero-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.hero-bg img {
    width: 110% !important; /* Un poco extra para el parallax */
    height: 110% !important;
    object-fit: cover;
    transform: translate(-5%, -5%);
    transition: transform 0.1s ease-out;
}