.hh-call-out-block {
    padding: 16px;
    margin-block: 23px;

    >div {
        padding: 30px;
        border: 3px solid;

        @media (max-width: 640px) {
            padding: 20px;
        }

        .bg-primary & {
            border-color: #F2E1CC;
        }

        .bg-beige & {
            border-color: #223453;
        }

        h2,
        p,
        li {

            /* If parent have class bg-primary or bg-beige */
            .bg-primary & {
                color: #fff;
            }

            .bg-beige & {
                color: #223453;
            }
        }

        hr {
            border-top: 2px solid;
            margin-block: 1.5rem;

            .bg-primary & {
                color: #F2E1CC;
                border-color: #F2E1CC;
            }

            .bg-beige & {
                color: #223453;
                border-color: #223453;
            }
        }
    }

    @media (max-width: 640px) {
        margin-inline: -15px;
    }
}

.hh-call-out-block.bg-beige ul li:before {
    background: #223452;
    border-color: #223452;
}