/*
|--------------------------------------------------------------------------
| Contact FAQ
|--------------------------------------------------------------------------
*/

.contact-faq {
    padding:
        85px
        0
        105px;

    background:
        #202020;

    color:
        #fff;
}


/*
|--------------------------------------------------------------------------
| Inner
|--------------------------------------------------------------------------
*/

.contact-faq__inner {
    max-width:
        1120px;

    margin:
        0
        auto;
}


/*
|--------------------------------------------------------------------------
| Heading
|--------------------------------------------------------------------------
*/

.contact-faq__head {
    margin-bottom:
        50px;
}


.contact-faq__eyebrow {
    margin-bottom:
        14px;

    color:
        var(--color-gold);

    font-size:
        var(--font-size-text-xsmall);

    font-weight:
        700;

    line-height:
        1.2;

    text-transform:
        uppercase;
}


.contact-faq__title {
    margin: 0;

    color:
        #fff;

    font-family:
        var(--font-title);

    font-size:
        var(--font-size-h2);

    font-weight:
        400;

    line-height:
        1.05;
}


/*
|--------------------------------------------------------------------------
| Items
|--------------------------------------------------------------------------
*/

.contact-faq__items {
    display:
        flex;

    flex-direction:
        column;

    gap:
        18px;
}


/*
|--------------------------------------------------------------------------
| Item
|--------------------------------------------------------------------------
*/

.contact-faq__item {
    position:
        relative;

    border:
        1px solid
        rgba(255, 255, 255, .22);

    background:
        #343434;

    overflow:
        hidden;

    transition:
        border-color
        .3s
        ease,
        background-color
        .3s
        ease;
}


.contact-faq__item:hover {
    border-color:
        rgba(185, 163, 130, .55);
}


.contact-faq__item.is-open {
    border-color:
        rgba(255, 255, 255, .26);
}


/*
|--------------------------------------------------------------------------
| Button
|--------------------------------------------------------------------------
*/

.contact-faq__button {
    width:
        100%;

    min-height:
        66px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        30px;

    padding:
        20px
        26px;

    border:
        0;

    background:
        transparent;

    color:
        #fff;

    text-align:
        left;

    cursor:
        pointer;
}


/*
|--------------------------------------------------------------------------
| Question
|--------------------------------------------------------------------------
*/

.contact-faq__question {
    font-family:
        var(--font-title);

    font-size:
        var(--font-size-text-main);

    font-weight:
        700;

    line-height:
        1.3;
}


/*
|--------------------------------------------------------------------------
| Icon
|--------------------------------------------------------------------------
*/

.contact-faq__icon {
    position:
        relative;

    flex:
        0
        0
        30px;

    width:
        30px;

    height:
        30px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border-radius:
        50%;

    background:
        var(--color-gold);
}


.contact-faq__icon img {
    position:
        absolute;

    width:
        12px;

    height:
        12px;

    object-fit:
        contain;

    transition:
        opacity
        .2s
        ease,
        transform
        .3s
        ease;
}


.contact-faq__icon-plus {
    opacity:
        1;
}


.contact-faq__icon-minus {
    opacity:
        0;

    transform:
        rotate(-90deg);
}


.contact-faq__item.is-open
.contact-faq__icon-plus {
    opacity:
        0;

    transform:
        rotate(90deg);
}


.contact-faq__item.is-open
.contact-faq__icon-minus {
    opacity:
        1;

    transform:
        rotate(0);
}


/*
|--------------------------------------------------------------------------
| Answer
|--------------------------------------------------------------------------
*/

.contact-faq__answer {
    display:
        none;
}


.contact-faq__answer-inner {
    /* max-width:
        970px; */

    padding:
        0
        26px
        28px;

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

    font-size:
        var(--font-size-text-small);

    font-weight:
        300;

    line-height:
        1.3;
}


.contact-faq__answer-inner p {
    margin:
        0;
}


/*
|--------------------------------------------------------------------------
| Open State
|--------------------------------------------------------------------------
*/

.contact-faq__item.is-open {
    background:
        #343434;
}


/*
|--------------------------------------------------------------------------
| Tablet
|--------------------------------------------------------------------------
*/

@media (max-width: 991.98px) {

    .contact-faq {
        padding:
            65px
            0
            80px;
    }


    .contact-faq__head {
        margin-bottom:
            38px;
    }

}


/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 767.98px) {

    .contact-faq {
        padding:
            50px
            0
            60px;
    }


    .contact-faq__items {
        gap:
            12px;
    }


    .contact-faq__button {
        min-height:
            62px;

        gap:
            18px;

        padding:
            18px
            18px;
    }


    .contact-faq__question {
        font-size:
            18px;
    }


    .contact-faq__icon {
        flex-basis:
            28px;

        width:
            28px;

        height:
            28px;
    }


    .contact-faq__answer-inner {
        padding:
            0
            18px
            22px;
    }

}

/*
|--------------------------------------------------------------------------
| Find Us
|--------------------------------------------------------------------------
*/

.contact-location {
    padding:
        85px
        0
        95px;

    background:
        #292929;
}


/*
|--------------------------------------------------------------------------
| Layout
|--------------------------------------------------------------------------
*/

.contact-location__grid {
    display: grid;

    grid-template-columns:
        minmax(300px, 1fr)
        minmax(0, 1.62fr);

    gap:
        clamp(
            60px,
            8vw,
            120px
        );

    align-items: center;
}


