.cst-post-callout {
    background: var(--bg-color);
    position: relative;
    border-radius: 30px;
    overflow: hidden;
    z-index: 1;
    border: var(--border);
}

.cst-post-callout:after {
    content: '';
    position: absolute;
    inset: 0;
    background: transparent var(--bg-image) no-repeat center / cover;
    opacity: var(--bg-img-opacity);
    z-index: 0;
}

.cst-post-callout>* {
    position: relative;
    z-index: 2;
}

.cst-post-callout.brad-0 {
    border-radius: 0;
}

.cst-post-callout .container {
    max-width: 1190px;
    margin: 0 auto;
    width: 90%;
    padding: 40px 0;
    position: relative;
    z-index: 1;
}

.cst-post-callout .title {
    font: normal var(--f-bold) 1.9rem / 1.1 var(--font-sans);
    color: var(--title-color);
    margin-bottom: 1rem;
}

.cst-post-callout .content *,
.cst-post-callout .content li,
.cst-post-callout .content li::before,
.cst-post-callout .content li::marker {
    color: var(--content-color) !important;
}

.cst-post-callout .content {
    font: normal var(--f-medium) 1.13rem / 1.3 var(--font-sans);
    margin-bottom: 0;
}

.cst-post-callout .content a {
    opacity: 0.9;
    text-decoration: underline !important;
    text-decoration-color: var(--content-color) !important;
}

.cst-post-callout .content a:hover {
    opacity: 1;
}

.cst-post-callout .content>*:last-child {
    margin-bottom: 0 !important;
}

@media screen and (max-width: 767px) {
    .cst-post-callout .container {
        padding: 20px 0;
    }

    .cst-post-callout .title {
        font: normal var(--f-bold) 1.63rem / 1.1 var(--font-sans);
    }

    .cst-post-callout .content {
        font: normal var(--f-medium) 1rem / 1.3 var(--font-sans);
    }
}