.featured-callout-tiles-4-across {
    --widget-title-font-mobile: 700 30px/27.801px var(--font-display);
    --widget-title-font-desktop: 700 40px/38px var(--font-display);
    --widget-caption-font-mobile: 500 16px/22px var(--font-body);
    --widget-caption-font-desktop: 500 19px/30px var(--font-body);
    --slide-title-font-mobile: 700 21px/22px var(--font-display);
    --slide-title-font-desktop: 700 21px/23px var(--font-display);
    --featured-slide-title-font: 700 28px/31px var(--font-display);
    --max-width: 1238px;

    position: relative;
    padding-top: 85px;
}

.featured-callout-tiles-4-across::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    display: block;
    background: 
        url('/includes/public/assets/shared/featured-callout-background.png') no-repeat top left 40% / cover, 
        radial-gradient(74.83% 77.26% at 18.01% 33.9%, rgba(255, 255, 255, 0.90) 39.62%, rgba(255, 255, 255, 0.00) 87.94%) no-repeat center center / cover;
    background-size: auto 517px;
}


@media screen and (min-width: 40em) {
    .featured-callout-tiles-4-across::before {
        background: 
            url('/includes/public/assets/shared/featured-callout-background.png') no-repeat top center / cover, 
            radial-gradient(74.83% 77.26% at 18.01% 33.9%, rgba(255, 255, 255, 0.90) 39.62%, rgba(255, 255, 255, 0.00) 87.94%) no-repeat center center / cover;
        background-size: 100%;
        height: 800px;
    }
}
    
@media screen and (min-width: 90em) {
        .featured-callout-tiles-4-across::before {
        background: 
            url('/includes/public/assets/shared/featured-callout-background.png') no-repeat bottom center / cover, 
            radial-gradient(74.83% 77.26% at 18.01% 33.9%, rgba(255, 255, 255, 0.90) 39.62%, rgba(255, 255, 255, 0.00) 87.94%) no-repeat center center / cover;
    }
}

@media screen and (min-width: 40em) {
    .featured-callout-tiles-4-across > .inner {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        margin-inline: auto;
        max-width: calc(var(--max-width) + 2 * var(--space-5));
    }
}

.featured-callout-tiles-4-across .widget-header {
    max-width: 546px;
    padding: 0 var(--space-10);
}

@media screen and (min-width: 64em) {
    .featured-callout-tiles-4-across .widget-header {
        align-self: center;
        position: relative;
        margin: 0;
    }
}

@media screen and (min-width: 1060px) {
    .featured-callout-tiles-4-across .widget-header {
        inset: 30px 70px auto auto;
        padding: 0 var(--space-5);
        max-width: 566px;
        align-self: flex-end;
    }
}

@media screen and (min-width: 1150px) {
    .featured-callout-tiles-4-across .widget-header {
        inset: 150px 120px auto auto;
    }
}

.featured-callout-tiles-4-across .widget-header-inner {
    position: relative;
    z-index: 2;
    align-items: flex-start;
    gap: var(--space-3);
}

@media screen and (min-width: 64em) {
    .featured-callout-tiles-4-across .widget-header-inner {
        gap: var(--space-5);
    }
}

