.hero-container::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1; /* Pushes it behind the text */

    /* Apply your background styles here */
    background:
        linear-gradient(to top, rgba(var(--bg-1-rgb), .8) 30%, rgba(var(--bg-2-rgb), .6) 100%),
        url('/imgs/noize_branded_portrait.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    filter: grayscale(70%);
}

@media(min-width: 768px) {
    .hero-container::before {
        background-image: linear-gradient(to top, rgba(var(--bg-1-rgb), .8) 50%, rgba(var(--bg-2-rgb), .1) 100%),
                            url('/imgs/noize_branded_landscape.webp');
    }
}

.cta::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1; /* Pushes it behind the text */

    /* Apply your background styles here */
    background:
        linear-gradient(to right, rgba(var(--bg-2-rgb), .9) 40%, rgba(var(--bg-2-rgb), .5) 100%),
        url('/imgs/recording_studio_camera.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    /* The Magic Sauce */
    filter: grayscale(100%);
}

@media(min-width: 768px) {
    .cta::before {
        background-image:
            linear-gradient(to right, rgba(var(--bg-2-rgb), .9) 40%, rgba(var(--bg-2-rgb), .5) 100%),
            url('/imgs/recording_studio_camera_banner.webp');
    }
}