/*=========================================================
GLOBAL - FOOTER
=========================================================*/

.site_footer
{
    width:100%;

    margin:0;
    padding:0;

    background:var(--aob-black);

    color:rgba(247,243,237,0.72);
}


/*=========================================================
MAIN FOOTER
=========================================================*/

.footer_main
{
    width:100%;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(184,138,79,0.055),
            transparent 35%
        ),
        var(--aob-black);
}

.footer_inner
{
    width:min(100% - 2rem,96rem);

    margin:0 auto;
    padding:3rem 0;
}


/*=========================================================
BRAND / AB LOGO
=========================================================*/

.footer_brand
{
    display:flex;

    width:100%;

    margin:0 auto 0.25rem;

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

    gap:1.25rem;
}

.footer_brand_line
{
    display:block;

    height:1px;

    flex:1 1 auto;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--aob-gold)
        );
}

.footer_brand_line:last-child
{
    background:
        linear-gradient(
            90deg,
            var(--aob-gold),
            transparent
        );
}

.footer_logo
{
    display:block;

    flex:0 0 auto;

    line-height:0;
}

.footer_logo_image
{
    display:block;

    width:12rem;
    height:12rem;

    object-fit:contain;

    transition:
        opacity 220ms ease,
        transform 220ms ease;
}

.footer_logo:hover .footer_logo_image,
.footer_logo:focus-visible .footer_logo_image
{
    opacity:0.88;

    transform:scale(1.025);
}


/*=========================================================
FOOTER COLUMNS - MOBILE FIRST
=========================================================*/

.footer_columns
{
    display:grid;

    width:100%;

    grid-template-columns:1fr;

    gap:0.75rem;
}


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

.footer_column
{
    width:100%;

    margin:0;

    overflow:hidden;

    background:rgba(255,255,255,0.035);

    border:1px solid rgba(255,255,255,0.08);

    border-radius:0.75rem;
}

.footer_column summary
{
    list-style:none;
}

.footer_column summary::-webkit-details-marker
{
    display:none;
}


/*=========================================================
COLUMN HEADINGS
=========================================================*/

.footer_heading
{
    display:flex;

    width:100%;
    min-height:4rem;

    margin:0;
    padding:1rem 1.1rem;

    align-items:center;
    justify-content:space-between;

    gap:1rem;

    color:var(--aob-champagne-gold);

    cursor:pointer;

    font-family:var(--font_display);
    font-size:0.82rem;
    font-weight:600;
    letter-spacing:0.07em;
    line-height:1.35;
    text-transform:uppercase;
}


/*=========================================================
ACCORDION PLUS / MINUS
=========================================================*/

.footer_toggle
{
    position:relative;

    display:block;

    width:1rem;
    height:1rem;

    flex:0 0 auto;
}

.footer_toggle::before,
.footer_toggle::after
{
    content:"";

    position:absolute;

    top:50%;
    left:50%;

    width:0.8rem;
    height:1px;

    background:var(--aob-gold);

    transform:translate(-50%,-50%);

    transition:transform 220ms ease;
}

.footer_toggle::after
{
    transform:
        translate(-50%,-50%)
        rotate(90deg);
}

.footer_column[open] .footer_toggle::after
{
    transform:
        translate(-50%,-50%)
        rotate(0deg);
}


/*=========================================================
COLUMN CONTENT
=========================================================*/

.footer_column_content
{
    padding:0 1.1rem 1.25rem;

    border-top:1px solid rgba(255,255,255,0.06);
}


/*=========================================================
FOOTER LINK LISTS
=========================================================*/

.footer_links
{
    margin:0;
    padding:1rem 0 0;

    list-style:none;
}

.footer_links li
{
    margin:0 0 0.68rem;
    padding:0;
}

.footer_links li:last-child
{
    margin-bottom:0;
}

.footer_links a
{
    color:var(--aob-soft-white);

    font-size:0.92rem;
    font-weight:400;
    line-height:1.45;

    text-decoration:none;
    text-decoration-thickness:1px;
    text-underline-offset:0.2rem;

    transition:
        color 180ms ease,
        text-decoration-color 180ms ease;
}

.footer_links a:hover,
.footer_links a:focus-visible
{
    color:var(--aob-champagne-gold);

    text-decoration:underline;

    text-decoration-color:var(--aob-champagne-gold);
}

.footer_location_group
{
    margin:0;
    padding:0;
    list-style:none;
}

.footer_location_region
{
    margin:0;
}

.footer_location_region > summary
{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:0.75rem;
    padding:0.28rem 0;
    color:inherit;
    cursor:pointer;
    list-style:none;
}

