/* ============================================================
   ASA ABOUT US HERO
   VERSION 2.1
   ============================================================ */


/* ============================================================
   HERO
   ============================================================ */

.asa-about-hero {
    position: relative;

    width: 100vw;
    max-width: 100vw;

    height:
        var(
            --asa-about-hero-desktop-height,
            500px
        );

    margin-left:
        calc(50% - 50vw);

    margin-right:
        calc(50% - 50vw);

    overflow: hidden;

    background: #333333;
}


/* ============================================================
   LAYER 1 — BACKGROUND IMAGE
   ============================================================ */

.asa-about-hero__background {
    position: absolute;

    inset: 0;

    z-index: 1;

    background-image:
        var(
            --asa-about-hero-image,
            none
        );

    background-size: cover;

    background-position:
        center center;

    background-repeat:
        no-repeat;
}


/* ============================================================
   LAYER 2 — OVERLAY

   This ALWAYS sits above the image.
   ============================================================ */

.asa-about-hero__overlay {
    position: absolute;

    inset: 0;

    z-index: 2;

    background:
        var(
            --asa-about-hero-overlay-color,
            #000000
        );

    opacity:
        var(
            --asa-about-hero-overlay-opacity,
            .35
        );

    pointer-events: none;
}


/* ============================================================
   LAYER 3 — INNER CONTENT
   ============================================================ */

.asa-about-hero__inner {
    position: relative;

    z-index: 3;

    width:
        min(
            90%,
            1400px
        );

    height: 100%;

    margin: 0 auto;
}


/* ============================================================
   TITLE POSITION AREA
   ============================================================ */

.asa-about-hero__content {
    position: absolute;

    inset: 0;

    display: flex;

    align-items:
        var(
            --asa-about-hero-vertical,
            center
        );

    justify-content:
        var(
            --asa-about-hero-horizontal,
            flex-start
        );

    /*
     * Bottom space prevents a bottom-positioned
     * title from colliding with breadcrumbs.
     */

    padding:
        48px
        0
        90px;

    box-sizing:
        border-box;

    pointer-events: none;
}


/* ============================================================
   TITLE
   ============================================================ */

.asa-about-hero__content h1 {
    max-width: 100%;

    margin: 0 !important;

    padding: 0 !important;

    color: #FFFFFF !important;

    font-size:
        clamp(
            42px,
            5vw,
            78px
        ) !important;

    font-weight:
        700 !important;

    line-height:
        1.05 !important;

    letter-spacing:
        .01em;

    text-align:
        var(
            --asa-about-hero-text-align,
            left
        );

    text-transform:
        uppercase;

    text-shadow:
        0
        4px
        18px
        rgba(
            0,
            0,
            0,
            .28
        );
}


/* ============================================================
   BREADCRUMBS
   ============================================================ */

.asa-about-hero__breadcrumb {
    position: absolute;

    right: 0;

    bottom: 32px;

    display: flex;

    align-items: center;

    gap: 9px;

    margin: 0;

    padding: 0;

    color:
        rgba(
            255,
            255,
            255,
            .88
        );

    font-size: 15px;

    font-weight: 500;

    line-height: 1.3;
}


.asa-about-hero__breadcrumb a {
    color: #FFFFFF !important;

    text-decoration: none;

    transition:
        opacity .2s ease;
}


.asa-about-hero__breadcrumb a:hover {
    opacity: .72;
}


.asa-about-hero__breadcrumb-separator {
    color:
        rgba(
            255,
            255,
            255,
            .6
        );
}


.asa-about-hero__breadcrumb-current {
    color:
        rgba(
            255,
            255,
            255,
            .82
        );
}


/* ============================================================
   TABLET
   ============================================================ */