/*
|--------------------------------------------------------------------------
| Content
|--------------------------------------------------------------------------
*/

.contact-location__content {
    /* max-width:
        430px; */
}


/*
|--------------------------------------------------------------------------
| Eyebrow
|--------------------------------------------------------------------------
*/

.contact-location__eyebrow {
    margin-bottom:
        14px;

    color:
        var(--color-gold);

    font-size:
        var(--font-size-text-xsmall);

    font-weight:
        700;

    line-height:
        1.2;

    text-transform:
        uppercase;
}


/*
|--------------------------------------------------------------------------
| Title
|--------------------------------------------------------------------------
*/

.contact-location__title {
    margin:
        0
        0
        38px;

    color:
        #fff;

    font-family:
        var(--font-title);

    font-size:
        var(--font-size-h2);

    font-weight:
        400;

    line-height:
        1.05;
}


/*
|--------------------------------------------------------------------------
| Address
|--------------------------------------------------------------------------
*/

.contact-location__address {
    margin-bottom:
        22px;

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

    font-size:
        var(--font-size-text-main);

    font-weight:
        300;

    line-height:
        1.55;
}


/*
|--------------------------------------------------------------------------
| Email
|--------------------------------------------------------------------------
*/

.contact-location__email {
    display:
        inline-block;

    margin-bottom:
        34px;

    color:
        var(--color-gold);

    font-size:
        var(--font-size-text-main);

    font-weight:
        600;

    line-height:
        1.4;

    text-decoration:
        none;

    transition:
        color
        .25s
        ease;
}


.contact-location__email:hover {
    color:
        #fff;
}


/*
|--------------------------------------------------------------------------
| Actions
|--------------------------------------------------------------------------
*/

.contact-location__actions {
    display:
        flex;

    flex-wrap:
        wrap;

    gap:
        14px;
}


/*
|--------------------------------------------------------------------------
| CTA
|--------------------------------------------------------------------------
*/

.contact-location__cta {
    min-height:
        42px;

    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    padding:
        9px
        20px;

    font-size:
        var(--font-size-text-main);

    font-weight:
        700;

    line-height:
        1;

    text-decoration:
        none;

    text-transform:
        uppercase;

    cursor:
        pointer;

    transition:
        background-color
        .25s
        ease,
        border-color
        .25s
        ease,
        color
        .25s
        ease;
}


/*
|--------------------------------------------------------------------------
| Primary CTA
|--------------------------------------------------------------------------
*/

.contact-location__cta--primary {
    border:
        1px solid
        var(--color-gold);

    background:
        var(--color-gold);

    color:
        #222;
}


.contact-location__cta--primary:hover {
    background:
        #292929;

    color:
        #fff;
}


/*
|--------------------------------------------------------------------------
| Secondary CTA
|--------------------------------------------------------------------------
*/

.contact-location__cta--secondary {
    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .24
        );

    background:
        transparent;

    color:
        #fff;
}


.contact-location__cta--secondary:hover {
    border-color:
        var(--color-gold);

    background:
        #403d35;
}


/*
|--------------------------------------------------------------------------
| Map
|--------------------------------------------------------------------------
*/

.contact-location__map {
    position:
        relative;

    overflow:
        hidden;

    min-height:
        470px;

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .08
        );

    background:
        #202020;
}


.contact-location__map img {
    display:
        block;

    width:
        100%;

    height:
        100%;

    min-height:
        470px;

    object-fit:
        cover;

    object-position:
        center;

    transition:
        transform
        .7s
        cubic-bezier(
            .22,
            .61,
            .36,
            1
        );
}


/*
|--------------------------------------------------------------------------
| Map Hover
|--------------------------------------------------------------------------
*/

.contact-location__map:hover img {
    transform:
        scale(
            1.015
        );
}


/*
|--------------------------------------------------------------------------
| Tablet
|--------------------------------------------------------------------------
*/

@media (max-width: 1199.98px) {

    .contact-location__grid {
        grid-template-columns:
            minmax(280px, .8fr)
            minmax(0, 1.4fr);

        gap:
            55px;
    }


    .contact-location__map,
    .contact-location__map img {
        min-height:
            420px;
    }

}


/*
|--------------------------------------------------------------------------
| <= 991
|--------------------------------------------------------------------------
*/

@media (max-width: 991.98px) {

    .contact-location {
        padding:
            65px
            0
            75px;
    }


    .contact-location__grid {
        grid-template-columns:
            1fr;

        gap:
            45px;
    }


    .contact-location__content {
        max-width:
            650px;
    }


    .contact-location__map,
    .contact-location__map img {
        min-height:
            400px;
    }

}


/*
|--------------------------------------------------------------------------
| Mobile
|--------------------------------------------------------------------------
*/

@media (max-width: 767.98px) {

    .contact-location {
        padding:
            50px
            0
            60px;
    }


    .contact-location__title {
        margin-bottom:
            28px;
    }


    .contact-location__address {
        margin-bottom:
            18px;
    }


    .contact-location__email {
        margin-bottom:
            28px;
    }


    .contact-location__actions {
        display:
            grid;

        grid-template-columns:
            1fr;
    }


    .contact-location__cta {
        width:
            100%;
    }


    .contact-location__map,
    .contact-location__map img {
        min-height:
            300px;
    }

}