.footer_location_region > summary::-webkit-details-marker
{
    display:none;
}

.footer_location_region > summary::after
{
    content:"";
    flex:0 0 7px;
    width:7px;
    height:7px;
    margin-right:3px;
    border-right:1px solid var(--aob-champagne-gold);
    border-bottom:1px solid var(--aob-champagne-gold);
    transform:rotate(45deg);
    transition:transform 180ms ease;
}

.footer_location_region[open] > summary::after
{
    transform:rotate(225deg);
}

.footer_location_region > ul
{
    margin:0.25rem 0 0.55rem;
    padding:0 0 0 0.8rem;
    border-left:1px solid rgba(230,205,153,0.35);
    list-style:none;
}

.footer_location_region > ul li
{
    margin:0 0 0.35rem;
}

.footer_location_region > ul li:last-child
{
    margin-bottom:0;
}


/*=========================================================
CONTACT
=========================================================*/

.footer_contact_spacer
{
    padding-top:0.9rem;
}


/*=========================================================
COPYRIGHT / LEGAL BAR
=========================================================*/

.footer_legal
{
    width:100%;

    padding:1.5rem 1rem 1.75rem;

    border-top:1px solid var(--aob-gold);

    background:var(--aob-merlot);

    color:var(--aob-warm-ivory);
}

.footer_legal_inner
{
    width:min(100%,96rem);

    margin:0 auto;

    text-align:center;
}

.footer_copyright
{
    margin:0 0 1rem;

    color:var(--aob-warm-ivory);

    font-family:var(--font_display);
    font-size:0.9rem;
    font-weight:500;
    line-height:1.45;
}


/*=========================================================
LEGAL LINKS
=========================================================*/

.footer_legal_navigation
{
    display:flex;

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

    flex-wrap:wrap;

    gap:0.55rem 0.7rem;
}

.footer_legal_navigation a
{
    color:var(--aob-gold);

    font-size:0.78rem;
    line-height:1.4;

    text-decoration:underline;
    text-decoration-thickness:1px;
    text-underline-offset:0.15rem;

    transition:
        color 180ms ease,
        text-decoration-color 180ms ease;
}

.footer_legal_navigation a:hover,
.footer_legal_navigation a:focus-visible
{
    color:var(--aob-champagne-gold);

    text-decoration:none;
}

.footer_legal_navigation .footer_cookie_settings
{
    color:var(--aob-gold) !important;
}

.footer_legal_navigation .footer_cookie_settings:hover,
.footer_legal_navigation .footer_cookie_settings:focus-visible
{
    color:var(--aob-champagne-gold) !important;
}

.footer_legal_navigation span
{
    color:rgba(241,232,221,0.65);

    font-size:0.75rem;
}


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

@media (min-width:30rem)
{
    .footer_inner
    {
        width:min(100% - 3rem,96rem);

        padding:3.5rem 0;
    }

    .footer_brand
    {
        gap:1.75rem;
    }

    .footer_logo_image
    {
        width:13rem;
        height:13rem;
    }
}


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

@media (min-width:48rem) and (max-width:67.99rem)
{
    .footer_inner
    {
        width:min(100% - 4rem,96rem);

        padding:4rem 0;
    }

    .footer_brand
    {
        margin-bottom:0.25rem;

        gap:2rem;
    }

    .footer_logo_image
    {
        width:14rem;
        height:14rem;
    }

    .footer_heading
    {
        padding-right:1.5rem;
        padding-left:1.5rem;
    }

    .footer_column_content
    {
        padding-right:1.5rem;
        padding-left:1.5rem;
    }
}


/*=========================================================
DESKTOP
=========================================================*/

