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

.footer{

    position:relative;

    overflow:hidden;

    padding:140px 0 40px;

    background:
        linear-gradient(
            180deg,
            #08111d 0%,
            #050b14 100%
        );

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

}

.footer::before{

    content:"";

    position:absolute;

    inset:0;

    opacity:.22;

    background-image:

        linear-gradient(
            rgba(255,255,255,.025) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(255,255,255,.025) 1px,
            transparent 1px
        );

    background-size:72px 72px;

}

.footer::after{

    content:"HERITAGE";

    position:absolute;

    left:50%;

    top:45%;

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

    font-size:220px;

    font-weight:900;

    letter-spacing:-8px;

    color:#fff;

    opacity:.018;

    pointer-events:none;

    white-space:nowrap;

}

/* ==========================================================
   TOP
========================================================== */

.footer-top{

    position:relative;

    z-index:2;

    display:grid;

    grid-template-columns:

        1.3fr
        1fr;

    gap:100px;

    align-items:start;

    padding-bottom:70px;

    border-bottom:

        1px solid

        rgba(255,255,255,.08);

}

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

.footer-brand img{

    width:180px;

    height:auto;

    display:block;

    margin-bottom:32px;

    object-fit:contain;

}
.footer-brand h3{

    margin-bottom:18px;

    font-size:42px;

    font-weight:800;

    letter-spacing:-2px;

    color:#fff;

}

.footer-brand p{

    margin-bottom:16px;

    font-size:20px;

    color:var(--color-text);

}

.footer-brand span{

    display:inline-block;

    color:var(--color-primary);

    font-size:17px;

    letter-spacing:.5px;

}

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

.footer-links{

    display:grid;

    grid-template-columns:

        repeat(3,1fr);

    gap:40px;

}

.footer-links h4{

    margin-bottom:24px;

    color:#fff;

    font-size:18px;

    font-weight:700;

}

.footer-links a{

    display:block;

    margin-bottom:14px;

    color:var(--color-text);

    text-decoration:none;

    transition:.35s;

}

.footer-links a:hover{

    color:var(--color-primary);

    transform:translateX(6px);

}

/* ==========================================================
   BOTTOM
========================================================== */

.footer-bottom{

    position:relative;

    z-index:2;

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    padding-top:35px;

}

.footer-bottom span{

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

    font-size:15px;

    letter-spacing:.3px;

}

/* ==========================================================
   RESPONSIVE
========================================================== */

@media(max-width:1100px){

    .footer-top{

        grid-template-columns:1fr;

        gap:70px;

    }

}

@media(max-width:768px){

    .footer{

        padding:100px 0 30px;

    }

    .footer::after{

        display:none;

    }

    .footer-brand h3{

        font-size:34px;

    }

    .footer-links{

        grid-template-columns:1fr;

        gap:34px;

    }

    .footer-bottom{

        flex-direction:column;

        text-align:center;

    }

}