.wp-block-blacksheep-feature-callout {
    --feature-callout-bg: var(--theme-white, #ffffff);
    --feature-callout-text: var(--body-text-color, #1f2933);
    --feature-callout-heading: var(--primary-color, #3f7ec7);
    --feature-callout-heading-accent: var(--accent-color, var(--secondary-color, #f28030));
    --feature-callout-media-bg: var(--surface-alt-color, #f5f7fa);
    --feature-callout-media-radius: 50%;
    --feature-callout-inner-max-width: 1024px;
    --feature-callout-media-size: 346px;
    --feature-callout-content-width: 618px;
    --feature-callout-section-padding-y: clamp(var(--space-xl, 2rem), 4.7vw, 60px);
    --feature-callout-section-padding-x: clamp(var(--space-lg, 1.5rem), 10vw, 128px);
    --feature-callout-column-gap: clamp(var(--space-xl, 2rem), 4.7vw, 60px);
    --feature-callout-media-stack-gap: clamp(var(--space-xl, 2rem), 4.7vw, 60px);
    background: var(--feature-callout-bg);
    box-sizing: border-box;
    color: var(--feature-callout-text);
    font-family: var(--body-font, inherit);
    padding: var(--feature-callout-section-padding-y) var(--feature-callout-section-padding-x);
}

.wp-block-blacksheep-feature-callout.has-background-style-surface {
    --feature-callout-bg: var(--surface-color, #ffffff);
}

.wp-block-blacksheep-feature-callout.has-background-style-surface-alt {
    --feature-callout-bg: var(--surface-alt-color, #f5f7fa);
}

.wp-block-blacksheep-feature-callout.has-background-style-primary {
    --feature-callout-bg: var(--primary-color, #3f7ec7);
    --feature-callout-text: var(--primary-text-color, #ffffff);
    --feature-callout-heading: var(--primary-text-color, #ffffff);
    --feature-callout-heading-accent: var(--secondary-color, #f28030);
}

.wp-block-blacksheep-feature-callout.has-background-style-secondary {
    --feature-callout-bg: var(--secondary-color, #f28030);
    --feature-callout-text: var(--secondary-text-color, #101010);
    --feature-callout-heading: var(--secondary-text-color, #101010);
    --feature-callout-heading-accent: var(--primary-color, #3f7ec7);
}

.wp-block-blacksheep-feature-callout.has-background-style-accent {
    --feature-callout-bg: var(--accent-color, var(--secondary-color, #f28030));
    --feature-callout-text: var(--accent-text-color, #101010);
    --feature-callout-heading: var(--accent-text-color, #101010);
    --feature-callout-heading-accent: var(--primary-color, #3f7ec7);
}

.wp-block-blacksheep-feature-callout.has-background-style-dark {
    --feature-callout-bg: var(--theme-black, #101010);
    --feature-callout-text: var(--theme-white, #ffffff);
    --feature-callout-heading: var(--theme-white, #ffffff);
    --feature-callout-heading-accent: var(--secondary-color, #f28030);
}

.wp-block-blacksheep-feature-callout.has-media-shape-rounded {
    --feature-callout-media-radius: 20px;
}

.wp-block-blacksheep-feature-callout.has-media-shape-square {
    --feature-callout-media-radius: 0;
}

.wp-block-blacksheep-feature-callout.has-media-layout-portrait,
.wp-block-blacksheep-feature-callout.has-media-layout-two-stack,
.wp-block-blacksheep-feature-callout.has-media-layout-three-stack {
    --feature-callout-content-width: 676px;
    --feature-callout-media-size: 288px;
}

.wp-block-blacksheep-feature-callout .feature-callout__inner {
    align-items: center;
    display: grid;
    gap: var(--feature-callout-column-gap);
    grid-template-columns: minmax(0, var(--feature-callout-media-size)) minmax(0, var(--feature-callout-content-width));
    justify-content: center;
    margin-inline: auto;
    max-width: var(--feature-callout-inner-max-width);
}

.wp-block-blacksheep-feature-callout.has-media-position-right .feature-callout__inner {
    grid-template-columns: minmax(0, var(--feature-callout-content-width)) minmax(0, var(--feature-callout-media-size));
}

.wp-block-blacksheep-feature-callout.has-media-vertical-align-top .feature-callout__inner {
    align-items: start;
}

.wp-block-blacksheep-feature-callout.has-media-vertical-align-bottom .feature-callout__inner {
    align-items: end;
}

.wp-block-blacksheep-feature-callout .feature-callout__media,
.wp-block-blacksheep-feature-callout .feature-callout__content {
    min-width: 0;
}

.wp-block-blacksheep-feature-callout .feature-callout__media {
    aspect-ratio: 1 / 1;
    background: var(--feature-callout-media-bg);
    border-radius: var(--feature-callout-media-radius);
    display: block;
    grid-column: 1;
    grid-row: 1;
    margin: 0;
    max-width: var(--feature-callout-media-size);
    overflow: hidden;
    width: 100%;
}

.wp-block-blacksheep-feature-callout.has-media-position-right .feature-callout__media {
    grid-column: 2;
}

.wp-block-blacksheep-feature-callout.has-media-layout-portrait .feature-callout__media,
.wp-block-blacksheep-feature-callout.has-media-layout-two-stack .feature-callout__media,
.wp-block-blacksheep-feature-callout.has-media-layout-three-stack .feature-callout__media {
    aspect-ratio: auto;
    background: transparent;
    border-radius: 0;
    display: grid;
    gap: var(--feature-callout-media-stack-gap);
    overflow: visible;
}

.wp-block-blacksheep-feature-callout .feature-callout__media-slot {
    background: var(--feature-callout-media-bg);
    overflow: hidden;
    width: 100%;
}

.wp-block-blacksheep-feature-callout.has-media-layout-portrait .feature-callout__media-slot {
    aspect-ratio: 288 / 762;
    border-radius: 30px;
}

.wp-block-blacksheep-feature-callout.has-media-layout-two-stack .feature-callout__media-slot,
.wp-block-blacksheep-feature-callout.has-media-layout-three-stack .feature-callout__media-slot {
    aspect-ratio: 6 / 5;
    border-radius: 12px;
}

.wp-block-blacksheep-feature-callout .feature-callout__image {
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.wp-block-blacksheep-feature-callout .feature-callout__content {
    color: inherit;
    grid-column: 2;
    grid-row: 1;
    max-width: var(--feature-callout-content-width);
}

.wp-block-blacksheep-feature-callout.has-media-position-right .feature-callout__content,
.wp-block-blacksheep-feature-callout.has-no-media .feature-callout__content {
    grid-column: 1;
}

.wp-block-blacksheep-feature-callout.has-no-media .feature-callout__inner {
    grid-template-columns: minmax(0, var(--feature-callout-content-width));
}

.wp-block-blacksheep-feature-callout .feature-callout__content > * {
    max-width: 100%;
}

.wp-block-blacksheep-feature-callout .feature-callout__content h1,
.wp-block-blacksheep-feature-callout .feature-callout__content h2,
.wp-block-blacksheep-feature-callout .feature-callout__content h3,
.wp-block-blacksheep-feature-callout .feature-callout__content h4,
.wp-block-blacksheep-feature-callout .feature-callout__content h5,
.wp-block-blacksheep-feature-callout .feature-callout__content h6 {
    color: var(--feature-callout-heading);
    font-family: var(--header-font, inherit);
    letter-spacing: 0;
    margin-top: 0;
}

.wp-block-blacksheep-feature-callout .feature-callout__content p,
.wp-block-blacksheep-feature-callout .feature-callout__content li {
    color: inherit;
    font-size: var(--p-size, 1.125rem);
    line-height: var(--body-line-height, 1.6);
}

.wp-block-blacksheep-feature-callout .feature-callout__content ul,
.wp-block-blacksheep-feature-callout .feature-callout__content ol {
    padding-left: 1.35em;
}

.wp-block-blacksheep-feature-callout .feature-callout__content a {
    color: inherit;
}

.wp-block-blacksheep-feature-callout .feature-callout__content .wp-block-button__link:not(.has-background) {
    background: var(--primary-button-color, var(--primary-color, #3f7ec7));
    color: var(--primary-button-text-color, var(--primary-text-color, #ffffff));
}

.wp-block-blacksheep-feature-callout .feature-callout__content .wp-block-button__link:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
}

@media (max-width: 1180px) {
    .wp-block-blacksheep-feature-callout {
        --feature-callout-section-padding-y: clamp(var(--space-lg, 1.5rem), 5vw, 52px);
        --feature-callout-section-padding-x: clamp(var(--space-md, 1rem), 5vw, 72px);
        --feature-callout-column-gap: clamp(var(--space-lg, 1.5rem), 4vw, 48px);
        --feature-callout-media-stack-gap: clamp(var(--space-md, 1rem), 4vw, 48px);
    }
}

@media (min-width: 701px) and (max-width: 1180px) {
    .wp-block-blacksheep-feature-callout:not(.has-no-media) .feature-callout__inner {
        grid-template-columns: minmax(180px, 0.85fr) minmax(0, 1.4fr);
        max-width: 100%;
    }

    .wp-block-blacksheep-feature-callout:not(.has-no-media).has-media-position-right .feature-callout__inner {
        grid-template-columns: minmax(0, 1.4fr) minmax(180px, 0.85fr);
    }

    .wp-block-blacksheep-feature-callout .feature-callout__media,
    .wp-block-blacksheep-feature-callout .feature-callout__content {
        max-width: 100%;
    }
}

@media (max-width: 700px) {
    .wp-block-blacksheep-feature-callout {
        padding: var(--space-lg, 1.5rem) 10px;
    }

    .wp-block-blacksheep-feature-callout .feature-callout__inner,
    .wp-block-blacksheep-feature-callout.has-media-position-right .feature-callout__inner {
        align-items: stretch;
        gap: var(--space-lg, 1.5rem);
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .wp-block-blacksheep-feature-callout .feature-callout__media,
    .wp-block-blacksheep-feature-callout.has-media-position-right .feature-callout__media {
        aspect-ratio: 16 / 9;
        border-radius: 20px;
        grid-column: 1;
        grid-row: auto;
        max-width: 100%;
        width: 100%;
    }

    .wp-block-blacksheep-feature-callout.has-media-shape-square .feature-callout__media {
        border-radius: 0;
    }

    .wp-block-blacksheep-feature-callout.has-media-layout-portrait .feature-callout__media,
    .wp-block-blacksheep-feature-callout.has-media-layout-two-stack .feature-callout__media,
    .wp-block-blacksheep-feature-callout.has-media-layout-three-stack .feature-callout__media {
        aspect-ratio: auto;
        background: transparent;
        border-radius: 0;
        display: grid;
        gap: var(--space-sm, 0.75rem);
        overflow: visible;
    }

    .wp-block-blacksheep-feature-callout.has-media-layout-portrait .feature-callout__media-slot,
    .wp-block-blacksheep-feature-callout.has-media-layout-two-stack .feature-callout__media-slot,
    .wp-block-blacksheep-feature-callout.has-media-layout-three-stack .feature-callout__media-slot {
        aspect-ratio: 16 / 9;
        border-radius: 20px;
    }

    .wp-block-blacksheep-feature-callout.has-media-layout-portrait .feature-callout__media-slot {
        aspect-ratio: auto;
        height: clamp(200px, 56vw, 250px);
        max-height: 250px;
    }

    .wp-block-blacksheep-feature-callout:not(.has-mobile-media-show-all) .feature-callout__media-slot:nth-child(n+2) {
        display: none;
    }

    .wp-block-blacksheep-feature-callout .feature-callout__content,
    .wp-block-blacksheep-feature-callout.has-media-position-right .feature-callout__content {
        grid-column: 1;
        grid-row: auto;
        max-width: min(100%, var(--feature-callout-content-width));
        width: 100%;
    }

    .wp-block-blacksheep-feature-callout.has-mobile-order-content-first .feature-callout__content {
        order: 1;
    }

    .wp-block-blacksheep-feature-callout.has-mobile-order-content-first .feature-callout__media {
        order: 2;
    }

    .wp-block-blacksheep-feature-callout.has-mobile-order-media-first .feature-callout__media {
        order: 1;
    }

    .wp-block-blacksheep-feature-callout.has-mobile-order-media-first .feature-callout__content {
        order: 2;
    }
}