/* ==========================================================
   VANARA FOOTER
   File: assets/css/footer.css
   ========================================================== */

.site-footer{
    position:relative;
    overflow:hidden;

    background:
        radial-gradient(
            circle at 14% 12%,
            rgba(217,193,141,.08),
            transparent 34%
        ),
        radial-gradient(
            circle at 84% 24%,
            rgba(70,112,82,.12),
            transparent 38%
        ),
        linear-gradient(
            180deg,
            #10281e 0%,
            #0b2118 58%,
            #081a13 100%
        );

    color:#f7f4ee;

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

.site-footer::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;

    background-image:
        linear-gradient(
            rgba(255,255,255,.018) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.018) 1px,
            transparent 1px
        );

    background-size:48px 48px;
    opacity:.28;
}

.site-footer::after{
    content:"";
    position:absolute;
    left:50%;
    top:-180px;

    width:520px;
    height:520px;

    border:1px solid rgba(217,193,141,.05);
    border-radius:50%;

    transform:translateX(-50%);
    pointer-events:none;
}

.site-footer__container{
    position:relative;
    z-index:1;

    width:min(1400px,calc(100% - 80px));
    margin:0 auto;
    padding:96px 0 72px;

    display:grid;
    grid-template-columns:minmax(280px,.9fr) minmax(0,1.6fr);
    gap:clamp(70px,9vw,150px);
    align-items:start;
}

.site-footer__brand{
    max-width:370px;
}

.site-footer__logo{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    width:118px;
    height:118px;

    margin-bottom:30px;

    color:inherit;
    text-decoration:none;

    transition:
        transform .35s cubic-bezier(.22,1,.36,1),
        opacity .35s ease;
}

.site-footer__logo:hover{
    transform:translateY(-3px);
    opacity:.88;
}

.site-footer__logo img{
    display:block;

    width:118px;
    height:118px;

    object-fit:contain;
}

.site-footer__tagline{
    margin:0;

    color:rgba(247,244,238,.72);

    font-family:"Marcellus",serif;
    font-size:clamp(20px,1.75vw,27px);
    font-weight:400;
    line-height:1.5;
    letter-spacing:.01em;
}

.site-footer__columns{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:clamp(38px,5vw,84px);
}

.site-footer__column h4{
    position:relative;

    margin:0 0 30px;
    padding-bottom:17px;

    color:#d9c18d;

    font-family:"Lato",sans-serif;
    font-size:11px;
    font-weight:700;
    line-height:1;
    letter-spacing:.2em;
    text-transform:uppercase;
}

.site-footer__column h4::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;

    width:34px;
    height:1px;

    background:rgba(217,193,141,.58);
}

.site-footer__column ul{
    margin:0;
    padding:0;
    list-style:none;
}

.site-footer__column li{
    margin:0 0 15px;
}

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

.site-footer__column li{
    color:rgba(247,244,238,.75);

    font-family:"Lato",sans-serif;
    font-size:14px;
    font-weight:400;
    line-height:1.5;
    letter-spacing:.015em;
}

.site-footer__column a{
    position:relative;
    display:inline-block;

    color:rgba(247,244,238,.75);
    text-decoration:none;

    font-family:"Lato",sans-serif;
    font-size:14px;
    font-weight:400;
    line-height:1.5;
    letter-spacing:.015em;

    transition:
        color .28s ease,
        transform .28s cubic-bezier(.22,1,.36,1);
}

.site-footer__column a::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-4px;

    width:0;
    height:1px;

    background:#d9c18d;

    transition:width .3s cubic-bezier(.22,1,.36,1);
}

.site-footer__column a:hover{
    color:#fff;
    transform:translateX(3px);
}

.site-footer__column a:hover::after{
    width:100%;
}

.site-footer__bottom{
    position:relative;
    z-index:1;

    border-top:1px solid rgba(255,255,255,.075);

    background:rgba(0,0,0,.08);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
}

.site-footer__bottom-inner{
    width:min(1400px,calc(100% - 80px));
    min-height:78px;
    margin:0 auto;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:30px;

    color:rgba(247,244,238,.48);

    font-family:"Lato",sans-serif;
    font-size:11px;
    font-weight:400;
    line-height:1.5;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.site-footer__bottom-inner span:last-child{
    color:rgba(217,193,141,.62);
}

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

@media (max-width:1000px){

    .site-footer__container{
        width:min(100% - 48px,900px);
        padding:80px 0 64px;

        grid-template-columns:1fr;
        gap:64px;
    }

    .site-footer__brand{
        max-width:540px;
    }

    .site-footer__columns{
        gap:44px;
    }

    .site-footer__bottom-inner{
        width:min(100% - 48px,900px);
    }
}

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

@media (max-width:700px){

    .site-footer__container{
        width:calc(100% - 36px);
        padding:68px 0 52px;
        gap:54px;
    }

    .site-footer__logo{
        width:96px;
        height:96px;
        margin-bottom:24px;
    }

    .site-footer__logo img{
        width:96px;
        height:96px;
    }

    .site-footer__tagline{
        max-width:320px;
        font-size:21px;
        line-height:1.45;
    }

    .site-footer__columns{
        grid-template-columns:1fr 1fr;
        gap:46px 28px;
    }

    .site-footer__column:last-child{
        grid-column:1 / -1;
    }

    .site-footer__column h4{
        margin-bottom:24px;
    }

    .site-footer__bottom-inner{
        width:calc(100% - 36px);
        min-height:auto;
        padding:24px 0;

        flex-direction:column;
        align-items:flex-start;
        gap:8px;

        font-size:10px;
    }
}

@media (max-width:430px){

    .site-footer__columns{
        grid-template-columns:1fr;
        gap:42px;
    }

    .site-footer__column:last-child{
        grid-column:auto;
    }
}

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

.site-footer a:focus-visible{
    outline:2px solid #d9c18d;
    outline-offset:5px;
}

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

    .site-footer *,
    .site-footer *::before,
    .site-footer *::after{
        transition-duration:.01ms !important;
    }
}