.blur-bg {
    position: relative;
    overflow: hidden;
}

/* Overlay real en vez de ::before para poder manipularlo con JS */
.blur-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    pointer-events: none;
    z-index: 2;
}

/* Todo el contenido va encima del overlay, excepto el overlay mismo */
.blur-bg > *:not(.blur-overlay) {
    position: relative;
    z-index: 3;
}