/* AfB Homepage Slideshow Improvements — v0.2.2 */

.home .slideshow .flexslider {
    height: auto !important;
    aspect-ratio: 2 / 1;
    overflow: hidden;
}

.home .slideshow .slides {
    height: 100% !important;
}

.home .slideshow .slides > li.slide {
    height: 100% !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

@media only screen and (max-width: 767px) {
    .home .slideshow .flexslider {
        aspect-ratio: 3 / 2;
    }

    .home .slideshow .slides > li.slide {
        position: relative;
    }

    .home .slideshow .slides > li.slide::after {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(
            to bottom,
            rgba(0, 0, 0, 0) 42%,
            rgba(0, 0, 0, 0.18) 62%,
            rgba(0, 0, 0, 0.58) 100%
        );
        pointer-events: none;
        z-index: 1;
    }

    .home .slideshow .slide-aligner {
        position: absolute !important;
        inset: auto 0 0 0 !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 18px 18px !important;
        display: flex !important;
        align-items: flex-end !important;
        justify-content: center !important;
        z-index: 2;
    }

    /* Keep CTA/content area wide enough for longer button labels */
    .home .slideshow .slide-aligner .information {
        width: 88% !important;
        max-width: 360px;
        margin: 0 auto !important;
        padding: 0 !important;
        text-align: center !important;
    }

    /* Constrain only the title so long headings wrap more deliberately */
    .home .slideshow .slide-aligner .information h4 {
        width: 100% !important;
        max-width: 280px !important;
        margin: 0 auto 12px !important;
        font-size: 1.55rem !important;
        line-height: 1.15 !important;
        text-align: center !important;
        text-shadow: 0 1px 4px rgba(0, 0, 0, 0.7);
    }

    .home .slideshow .excerpt {
        display: block !important;
        margin: 0 !important;
    }

    .home .slideshow .excerpt > p:first-of-type {
        display: none !important;
    }

    .home .slideshow .excerpt > p:last-of-type {
        display: block !important;
        margin: 0 !important;
        text-align: center !important;
    }

    .home .slideshow .excerpt .button {
        display: inline-block !important;
        visibility: visible !important;
        opacity: 1 !important;
        margin: 0 !important;
        padding: 11px 18px !important;
        font-size: 0.9rem !important;
        line-height: 1.2 !important;
    }

    .home .slideshow .flex-direction-nav a {
        width: 34px !important;
        height: 42px !important;
        margin-top: -21px !important;
        line-height: 42px !important;
        z-index: 3;
    }
}
