header.block {
    & .background-hero {
        width: 100%;
        height: 120%;
        object-fit: cover;
        position: absolute;
        top: -10%;
        left: 0;
        z-index: 0;
        filter: brightness(.7);
    }

    & .backdrop {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: light-dark(transparent, var(--wp--preset--color--contrast-alpha-50));
        backdrop-filter: blur(20px);
        z-index: 0;
    }

    & .content {
        color: var(--wp--preset--color--base);
        text-shadow: var(--modern-text-shadow);
        position: relative;
    }
}