.featured-callout-tiles-4-across .widget-header-inner .widget-title {
    font: var(--widget-title-font-mobile);
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

@media screen and (min-width: 40em) {
    .featured-callout-tiles-4-across .widget-header-inner .widget-title {
        font: var(--widget-title-font-desktop);
        letter-spacing: 4px;
    }
}

.featured-callout-tiles-4-across .widget-header-inner .widget-title::before {
    content: '';
    position: absolute;
    inset: -50px auto auto -40px;
    z-index: -1;
    display: block;
    pointer-events: none;
    background: url(/includes/public/assets/shared/paint-stroke.png) no-repeat top left / 102px auto;
    width: 102px;
    height: 150px;
    opacity: 1;
    transform: rotate(-21.976deg);
}

@media screen and (min-width: 40em) {
    .featured-callout-tiles-4-across .widget-header-inner .widget-title::before {
        inset: -115px auto auto -80px;
        background: url(/includes/public/assets/shared/paint-stroke.png) no-repeat top left / 163px auto;
        width: 162.632px;
        height: 240.905px;
        transform: rotate(-25.207deg);
    }
}

.featured-callout-tiles-4-across .widget-header-inner .widget-caption {
    font: var(--widget-caption-font-mobile);
}

@media screen and (min-width: 40em) {
    .featured-callout-tiles-4-across .widget-header-inner .widget-caption {
        font: var(--widget-caption-font-desktop);
    }
}

.featured-callout-tiles-4-across .widget-header-inner .widget-view-all {
    margin-top: var(--space-3);
}

.featured-callout-tiles-4-across .slides {
    position: relative;
    grid-template-columns: 1fr;
    gap: 10px;
}

@media screen and (min-width: 40em) {
    .featured-callout-tiles-4-across .slides {
        grid-template-columns: 1fr 1fr;
    }
}

@media screen and (min-width: 64em) {
    .featured-callout-tiles-4-across .inner .slides {
        grid-template-columns: minmax(auto, 450px) 0 repeat(3, minmax(auto, 238px));
        grid-template-areas: 
            "featured . . . ."
            "featured . standard-1 standard-2 standard-3";
    }
}

@media screen and (min-width: 90em) {
    .featured-callout-tiles-4-across .inner .slides {
        grid-template-columns: minmax(auto, 450px) 0 repeat(3, minmax(auto, 238px));
        gap: 18px;
    }
}

.featured-callout-tiles-4-across .slides .slide.featured {
    position: relative;
}

@media screen and (min-width: 64em) {
    .featured-callout-tiles-4-across .slides .slide.featured {
        grid-area: featured;
    }
    
    .featured-callout-tiles-4-across .slides .slide:nth-of-type(2) {
        grid-area: standard-1;
    }
    
    .featured-callout-tiles-4-across .slides .slide:nth-of-type(3) {
        grid-area: standard-2;
    }

    .featured-callout-tiles-4-across .slides .slide:nth-of-type(4) {
        grid-area: standard-3;
    }
}

.featured-callout-tiles-4-across .slides .slide.featured::after {
    content: '';
    position: absolute;
    inset: 15px 15px auto auto;
    z-index: 3;
	display: block;
	width: 77px;
	height: 77px;
}

@media screen and (min-width: 1200px) {
    .featured-callout-tiles-4-across .slides .slide.featured::after {
        width: 115px;
        height: 115px;
    }
}


@media screen and (min-width: 64em) {
    .featured-callout-tiles-4-across .slides .slide.featured::after {
        inset: 31px 0 0 26px;

    }
}

.featured-callout-tiles-4-across .img-cont::before {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 27.6%, rgba(0, 0, 0, 0.60) 100%);
}

.featured-callout-tiles-4-across .img-cont::after {
	background: url('/includes/public/assets/shared/hover-paint.svg') no-repeat bottom left / auto auto;
	opacity: 0;
}

.featured-callout-tiles-4-across .slide:not(.featured) .img-cont::after {
    background: url('/includes/public/assets/shared/hover-paint.svg') no-repeat bottom left / 250px auto;
}

.featured-callout-tiles-4-across .img-cont .credits {
    inset: 15px auto auto var(--space-6);
}

@media screen and (min-width: 64em) {
    .featured-callout-tiles-4-across .img-cont .credits {
        inset: 15px 0 auto auto;
    }
}

.featured-callout-tiles-4-across .slides .content-section {
    justify-content: flex-start;
    align-items: end;
}

.featured-callout-tiles-4-across .slides .content-section .slide-title {
    text-align: left;
}

.featured-callout-tiles-4-across .slides .content-section .slide-title > a {
    font: var(--slide-title-font-mobile);
    text-transform: none;
}

@media screen and (min-width: 40em) {
    .featured-callout-tiles-4-across .slides .content-section .slide-title > a {
        font: var(--slide-title-font-desktop);
        letter-spacing: -0.21px;
    }

    .featured-callout-tiles-4-across .slides .slide.featured .content-section .slide-title > a {
        font: var(--featured-slide-title-font);
    }
}

.featured-callout-tiles-4-across .slides .slide .content-section .slide-title .fas {
    font-size: 18px;
}