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

.footer{
    background:#b30000;
    color:#fff;
    padding-top:40px;
    margin-top:30px;
}

.footer-container{
    width:90%;
    max-width:1400px;
    margin:auto;

    display:grid;
    grid-template-columns:
    1.5fr 1fr 1fr 1fr;

    gap:50px;
}

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

.footer-logo{
    width:220px;
    margin-bottom:15px;
}

.footer-about h3{
    font-size:24px;
    margin-bottom:15px;
    color:#fff;
}

.footer-about p{
    font-size:15px;
    line-height:1.9;
    color:#f2f2f2;
}

/* =========================
   HEADING
========================= */

.footer-col h4{
    font-size:22px;
    margin-bottom:25px;
    color:#ffb347;
    position:relative;
}

.footer-col h4::after{
    content:'';
    position:absolute;
    left:0;
    bottom:-8px;
    width:50px;
    height:3px;
    background:#ffb347;
}

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

.footer-col ul{
    list-style:none;
}

.footer-col ul li{
    margin-bottom:12px;
}

.footer-col ul li a{
    color:#fff;
    text-decoration:none;
    transition:.3s;
    font-size:15px;
}

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

/* =========================
   CONTACT
========================= */

.footer-contact i{
    width:25px;
    color:#ffcc70;
}

.footer-contact a{
    display:flex;
    align-items:center;
    gap:10px;
}

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

.footer-bottom{
    border-top:1px solid rgba(255,255,255,.2);
    margin-top:50px;
    padding:20px 0;
    text-align:center;
}

.footer-bottom p{
    margin:0;
    font-size:14px;
}

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

@media(max-width:991px){

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

}

@media(max-width:768px){

    .footer{
        padding-top:50px;
    }

    .footer-container{
        grid-template-columns:1fr;
        text-align:center;
    }

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

    .footer-contact a{
        justify-content:center;
    }

    .footer-logo{
        margin:auto auto 15px;
        display:block;
    }

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

}