.wp-block-group{
    &[class*="is-style-accent"] {
        position: relative;

        &::before{
            aspect-ratio: 0.51 / 1;
            background-image: url("../../../images/logo-accent-cropped.svg");
            background-size: cover;
            background-repeat: no-repeat;
            bottom: 0;
            content: '';
            height: 560px;
            max-height: 100%;
            opacity: 0.2;
            pointer-events: none;
            position: absolute;
            z-index: 1;
        }

        &:is(.entry-content > .wp-block-group, .is-root-container > .wp-block-group){
            &:not(.has-secondary-background-color){
                &::before{
                    background-image: url("../../../images/logo-accent-cropped-dark.svg");
                    opacity: 0.05;
                }
            }
        }
    }

    &.is-style-accent-left {
        &::before{
            left: 0;
        }
    }

    &.is-style-accent-right {
        &::before{
            right: 0;
            transform: scaleX(-1);
        }
    }

    &.is-style-hover-reveal{
        display: grid;
        overflow: hidden;

        @media (min-width: 782px) {
            &:not(body.wp-admin .wp-block-group) {
                grid-template-rows: 0fr;
                transition: grid-template-rows 0.2s ease-in-out;

                > * {
                    min-height: 0;
                    transition: visibility 1s;
                    visibility: hidden;
                }

                &:is(.wp-block-cover:hover .wp-block-group) {
                    grid-template-rows: 1fr;

                    > * {
                        visibility: visible;
                    }
                }
            }
        }
    }
}