@media (min-width:68rem)
{

    .footer_inner
    {
        width:min(100% - 6rem,96rem);

        padding:4.5rem 0 5rem;
    }


    /*=====================================================
    DESKTOP BRAND
    =====================================================*/

    .footer_brand
    {
        width:100%;

        margin-bottom:0.25rem;

        gap:2.5rem;
    }

    .footer_logo_image
    {
        width:16rem;
        height:16rem;
    }


    /*=====================================================
    FOUR DESKTOP COLUMNS
    =====================================================*/

    .footer_columns
    {
        display:grid;

        grid-template-columns:
            minmax(0,0.9fr)
            minmax(0,1.35fr)
            minmax(0,0.95fr)
            minmax(0,1.35fr);

        gap:0;
    }


    /*=====================================================
    REMOVE MOBILE CARD APPEARANCE
    =====================================================*/

    .footer_column
    {
        position:relative;

        display:block;

        min-width:0;

        overflow:visible;

        background:transparent;

        border:0;
        border-radius:0;
    }


    /*=====================================================
    FORCE ALL DETAILS CONTENT OPEN ON DESKTOP
    =====================================================*/

    .footer_column > .footer_column_content,
    .footer_column:not([open]) > .footer_column_content,
    .footer_column[open] > .footer_column_content
    {
        display:block !important;

        width:100%;
        height:auto !important;
        max-height:none !important;

        visibility:visible !important;

        overflow:visible !important;

        opacity:1 !important;
    }


    /*=====================================================
    GOLD VERTICAL DIVIDERS
    =====================================================*/

    .footer_column:not(:last-child)::after
    {
        content:"";

        position:absolute;

        top:0.25rem;
        right:0;
        bottom:0.25rem;

        width:1px;

        background:
            linear-gradient(
                180deg,
                transparent 0%,
                rgba(184,138,79,0.7) 7%,
                rgba(184,138,79,0.7) 93%,
                transparent 100%
            );
    }


    /*=====================================================
    DESKTOP HEADINGS
    =====================================================*/

    .footer_heading
    {
        display:flex;

        width:100%;
        min-height:0;

        padding:0 2rem 1.25rem;

        align-items:flex-start;
        justify-content:flex-start;

        cursor:default;

        font-size:0.74rem;

        pointer-events:none;
    }

    .footer_column:first-child .footer_heading
    {
        padding-left:0;
    }

    .footer_column:last-child .footer_heading
    {
        padding-right:0;
    }

    .footer_toggle
    {
        display:none;
    }


    /*=====================================================
    DESKTOP COLUMN CONTENT
    =====================================================*/

    .footer_column_content
    {
        display:block !important;

        padding:0 2rem;

        border-top:0;
    }

    .footer_column:first-child .footer_column_content
    {
        padding-left:0;
    }

    .footer_column:last-child .footer_column_content
    {
        padding-right:0;
    }

    .footer_links
    {
        display:block;

        padding-top:0;
    }

    .footer_links li
    {
        display:block;

        margin-bottom:0.62rem;
    }

    .footer_links a
    {
        display:inline;

        font-size:clamp(0.76rem,0.84vw,0.9rem);
    }


    /*=====================================================
    DESKTOP LEGAL BAR
    =====================================================*/

    .footer_legal
    {
        padding:1.5rem 3rem;
    }

    .footer_copyright
    {
        color:var(--aob-warm-ivory);
        font-size:0.9rem;
    }

    .footer_legal_navigation
    {
        gap:0.5rem 0.75rem;
    }

    .footer_legal_navigation a
    {
        font-size:0.76rem;
    }
}


/*=========================================================
LARGE DESKTOP
=========================================================*/

@media (min-width:90rem)
{
    .footer_inner
    {
        width:min(100% - 8rem,100rem);
    }

    .footer_heading
    {
        padding-right:2.5rem;
        padding-left:2.5rem;

        font-size:0.78rem;
    }

    .footer_column_content
    {
        padding-right:2.5rem;
        padding-left:2.5rem;
    }

    .footer_links a
    {
        font-size:0.88rem;
    }
}


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

@media (max-width:29.99rem)
{
    .footer_inner
    {
        width:min(100% - 1.25rem,96rem);

        padding:2.5rem 0;
    }

    .footer_brand
    {
        margin-bottom:0.25rem;

        gap:0.9rem;
    }

    .footer_logo_image
    {
        width:11rem;
        height:11rem;
    }

    .footer_heading
    {
        min-height:3.75rem;

        padding:0.9rem 1rem;

        font-size:0.7rem;
    }

    .footer_column_content
    {
        padding-right:1rem;
        padding-bottom:1.1rem;
        padding-left:1rem;
    }

    .footer_links a
    {
        font-size:0.88rem;
    }

    .footer_legal
    {
        padding:1.5rem 0.75rem 1.75rem;
    }

    .footer_copyright
    {
        max-width:18rem;

        margin-right:auto;
        margin-left:auto;

        color:var(--aob-warm-ivory);
        font-size:0.84rem;
    }

    .footer_legal_navigation
    {
        gap:0.65rem 0.55rem;
    }

    .footer_legal_navigation a
    {
        font-size:0.72rem;
    }

    .footer_legal_navigation span
    {
        color:rgba(241,232,221,0.65);
    }
}


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

@media (prefers-reduced-motion:reduce)
{
    .footer_logo_image,
    .footer_toggle::before,
    .footer_toggle::after,
    .footer_links a,
    .footer_legal_navigation a
    {
        transition:none;
    }
}