@media (
    min-width: 768px
)
and (
    max-width: 1024px
) {

    .asa-about-hero {
        height:
            var(
                --asa-about-hero-tablet-height,
                400px
            );
    }


    .asa-about-hero__inner {
        width: 92%;
    }


    .asa-about-hero__content {
        padding:
            42px
            0
            82px;
    }


    .asa-about-hero__breadcrumb {
        bottom: 28px;
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:767px) {

    .asa-about-hero {
        height:
            var(
                --asa-about-hero-mobile-height,
                300px
            );
    }


    .asa-about-hero__inner {
        width: 90%;
    }


    .asa-about-hero__content {
        padding:
            32px
            0
            72px;
    }


    .asa-about-hero__content h1 {
        font-size:
            clamp(
                32px,
                10vw,
                48px
            ) !important;
    }


    /*
     * Breadcrumbs stack naturally below
     * the main hero content on mobile.
     */

    .asa-about-hero__breadcrumb {
        left: 0;

        right: auto;

        bottom: 22px;

        gap: 7px;

        font-size: 13px;

        flex-wrap: wrap;
    }

}

/* ============================================================
   ASA ABOUT INTRO / IMPACT
   VERSION 2.0
   ============================================================ */


/* ============================================================
   SECTION
   ============================================================ */

.asa-about-intro--v2 {
    position:
        relative;

    padding:
        var(
            --asa-ai2-pad-top-desktop,
            100px
        )
        0
        var(
            --asa-ai2-pad-bottom-desktop,
            110px
        );

    background:
        var(
            --asa-ai2-bg,
            #FFFFFF
        );

    overflow:
        hidden;
}


/* ============================================================
   CONTAINER
   ============================================================ */

.asa-about-intro--v2
.asa-about-intro__container {
    width:
        min(
            86%,
            1520px
        );

    margin:
        0
        auto;

    display:
        grid;

    grid-template-columns:
        minmax(
            0,
            1.05fr
        )
        minmax(
            420px,
            .95fr
        );

    align-items:
        center;

    gap:
        clamp(
            55px,
            7vw,
            110px
        );
}


/* ============================================================
   TEXT LEFT / IMAGES RIGHT
   ============================================================ */

.asa-about-intro--v2[data-about-layout="text-left"]
.asa-about-intro__content {
    grid-column:
        1;

    grid-row:
        1;
}


.asa-about-intro--v2[data-about-layout="text-left"]
.asa-about-intro__visual {
    grid-column:
        2;

    grid-row:
        1;
}


/* ============================================================
   IMAGES LEFT / TEXT RIGHT
   ============================================================ */

.asa-about-intro--v2[data-about-layout="image-left"]
.asa-about-intro__container {
    grid-template-columns:
        minmax(
            420px,
            .95fr
        )
        minmax(
            0,
            1.05fr
        );
}


.asa-about-intro--v2[data-about-layout="image-left"]
.asa-about-intro__visual {
    grid-column:
        1;

    grid-row:
        1;
}


.asa-about-intro--v2[data-about-layout="image-left"]
.asa-about-intro__content {
    grid-column:
        2;

    grid-row:
        1;
}


/* ============================================================
   NO IMAGES
   ============================================================ */

.asa-about-intro--v2.asa-about-intro--no-images
.asa-about-intro__container {
    grid-template-columns:
        minmax(
            0,
            1fr
        );
}


.asa-about-intro--v2.asa-about-intro--no-images
.asa-about-intro__content {
    grid-column:
        1;

    width:
        100%;

    max-width:
        920px;
}


/* ============================================================
   TEXT COLUMN
   ============================================================ */

.asa-about-intro--v2
.asa-about-intro__content {
    min-width:
        0;
}


/* ============================================================
   HEADER
   ============================================================ */

.asa-about-intro--v2
.asa-about-intro-header {
    display:
        block;

    margin-bottom:
        30px;
}


.asa-about-intro--v2
.asa-about-intro-header
.asa-section-title {
    width:
        100%;

    max-width:
        none;
}


.asa-about-intro--v2
.asa-about-intro-header
.asa-section-title h2 {
    color:
        var(
            --asa-ai2-title-color,
            #242424
        ) !important;

    font-weight:
        var(
            --asa-ai2-title-weight,
            700
        ) !important;
}


.asa-about-intro--v2
.asa-about-intro-header
.asa-section-title h2 em {
    color:
        var(
            --asa-ai2-highlight-color,
            #F68D2E
        ) !important;

    font-weight:
        var(
            --asa-ai2-highlight-weight,
            400
        ) !important;
}


.asa-about-intro--v2
.asa-about-intro-header
.asa-section-intro {
    width:
        100%;

    max-width:
        var(
            --asa-ai2-intro-max,
            680px
        );

    margin-top:
        26px;
}


.asa-about-intro--v2
.asa-about-intro-header
.asa-section-intro,

.asa-about-intro--v2
.asa-about-intro-header
.asa-section-intro p {
    color:
        var(
            --asa-ai2-intro-color,
            #777777
        ) !important;

    font-weight:
        var(
            --asa-ai2-intro-weight,
            400
        ) !important;
}


/* ============================================================
   BODY
   ============================================================ */

.asa-about-intro--v2
.asa-about-intro__body {
    width:
        100%;

    max-width:
        var(
            --asa-ai2-body-max,
            720px
        );

    color:
        var(
            --asa-ai2-body-color,
            #444444
        );

    font-size:
        var(
            --asa-ai2-body-size-desktop,
            18px
        );

    font-weight:
        var(
            --asa-ai2-body-weight,
            400
        );

    line-height:
        1.75;
}


.asa-about-intro--v2
.asa-about-intro__body p,

.asa-about-intro--v2
.asa-about-intro__body li,

.asa-about-intro--v2
.asa-about-intro__body blockquote {
    color:
        inherit !important;

    font-size:
        inherit !important;

    font-weight:
        inherit;

    line-height:
        inherit !important;
}


.asa-about-intro--v2
.asa-about-intro__body p {
    margin:
        0
        0
        20px !important;
}


.asa-about-intro--v2
.asa-about-intro__body p:last-child {
    margin-bottom:
        0 !important;
}


.asa-about-intro--v2
.asa-about-intro__body h2,

.asa-about-intro--v2
.asa-about-intro__body h3,

.asa-about-intro--v2
.asa-about-intro__body h4,

.asa-about-intro--v2
.asa-about-intro__body h5 {
    margin:
        26px
        0
        12px !important;

    color:
        var(
            --asa-ai2-title-color,
            #242424
        ) !important;

    line-height:
        1.3 !important;
}


.asa-about-intro--v2
.asa-about-intro__body ul,

.asa-about-intro--v2
.asa-about-intro__body ol {
    margin:
        16px
        0
        20px
        1.3em !important;

    padding-left:
        1em !important;
}


.asa-about-intro--v2
.asa-about-intro__body li {
    margin-bottom:
        8px !important;
}


.asa-about-intro--v2
.asa-about-intro__body a {
    color:
        var(
            --asa-ai2-highlight-color,
            #F68D2E
        ) !important;

    text-decoration:
        underline;
}


.asa-about-intro--v2
.asa-about-intro__body blockquote {
    margin:
        22px
        0 !important;

    padding:
        10px
        16px !important;

    border-left:
        3px
        solid
        var(
            --asa-ai2-highlight-color,
            #F68D2E
        );
}


/* ============================================================
   BUTTON
   ============================================================ */

.asa-about-intro--v2
.asa-about-intro__action {
    margin-top:
        34px;
}


.asa-about-intro--v2
.asa-about-intro__button {
    display:
        inline-flex !important;

    align-items:
        center;

    justify-content:
        center;

    gap:
        12px;

    min-height:
        var(
            --asa-ai2-button-height,
            52px
        );

    padding:
        0
        var(
            --asa-ai2-button-pad-x,
            26px
        ) !important;

    border-radius:
        var(
            --asa-ai2-button-radius,
            100px
        ) !important;

    background:
        var(
            --asa-ai2-button-bg,
            #F68D2E
        ) !important;

    color:
        var(
            --asa-ai2-button-text,
            #FFFFFF
        ) !important;

    font-size:
        var(
            --asa-ai2-button-size,
            15px
        ) !important;

    font-weight:
        var(
            --asa-ai2-button-weight,
            700
        ) !important;

    text-decoration:
        none !important;

    transition:
        transform
        .25s
        ease,

        background-color
        .25s
        ease;
}


.asa-about-intro--v2
.asa-about-intro__button:hover {
    background:
        var(
            --asa-ai2-button-hover-bg,
            #FFB81C
        ) !important;

    color:
        var(
            --asa-ai2-button-text,
            #FFFFFF
        ) !important;

    transform:
        translateY(
            -2px
        );
}


/* ============================================================
   MOSAIC
   ============================================================ */

.asa-about-intro--v2
.asa-about-intro__visual {
    position:
        relative;

    width:
        100%;

    min-width:
        0;
}


.asa-about-intro--v2
.asa-about-intro__mosaic {
    position:
        relative;

    width:
        100%;

    display:
        grid;

    grid-template-columns:
        1fr
        .92fr;

    grid-template-rows:
        var(
            --asa-ai2-row-desktop,
            230px
        )
        var(
            --asa-ai2-row-desktop,
            230px
        );

    gap:
        var(
            --asa-ai2-gap-desktop,
            16px
        );
}


/* ============================================================
   MOSAIC PHOTOS
   ============================================================ */

.asa-about-intro--v2
.asa-about-intro__photo {
    position:
        relative;

    margin:
        0;

    overflow:
        hidden;

    border-radius:
        var(
            --asa-ai2-radius-desktop,
            22px
        );

    background:
        #EEEEEE;
}


.asa-about-intro--v2
.asa-about-intro__photo--1 {
    grid-column:
        1;

    grid-row:
        1
        /
        span 2;
}


.asa-about-intro--v2
.asa-about-intro__photo--2 {
    grid-column:
        2;

    grid-row:
        1;
}


.asa-about-intro--v2
.asa-about-intro__photo--3 {
    grid-column:
        2;

    grid-row:
        2;
}


/* ============================================================
   FLOATING FOURTH IMAGE
   ============================================================ */

.asa-about-intro--v2
.asa-about-intro__photo--4 {
    position:
        absolute;

    width:
        var(
            --asa-ai2-float-desktop,
            155px
        );

    height:
        var(
            --asa-ai2-float-desktop,
            155px
        );

    right:
        -30px;

    bottom:
        -35px;

    z-index:
        3;

    border:
        var(
            --asa-ai2-float-border,
            7px
        )
        solid
        #FFFFFF;

    border-radius:
        50%;

    box-shadow:
        0
        16px
        38px
        rgba(
            0,
            0,
            0,
            .14
        );
}


/* ============================================================
   IMAGE BEHAVIOR
   ============================================================ */

.asa-about-intro--v2
.asa-about-intro__photo img {
    display:
        block;

    width:
        100%;

    height:
        100%;

    object-fit:
        cover;

    transition:
        transform
        .6s
        ease;
}


@media (hover:hover) {

    .asa-about-intro--v2
    .asa-about-intro__photo:hover img {
        transform:
            scale(
                1.035
            );
    }

}


/* ============================================================
   TABLET
   ============================================================ */

@media(max-width:1024px) {

    .asa-about-intro--v2 {
        padding:
            var(
                --asa-ai2-pad-top-tablet,
                80px
            )
            0
            var(
                --asa-ai2-pad-bottom-tablet,
                90px
            );
    }


    .asa-about-intro--v2
    .asa-about-intro__container {
        width:
            90%;

        grid-template-columns:
            minmax(
                0,
                1fr
            )
            minmax(
                340px,
                .9fr
            );

        gap:
            45px;
    }


    .asa-about-intro--v2[data-about-layout="image-left"]
    .asa-about-intro__container {
        grid-template-columns:
            minmax(
                340px,
                .9fr
            )
            minmax(
                0,
                1fr
            );
    }


    .asa-about-intro--v2
    .asa-about-intro__mosaic {
        grid-template-rows:
            var(
                --asa-ai2-row-tablet,
                190px
            )
            var(
                --asa-ai2-row-tablet,
                190px
            );
    }


    .asa-about-intro--v2
    .asa-about-intro__photo--4 {
        width:
            var(
                --asa-ai2-float-tablet,
                125px
            );

        height:
            var(
                --asa-ai2-float-tablet,
                125px
            );

        right:
            -15px;

        bottom:
            -25px;
    }


    .asa-about-intro--v2
    .asa-about-intro__body {
        font-size:
            var(
                --asa-ai2-body-size-tablet,
                17px
            );
    }

}


/* ============================================================
   MOBILE
   Images always first.
   ============================================================ */

@media(max-width:767px) {

    .asa-about-intro--v2 {
        padding:
            var(
                --asa-ai2-pad-top-mobile,
                60px
            )
            0
            var(
                --asa-ai2-pad-bottom-mobile,
                70px
            );
    }


    .asa-about-intro--v2
    .asa-about-intro__container,

    .asa-about-intro--v2[data-about-layout="text-left"]
    .asa-about-intro__container,

    .asa-about-intro--v2[data-about-layout="image-left"]
    .asa-about-intro__container {
        width:
            90%;

        display:
            flex;

        flex-direction:
            column;

        gap:
            42px;
    }


    /* Images FIRST */

    .asa-about-intro--v2
    .asa-about-intro__visual {
        order:
            1;

        width:
            100%;
    }


    /* Text SECOND */

    .asa-about-intro--v2
    .asa-about-intro__content {
        order:
            2;

        width:
            100%;
    }


    .asa-about-intro--v2
    .asa-about-intro__mosaic {
        grid-template-columns:
            1.15fr
            .85fr;

        grid-template-rows:
            var(
                --asa-ai2-row-mobile,
                165px
            )
            var(
                --asa-ai2-row-mobile,
                165px
            );

        gap:
            var(
                --asa-ai2-gap-mobile,
                10px
            );
    }


    .asa-about-intro--v2
    .asa-about-intro__photo {
        border-radius:
            var(
                --asa-ai2-radius-mobile,
                16px
            );
    }


    .asa-about-intro--v2
    .asa-about-intro__photo--4 {
        width:
            var(
                --asa-ai2-float-mobile,
                105px
            );

        height:
            var(
                --asa-ai2-float-mobile,
                105px
            );

        right:
            -8px;

        bottom:
            -25px;

        border-width:
            min(
                var(
                    --asa-ai2-float-border,
                    7px
                ),
                5px
            );
    }


    .asa-about-intro--v2
    .asa-about-intro-header {
        margin-bottom:
            24px;
    }


    .asa-about-intro--v2
    .asa-about-intro-header
    .asa-section-intro {
        margin-top:
            20px;
    }


    .asa-about-intro--v2
    .asa-about-intro__body {
        max-width:
            none;

        font-size:
            var(
                --asa-ai2-body-size-mobile,
                16px
            );

        line-height:
            1.7;
    }

}


/* ============================================================
   SMALL MOBILE
   ============================================================ */

@media(max-width:480px) {

    .asa-about-intro--v2
    .asa-about-intro__mosaic {
        grid-template-rows:
            var(
                --asa-ai2-row-small-mobile,
                145px
            )
            var(
                --asa-ai2-row-small-mobile,
                145px
            );
    }


    .asa-about-intro--v2
    .asa-about-intro__photo--4 {
        width:
            var(
                --asa-ai2-float-small,
                90px
            );

        height:
            var(
                --asa-ai2-float-small,
                90px
            );

        right:
            -5px;

        bottom:
            -20px;
    }

}


/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media(prefers-reduced-motion:reduce) {

    .asa-about-intro--v2
    .asa-about-intro__photo img,

    .asa-about-intro--v2
    .asa-about-intro__button {
        transition:
            none !important;
    }

}

/* ============================================================
   ASA ABOUT US - VISION & MISSION
   VERSION 2.0
   ============================================================ */


/* ============================================================
   SECTION
   ============================================================ */

.asa-vm2-section {
    position: relative;

    padding:
        90px
        0
        0;

    background:
        #FFFFFF;

    overflow:
        hidden;
}


/* ============================================================
   SECTION HEADER
   ============================================================ */

.asa-vm2-header-container {
    width:
        min(
            86%,
            1520px
        );

    margin:
        0
        auto;
}


.asa-vm2-header {
    display:
        block;

    margin-bottom:
        42px;
}


.asa-vm2-header
.asa-section-title,

.asa-vm2-header
.asa-section-intro {
    width:
        100%;

    max-width:
        760px;
}


.asa-vm2-header
.asa-section-intro {
    margin-top:
        22px;
}


.asa-vm2-header
.asa-section-title h2 {
    color:
        var(
            --asa-vm2-header-title,
            #242424
        ) !important;

    font-weight:
        var(
            --asa-vm2-header-title-weight,
            700
        ) !important;
}


.asa-vm2-header
.asa-section-title h2 em {
    color:
        var(
            --asa-vm2-header-highlight,
            #F68D2E
        ) !important;

    font-weight:
        var(
            --asa-vm2-header-highlight-weight,
            400
        ) !important;
}


.asa-vm2-header
.asa-section-intro,

.asa-vm2-header
.asa-section-intro p {
    color:
        var(
            --asa-vm2-header-intro,
            #777777
        ) !important;

    font-weight:
        var(
            --asa-vm2-header-intro-weight,
            400
        ) !important;
}


/* ============================================================
   FULL-WIDTH GRID
   ============================================================ */

.asa-vm2-grid {
    position:
        relative;

    width:
        100vw;

    max-width:
        100vw;

    margin-left:
        calc(
            50%
            -
            50vw
        );

    margin-right:
        calc(
            50%
            -
            50vw
        );

    display:
        grid;

    grid-template-columns:
        repeat(
            2,
            minmax(
                0,
                1fr
            )
        );

    overflow:
        hidden;
}


/* ============================================================
   PANEL
   ============================================================ */

.asa-vm2-card {
    position:
        relative;

    min-width:
        0;

    min-height:
        var(
            --asa-vm2-desktop-height,
            420px
        );

    display:
        flex;

    background-color:
        var(
            --asa-vm2-bg-color,
            #F68D2E
        );

    background-repeat:
        no-repeat;

    background-size:
        cover;

    background-position:
        center;

    overflow:
        hidden;
}


/* ============================================================
   OVERLAY
   ============================================================ */

.asa-vm2-card__overlay {
    position:
        absolute;

    inset:
        0;

    z-index:
        1;

    background:
        var(
            --asa-vm2-overlay,
            transparent
        );

    pointer-events:
        none;
}


/* ============================================================
   PANEL CONTENT
   ============================================================ */

.asa-vm2-card__content {
    position:
        relative;

    z-index:
        2;

    width:
        min(
            76%,
            var(
                --asa-vm2-content-max,
                650px
            )
        );

    min-height:
        var(
            --asa-vm2-desktop-height,
            420px
        );

    padding:
        60px
        0;

    display:
        flex;

    flex-direction:
        column;

    box-sizing:
        border-box;

    color:
        var(
            --asa-vm2-body-color,
            #FFFFFF
        );
}


/* ============================================================
   NINE CONTENT POSITIONS
   ============================================================ */


/* LEFT */

.asa-vm2-pos-left-top
.asa-vm2-card__content {
    margin-left:
        9%;

    margin-right:
        auto;

    justify-content:
        flex-start;

    text-align:
        left;
}


.asa-vm2-pos-left-mid
.asa-vm2-card__content {
    margin-left:
        9%;

    margin-right:
        auto;

    justify-content:
        center;

    text-align:
        left;
}


.asa-vm2-pos-left-bottom
.asa-vm2-card__content {
    margin-left:
        9%;

    margin-right:
        auto;

    justify-content:
        flex-end;

    text-align:
        left;
}


/* CENTER */

.asa-vm2-pos-center-top
.asa-vm2-card__content {
    margin:
        0
        auto;

    justify-content:
        flex-start;

    text-align:
        center;
}


.asa-vm2-pos-center-mid
.asa-vm2-card__content {
    margin:
        0
        auto;

    justify-content:
        center;

    text-align:
        center;
}


.asa-vm2-pos-center-bottom
.asa-vm2-card__content {
    margin:
        0
        auto;

    justify-content:
        flex-end;

    text-align:
        center;
}


/* RIGHT */

.asa-vm2-pos-right-top
.asa-vm2-card__content {
    margin-left:
        auto;

    margin-right:
        9%;

    justify-content:
        flex-start;

    text-align:
        right;
}


.asa-vm2-pos-right-mid
.asa-vm2-card__content {
    margin-left:
        auto;

    margin-right:
        9%;

    justify-content:
        center;

    text-align:
        right;
}


.asa-vm2-pos-right-bottom
.asa-vm2-card__content {
    margin-left:
        auto;

    margin-right:
        9%;

    justify-content:
        flex-end;

    text-align:
        right;
}


/* ============================================================
   LABEL
   ============================================================ */

.asa-vm2-card__label {
    margin:
        0;

    color:
        var(
            --asa-vm2-label-color,
            #FFFFFF
        );

    font-size:
        var(
            --asa-vm2-label-size-desktop,
            20px
        );

    font-weight:
        var(
            --asa-vm2-label-weight,
            700
        );

    line-height:
        1.2;

    letter-spacing:
        .04em;

    text-transform:
        uppercase;
}


/* ============================================================
   ACCENT LINE
   ============================================================ */

.asa-vm2-card__line {
    width:
        var(
            --asa-vm2-line-width,
            82px
        );

    height:
        var(
            --asa-vm2-line-height,
            5px
        );

    margin:
        14px
        0
        27px;

    border-radius:
        999px;

    background:
        var(
            --asa-vm2-line-color,
            #FFFFFF
        );
}


/* Center */

.asa-vm2-pos-center-top
.asa-vm2-card__line,

.asa-vm2-pos-center-mid
.asa-vm2-card__line,

.asa-vm2-pos-center-bottom
.asa-vm2-card__line {
    margin-left:
        auto;

    margin-right:
        auto;
}


/* Right */

.asa-vm2-pos-right-top
.asa-vm2-card__line,

.asa-vm2-pos-right-mid
.asa-vm2-card__line,

.asa-vm2-pos-right-bottom
.asa-vm2-card__line {
    margin-left:
        auto;

    margin-right:
        0;
}


/* ============================================================
   HTML BODY
   ============================================================ */

.asa-vm2-card__text {
    width:
        100%;

    color:
        var(
            --asa-vm2-body-color,
            #FFFFFF
        );

    font-size:
        var(
            --asa-vm2-body-size-desktop,
            23px
        );

    font-weight:
        var(
            --asa-vm2-body-weight,
            400
        );

    line-height:
        1.5;
}


.asa-vm2-card__text p,

.asa-vm2-card__text li,

.asa-vm2-card__text blockquote {
    color:
        inherit !important;

    font-size:
        inherit !important;

    font-weight:
        inherit;

    line-height:
        inherit !important;
}


.asa-vm2-card__text p {
    margin:
        0
        0
        18px !important;
}


.asa-vm2-card__text p:last-child {
    margin-bottom:
        0 !important;
}


.asa-vm2-card__text h2,

.asa-vm2-card__text h3,

.asa-vm2-card__text h4,

.asa-vm2-card__text h5 {
    margin:
        24px
        0
        10px !important;

    color:
        inherit !important;

    line-height:
        1.25 !important;
}


.asa-vm2-card__text ul,

.asa-vm2-card__text ol {
    margin:
        16px
        0
        18px
        1.25em !important;

    padding-left:
        1em !important;
}


.asa-vm2-card__text li {
    margin-bottom:
        7px !important;
}


.asa-vm2-card__text a {
    color:
        inherit !important;

    text-decoration:
        underline;
}


.asa-vm2-card__text blockquote {
    margin:
        22px
        0 !important;

    padding:
        10px
        16px !important;

    border-left:
        3px
        solid
        currentColor;
}


/* ============================================================
   TABLET
   ============================================================ */

@media(max-width:1024px) {

    .asa-vm2-section {
        padding-top:
            75px;
    }


    .asa-vm2-header-container {
        width:
            90%;
    }


    .asa-vm2-card {
        min-height:
            var(
                --asa-vm2-tablet-height,
                400px
            );
    }


    .asa-vm2-card__content {
        width:
            min(
                82%,
                var(
                    --asa-vm2-content-max,
                    650px
                )
            );

        min-height:
            var(
                --asa-vm2-tablet-height,
                400px
            );

        padding:
            48px
            0;
    }


    .asa-vm2-pos-left-top
    .asa-vm2-card__content,

    .asa-vm2-pos-left-mid
    .asa-vm2-card__content,

    .asa-vm2-pos-left-bottom
    .asa-vm2-card__content {
        margin-left:
            8%;
    }


    .asa-vm2-pos-right-top
    .asa-vm2-card__content,

    .asa-vm2-pos-right-mid
    .asa-vm2-card__content,

    .asa-vm2-pos-right-bottom
    .asa-vm2-card__content {
        margin-right:
            8%;
    }


    .asa-vm2-card__label {
        font-size:
            var(
                --asa-vm2-label-size-tablet,
                18px
            );
    }


    .asa-vm2-card__text {
        font-size:
            var(
                --asa-vm2-body-size-tablet,
                20px
            );
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:767px) {

    .asa-vm2-section {
        padding-top:
            60px;
    }


    .asa-vm2-header-container {
        width:
            90%;
    }


    .asa-vm2-header {
        margin-bottom:
            32px;
    }


    .asa-vm2-grid {
        grid-template-columns:
            1fr;
    }


    .asa-vm2-card {
        min-height:
            var(
                --asa-vm2-mobile-height,
                440px
            );
    }


    /*
     * All panels use the same horizontal alignment
     * on mobile for a cleaner stacked layout.
     */

    .asa-vm2-card__content,

    .asa-vm2-pos-left-top
    .asa-vm2-card__content,

    .asa-vm2-pos-left-mid
    .asa-vm2-card__content,

    .asa-vm2-pos-left-bottom
    .asa-vm2-card__content,

    .asa-vm2-pos-center-top
    .asa-vm2-card__content,

    .asa-vm2-pos-center-mid
    .asa-vm2-card__content,

    .asa-vm2-pos-center-bottom
    .asa-vm2-card__content,

    .asa-vm2-pos-right-top
    .asa-vm2-card__content,

    .asa-vm2-pos-right-mid
    .asa-vm2-card__content,

    .asa-vm2-pos-right-bottom
    .asa-vm2-card__content {
        width:
            min(
                88%,
                var(
                    --asa-vm2-content-max,
                    650px
                )
            );

        min-height:
            var(
                --asa-vm2-mobile-height,
                440px
            );

        margin-left:
            auto;

        margin-right:
            auto;

        padding:
            44px
            0;

        text-align:
            left;
    }


    /* TOP */

    .asa-vm2-pos-left-top
    .asa-vm2-card__content,

    .asa-vm2-pos-center-top
    .asa-vm2-card__content,

    .asa-vm2-pos-right-top
    .asa-vm2-card__content {
        justify-content:
            flex-start;
    }


    /* MIDDLE */

    .asa-vm2-pos-left-mid
    .asa-vm2-card__content,

    .asa-vm2-pos-center-mid
    .asa-vm2-card__content,

    .asa-vm2-pos-right-mid
    .asa-vm2-card__content {
        justify-content:
            center;
    }


    /* BOTTOM */

    .asa-vm2-pos-left-bottom
    .asa-vm2-card__content,

    .asa-vm2-pos-center-bottom
    .asa-vm2-card__content,

    .asa-vm2-pos-right-bottom
    .asa-vm2-card__content {
        justify-content:
            flex-end;
    }


    .asa-vm2-card__label {
        font-size:
            var(
                --asa-vm2-label-size-mobile,
                17px
            );
    }


    .asa-vm2-card__line,

    .asa-vm2-pos-center-top
    .asa-vm2-card__line,

    .asa-vm2-pos-center-mid
    .asa-vm2-card__line,

    .asa-vm2-pos-center-bottom
    .asa-vm2-card__line,

    .asa-vm2-pos-right-top
    .asa-vm2-card__line,

    .asa-vm2-pos-right-mid
    .asa-vm2-card__line,

    .asa-vm2-pos-right-bottom
    .asa-vm2-card__line {
        margin:
            12px
            0
            22px;
    }


    .asa-vm2-card__text {
        font-size:
            var(
                --asa-vm2-body-size-mobile,
                18px
            );

        line-height:
            1.6;
    }

}

/* =========================================================
   ASA ABOUT US - CORE VALUES
   FINAL
   ========================================================= */

.asa-core-values {
    position: relative;
    padding: 105px 0 115px;
    background: #faf8f4;
    overflow: hidden;
}


/* =========================================================
   CONTAINER
   ========================================================= */

.asa-core-values__container {
    width: min(90%, 1520px);
    margin: 0 auto;
}


/* =========================================================
   HEADER
   Uses our homepage title system
   ========================================================= */

.asa-core-values__header {
    display: block;
    margin-bottom: 85px;
}

.asa-core-values__header .asa-section-title {
    width: 100%;
    max-width: 760px;
}

.asa-core-values__header .asa-section-intro {
    width: 100%;
    max-width: 760px;
    margin-top: 22px;
}


/* =========================================================
   GRID
   ========================================================= */

.asa-core-values__grid {
    display: grid !important;

    grid-template-columns:
        repeat(3, minmax(0, 1fr)) !important;

    gap: 88px 38px !important;

    width: 100%;
}


/* =========================================================
   CARD
   ========================================================= */

.asa-core-value-card {
    position: relative !important;

    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;

    min-width: 0 !important;
    min-height: 330px;

    margin: 0 !important;

    padding:
        105px
        38px
        42px !important;

    background: #ffffff !important;

    border: 1px solid #e5e5e5 !important;
    border-radius: 28px !important;

    box-shadow:
        0 14px 36px
        rgba(25, 25, 25, 0.055);

    text-align: center;

    overflow: visible !important;

    box-sizing: border-box;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


/* =========================================================
   CARD HOVER
   ========================================================= */

@media (hover: hover) {

    .asa-core-value-card:hover {
        transform: translateY(-5px);

        box-shadow:
            0 20px 44px
            rgba(25, 25, 25, 0.09);
    }

}


/* =========================================================
   ICON POSITION
   ========================================================= */

.asa-core-value-card__icon-wrap {
    position: absolute !important;

    top: -58px !important;
    left: 50% !important;

    transform: translateX(-50%) !important;

    width: 128px;
    height: 128px;

    margin: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    z-index: 5;
}


/* =========================================================
   OUTER ICON FRAME
   ========================================================= */

.asa-core-value-card__icon-frame {
    position: relative;

    width: 128px;
    height: 128px;

    padding: 9px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #ffffff !important;

    border:
        4px solid
        var(--asa-cv-outline, #F68D2E) !important;

    border-radius: 31px;

    box-shadow:
        0 12px 28px
        rgba(30, 30, 30, 0.08);

    box-sizing: border-box;
}


/* Remove old animation completely */

.asa-core-value-card__icon-frame::before,
.asa-core-value-card__icon-frame::after {
    content: none !important;
    display: none !important;
    animation: none !important;
}


/* =========================================================
   ACTUAL UPLOADED ICON
   ========================================================= */

.asa-core-value-card__icon-box {
    position: relative;

    width: 100%;
    height: 100%;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: transparent !important;

    border-radius: 21px;

    overflow: hidden;

    box-shadow: none !important;
}


.asa-core-value-card__icon-box img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    max-width: none !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: cover;

    opacity: 1 !important;
    visibility: visible !important;
}


/* =========================================================
   BODY
   ========================================================= */

.asa-core-value-card__body {
    position: relative !important;

    z-index: 2;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;
}


/* =========================================================
   TITLE
   ========================================================= */

.asa-core-value-card__body h3 {
    display: block !important;

    width: 100% !important;

    margin: 0 0 16px !important;
    padding: 0 !important;

    color: #292941 !important;

    font-size:
        clamp(20px, 1.5vw, 25px) !important;

    font-weight: 800 !important;

    line-height: 1.2 !important;

    letter-spacing: 0.01em;

    text-align: center !important;
    text-transform: uppercase;

    opacity: 1 !important;
    visibility: visible !important;

    transform: none !important;
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.asa-core-value-card__body p {
    display: block !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #777777 !important;

    font-size: 17px !important;
    font-weight: 400 !important;

    line-height: 1.7 !important;

    text-align: center !important;

    opacity: 1 !important;
    visibility: visible !important;

    transform: none !important;
}


/* =========================================================
   TABLET
   STILL 3 COLUMNS
   ========================================================= */

@media (max-width: 1024px) {

    .asa-core-values {
        padding: 90px 0 100px;
    }


    .asa-core-values__container {
        width: 92%;
    }


    .asa-core-values__header {
        margin-bottom: 76px;
    }


    .asa-core-values__grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr)) !important;

        gap: 76px 22px !important;
    }


    .asa-core-value-card {
        min-height: 310px;

        padding:
            88px
            20px
            31px !important;
    }


    .asa-core-value-card__icon-wrap {
        top: -52px !important;

        width: 112px;
        height: 112px;
    }


    .asa-core-value-card__icon-frame {
        width: 112px;
        height: 112px;

        padding: 8px;

        border-radius: 27px;
    }


    .asa-core-value-card__icon-box {
        border-radius: 18px;
    }


    .asa-core-value-card__body h3 {
        font-size: 18px !important;
    }


    .asa-core-value-card__body p {
        font-size: 15px !important;
        line-height: 1.6 !important;
    }

}


/* =========================================================
   MOBILE
   ONE COLUMN
   ========================================================= */

@media (max-width: 767px) {

    .asa-core-values {
        padding: 70px 0 80px;
    }


    .asa-core-values__container {
        width: 90%;
    }


    .asa-core-values__header {
        margin-bottom: 75px;
    }


    .asa-core-values__grid {
        grid-template-columns: 1fr !important;

        gap: 78px !important;
    }


    .asa-core-value-card {
        min-height: 0;

        padding:
            88px
            28px
            34px !important;

        border-radius: 24px !important;
    }


    .asa-core-value-card__icon-wrap {
        top: -52px !important;

        width: 112px;
        height: 112px;
    }


    .asa-core-value-card__icon-frame {
        width: 112px;
        height: 112px;

        padding: 8px;
    }


    .asa-core-value-card__body h3 {
        margin-bottom: 13px !important;

        font-size: 20px !important;
    }


    .asa-core-value-card__body p {
        font-size: 16px !important;
        line-height: 1.7 !important;
    }

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .asa-core-value-card {
        transition: none;
    }

    .asa-core-value-card:hover {
        transform: none;
    }

}

/* =========================================================
   ASA ABOUT US - HISTORY INTRO
   VERSION 3.1
   ========================================================= */

.asa-history-intro {
    position:
        relative;

    padding:
        110px
        0;

    background:
        #FFFFFF;

    overflow:
        hidden;
}


/* =========================================================
   CONTAINER
   ========================================================= */

.asa-history-intro__container {
    width:
        min(
            90%,
            1520px
        );

    margin:
        0
        auto;

    display:
        grid !important;

    grid-template-columns:
        minmax(
            0,
            .95fr
        )
        minmax(
            0,
            1.05fr
        );

    align-items:
        center;

    gap:
        clamp(
            60px,
            7vw,
            115px
        );
}


/* =========================================================
   EXPLICIT IMAGE POSITION

   Position comes directly from dashboard setting
   through CSS variables generated by PHP.
   ========================================================= */

.asa-history-intro
.asa-history-intro__visual {
    grid-column:
        var(
            --asa-hi-image-column,
            1
        ) !important;

    grid-row:
        1 !important;

    order:
        var(
            --asa-hi-image-order,
            1
        ) !important;
}


/* =========================================================
   EXPLICIT TEXT POSITION
   ========================================================= */

.asa-history-intro
.asa-history-intro__content {
    grid-column:
        var(
            --asa-hi-text-column,
            2
        ) !important;

    grid-row:
        1 !important;

    order:
        var(
            --asa-hi-text-order,
            2
        ) !important;
}


/* =========================================================
   IMAGE LEFT / TEXT RIGHT
   ========================================================= */

.asa-history-intro[data-history-layout="image-left"]
.asa-history-intro__container {
    grid-template-columns:
        minmax(
            0,
            .95fr
        )
        minmax(
            0,
            1.05fr
        );
}


.asa-history-intro[data-history-layout="image-left"]
.asa-history-intro__visual {
    grid-column:
        1 !important;

    order:
        1 !important;
}


.asa-history-intro[data-history-layout="image-left"]
.asa-history-intro__content {
    grid-column:
        2 !important;

    order:
        2 !important;
}


/* =========================================================
   TEXT LEFT / IMAGE RIGHT
   ========================================================= */

.asa-history-intro[data-history-layout="text-left"]
.asa-history-intro__container {
    grid-template-columns:
        minmax(
            0,
            1.05fr
        )
        minmax(
            0,
            .95fr
        );
}


.asa-history-intro[data-history-layout="text-left"]
.asa-history-intro__content {
    grid-column:
        1 !important;

    order:
        1 !important;
}


.asa-history-intro[data-history-layout="text-left"]
.asa-history-intro__visual {
    grid-column:
        2 !important;

    order:
        2 !important;
}


/* =========================================================
   NO IMAGE
   ========================================================= */

.asa-history-intro--no-image
.asa-history-intro__container {
    grid-template-columns:
        minmax(
            0,
            1fr
        ) !important;
}


.asa-history-intro--no-image
.asa-history-intro__content {
    grid-column:
        1 !important;

    grid-row:
        1 !important;

    width:
        100%;

    max-width:
        920px;
}

/* =========================================================
   HISTORY INTRO IMAGE
   ========================================================= */

.asa-history-intro__visual {
    position: relative;
    width: 100%;
    min-width: 0;
}

.asa-history-intro__image-wrap {
    position: relative;
    width: 100%;
    height: var(--asa-hi-image-h-desktop, 570px);
    border-radius: 30px;
    overflow: hidden;
    background: #efefef;
    box-shadow: 0 18px 45px rgba(20, 20, 20, .09);
}

.asa-history-intro__image-wrap img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform .7s ease;
}

