.has-vonfred-blue-background-color {
    --backgroundColor: var(--wp--preset--color--vonfred-blue);
    background-color: var(--backgroundColor);
}

.has-darkblue-background-color {
    --backgroundColor: var(--wp--preset--color--darkblue);
    background-color: var(--backgroundColor);
}
.has-lightblue-background-color {
    --backgroundColor: var(--wp--preset--color--lightblue);
    background-color: var(--backgroundColor);
}
.has-turquoise-background-color {
    --backgroundColor: var(--wp--preset--color--turquoise);
    background-color: var(--backgroundColor);
}
.has-salmon-background-color {
    --backgroundColor: var(--wp--preset--color--salmon);
    background-color: var(--backgroundColor);
}

.has-diagonal-background::before {
    background-color: var(--backgroundColor);
}

.has-background.has-diagonal-background {
    background-color: unset !important;
}

.has-diagonal-background::before {
    content: "";
    width: 100%;
    height: 100%;
    transform: skewY(-5.5deg);
    inset: 0;
    display: block;
    position: absolute;
    z-index: -1;
}