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

.footer{
    min-height:calc(100svh - 65px);

    display:flex;
    align-items:center;

    background:#111;
    color:#fff;

    position:relative;
    overflow:hidden;

    padding:30px 0;
}

.footer::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:3px;
    background:linear-gradient(90deg,#ef902d,#ffb55a);
}

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

.footer .container{
    width:100%;
}

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

.footer-grid{
    display:grid;
    grid-template-columns:2fr repeat(3,1fr);
    gap:32px;
    margin-bottom:24px;
}

/*================ LOGO ================*/

.footer-logo{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:14px;
}

.footer-logo img{
    width:56px;
    flex-shrink:0;
}

.footer-logo-text h3{
    margin:0;
    font-size:24px;
    line-height:1.1;
    font-weight:800;
    color:#fff;
}

.footer-logo-text span{
    display:block;
    margin-top:2px;
    color:#ef902d;
    font-size:15px;
    font-weight:600;
}

.footer-col p{
    max-width:310px;
    color:#b8b8b8;
    font-size:14px;
    line-height:1.7;
}

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

.footer-col h4{
    position:relative;
    margin-bottom:16px;
    padding-bottom:8px;
    font-size:18px;
    color:#fff;
}

.footer-col h4::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:36px;
    height:3px;
    background:#ef902d;
    border-radius:30px;
}

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

.footer-col ul{
    margin:0;
    padding:0;
}

.footer-col ul li{
    list-style:none;
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:10px;
    color:#b8b8b8;
    font-size:14px;
}

.footer-col ul li:last-child{
    margin-bottom:0;
}

.footer-col ul li i{
    width:16px;
    color:#ef902d;
    font-size:13px;
}

.footer-col ul li a{
    color:#b8b8b8;
    transition:.3s;
}

.footer-col ul li a:hover{
    color:#ef902d;
    padding-left:5px;
}

/*================ SOCIAL ================*/

.footer-social{
    display:flex;
    gap:10px;
    margin-top:18px;
}

.footer-social a{
    width:40px;
    height:40px;

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

    border-radius:50%;

    background:#1b1b1b;
    color:#fff;

    font-size:16px;

    transition:.3s;
}

.footer-social a:hover{
    background:#ef902d;
    transform:translateY(-4px);
    box-shadow:0 10px 22px rgba(239,144,45,.28);
}

/*================ DIVIDER ================*/

.footer hr{
    border:none;
    height:1px;
    background:#2a2a2a;
    margin:20px 0;
}

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

.footer-bottom{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.footer-bottom p{
    margin:0;
    font-size:13px;
    color:#999;
}

.footer-bottom-links{
    display:flex;
    align-items:center;
    gap:14px;
}

.footer-bottom-links a{
    color:#999;
    font-size:13px;
    transition:.3s;
}

.footer-bottom-links a:hover{
    color:#ef902d;
}

.footer-bottom-links span{
    color:#555;
}

/*==========================================
            BACK TO TOP
==========================================*/

.scroll-top-btn{
    position:fixed;

    right:25px;
    bottom:25px;

    width:52px;
    height:52px;

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

    border:none;
    border-radius:50%;

    background:#ef902d;
    color:#fff;

    font-size:18px;

    cursor:pointer;

    opacity:0;
    visibility:hidden;

    transform:translateY(20px);

    transition:.35s;

    z-index:9999;

    box-shadow:0 10px 25px rgba(239,144,45,.35);
}

.scroll-top-btn.show{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.scroll-top-btn:hover{
    background:#d97f1d;
    transform:translateY(-4px);
}

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

@media(max-width:991px){

    .footer{
        min-height:auto;
        padding:60px 0;
    }

    .footer-grid{
        grid-template-columns:repeat(2,1fr);
        gap:28px;
    }

    .footer-col:first-child{
        grid-column:1/-1;
    }

    .scroll-top-btn{
        width:46px;
        height:46px;
        right:18px;
        bottom:70px;
        font-size:17px;
    }
}

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

@media(max-width:576px){

    .footer{
        padding:50px 0;
    }

    .footer-grid{
        grid-template-columns:1fr;
        gap:24px;
        text-align:center;
    }

    .footer-logo{
        justify-content:center;
    }

    .footer-col p{
        margin:auto;
    }

    .footer-col h4::after{
        left:50%;
        transform:translateX(-50%);
    }

    .footer-col ul li{
        justify-content:center;
    }

    .footer-social{
        justify-content:center;
    }

    .footer-bottom{
        flex-direction:column;
        text-align:center;
        gap:10px;
    }

    .footer-bottom-links{
        justify-content:center;
        flex-wrap:wrap;
    }

    .scroll-top-btn{
        width:44px;
        height:44px;
        right:16px;
        bottom:65px;
        font-size:16px;
    }
}

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

@media(max-width:400px){

    .footer-logo img{
        width:50px;
    }

    .footer-logo-text h3{
        font-size:22px;
    }

    .footer-logo-text span{
        font-size:14px;
    }

    .footer-social a{
        width:38px;
        height:38px;
    }
}