@media (hover: hover) {
    .asa-history-intro__image-wrap:hover img {
        transform: scale(1.025);
    }
}

/* =========================================================
   HISTORY INTRO KICKER
   ========================================================= */

.asa-history-intro__year {
    position: absolute;
    left: 30px;
    bottom: 30px;
    z-index: 3;
    padding: 14px 22px;
    background: rgba(255, 255, 255, .94);
    border-radius: 100px;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .10);
    backdrop-filter: blur(8px);
}

.asa-history-intro__year span,
.asa-history-intro__kicker-inline {
    color: var(--asa-hi-kicker-color, #F68D2E);
    font-size: var(--asa-hi-kicker-size-desktop, 16px);
    font-weight: var(--asa-hi-kicker-weight, 800);
    line-height: 1;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.asa-history-intro__year span {
    display: block;
    margin: 0;
}

.asa-history-intro__kicker-inline {
    display: inline-flex;
    margin-bottom: 22px;
    padding: 12px 18px;
    background: #fff7ed;
    border-radius: 100px;
}

/* =========================================================
   HISTORY INTRO CONTENT
   ========================================================= */

.asa-history-intro__content {
    min-width: 0;
}

.asa-history-intro__header {
    display: block;
    margin-bottom: 30px;
}

.asa-history-intro__header h2 {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.08 !important;
}

.asa-history-intro__title-main {
    color: var(--asa-hi-title-color, #242424) !important;
    font-size: var(--asa-hi-title-size-desktop, 52px) !important;
    font-weight: var(--asa-hi-title-weight, 700) !important;
    font-style: normal;
}

.asa-history-intro__title-highlight {
    color: var(--asa-hi-highlight-color, #F68D2E) !important;
    font-size: var(--asa-hi-highlight-size-desktop, 52px) !important;
    font-weight: var(--asa-hi-highlight-weight, 400) !important;
    font-style: italic;
}

/* =========================================================
   HISTORY INTRO HTML BODY
   ========================================================= */

.asa-history-intro__copy {
    width: 100%;
    max-width: 720px;
    color: #555555;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.75;
}

.asa-history-intro__copy p {
    margin: 0 0 20px;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.asa-history-intro__copy p:last-child {
    margin-bottom: 0;
}

.asa-history-intro__copy h2,
.asa-history-intro__copy h3,
.asa-history-intro__copy h4,
.asa-history-intro__copy h5 {
    margin: 28px 0 12px;
    color: #242424;
    line-height: 1.25;
}

.asa-history-intro__copy ul,
.asa-history-intro__copy ol {
    margin: 18px 0 20px 1.35em;
    padding-left: 1em;
}

.asa-history-intro__copy li {
    margin-bottom: 8px;
}

.asa-history-intro__copy a {
    color: #F68D2E;
    text-decoration: underline;
}

.asa-history-intro__copy blockquote {
    margin: 24px 0;
    padding: 12px 18px;
    border-left: 3px solid #F68D2E;
}

/* =========================================================
   HISTORY INTRO TABLET
   ========================================================= */

@media (max-width: 1024px) {
    .asa-history-intro {
        padding: 90px 0;
    }

    .asa-history-intro__container {
        width: 92%;
        gap: 48px;
    }

    .asa-history-layout-image-left .asa-history-intro__container {
        grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    }

    .asa-history-layout-text-left .asa-history-intro__container {
        grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    }

    .asa-history-intro__image-wrap {
        height: var(--asa-hi-image-h-tablet, 480px);
        border-radius: 26px;
    }

    .asa-history-intro__year {
        left: 24px;
        bottom: 24px;
    }

    .asa-history-intro__title-main {
        font-size: var(--asa-hi-title-size-tablet, 46px) !important;
    }

    .asa-history-intro__title-highlight {
        font-size: var(--asa-hi-highlight-size-tablet, 46px) !important;
    }

    .asa-history-intro__year span,
    .asa-history-intro__kicker-inline {
        font-size: var(--asa-hi-kicker-size-tablet, 15px);
    }

    .asa-history-intro__copy {
        font-size: 17px;
        line-height: 1.7;
    }
}

/* =========================================================
   HISTORY INTRO MOBILE
   Image remains first for both desktop layout choices.
   ========================================================= */

@media (max-width: 767px) {
    .asa-history-intro {
        padding: 70px 0 75px;
    }

    .asa-history-intro__container,
    .asa-history-layout-image-left .asa-history-intro__container,
    .asa-history-layout-text-left .asa-history-intro__container {
        width: 90%;
        display: flex;
        flex-direction: column;
        gap: 42px;
    }

    .asa-history-intro__visual {
        order: 1;
        width: 100%;
    }

    .asa-history-intro__content {
        order: 2;
        width: 100%;
    }

    .asa-history-intro__image-wrap {
        height: var(--asa-hi-image-h-mobile, 410px);
        border-radius: 22px;
    }

    .asa-history-intro__year {
        left: 18px;
        bottom: 18px;
        padding: 12px 18px;
    }

    .asa-history-intro__title-main {
        font-size: var(--asa-hi-title-size-mobile, 36px) !important;
    }

    .asa-history-intro__title-highlight {
        font-size: var(--asa-hi-highlight-size-mobile, 36px) !important;
    }

    .asa-history-intro__year span,
    .asa-history-intro__kicker-inline {
        font-size: var(--asa-hi-kicker-size-mobile, 14px);
    }

    .asa-history-intro__header {
        margin-bottom: 24px;
    }

    .asa-history-intro__copy {
        max-width: none;
        font-size: 16px;
        line-height: 1.7;
    }
}

/* =========================================================
   ASA ABOUT US - HISTORY INTRO
   VERSION 3.2
   ========================================================= */

.asa-history-intro {
    position: relative;
    padding: 110px 0;
    background: #ffffff;
    overflow: hidden;
}

.asa-history-intro__container {
    width:
        min(
            90%,
            1520px
        );

    margin:
        0
        auto;

    display:
        grid !important;

    grid-template-columns:
        minmax(
            0,
            .95fr
        )
        minmax(
            0,
            1.05fr
        );

    align-items:
        center;

    gap:
        clamp(
            60px,
            7vw,
            115px
        );
}


/* =========================================================
   DESKTOP IMAGE / TEXT POSITION
   ========================================================= */

.asa-history-intro
.asa-history-intro__visual {
    grid-column:
        var(
            --asa-hi-image-column,
            1
        ) !important;

    grid-row:
        1 !important;

    order:
        var(
            --asa-hi-image-order,
            1
        ) !important;
}


.asa-history-intro
.asa-history-intro__content {
    grid-column:
        var(
            --asa-hi-text-column,
            2
        ) !important;

    grid-row:
        1 !important;

    order:
        var(
            --asa-hi-text-order,
            2
        ) !important;
}


/* Image Left / Text Right */

.asa-history-intro[data-history-layout="image-left"]
.asa-history-intro__container {
    grid-template-columns:
        minmax(
            0,
            .95fr
        )
        minmax(
            0,
            1.05fr
        );
}


.asa-history-intro[data-history-layout="image-left"]
.asa-history-intro__visual {
    grid-column:
        1 !important;

    order:
        1 !important;
}


.asa-history-intro[data-history-layout="image-left"]
.asa-history-intro__content {
    grid-column:
        2 !important;

    order:
        2 !important;
}


/* Text Left / Image Right */

.asa-history-intro[data-history-layout="text-left"]
.asa-history-intro__container {
    grid-template-columns:
        minmax(
            0,
            1.05fr
        )
        minmax(
            0,
            .95fr
        );
}


.asa-history-intro[data-history-layout="text-left"]
.asa-history-intro__content {
    grid-column:
        1 !important;

    order:
        1 !important;
}


.asa-history-intro[data-history-layout="text-left"]
.asa-history-intro__visual {
    grid-column:
        2 !important;

    order:
        2 !important;
}


/* No image */

.asa-history-intro--no-image
.asa-history-intro__container {
    grid-template-columns:
        minmax(
            0,
            1fr
        ) !important;
}


.asa-history-intro--no-image
.asa-history-intro__content {
    grid-column:
        1 !important;

    grid-row:
        1 !important;

    width:
        100%;

    max-width:
        920px;
}


/* =========================================================
   HISTORY INTRO IMAGE
   ========================================================= */

.asa-history-intro__visual {
    position: relative;
    width: 100%;
    min-width: 0;
}

.asa-history-intro__image-wrap {
    position: relative;
    width: 100%;
    height: var(--asa-hi-image-h-desktop, 570px);
    border-radius: 30px;
    overflow: hidden;
    background: #efefef;
    box-shadow: 0 18px 45px rgba(20, 20, 20, .09);
}

.asa-history-intro__image-wrap img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform .7s ease;
}

@media (hover: hover) {
    .asa-history-intro__image-wrap:hover img {
        transform: scale(1.025);
    }
}

/* =========================================================
   HISTORY INTRO KICKER
   ========================================================= */

.asa-history-intro__year {
    position: absolute;
    left: 30px;
    bottom: 30px;
    z-index: 3;
    padding: 14px 22px;
    background: rgba(255, 255, 255, .94);
    border-radius: 100px;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .10);
    backdrop-filter: blur(8px);
}

.asa-history-intro__year span,
.asa-history-intro__kicker-inline {
    color: var(--asa-hi-kicker-color, #F68D2E);
    font-size: var(--asa-hi-kicker-size-desktop, 16px);
    font-weight: var(--asa-hi-kicker-weight, 800);
    line-height: 1;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.asa-history-intro__year span {
    display: block;
    margin: 0;
}

.asa-history-intro__kicker-inline {
    display: inline-flex;
    margin-bottom: 22px;
    padding: 12px 18px;
    background: #fff7ed;
    border-radius: 100px;
}

/* =========================================================
   HISTORY INTRO CONTENT
   ========================================================= */

.asa-history-intro__content {
    min-width: 0;
}

.asa-history-intro__header {
    display: block;
    margin-bottom: 30px;
}

.asa-history-intro__header h2 {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.08 !important;
}

.asa-history-intro__title-main {
    color: var(--asa-hi-title-color, #242424) !important;
    font-size: var(--asa-hi-title-size-desktop, 52px) !important;
    font-weight: var(--asa-hi-title-weight, 700) !important;
    font-style: normal;
}

.asa-history-intro__title-highlight {
    color: var(--asa-hi-highlight-color, #F68D2E) !important;
    font-size: var(--asa-hi-highlight-size-desktop, 52px) !important;
    font-weight: var(--asa-hi-highlight-weight, 400) !important;
    font-style: italic;
}

/* =========================================================
   HISTORY INTRO HTML BODY
   ========================================================= */

.asa-history-intro__copy {
    width: 100%;
    max-width: 720px;
    color: #555555;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.75;
}

.asa-history-intro__copy p {
    margin: 0 0 20px;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.asa-history-intro__copy p:last-child {
    margin-bottom: 0;
}

.asa-history-intro__copy h2,
.asa-history-intro__copy h3,
.asa-history-intro__copy h4,
.asa-history-intro__copy h5 {
    margin: 28px 0 12px;
    color: #242424;
    line-height: 1.25;
}

.asa-history-intro__copy ul,
.asa-history-intro__copy ol {
    margin: 18px 0 20px 1.35em;
    padding-left: 1em;
}

.asa-history-intro__copy li {
    margin-bottom: 8px;
}

.asa-history-intro__copy a {
    color: #F68D2E;
    text-decoration: underline;
}

.asa-history-intro__copy blockquote {
    margin: 24px 0;
    padding: 12px 18px;
    border-left: 3px solid #F68D2E;
}

/* =========================================================
   HISTORY INTRO TABLET
   Tablet becomes one column.
   Image is always first and centered.
   ========================================================= */

@media (max-width: 1024px) {

    .asa-history-intro {
        padding:
            90px
            0;
    }


    .asa-history-intro__container,

    .asa-history-layout-image-left
    .asa-history-intro__container,

    .asa-history-layout-text-left
    .asa-history-intro__container {
        width:
            92%;

        display:
            flex !important;

        flex-direction:
            column;

        align-items:
            stretch;

        gap:
            48px;
    }


    /*
     * At tablet breakpoint the desktop
     * Image Left / Text Right switch no longer
     * controls the order.
     *
     * Tablet and mobile always use:
     * IMAGE FIRST
     * TEXT SECOND
     */

    .asa-history-intro__visual,

    .asa-history-layout-image-left
    .asa-history-intro__visual,

    .asa-history-layout-text-left
    .asa-history-intro__visual {
        order:
            1 !important;

        width:
            min(
                100%,
                720px
            );

        margin-left:
            auto;

        margin-right:
            auto;

        grid-column:
            auto !important;

        grid-row:
            auto !important;
    }


    .asa-history-intro__content,

    .asa-history-layout-image-left
    .asa-history-intro__content,

    .asa-history-layout-text-left
    .asa-history-intro__content {
        order:
            2 !important;

        width:
            100%;

        grid-column:
            auto !important;

        grid-row:
            auto !important;
    }


    .asa-history-intro--no-image
    .asa-history-intro__content {
        order:
            1 !important;
    }


    .asa-history-intro__image-wrap {
        width:
            100%;

        height:
            var(
                --asa-hi-image-h-tablet,
                480px
            );

        margin:
            0
            auto;

        border-radius:
            26px;
    }


    .asa-history-intro__year {
        left:
            24px;

        bottom:
            24px;
    }


    .asa-history-intro__title-main {
        font-size:
            var(
                --asa-hi-title-size-tablet,
                46px
            ) !important;
    }


    .asa-history-intro__title-highlight {
        font-size:
            var(
                --asa-hi-highlight-size-tablet,
                46px
            ) !important;
    }


    .asa-history-intro__year span,

    .asa-history-intro__kicker-inline {
        font-size:
            var(
                --asa-hi-kicker-size-tablet,
                15px
            );
    }


    .asa-history-intro__copy {
        font-size:
            17px;

        line-height:
            1.7;
    }

}


/* =========================================================
   HISTORY INTRO MOBILE
   One column, image first and centered.
   ========================================================= */

@media (max-width: 767px) {

    .asa-history-intro {
        padding:
            70px
            0
            75px;
    }


    .asa-history-intro__container,

    .asa-history-layout-image-left
    .asa-history-intro__container,

    .asa-history-layout-text-left
    .asa-history-intro__container {
        width:
            90%;

        display:
            flex !important;

        flex-direction:
            column;

        align-items:
            stretch;

        gap:
            42px;
    }


    .asa-history-intro__visual,

    .asa-history-layout-image-left
    .asa-history-intro__visual,

    .asa-history-layout-text-left
    .asa-history-intro__visual {
        order:
            1 !important;

        width:
            min(
                100%,
                620px
            );

        margin-left:
            auto;

        margin-right:
            auto;

        grid-column:
            auto !important;

        grid-row:
            auto !important;
    }


    .asa-history-intro__content,

    .asa-history-layout-image-left
    .asa-history-intro__content,

    .asa-history-layout-text-left
    .asa-history-intro__content {
        order:
            2 !important;

        width:
            100%;

        grid-column:
            auto !important;

        grid-row:
            auto !important;
    }


    .asa-history-intro--no-image
    .asa-history-intro__content {
        order:
            1 !important;
    }


    .asa-history-intro__image-wrap {
        width:
            100%;

        height:
            var(
                --asa-hi-image-h-mobile,
                410px
            );

        margin:
            0
            auto;

        border-radius:
            22px;
    }


    .asa-history-intro__year {
        left:
            18px;

        bottom:
            18px;

        padding:
            12px
            18px;
    }


    .asa-history-intro__title-main {
        font-size:
            var(
                --asa-hi-title-size-mobile,
                36px
            ) !important;
    }


    .asa-history-intro__title-highlight {
        font-size:
            var(
                --asa-hi-highlight-size-mobile,
                36px
            ) !important;
    }


    .asa-history-intro__year span,

    .asa-history-intro__kicker-inline {
        font-size:
            var(
                --asa-hi-kicker-size-mobile,
                14px
            );
    }


    .asa-history-intro__header {
        margin-bottom:
            24px;
    }


    .asa-history-intro__copy {
        max-width:
            none;

        font-size:
            16px;

        line-height:
            1.7;
    }

}


/* ==========================================================
   ASA ABOUT US - HISTORY TIMELINE
   VERSION 3.2
   ========================================================== */

.asa-history-timeline {
    position: relative;
    padding: 105px 0 115px;
    background: #faf8f4;
    overflow: hidden;
}

.asa-history-timeline__container {
    width: min(90%, 1520px);
    margin: 0 auto;
}

/* ==========================================================
   TIMELINE HEADER
   ========================================================== */

.asa-history-timeline__header {
    display: block;
    margin-bottom: 48px;
}

.asa-history-timeline__header .asa-section-title {
    width: 100%;
    max-width: 820px;
}

.asa-history-timeline__header .asa-section-intro {
    width: 100%;
    max-width: 820px;
    margin-top: 22px;
}

/* ==========================================================
   TIMELINE NAVIGATION SHELL
   ========================================================== */

.asa-history-timeline__nav-shell {
    position: relative;
    width: 100%;
}

.asa-history-timeline__nav {
    position: absolute !important;
    top: 50% !important;
    z-index: 20 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 50px !important;
    height: 50px !important;
    min-width: 50px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: translateY(-50%) !important;
    border: 0 !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    color: #F68D2E !important;
    font-size: 34px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .14) !important;
    cursor: pointer !important;
}

.asa-history-timeline__nav[hidden] {
    display: none !important;
}

.asa-history-timeline__prev {
    left: -25px !important;
}

.asa-history-timeline__next {
    right: -25px !important;
}

/* ==========================================================
   HORIZONTAL SCROLLER
   Horizontal scrolling is intentionally enabled.
   ========================================================== */

.asa-history-timeline__scroller {
    width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 0 14px;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: rgba(246, 141, 46, .55) rgba(0, 0, 0, .06);
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;

    /*
     * Vertical page scrolling remains native.
     * Horizontal touch/pen swiping is handled by
     * the timeline's pointer-drag JavaScript so a
     * gesture can start over the open accordion body.
     */
    touch-action: pan-y;

    box-sizing: border-box;
}

.asa-history-timeline__scroller::-webkit-scrollbar {
    height: 8px;
}

.asa-history-timeline__scroller::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, .05);
    border-radius: 999px;
}

.asa-history-timeline__scroller::-webkit-scrollbar-thumb {
    background: rgba(246, 141, 46, .55);
    border-radius: 999px;
}

.asa-history-timeline__scroller:focus-visible {
    outline: 2px solid rgba(246, 141, 46, .45);
    outline-offset: 6px;
}


/*
 * Make the complete horizontal timeline drag surface,
 * including the expanded accordion body.
 */
.asa-history-timeline__track,
.asa-timeline-item,
.asa-timeline-tab,
.asa-timeline-body,
.asa-timeline-body__content {
    touch-action: pan-y;
}

.asa-history-timeline__scroller.is-dragging {
    scroll-behavior: auto;
}

/* ==========================================================
   TRACK
   Width is based on the actual title and detail panel widths.
   ========================================================== */

.asa-history-timeline__track {
    display: flex;
    align-items: stretch;
    width: max-content;
    min-width: 100%;
    height: var(--asa-tl-desktop-height, 560px);
    gap: 12px;
}

/* ==========================================================
   TIMELINE ITEM
   ========================================================== */

.asa-timeline-item {
    position: relative;
    display: flex;
    flex: 0 0 var(--asa-tl-tab-width, 88px);
    width: var(--asa-tl-tab-width, 88px);
    min-width: var(--asa-tl-tab-width, 88px);
    height: 100%;
    overflow: hidden;
    border-radius: 38px;
    background: transparent;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .07);
    transition: flex-basis .55s cubic-bezier(.2, .7, .2, 1), width .55s cubic-bezier(.2, .7, .2, 1);
}

.asa-timeline-item.is-active {
    flex-basis: calc(var(--asa-tl-tab-width, 88px) + var(--asa-tl-detail-width, 560px));
    width: calc(var(--asa-tl-tab-width, 88px) + var(--asa-tl-detail-width, 560px));
}

/* ==========================================================
   TITLE TAB
   ========================================================== */

.asa-timeline-tab {
    position: relative;
    flex: 0 0 var(--asa-tl-tab-width, 88px);
    width: var(--asa-tl-tab-width, 88px);
    min-width: var(--asa-tl-tab-width, 88px);
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 38px;
    overflow: hidden;
    cursor: pointer;
    appearance: none;
    text-align: center;
    box-sizing: border-box;
}

.asa-timeline-item.is-active .asa-timeline-tab {
    border-radius: 38px 0 0 38px;
}

.asa-timeline-tab__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: var(--asa-tl-overlay, transparent);
    pointer-events: none;
}

.asa-timeline-tab__text {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: block;
    color: var(--asa-title-color, #ffffff);
    font-family: var(--asa-title-family, inherit);
    font-size: var(--asa-title-size, 30px);
    font-weight: var(--asa-title-weight, 800);
    font-style: var(--asa-title-style, normal);
    letter-spacing: var(--asa-title-spacing, 1px);
    text-transform: var(--asa-title-transform, uppercase);
    line-height: 1;
    white-space: nowrap;
    transform-origin: center;
}

.asa-title-up .asa-timeline-tab__text {
    transform: translate(-50%, -50%) rotate(-90deg);
}

.asa-title-down .asa-timeline-tab__text {
    transform: translate(-50%, -50%) rotate(90deg);
}

.asa-title-horizontal .asa-timeline-tab__text {
    transform: translate(-50%, -50%);
}

/* ==========================================================
   UNIFORM DETAIL PANEL
   This is the new general detail width control.
   ========================================================== */

.asa-timeline-body {
    position: relative;
    flex: 0 0 var(--asa-tl-detail-width, 560px);
    width: var(--asa-tl-detail-width, 560px);
    min-width: var(--asa-tl-detail-width, 560px);
    height: 100%;
    display: flex;
    padding: 52px 54px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    border-radius: 0 38px 38px 0;
    overflow: hidden;
    box-sizing: border-box;
    transition: opacity .35s ease .12s, visibility .35s ease;
}

.asa-timeline-item.is-active .asa-timeline-body {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.asa-timeline-body__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: var(--asa-tl-overlay, transparent);
    pointer-events: none;
}

.asa-timeline-body__content {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: var(--asa-body-max, 680px);
    color: var(--asa-body-color, #242424);
    font-size: var(--asa-body-size, 22px);
    font-weight: var(--asa-body-weight, 400);
    line-height: 1.65;
}

.asa-timeline-body__content p {
    margin: 0 0 18px;
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.asa-timeline-body__content p:last-child {
    margin-bottom: 0;
}

.asa-timeline-body__content h2,
.asa-timeline-body__content h3,
.asa-timeline-body__content h4,
.asa-timeline-body__content h5 {
    margin: 22px 0 10px;
    color: inherit;
    line-height: 1.3;
}

.asa-timeline-body__content ul,
.asa-timeline-body__content ol {
    margin: 16px 0 18px 1.3em;
    padding-left: 1em;
}

.asa-timeline-body__content li {
    margin-bottom: 7px;
}

.asa-timeline-body__content a {
    color: inherit;
    text-decoration: underline;
}

/* ==========================================================
   NINE BODY CONTENT POSITIONS
   ========================================================== */

.asa-pos-left-top { align-items: flex-start; justify-content: flex-start; }
.asa-pos-left-mid { align-items: center; justify-content: flex-start; }
.asa-pos-left-bottom { align-items: flex-end; justify-content: flex-start; }
.asa-pos-center-top { align-items: flex-start; justify-content: center; }
.asa-pos-center-mid { align-items: center; justify-content: center; }
.asa-pos-center-bottom { align-items: flex-end; justify-content: center; }
.asa-pos-right-top { align-items: flex-start; justify-content: flex-end; }
.asa-pos-right-mid { align-items: center; justify-content: flex-end; }
.asa-pos-right-bottom { align-items: flex-end; justify-content: flex-end; }

.asa-pos-center-top .asa-timeline-body__content,
.asa-pos-center-mid .asa-timeline-body__content,
.asa-pos-center-bottom .asa-timeline-body__content {
    text-align: center;
}

.asa-pos-right-top .asa-timeline-body__content,
.asa-pos-right-mid .asa-timeline-body__content,
.asa-pos-right-bottom .asa-timeline-body__content {
    text-align: right;
}

/* ==========================================================
   HOVER
   ========================================================== */

@media (hover: hover) {
    .asa-timeline-tab {
        transition: filter .25s ease;
    }

    .asa-timeline-tab:hover {
        filter: brightness(1.05);
    }

    .asa-history-timeline__nav:hover {
        background: #F68D2E !important;
        color: #ffffff !important;
    }
}

/* ==========================================================
   TIMELINE TABLET
   Horizontal timeline remains active.
   ========================================================== */

@media (max-width: 1024px) {
    .asa-history-timeline {
        padding: 85px 0 95px;
    }

    .asa-history-timeline__container {
        width: 92%;
    }

    .asa-history-timeline__track {
        height: var(--asa-tl-tablet-height, 500px);
        gap: 9px;
    }

    .asa-timeline-item,
    .asa-timeline-tab {
        border-radius: 30px;
    }

    .asa-timeline-item.is-active .asa-timeline-tab {
        border-radius: 30px 0 0 30px;
    }

    .asa-timeline-body {
        padding: 42px 38px;
        border-radius: 0 30px 30px 0;
    }

    .asa-timeline-body__content {
        font-size: min(var(--asa-body-size, 22px), 19px);
    }

    .asa-history-timeline__prev {
        left: -14px !important;
    }

    .asa-history-timeline__next {
        right: -14px !important;
    }
}

/* ==========================================================
   TIMELINE MOBILE
   Converts into a vertical accordion.
   Horizontal navigation is intentionally disabled here.
   ========================================================== */

@media (max-width: 767px) {
    .asa-history-timeline {
        padding: 70px 0 80px;
    }

    .asa-history-timeline__container {
        width: 90%;
    }

    .asa-history-timeline__header {
        margin-bottom: 34px;
    }

    .asa-history-timeline__nav {
        display: none !important;
    }

    .asa-history-timeline__scroller {
        overflow: visible;
        padding: 0;
        touch-action: auto;
    }

    .asa-history-timeline__track,
    .asa-timeline-item,
    .asa-timeline-tab,
    .asa-timeline-body,
    .asa-timeline-body__content {
        touch-action: auto;
    }

    .asa-history-timeline__track {
        width: 100%;
        min-width: 0;
        height: auto;
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    .asa-timeline-item,
    .asa-timeline-item.is-active {
        display: flex;
        flex-direction: column;
        flex: none;
        width: 100%;
        min-width: 0;
        height: auto;
        border-radius: 22px;
        overflow: hidden;
    }

    .asa-timeline-tab,
    .asa-timeline-item.is-active .asa-timeline-tab {
        flex: none;
        width: 100%;
        min-width: 100%;
        height: 76px;
        border-radius: 22px;
        padding: 0 24px;
    }

    .asa-timeline-item.is-active .asa-timeline-tab {
        border-radius: 0;
    }

    .asa-timeline-tab__text,
    .asa-title-up .asa-timeline-tab__text,
    .asa-title-down .asa-timeline-tab__text,
    .asa-title-horizontal .asa-timeline-tab__text {
        top: 50%;
        left: 24px;
        transform: translateY(-50%);
        font-size: min(var(--asa-title-size, 30px), 23px);
        text-align: left;
    }

    .asa-timeline-body {
        flex: none;
        width: 100%;
        min-width: 0;
        height: auto;
        max-height: 0;
        padding: 0 26px;
        opacity: 0;
        visibility: hidden;
        border-radius: 0 0 22px 22px;
        transition: max-height .45s ease, padding .45s ease, opacity .3s ease, visibility .3s ease;
    }

    .asa-timeline-item.is-active .asa-timeline-body {
        max-height: 900px;
        min-height: 260px;
        padding: 34px 26px;
        opacity: 1;
        visibility: visible;
    }

    .asa-timeline-body__content {
        max-width: 100%;
        font-size: min(var(--asa-body-size, 22px), 17px);
        line-height: 1.7;
    }
}

/* ==========================================================
   REDUCED MOTION
   ========================================================== */

@media (prefers-reduced-motion: reduce) {
    .asa-history-intro__image-wrap img,
    .asa-timeline-item,
    .asa-timeline-body,
    .asa-timeline-tab,
    .asa-history-timeline__nav {
        transition: none !important;
    }

    .asa-history-timeline__scroller {
        scroll-behavior: auto;
    }
}


/* ============================================================
   ASA PRIMARY PRODUCTS
   VERSION 2.6
   ============================================================ */


/* ============================================================
   SECTION
   ============================================================ */

.asa-pp26-section {
    position:
        relative;

    width:
        100vw;

    max-width:
        100vw;

    margin-left:
        calc(
            50%
            -
            50vw
        );

    margin-right:
        calc(
            50%
            -
            50vw
        );

    padding:
        105px
        0
        115px;

    background:
        var(
            --asa-pp26-section-bg,
            #FFFFFF
        );

    overflow:
        hidden;

    box-sizing:
        border-box;
}


/* ============================================================
   HEADER
   ============================================================ */

.asa-pp26-header-container {
    width:
        min(
            90%,
            1520px
        );

    margin:
        0
        auto
        34px;
}


.asa-pp26-header
.asa-section-title h2 {
    color:
        var(
            --asa-pp26-header-title,
            #242424
        ) !important;

    font-weight:
        var(
            --asa-pp26-header-title-weight,
            700
        ) !important;
}


.asa-pp26-header
.asa-section-title h2 em {
    color:
        var(
            --asa-pp26-header-highlight,
            #F68D2E
        ) !important;

    font-weight:
        var(
            --asa-pp26-header-highlight-weight,
            400
        ) !important;
}


.asa-pp26-header
.asa-section-intro,

.asa-pp26-header
.asa-section-intro p {
    color:
        var(
            --asa-pp26-header-intro,
            #777777
        ) !important;

    font-weight:
        var(
            --asa-pp26-header-intro-weight,
            400
        ) !important;
}


/* ============================================================
   CAROUSEL SHELL

   The shell remains centered in the page.
   ============================================================ */

.asa-pp26-carousel-shell {
    position:
        relative;

    width:
        min(
            94%,
            1680px
        );

    margin:
        0
        auto;
}


/* ============================================================
   CENTERED PRODUCT SET

   JavaScript calculates this width using:
   visible product count + card width + gaps.
   ============================================================ */

.asa-pp26-carousel-stage {
    position:
        relative;

    width:
        100%;

    max-width:
        100%;

    margin:
        0
        auto;

    box-sizing:
        border-box;
}


/* ============================================================
   VIEWPORT

   No swipe.
   No native horizontal scroll.
   Products move only through nav buttons.
   ============================================================ */

.asa-pp26-viewport {
    position:
        relative;

    width:
        100%;

    overflow:
        hidden;

    padding:
        58px
        0
        70px;

    box-sizing:
        border-box;
}


/* ============================================================
   TRACK
   ============================================================ */

.asa-pp26-track {
    display:
        flex;

    flex-wrap:
        nowrap;

    align-items:
        stretch;

    gap:
        var(
            --asa-pp26-gap,
            26px
        );

    width:
        max-content;

    box-sizing:
        border-box;

    transform:
        translate3d(
            0,
            0,
            0
        );

    transition:
        transform
        .42s
        cubic-bezier(
            .22,
            .7,
            .2,
            1
        );

    will-change:
        transform;
}


/* Resize or setup should never slide visibly */

.asa-pp26-track.asa-pp26-no-transition {
    transition:
        none !important;
}


/* ============================================================
   CARD
   ============================================================ */

.asa-pp26-card {
    position:
        relative;

    flex:
        0
        0
        320px;

    width:
        320px;

    min-width:
        0;

    min-height:
        var(
            --asa-pp26-card-min-height,
            550px
        );

    display:
        flex;

    flex-direction:
        column;

    overflow:
        hidden;

    border-radius:
        var(
            --asa-pp26-radius,
            28px
        );

    background:
        var(
            --asa-pp26-card-bg,
            #FFFFFF
        );

    opacity:
        .80;

    transform:
        scale(
            .97
        );

    box-shadow:
        0
        12px
        34px
        rgba(
            24,
            30,
            40,
            .10
        );

    transition:
        background-color
        .3s
        ease,

        opacity
        .3s
        ease,

        transform
        .3s
        ease,

        box-shadow
        .3s
        ease;

    box-sizing:
        border-box;

    outline:
        none;
}


/* ============================================================
   FOCUSED CARD

   Focus changes appearance only.
   It never changes carousel position.
   ============================================================ */

.asa-pp26-card.is-active,

.asa-pp26-card:focus-visible {
    background:
        var(
            --asa-pp26-card-focus-bg,
            #F68D2E
        );

    opacity:
        1;

    transform:
        scale(
            var(
                --asa-pp26-focus-scale,
                1.06
            )
        );

    box-shadow:
        0
        24px
        58px
        rgba(
            24,
            30,
            40,
            .18
        );

    z-index:
        3;
}


/* ============================================================
   IMAGE
   ============================================================ */

.asa-pp26-card__image {
    position:
        relative;

    flex:
        0
        0
        var(
            --asa-pp26-image-height,
            230px
        );

    width:
        100%;

    height:
        var(
            --asa-pp26-image-height,
            230px
        );

    margin:
        0;

    padding:
        0;

    overflow:
        hidden;

    background:
        transparent;
}


.asa-pp26-card__image img {
    display:
        block !important;

    width:
        100% !important;

    height:
        100% !important;

    max-width:
        none !important;

    margin:
        0 !important;

    padding:
        0 !important;

    object-fit:
        cover;

    object-position:
        center
        center;

    transform:
        scale(
            var(
                --asa-pp26-image-scale,
                1
            )
        );

    transform-origin:
        center
        center;
}


/* ============================================================
   PRODUCT TITLE BOX
   ============================================================ */

.asa-pp26-card__title-box {
    flex:
        0
        0
        auto;

    width:
        100%;

    margin:
        0;

    padding:
        var(
            --asa-pp26-title-box-pad-top,
            18px
        )
        24px
        var(
            --asa-pp26-title-box-pad-bottom,
            18px
        );

    background:
        var(
            --asa-pp26-title-box-bg,
            #F3F3F3
        );

    box-sizing:
        border-box;

    transition:
        background-color
        .3s
        ease;
}


.asa-pp26-card.is-active
.asa-pp26-card__title-box,

.asa-pp26-card:focus-visible
.asa-pp26-card__title-box {
    background:
        var(
            --asa-pp26-title-box-focus-bg,
            #D97824
        );
}


/* ============================================================
   PRODUCT TITLE
   ============================================================ */

.asa-pp26-card__title {
    margin:
        0 !important;

    padding:
        0 !important;

    color:
        var(
            --asa-pp26-title-color,
            #292941
        ) !important;

    font-size:
        var(
            --asa-pp26-title-size,
            25px
        ) !important;

    font-weight:
        var(
            --asa-pp26-title-weight,
            800
        ) !important;

    line-height:
        1.16 !important;

    text-align:
        center !important;

    transition:
        color
        .3s
        ease;
}


.asa-pp26-card.is-active
.asa-pp26-card__title,

.asa-pp26-card:focus-visible
.asa-pp26-card__title {
    color:
        var(
            --asa-pp26-title-focus-color,
            #FFFFFF
        ) !important;
}


/* ============================================================
   PRODUCT CONTENT
   ============================================================ */

.asa-pp26-card__content {
    flex:
        1
        1
        auto;

    display:
        flex;

    flex-direction:
        column;

    width:
        100%;

    padding:
        24px
        30px
        34px;

    box-sizing:
        border-box;
}


/* ============================================================
   DESCRIPTION
   ============================================================ */

.asa-pp26-card__description {
    width:
        100%;

    max-width:
        94%;

    margin:
        0
        auto !important;

    padding:
        0 !important;

    color:
        var(
            --asa-pp26-description-color,
            #777777
        ) !important;

    font-size:
        var(
            --asa-pp26-desc-size,
            16px
        ) !important;

    font-weight:
        var(
            --asa-pp26-desc-weight,
            400
        ) !important;

    line-height:
        1.55 !important;

    text-align:
        center !important;

    transition:
        color
        .3s
        ease;
}


.asa-pp26-card.is-active
.asa-pp26-card__description,

.asa-pp26-card:focus-visible
.asa-pp26-card__description {
    color:
        var(
            --asa-pp26-description-focus-color,
            #FFFFFF
        ) !important;
}


/* ============================================================
   PRODUCT FEATURES
   ============================================================ */

.asa-pp26-features {
    margin-top:
        24px;

    color:
        var(
            --asa-pp26-features-color,
            #777777
        );

    font-size:
        var(
            --asa-pp26-feature-size,
            15px
        );

    font-weight:
        var(
            --asa-pp26-feature-weight,
            400
        );

    line-height:
        1.6;

    text-align:
        left;

    transition:
        color
        .3s
        ease;
}


.asa-pp26-card.is-active
.asa-pp26-features,

.asa-pp26-card:focus-visible
.asa-pp26-features {
    color:
        var(
            --asa-pp26-features-focus-color,
            #FFFFFF
        );
}


/* ============================================================
   FEATURE CONTENT
   ============================================================ */

.asa-pp26-features p,

.asa-pp26-features li,

.asa-pp26-features blockquote {
    color:
        inherit !important;

    font-size:
        inherit !important;

    font-weight:
        inherit;

    line-height:
        inherit !important;
}


.asa-pp26-features p {
    margin:
        0
        0
        14px !important;
}


.asa-pp26-features li {
    margin-bottom:
        8px !important;
}


/* ============================================================
   DEFAULT UNORDERED LIST = CHECK
   ============================================================ */

.asa-pp26-features
ul:not([class*="asa-pp26-lst-"]) {
    list-style:
        none !important;

    margin:
        0
        0
        18px
        0 !important;

    padding:
        0 !important;
}


.asa-pp26-features
ul:not([class*="asa-pp26-lst-"])
> li {
    position:
        relative;

    padding-left:
        1.65em !important;
}


.asa-pp26-features
ul:not([class*="asa-pp26-lst-"])
> li::before {
    content:
        "✓";

    position:
        absolute;

    left:
        0;

    top:
        0;

    color:
        var(
            --asa-pp26-accent-color,
            #F68D2E
        );

    font-weight:
        800;

    line-height:
        inherit;
}


.asa-pp26-card.is-active
.asa-pp26-features
ul:not([class*="asa-pp26-lst-"])
> li::before,

.asa-pp26-card:focus-visible
.asa-pp26-features
ul:not([class*="asa-pp26-lst-"])
> li::before {
    color:
        var(
            --asa-pp26-accent-focus-color,
            #FFFFFF
        );
}


/* ============================================================
   EXPLICIT LIST STYLES
   ============================================================ */

.asa-pp26-features
ul[class*="asa-pp26-lst-"],

.asa-pp26-features
ol[class*="asa-pp26-lst-"] {
    margin:
        0
        0
        18px
        1.15em !important;

    padding-left:
        1.15em !important;
}


.asa-pp26-features
ul[class*="asa-pp26-lst-"]
> li,

.asa-pp26-features
ol[class*="asa-pp26-lst-"]
> li {
    position:
        static;

    padding-left:
        0 !important;
}


.asa-pp26-features
ul[class*="asa-pp26-lst-"]
> li::before,

.asa-pp26-features
ol[class*="asa-pp26-lst-"]
> li::before {
    content:
        none !important;

    display:
        none !important;
}


/* DISC */

.asa-pp26-features
.asa-pp26-lst-disc {
    list-style-type:
        disc !important;
}


/* CIRCLE */

.asa-pp26-features
.asa-pp26-lst-circle {
    list-style-type:
        circle !important;
}


/* SQUARE */

.asa-pp26-features
.asa-pp26-lst-square {
    list-style-type:
        square !important;
}


/* NONE */

.asa-pp26-features
.asa-pp26-lst-none {
    list-style-type:
        none !important;

    margin-left:
        0 !important;

    padding-left:
        0 !important;
}


/* DECIMAL */

.asa-pp26-features
.asa-pp26-lst-decimal {
    list-style-type:
        decimal !important;
}


/* DECIMAL LEADING ZERO */

.asa-pp26-features
.asa-pp26-lst-decimal-leading-zero {
    list-style-type:
        decimal-leading-zero !important;
}


/* LOWER ALPHA */

.asa-pp26-features
.asa-pp26-lst-lower-alpha {
    list-style-type:
        lower-alpha !important;
}


/* UPPER ALPHA */

.asa-pp26-features
.asa-pp26-lst-upper-alpha {
    list-style-type:
        upper-alpha !important;
}


/* LOWER LATIN */

.asa-pp26-features
.asa-pp26-lst-lower-latin {
    list-style-type:
        lower-latin !important;
}


/* UPPER LATIN */

.asa-pp26-features
.asa-pp26-lst-upper-latin {
    list-style-type:
        upper-latin !important;
}


/* LOWER ROMAN */

.asa-pp26-features
.asa-pp26-lst-lower-roman {
    list-style-type:
        lower-roman !important;
}


/* UPPER ROMAN */

.asa-pp26-features
.asa-pp26-lst-upper-roman {
    list-style-type:
        upper-roman !important;
}


/* LOWER GREEK */

.asa-pp26-features
.asa-pp26-lst-lower-greek {
    list-style-type:
        lower-greek !important;
}


/* ARMENIAN */

.asa-pp26-features
.asa-pp26-lst-armenian {
    list-style-type:
        armenian !important;
}


/* GEORGIAN */

.asa-pp26-features
.asa-pp26-lst-georgian {
    list-style-type:
        georgian !important;
}


/* ============================================================
   DEFAULT ORDERED LIST
   ============================================================ */

.asa-pp26-features
ol:not([class*="asa-pp26-lst-"]) {
    list-style-type:
        decimal !important;

    list-style-position:
        outside;

    margin:
        0
        0
        18px
        1.15em !important;

    padding-left:
        1.15em !important;
}


/* ============================================================
   LIST MARKER COLORS
   ============================================================ */

.asa-pp26-features
ul[class*="asa-pp26-lst-"]
li::marker,

.asa-pp26-features
ol
li::marker {
    color:
        var(
            --asa-pp26-accent-color,
            #F68D2E
        );
}


.asa-pp26-card.is-active
.asa-pp26-features
ul[class*="asa-pp26-lst-"]
li::marker,

.asa-pp26-card.is-active
.asa-pp26-features
ol
li::marker,

.asa-pp26-card:focus-visible
.asa-pp26-features
ul[class*="asa-pp26-lst-"]
li::marker,

.asa-pp26-card:focus-visible
.asa-pp26-features
ol
li::marker {
    color:
        var(
            --asa-pp26-accent-focus-color,
            #FFFFFF
        );
}


/* ============================================================
   NESTED LISTS
   ============================================================ */

.asa-pp26-features
li > ul,

.asa-pp26-features
li > ol {
    margin-top:
        8px !important;

    margin-bottom:
        8px !important;
}


/* ============================================================
   FEATURE HEADINGS
   ============================================================ */

.asa-pp26-features h2,

.asa-pp26-features h3,

.asa-pp26-features h4,

.asa-pp26-features h5 {
    margin:
        18px
        0
        9px !important;

    color:
        var(
            --asa-pp26-title-color,
            #292941
        ) !important;

    line-height:
        1.25 !important;
}


.asa-pp26-card.is-active
.asa-pp26-features h2,

.asa-pp26-card.is-active
.asa-pp26-features h3,

.asa-pp26-card.is-active
.asa-pp26-features h4,

.asa-pp26-card.is-active
.asa-pp26-features h5,

.asa-pp26-card:focus-visible
.asa-pp26-features h2,

.asa-pp26-card:focus-visible
.asa-pp26-features h3,

.asa-pp26-card:focus-visible
.asa-pp26-features h4,

.asa-pp26-card:focus-visible
.asa-pp26-features h5 {
    color:
        var(
            --asa-pp26-title-focus-color,
            #FFFFFF
        ) !important;
}


/* ============================================================
   FEATURE LINKS
   ============================================================ */

.asa-pp26-features a {
    color:
        var(
            --asa-pp26-accent-color,
            #F68D2E
        ) !important;

    text-decoration:
        underline;
}


.asa-pp26-card.is-active
.asa-pp26-features a,

.asa-pp26-card:focus-visible
.asa-pp26-features a {
    color:
        var(
            --asa-pp26-accent-focus-color,
            #FFFFFF
        ) !important;
}


/* ============================================================
   BLOCKQUOTE
   ============================================================ */

.asa-pp26-features blockquote {
    margin:
        18px
        0 !important;

    padding:
        12px
        16px !important;

    border-left:
        3px
        solid
        var(
            --asa-pp26-accent-color,
            #F68D2E
        );
}


.asa-pp26-card.is-active
.asa-pp26-features blockquote,

.asa-pp26-card:focus-visible
.asa-pp26-features blockquote {
    border-left-color:
        var(
            --asa-pp26-accent-focus-color,
            #FFFFFF
        );
}


/* ============================================================
   PRODUCT BUTTON
   ============================================================ */

.asa-pp26-card__button-wrap {
    margin-top:
        auto;

    padding-top:
        26px;

    display:
        flex;

    justify-content:
        center;
}


.asa-pp26-card__button {
    display:
        inline-flex !important;

    align-items:
        center;

    justify-content:
        center;

    padding:
        var(
            --asa-pp26-button-pad-y,
            13px
        )
        var(
            --asa-pp26-button-pad-x,
            24px
        ) !important;

    border:
        0 !important;

    border-radius:
        var(
            --asa-pp26-button-radius,
            999px
        ) !important;

    background:
        var(
            --asa-pp26-button-bg,
            #F68D2E
        ) !important;

    color:
        var(
            --asa-pp26-button-text,
            #FFFFFF
        ) !important;

    font-size:
        var(
            --asa-pp26-button-size,
            15px
        ) !important;

    font-weight:
        700 !important;

    line-height:
        1.15 !important;

    text-align:
        center;

    text-decoration:
        none !important;

    cursor:
        pointer;

    transition:
        background-color
        .25s
        ease,

        color
        .25s
        ease,

        opacity
        .25s
        ease;
}


.asa-pp26-card.is-active
.asa-pp26-card__button,

.asa-pp26-card:focus-visible
.asa-pp26-card__button {
    background:
        var(
            --asa-pp26-button-focus-bg,
            #FFFFFF
        ) !important;

    color:
        var(
            --asa-pp26-button-focus-text,
            #F68D2E
        ) !important;
}


.asa-pp26-card__button:hover {
    opacity:
        .85;
}


/* ============================================================
   NAVIGATION
   ============================================================ */

.asa-pp26-nav {
    position:
        absolute !important;

    top:
        50% !important;

    z-index:
        10 !important;

    width:
        50px !important;

    height:
        50px !important;

    min-width:
        50px !important;

    padding:
        0 !important;

    margin:
        0 !important;

    display:
        flex !important;

    align-items:
        center !important;

    justify-content:
        center !important;

    transform:
        translateY(
            -50%
        ) !important;

    border:
        0 !important;

    border-radius:
        50% !important;

    background:
        #FFFFFF !important;

    color:
        #F68D2E !important;

    font-size:
        34px !important;

    font-weight:
        400 !important;

    line-height:
        1 !important;

    box-shadow:
        0
        8px
        24px
        rgba(
            0,
            0,
            0,
            .14
        ) !important;

    cursor:
        pointer !important;
}


.asa-pp26-nav[hidden] {
    display:
        none !important;
}


.asa-pp26-prev {
    left:
        10px !important;
}


.asa-pp26-next {
    right:
        10px !important;
}


/* ============================================================
   TABLET
   ============================================================ */

@media(max-width:1024px) {

    .asa-pp26-section {
        padding:
            88px
            0
            96px;
    }


    .asa-pp26-header-container {
        width:
            92%;
    }


    .asa-pp26-carousel-shell {
        width:
            96%;
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:767px) {

    .asa-pp26-section {
        padding:
            70px
            0
            78px;
    }


    .asa-pp26-header-container {
        width:
            90%;

        margin-bottom:
            20px;
    }


    .asa-pp26-carousel-shell {
        width:
            100%;
    }


    .asa-pp26-viewport {
        padding:
            34px
            0
            48px;
    }


    .asa-pp26-card {
        transform:
            scale(
                .98
            );
    }


    .asa-pp26-card.is-active,

    .asa-pp26-card:focus-visible {
        transform:
            scale(
                min(
                    var(
                        --asa-pp26-focus-scale,
                        1.06
                    ),
                    1.04
                )
            );
    }


    .asa-pp26-card__title-box {
        padding-left:
            20px;

        padding-right:
            20px;
    }


    .asa-pp26-card__content {
        padding:
            22px
            24px
            30px;
    }


    .asa-pp26-nav {
        width:
            42px !important;

        height:
            42px !important;

        min-width:
            42px !important;

        font-size:
            29px !important;
    }


    .asa-pp26-prev {
        left:
            5px !important;
    }


    .asa-pp26-next {
        right:
            5px !important;
    }

}


/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media(
    prefers-reduced-motion:
    reduce
) {

    .asa-pp26-track,

    .asa-pp26-card,

    .asa-pp26-card__title-box,

    .asa-pp26-card__title,

    .asa-pp26-card__description,

    .asa-pp26-features,

    .asa-pp26-card__button {
        transition:
            none !important;
    }

}

/* ============================================================
   ASA BOARD OF TRUSTEES
   VERSION 1.6
   ============================================================ */


/* ============================================================
   MODAL BODY LOCK
   ============================================================ */

html.asa-bot1-modal-open,
html.asa-bot1-modal-open body {
    overflow: hidden;
}


/* ============================================================
   SECTION
   ============================================================ */

.asa-bot1-section {
    position: relative;

    width: 100vw;
    max-width: 100vw;

    margin-left:
        calc(50% - 50vw);

    margin-right:
        calc(50% - 50vw);

    padding:
        105px
        0
        115px;

    background:
        var(
            --asa-bot1-section-bg,
            #F7F6F3
        );

    overflow: hidden;

    box-sizing: border-box;
}


/* ============================================================
   HEADER
   ============================================================ */

.asa-bot1-header-container {
    width:
        min(
            90%,
            var(
                --asa-bot1-max-width,
                1400px
            )
        );

    margin:
        0
        auto
        46px;
}


.asa-bot1-header
.asa-section-title h2 {
    color:
        var(
            --asa-bot1-header-title,
            #242424
        ) !important;

    font-weight:
        var(
            --asa-bot1-header-title-weight,
            700
        ) !important;
}


.asa-bot1-header
.asa-section-title h2 em {
    color:
        var(
            --asa-bot1-header-highlight,
            #F68D2E
        ) !important;

    font-weight:
        var(
            --asa-bot1-header-highlight-weight,
            400
        ) !important;
}


.asa-bot1-header
.asa-section-intro,

.asa-bot1-header
.asa-section-intro p {
    color:
        var(
            --asa-bot1-header-intro,
            #777777
        ) !important;

    font-weight:
        var(
            --asa-bot1-header-intro-weight,
            400
        ) !important;
}


/* ============================================================
   BOARD SHELL
   ============================================================ */

.asa-bot1-board-shell {
    position: relative;

    width:
        min(
            94%,
            var(
                --asa-bot1-max-width,
                1400px
            )
        );

    margin:
        0
        auto;

    padding-top:
        calc(
            var(
                --asa-bot1-active-extension,
                135px
            )
            +
            20px
        );

    overflow:
        visible;
}


/* ============================================================
   RESPONSIVE CAROUSEL FRAME
   Desktop keeps the approved static board.
   ============================================================ */

.asa-bot1-board-viewport {
    position: relative;

    width: 100%;

    overflow: visible;
}


.asa-bot1-nav {
    position: absolute;

    z-index: 30;

    display: none;

    align-items: center;

    justify-content: center;

    width: 50px;

    height: 50px;

    min-width: 50px;

    margin: 0 !important;

    padding: 0 !important;

    border: 0 !important;

    border-radius: 50% !important;

    background: #FFFFFF !important;

    color:
        var(
            --asa-bot1-nav-color,
            #F68D2E
        ) !important;

    font-size: 34px !important;

    font-weight: 400 !important;

    line-height: 1 !important;

    box-shadow:
        0
        8px
        24px
        rgba(
            0,
            0,
            0,
            .14
        ) !important;

    cursor: pointer;
}


.asa-bot1-nav[hidden] {
    display: none !important;
}


.asa-bot1-indicators {
    display: none;

    align-items: center;

    justify-content: center;

    gap: 9px;
}


.asa-bot1-indicator {
    width: 10px;

    height: 10px;

    min-width: 10px;

    margin: 0 !important;

    padding: 0 !important;

    border:
        1.5px
        solid
        var(
            --asa-bot1-nav-color,
            #F68D2E
        ) !important;

    border-radius: 50% !important;

    background: transparent !important;

    cursor: pointer;

    transition:
        transform
        .2s
        ease,

        background-color
        .2s
        ease;
}


.asa-bot1-indicator.is-active {
    background:
        var(
            --asa-bot1-nav-color,
            #F68D2E
        ) !important;

    transform:
        scale(
            1.12
        );
}


/* ============================================================
   EDITABLE HORIZONTAL BOARD LINE
   ============================================================ */

.asa-bot1-board-shell::before {
    content: "";

    position: absolute;

    left: 0;
    right: 0;

    top:
        calc(
            var(
                --asa-bot1-active-extension,
                135px
            )
            +
            20px
            +
            (
                var(
                    --asa-bot1-desktop-height,
                    620px
                )
                *
                .49
            )
        );

    height:
        var(
            --asa-bot1-line-height,
            16px
        );

    background:
        var(
            --asa-bot1-line-color,
            #8B0000
        );

    z-index: 0;
}


/* ============================================================
   BOARD
   ============================================================ */

.asa-bot1-board {
    position: relative;

    z-index: 1;

    display: flex;

    align-items: flex-end;

    gap:
        var(
            --asa-bot1-gap,
            6px
        );

    width: 100%;
}


/* ============================================================
   CARD
   ============================================================ */

.asa-bot1-card {
    position: relative;

    flex:
        1
        1
        0;

    min-width: 0;

    height:
        var(
            --asa-bot1-desktop-height,
            620px
        );

    margin:
        0 !important;

    padding:
        0 !important;

    overflow:
        visible;

    cursor:
        pointer;

    opacity:
        var(
            --asa-bot1-inactive-opacity,
            1
        );

    outline:
        none;

    /*
     * IMPORTANT:
     *
     * No transform.
     * No scale.
     * No width expansion.
     */
}


/* ============================================================
   ACCENT RECTANGLE
   ============================================================ */

.asa-bot1-accent {
    position: absolute;

    left: 0;
    bottom: 0;

    width: 100%;

    height: 0;

    z-index: 1;

    background:
        var(
            --trustee-accent,
            #F68D2E
        );

    /*
     * When mouse leaves,
     * retract immediately.
     */

    transition-property:
        height;

    transition-duration:
        var(
            --asa-bot1-duration,
            450ms
        );

    transition-timing-function:
        cubic-bezier(
            .2,
            .75,
            .2,
            1
        );

    transition-delay:
        0ms;
}


/* ============================================================
   ACTIVE ACCENT

   PHOTO FADE MUST FINISH FIRST.
   ============================================================ */

.asa-bot1-card:hover
.asa-bot1-accent,

.asa-bot1-card:focus
.asa-bot1-accent,

.asa-bot1-card.is-active
.asa-bot1-accent {

    height:
        calc(
            100%
            +
            var(
                --asa-bot1-active-extension,
                135px
            )
        );

    /*
     * Delay rectangle growth by exactly
     * one complete photo-fade duration.
     */

    transition-delay:
        var(
            --asa-bot1-duration,
            450ms
        );
}


/* ============================================================
   PHOTO FRAME
   ============================================================ */

.asa-bot1-card__media {
    position: absolute;

    inset: 0;

    z-index: 2;

    overflow: hidden;

    pointer-events: none;
}


/* ============================================================
   PHOTOS

   ONLY OPACITY CHANGES.
   NO SCALE / NO ZOOM.
   ============================================================ */

.asa-bot1-img {
    position: absolute;

    inset: 0;

    display:
        block !important;

    width:
        100% !important;

    height:
        100% !important;

    max-width:
        none !important;

    margin:
        0 !important;

    padding:
        0 !important;

    object-fit:
        cover;

    object-position:
        center top;

    transition:
        opacity
        var(
            --asa-bot1-duration,
            0ms
        )
        ease;

    transition-delay:
        0ms;
}


/* ============================================================
   B&W
   ============================================================ */

.asa-bot1-img--bw {
    z-index: 2;

    opacity: 1;

    filter:
        grayscale(1);
}


/* ============================================================
   COLOR
   ============================================================ */

.asa-bot1-img--color {
    z-index: 3;

    opacity: 0;

    filter: none;
}


/* ============================================================
   PHOTO CROSSFADE
   ============================================================ */

.asa-bot1-card:hover
.asa-bot1-img--bw,

.asa-bot1-card:focus
.asa-bot1-img--bw,

.asa-bot1-card.is-active
.asa-bot1-img--bw {
    opacity: 0;
}


.asa-bot1-card:hover
.asa-bot1-img--color,

.asa-bot1-card:focus
.asa-bot1-img--color,

.asa-bot1-card.is-active
.asa-bot1-img--color {
    opacity: 1;
}


/* ============================================================
   CONTENT LAYER
   ============================================================ */

.asa-bot1-card__content {
    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    top:
        calc(
            -1
            *
            var(
                --asa-bot1-active-extension,
                135px
            )
        );

    z-index: 4;

    display: flex;

    flex-direction: column;

    justify-content: space-between;

    padding:
        28px
        22px
        26px;

    pointer-events: none;

    box-sizing:
        border-box;
}


/* ============================================================
   NAME + POSITION
   ============================================================ */

.asa-bot1-card__meta {
    opacity: 0;

    transform:
        translateX(-24px);

    transition:
        opacity
        .28s
        ease,

        transform
        .32s
        ease;

    /*
     * Sequence:
     *
     * photo fade completes
     * rectangle starts
     * wait another 280ms
     * then reveal text.
     */

    transition-delay:
        calc(
            var(
                --asa-bot1-duration,
                450ms
            )
            +
            280ms
        );
}


.asa-bot1-card__meta h3 {
    margin:
        0
        0
        6px !important;

    color:
        var(
            --trustee-name-color,
            #FFFFFF
        ) !important;

    font-size:
        var(
            --asa-bot1-gallery-name-size-desktop,
            26px
        ) !important;

    font-weight:
        800 !important;

    line-height:
        1.08 !important;

    text-transform:
        uppercase;
}


.asa-bot1-card__meta p {
    margin:
        0 !important;

    color:
        var(
            --trustee-position-color,
            #FFFFFF
        ) !important;

    font-size:
        var(
            --asa-bot1-gallery-position-size-desktop,
            21px
        ) !important;

    font-style:
        italic;

    line-height:
        1.15 !important;
}


/* ============================================================
   BIO BUTTON
   ============================================================ */

.asa-bot1-bio-btn {
    align-self:
        start;

    pointer-events:
        auto;

    margin:
        0 !important;

    border:
        0 !important;

    border-radius:
        999px !important;

    padding:
        13px
        23px !important;

    background:
        var(
            --trustee-button-bg,
            #F68D2E
        ) !important;

    color:
        var(
            --trustee-button-text,
            #FFFFFF
        ) !important;

    font-size:
        14px !important;

    font-weight:
        800 !important;

    line-height:
        1 !important;

    text-transform:
        uppercase;

    cursor:
        pointer;

    opacity:
        0;

    transform:
        translateY(
            12px
        );

    box-shadow:
        0
        8px
        20px
        rgba(
            0,
            0,
            0,
            .15
        );

    transition:
        opacity
        .28s
        ease,

        transform
        .28s
        ease;

    /*
     * Button is the final staged item.
     */

    transition-delay:
        calc(
            var(
                --asa-bot1-duration,
                450ms
            )
            +
            360ms
        );
}


/* ============================================================
   ACTIVE META
   ============================================================ */

.asa-bot1-card:hover
.asa-bot1-card__meta,

.asa-bot1-card:focus
.asa-bot1-card__meta,

.asa-bot1-card.is-active
.asa-bot1-card__meta {

    opacity:
        1;

    transform:
        translateX(
            0
        );
}


/* ============================================================
   ACTIVE BUTTON
   ============================================================ */

.asa-bot1-card:hover
.asa-bot1-bio-btn,

.asa-bot1-card:focus
.asa-bot1-bio-btn,

.asa-bot1-card.is-active
.asa-bot1-bio-btn {

    opacity:
        1;

    transform:
        translateY(
            0
        );
}


/* ============================================================
   LIGHTBOX
   ============================================================ */

.asa-bot1-modal {
    position:
        fixed;

    inset:
        0;

    z-index:
        99999;

    display:
        none;

    align-items:
        center;

    justify-content:
        center;

    padding:
        30px;

    box-sizing:
        border-box;
}


.asa-bot1-modal.is-open {
    display:
        flex;
}


/* ============================================================
   BACKDROP
   ============================================================ */

.asa-bot1-modal__backdrop {
    position:
        absolute;

    inset:
        0;

    background:
        rgba(
            18,
            20,
            24,
            .70
        );

    backdrop-filter:
        blur(
            5px
        );
}


/* ============================================================
   DIALOG
   ============================================================ */

.asa-bot1-modal__dialog {
    position:
        relative;

    z-index:
        2;

    width:
        min(
            92vw,
            1240px
        );

    height:
        min(
            var(
                --asa-bot1-modal-height,
                750px
            ),
            calc(
                100vh
                -
                60px
            )
        );

    overflow:
        hidden;

    background:
        #FFFFFF;

    border-radius:
        20px;

    box-shadow:
        0
        28px
        90px
        rgba(
            0,
            0,
            0,
            .28
        );
}


/* ============================================================
   CLOSE BUTTON
   ============================================================ */

.asa-bot1-modal__close {
    position:
        absolute;

    top:
        18px;

    right:
        18px;

    z-index:
        10;

    width:
        44px;

    height:
        44px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        0 !important;

    border:
        0 !important;

    border-radius:
        50% !important;

    background:
        rgba(
            255,
            255,
            255,
            .94
        ) !important;

    color:
        #242424 !important;

    font-size:
        28px !important;

    line-height:
        1 !important;

    cursor:
        pointer;

    box-shadow:
        0
        5px
        18px
        rgba(
            0,
            0,
            0,
            .12
        );
}


/* ============================================================
   MODAL GRID
   ============================================================ */

.asa-bot1-modal__grid {
    display:
        grid;

    grid-template-columns:
        minmax(
            340px,
            46%
        )
        minmax(
            0,
            1fr
        );

    width:
        100%;

    height:
        100%;

    min-height:
        0;
}


/* ============================================================
   BIO IMAGE
   ============================================================ */

.asa-bot1-modal__image {
    position:
        relative;

    align-self:
        center;

    width:
        100%;

    height:
        min(
            var(
                --asa-bot1-bio-photo-height-desktop,
                750px
            ),
            100%
        );

    overflow:
        hidden;

    background:
        #EFEFEF;
}


.asa-bot1-modal__image img {
    display:
        block !important;

    width:
        100% !important;

    height:
        100% !important;

    margin:
        0 !important;

    padding:
        0 !important;

    object-fit:
        cover;

    object-position:
        center top;
}


/* ============================================================
   MODAL BODY
   ============================================================ */

.asa-bot1-modal__body {
    min-width:
        0;

    min-height:
        0;

    height:
        100%;

    display:
        flex;

    flex-direction:
        column;

    padding:
        60px
        58px
        48px;

    overflow:
        hidden;

    box-sizing:
        border-box;
}


/* ============================================================
   BIO HEADER
   ============================================================ */

.asa-bot1-modal__header {
    flex:
        0
        0
        auto;

    padding-right:
        25px;

    padding-bottom:
        24px;
}


/* ============================================================
   BIO POSITION
   ============================================================ */

.asa-bot1-modal__position {
    margin:
        0
        0
        12px;

    color:
        var(
            --asa-bot1-bio-position-color,
            #F68D2E
        ) !important;

    font-size:
        var(
            --asa-bot1-bio-position-size,
            18px
        ) !important;

    font-weight:
        var(
            --asa-bot1-bio-position-weight,
            700
        ) !important;

    line-height:
        1.2 !important;
}


/* ============================================================
   BIO NAME
   ============================================================ */

.asa-bot1-modal__body
> .asa-bot1-modal__header
> h3 {
    margin:
        0 !important;

    padding:
        0 !important;

    color:
        var(
            --asa-bot1-bio-name-color,
            #161616
        ) !important;

    font-size:
        var(
            --asa-bot1-bio-name-size,
            48px
        ) !important;

    font-weight:
        var(
            --asa-bot1-bio-name-weight,
            600
        ) !important;

    line-height:
        1.05 !important;
}


/* ============================================================
   SCROLLABLE HTML BIO BODY
   ============================================================ */

.asa-bot1-modal__bio {
    flex:
        1
        1
        auto;

    min-height:
        0;

    overflow-y:
        auto;

    overflow-x:
        hidden;

    padding-right:
        18px;

    color:
        var(
            --asa-bot1-bio-body-color,
            #555555
        );

    font-size:
        var(
            --asa-bot1-bio-body-size,
            17px
        );

    font-weight:
        var(
            --asa-bot1-bio-body-weight,
            400
        );

    line-height:
        var(
            --asa-bot1-bio-body-line-height,
            1.72
        );

    scrollbar-width:
        thin;

    scrollbar-color:
        #C7C7C7
        transparent;
}


/* ============================================================
   HTML CONTENT
   ============================================================ */

.asa-bot1-modal__bio p,
.asa-bot1-modal__bio li,
.asa-bot1-modal__bio blockquote {
    color:
        inherit !important;

    font-size:
        inherit !important;

    line-height:
        inherit !important;
}


.asa-bot1-modal__bio p {
    margin:
        0
        0
        18px !important;
}


.asa-bot1-modal__bio h2,
.asa-bot1-modal__bio h3,
.asa-bot1-modal__bio h4,
.asa-bot1-modal__bio h5 {
    margin:
        24px
        0
        10px !important;

    color:
        var(
            --asa-bot1-bio-name-color,
            #161616
        ) !important;

    line-height:
        1.2 !important;
}


.asa-bot1-modal__bio h3 {
    font-size:
        1.45em !important;
}


.asa-bot1-modal__bio h4 {
    font-size:
        1.2em !important;
}


.asa-bot1-modal__bio ul,
.asa-bot1-modal__bio ol {
    margin:
        0
        0
        20px
        22px !important;

    padding:
        0 !important;
}


.asa-bot1-modal__bio li {
    margin-bottom:
        7px !important;
}


.asa-bot1-modal__bio a {
    color:
        #F68D2E;

    text-decoration:
        underline;
}


.asa-bot1-modal__bio blockquote {
    margin:
        22px
        0 !important;

    padding:
        14px
        20px !important;

    border-left:
        4px solid
        #F68D2E;

    background:
        rgba(
            246,
            141,
            46,
            .08
        );
}


/* ============================================================
   SCROLLBAR
   ============================================================ */

.asa-bot1-modal__bio::-webkit-scrollbar {
    width:
        7px;
}


.asa-bot1-modal__bio::-webkit-scrollbar-track {
    background:
        transparent;
}


.asa-bot1-modal__bio::-webkit-scrollbar-thumb {
    background:
        #C7C7C7;

    border-radius:
        20px;
}


/* ============================================================
   TABLET + MOBILE RESPONSIVE CAROUSEL
   Starts at tablet breakpoint.
   ============================================================ */

@media(max-width:1024px) {

    .asa-bot1-section {
        padding:
            85px
            0
            95px;
    }


    .asa-bot1-header-container {
        width:
            min(
                92%,
                var(
                    --asa-bot1-max-width,
                    1400px
                )
            );
    }


    .asa-bot1-board-shell {
        width:
            min(
                90%,
                var(
                    --asa-bot1-max-width,
                    1400px
                )
            );

        padding-top:
            0;

        overflow:
            visible;
    }


    /*
     * The viewport owns the clipping.
     * Top padding reserves space for the
     * already-open active rectangle.
     */

    .asa-bot1-board-viewport {
        width:
            100%;

        padding-top:
            calc(
                var(
                    --asa-bot1-active-extension,
                    135px
                )
                +
                18px
            );

        overflow:
            hidden;

        box-sizing:
            border-box;
    }


    .asa-bot1-board-shell::before {
        top:
            calc(
                var(
                    --asa-bot1-active-extension,
                    135px
                )
                +
                18px
                +
                (
                    var(
                        --asa-bot1-responsive-card-height,
                        420px
                    )
                    *
                    .49
                )
            );

        height:
            var(
                --asa-bot1-line-height,
                16px
            );

        background:
            var(
                --asa-bot1-line-color,
                #8B0000
            );
    }


    .asa-bot1-board {
        align-items:
            flex-end;

        gap:
            var(
                --asa-bot1-gap,
                6px
            );

        width:
            max-content;

        min-width:
            100%;

        overflow:
            visible;

        transform:
            translate3d(
                0,
                0,
                0
            );

        transition:
            transform
            .42s
            cubic-bezier(
                .22,
                .7,
                .2,
                1
            );

        will-change:
            transform;
    }


    .asa-bot1-board.asa-bot1-no-transition {
        transition:
            none !important;
    }

    /*
     * V1.5:
     * Responsive height comes directly from the dashboard.
     * JS calculates each card width from the image's original
     * width-to-height ratio, so photos remain proportional.
     */

    .asa-bot1-card {
        flex:
            0
            0
            auto;

        width:
            auto;

        min-width:
            0;

        height:
            var(
                --asa-bot1-responsive-card-height,
                var(
                    --asa-bot1-tablet-height,
                    520px
                )
            ) !important;

        aspect-ratio:
            var(
                --asa-bot1-photo-ratio,
                4 / 5
            );

        opacity:
            var(
                --asa-bot1-inactive-opacity,
                1
            );

        overflow:
            visible;
    }


    .asa-bot1-card.is-active {
        opacity:
            1;
    }


    .asa-bot1-card__media {
        inset:
            0;

        overflow:
            hidden;
    }


    /*
     * No crop at tablet/mobile.
     * The photo remains proportional.
     */

    .asa-bot1-img {
        width:
            100% !important;

        height:
            100% !important;

        object-fit:
            contain !important;

        object-position:
            center bottom !important;

        transition:
            none !important;
    }


    /*
     * Tablet/mobile active state is immediate.
     * Hover/focus must not activate inactive cards.
     */

    .asa-bot1-accent,
    .asa-bot1-card__meta,
    .asa-bot1-bio-btn {
        transition:
            none !important;

        transition-delay:
            0ms !important;
    }


    .asa-bot1-card:not(.is-active)
    .asa-bot1-accent {
        height:
            0 !important;
    }


    .asa-bot1-card:not(.is-active)
    .asa-bot1-img--bw {
        opacity:
            1 !important;
    }


    .asa-bot1-card:not(.is-active)
    .asa-bot1-img--color {
        opacity:
            0 !important;
    }


    .asa-bot1-card:not(.is-active)
    .asa-bot1-card__meta,

    .asa-bot1-card:not(.is-active)
    .asa-bot1-bio-btn {
        opacity:
            0 !important;
    }


    .asa-bot1-card:not(.is-active)
    .asa-bot1-bio-btn {
        pointer-events:
            none !important;
    }


    .asa-bot1-card:not(.is-active)
    .asa-bot1-card__meta {
        transform:
            translateX(
                -24px
            ) !important;
    }


    .asa-bot1-card:not(.is-active)
    .asa-bot1-bio-btn {
        transform:
            translateY(
                12px
            ) !important;
    }


    .asa-bot1-card.is-active
    .asa-bot1-accent {
        height:
            calc(
                100%
                +
                var(
                    --asa-bot1-active-extension,
                    135px
                )
            ) !important;
    }


    .asa-bot1-card.is-active.has-color
    .asa-bot1-img--bw {
        opacity:
            0 !important;
    }


    .asa-bot1-card.is-active.has-color
    .asa-bot1-img--color {
        opacity:
            1 !important;
    }


    .asa-bot1-card.is-active:not(.has-color)
    .asa-bot1-img--bw {
        opacity:
            1 !important;
    }


    .asa-bot1-card.is-active
    .asa-bot1-card__meta,

    .asa-bot1-card.is-active
    .asa-bot1-bio-btn {
        opacity:
            1 !important;
    }


    .asa-bot1-card.is-active
    .asa-bot1-card__meta {
        transform:
            translateX(
                0
            ) !important;
    }


    .asa-bot1-card.is-active
    .asa-bot1-bio-btn {
        transform:
            translateY(
                0
            ) !important;

        pointer-events:
            auto !important;
    }


    .asa-bot1-card__content {
        top:
            calc(
                -1
                *
                var(
                    --asa-bot1-active-extension,
                    135px
                )
            );
    }


    .asa-bot1-card__meta h3 {
        font-size:
            var(
                --asa-bot1-gallery-name-size-tablet,
                22px
            ) !important;
    }


    .asa-bot1-card__meta p {
        font-size:
            var(
                --asa-bot1-gallery-position-size-tablet,
                18px
            ) !important;
    }


    /* ========================================================
       NAVIGATION
       ======================================================== */

    .asa-bot1-nav {
        top:
            calc(
                var(
                    --asa-bot1-active-extension,
                    135px
                )
                +
                18px
                +
                (
                    var(
                        --asa-bot1-responsive-card-height,
                        420px
                    )
                    /
                    2
                )
            );

        display:
            flex;

        transform:
            translateY(
                -50%
            );
    }


    .asa-bot1-prev {
        left:
            -25px;
    }


    .asa-bot1-next {
        right:
            -25px;
    }


    .asa-bot1-indicators {
        display:
            flex;

        margin-top:
            20px;
    }


    @media(hover:hover) {

        .asa-bot1-nav:hover {
            background:
                var(
                    --asa-bot1-nav-color,
                    #F68D2E
                ) !important;

            color:
                #FFFFFF !important;
        }


        .asa-bot1-indicator:hover {
            transform:
                scale(
                    1.18
                );
        }

    }


    /* ========================================================
       TABLET LIGHTBOX
       ======================================================== */

    .asa-bot1-modal {
        padding:
            24px;
    }


    .asa-bot1-modal__dialog {
        width:
            min(
                94vw,
                1100px
            );

        height:
            min(
                var(
                    --asa-bot1-modal-height,
                    750px
                ),
                calc(
                    100vh
                    -
                    48px
                )
            );
    }


    .asa-bot1-modal__grid {
        grid-template-columns:
            minmax(
                300px,
                42%
            )
            minmax(
                0,
                1fr
            );
    }


    .asa-bot1-modal__image {
        height:
            min(
                var(
                    --asa-bot1-bio-photo-height-tablet,
                    620px
                ),
                100%
            );
    }


    .asa-bot1-modal__image img {
        width:
            100% !important;

        height:
            100% !important;

        object-fit:
            cover !important;

        object-position:
            center top !important;
    }


    .asa-bot1-modal__body {
        padding:
            54px
            38px
            40px;
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:767px) {

    .asa-bot1-section {
        padding:
            70px
            0
            80px;
    }


    .asa-bot1-header-container {
        width:
            90%;

        margin-bottom:
            24px;
    }


    .asa-bot1-board-shell {
        width:
            84%;
    }


    .asa-bot1-board-viewport {
        padding-top:
            calc(
                min(
                    var(
                        --asa-bot1-active-extension,
                        135px
                    ),
                    100px
                )
                +
                16px
            );
    }


    .asa-bot1-board-shell::before {
        display:
            none;
    }


    .asa-bot1-board {
        gap:
            max(
                var(
                    --asa-bot1-gap,
                    6px
                ),
                0px
            );
    }


    .asa-bot1-card {
        height:
            var(
                --asa-bot1-responsive-card-height,
                var(
                    --asa-bot1-mobile-height,
                    440px
                )
            ) !important;
    }


    .asa-bot1-card__content {
        top:
            calc(
                -1
                *
                min(
                    var(
                        --asa-bot1-active-extension,
                        135px
                    ),
                    100px
                )
            );

        padding:
            22px
            18px
            22px;
    }


    .asa-bot1-card.is-active
    .asa-bot1-accent {
        height:
            calc(
                100%
                +
                min(
                    var(
                        --asa-bot1-active-extension,
                        135px
                    ),
                    100px
                )
            ) !important;
    }


    .asa-bot1-card__meta h3 {
        font-size:
            var(
                --asa-bot1-gallery-name-size-mobile,
                20px
            ) !important;
    }


    .asa-bot1-card__meta p {
        font-size:
            var(
                --asa-bot1-gallery-position-size-mobile,
                16px
            ) !important;
    }


    .asa-bot1-bio-btn {
        padding:
            11px
            19px !important;

        font-size:
            12px !important;
    }


    .asa-bot1-nav {
        top:
            calc(
                min(
                    var(
                        --asa-bot1-active-extension,
                        135px
                    ),
                    100px
                )
                +
                16px
                +
                (
                    var(
                        --asa-bot1-responsive-card-height,
                        420px
                    )
                    /
                    2
                )
            );

        width:
            44px;

        height:
            44px;

        min-width:
            44px;

        font-size:
            30px !important;
    }


    .asa-bot1-prev {
        left:
            -22px;
    }


    .asa-bot1-next {
        right:
            -22px;
    }


    .asa-bot1-indicators {
        gap:
            8px;

        margin-top:
            17px;
    }


    .asa-bot1-indicator {
        width:
            9px;

        height:
            9px;

        min-width:
            9px;
    }


    /* ========================================================
       MOBILE LIGHTBOX
       ======================================================== */

    .asa-bot1-modal {
        padding:
            16px;
    }


    .asa-bot1-modal__dialog {
        width:
            100%;

        height:
            calc(
                100vh
                -
                32px
            );

        border-radius:
            18px;
    }


    .asa-bot1-modal__grid {
        display:
            flex;

        flex-direction:
            column;

        overflow:
            hidden;
    }


    .asa-bot1-modal__image {
        flex:
            0
            0
            auto;

        width:
            100%;

        height:
            min(
                var(
                    --asa-bot1-bio-photo-height-mobile,
                    320px
                ),
                45vh
            );

        align-self:
            auto;
    }


    .asa-bot1-modal__image img {
        width:
            100% !important;

        height:
            100% !important;

        object-fit:
            cover !important;

        object-position:
            center top !important;
    }


    .asa-bot1-modal__body {
        flex:
            1
            1
            auto;

        height:
            auto;

        min-height:
            0;

        padding:
            28px
            24px
            24px;
    }


    .asa-bot1-modal__header {
        padding-right:
            34px;

        padding-bottom:
            17px;
    }


    .asa-bot1-modal__position {
        font-size:
            min(
                var(
                    --asa-bot1-bio-position-size,
                    18px
                ),
                16px
            ) !important;
    }


    .asa-bot1-modal__body
    > .asa-bot1-modal__header
    > h3 {

        font-size:
            min(
                var(
                    --asa-bot1-bio-name-size,
                    48px
                ),
                38px
            ) !important;
    }


    .asa-bot1-modal__bio {
        padding-right:
            10px;

        font-size:
            min(
                var(
                    --asa-bot1-bio-body-size,
                    17px
                ),
                16px
            );
    }


    .asa-bot1-modal__close {
        top:
            12px;

        right:
            12px;

        width:
            40px;

        height:
            40px;
    }

}


/* ============================================================
   REDUCED MOTION
   ============================================================ */

@media(
    prefers-reduced-motion:
    reduce
) {

    .asa-bot1-img,
    .asa-bot1-accent,
    .asa-bot1-card__meta,
    .asa-bot1-bio-btn {

        transition:
            none !important;
    }

}