.main-footer{
background:#111315;
color:white;
padding-top:60px;
position:relative;

}
.footer-container{
width:85%;
margin:auto;
display:grid;
grid-template-columns:2fr 1fr 1.3fr 1.5fr;
gap:45px;
}
.footer-box h3{
font-size:18px;
margin-bottom:20px;
color:white;
}
.footer-logo{
width:100px;
max-width:100%;
background:white;
padding:10px;
border-radius:0 0 10px 10px;
}

.footer-box p{
font-size:17px;
line-height:1.7;
color:#eee;
}
.footer-box ul{
padding:0;
list-style:square;
}

.footer-box li{
margin-bottom:15px;
}

.footer-box a{
color:white;
text-decoration:none;

}
.social{
display:flex;
gap:12px;
margin-top:30px;
}

.social a{
width:45px;
height:45px;
border:1px solid #333;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
}

.footer-bottom{
margin-top:50px;
border-top:1px solid #333;
text-align:center;
padding:35px;
font-size:18px;

}

.top-btn{
position:absolute;
right:30px;
bottom:25px;
width:50px;
height:50px;
border-radius:50%;
border:1px solid #ddd;
background:#eee;
font-size:30px;
color:#b69b65;

}

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


@media(max-width:991px){

    .footer-container{
        width:90%;
        grid-template-columns:repeat(2,1fr);
        gap:30px;
    }


    .footer-logo{
        width:300px;
    }


    .footer-box p{
        font-size:16px;
    }


    .footer-bottom{
        font-size:16px;
    }


}



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


@media(max-width:576px){


    .main-footer{
        padding-top:40px;
    }


    .footer-container{

        width:90%;
        grid-template-columns:1fr;
        text-align:center;
        gap:25px;

    }


    .footer-logo{

        width:280px;
        margin:auto;

    }


    .footer-box ul{

        list-style:none;
        padding:0;

    }


    .social{

        justify-content:center;
        margin-top:20px;

    }


    .social a{

        width:40px;
        height:40px;

    }


    .footer-box h3{

        font-size:20px;

    }


    .footer-box p{

        font-size:15px;

    }



    .footer-bottom{

        margin-top:30px;
        padding:25px 10px;
        font-size:14px;

    }



    .top-btn{

        right:15px;
        bottom:15px;

        width:45px;
        height:45px;

        font-size:24px;

    }

}