/*==================================================
CODPAC FOOTER
Part 5
==================================================*/

.codpac-footer{

    position:relative;

    width:100%;

    overflow:hidden;

    background:#080808;

    color:#fff;

}

/*==============================
INNER
==============================*/

.footer-inner{

    position:relative;

    width:min(1400px,90%);

    margin:auto;

    padding:110px 0 45px;

    z-index:5;

}

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

.footer-grid{

    position:absolute;

    inset:0;

    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:60px 60px;

}

/*==============================
RED GLOW
==============================*/

.footer-glow{

    position:absolute;

    border-radius:50%;

    filter:blur(150px);

    pointer-events:none;

}

.footer-glow-left{

    width:450px;

    height:450px;

    top:-120px;

    left:-150px;

    background:#fa0105;

    opacity:.18;

}

.footer-glow-right{

    width:350px;

    height:350px;

    right:-120px;

    bottom:-100px;

    background:#fa0105;

    opacity:.10;

}

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

.footer-main{

    display:grid;
        grid-template-columns: 48% 16% 18% 18%;
    gap:40px

}

/*==============================
LEFT
==============================*/

.footer-left{

    padding-right:20px;
    max-width:620px;

}

.footer-logo img{

    width:190px;

    margin-bottom:35px;

}

.footer-badge{

    display:inline-flex;

    padding:10px 20px;

    border-radius:50px;

    background:#151515;

    border:1px solid rgba(255,255,255,.08);

    color:#fa0105;

    font-size:13px;

    letter-spacing:.7px;

    margin-bottom:30px;

}

.footer-left h2{

    font-size:42px;

    line-height:1.08;

    font-weight:800;

    margin-bottom:28px;

}

.footer-left h2 span{

    display:block;

    color:#fa0105;

}

.footer-left p{

    color:#a5a5a5;

    font-size:18px;

    line-height:34px;

    max-width:620px;

    margin-bottom:42px;

}

/*==============================
BUTTON
==============================*/

.footer-btn{

    display:inline-flex;

    align-items:center;

    gap:12px;

    text-decoration:none;

    padding:18px 38px;

    background:#fa0105;

    color:#fff;

    border-radius:60px;

    font-weight:700;

    transition:.35s;

}

.footer-btn:hover{

    background:#fff;

    color:#111;

}

/*==============================
RIGHT
==============================*/

.footer-right{

     display:grid;

  grid-template-columns:minmax(150px,170px)
                          minmax(200px,240px)
                          minmax(260px,320px);

    justify-content:space-between;

    column-gap:40px;

}

/*==============================
COLUMN
==============================*/

.footer-column{

    position:relative;
        padding-right:20px;

}

.footer-column:not(:last-child){

    border-right:1px solid rgba(255,255,255,.08);

    padding-right:40px;

}

.footer-column h4{

    font-size:18px;

    margin-bottom:30px;

    color:#fff;

}

.footer-column ul{

    padding:0;

    margin:0;

    list-style:none;

}

.footer-column li{

    margin-bottom:18px;

}

.footer-column a{

    text-decoration:none;

    color:#a9a9a9;

    transition:.3s;

}

.footer-column a:hover{

    color:#fff;

    padding-left:8px;

}

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

.footer-contact li{

    display:flex;

    align-items:flex-start;

    gap:18px;

    margin-bottom:26px;

}

.footer-contact i{

    width:48px;

    height:48px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#151515;

    color:#fa0105;

    flex-shrink:0;

}

.footer-contact strong{

    display:block;

    color:#fff;

    margin-bottom:6px;

}

.footer-contact span{

    color:#9f9f9f;

    line-height:28px;

}

.footer-contact a{

    color:#9f9f9f;

}


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

.footer-divider{

    width:100%;

    height:1px;

    margin:80px 0 35px;

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

}

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

.footer-bottom{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:30px;

}

.footer-copyright{

    color:#8e8e8e;

    font-size:15px;

    letter-spacing:.4px;

}

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

.footer-social{

    display:flex;

    align-items:center;

    gap:15px;

}

.footer-social a{

    width:48px;

    height:48px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    text-decoration:none;

    background:#151515;

    color:#fff;

    transition:.35s ease;

}

.footer-social a:hover{

    background:#fa0105;

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(250,1,5,.30);

}

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

.scroll-top{

    position:fixed;

    right:30px;

    bottom:30px;

    width:58px;

    height:58px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#fa0105;

    color:#fff;

    text-decoration:none;

    font-size:18px;

    z-index:999;

    transition:.35s;

}

.scroll-top:hover{

    transform:translateY(-8px);

    background:#ff2b2b;

}

/*=========================================
HOVER
=========================================*/

.footer-column li{

    transition:.3s;

}

.footer-column li:hover{

    transform:translateX(8px);

}

.footer-logo img{

    transition:.35s;

}

.footer-logo:hover img{

    transform:scale(1.05);

}

.footer-btn{

    transition:.35s;

}

.footer-btn:hover{

    transform:translateY(-6px);

}

.footer-contact i{

    transition:.35s;

}

.footer-contact li:hover i{

    background:#fa0105;

    color:#fff;

}

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

@media(max-width:1200px){

    .footer-main{

        grid-template-columns:1fr;

        gap:70px;

    }

    .footer-right{

        grid-template-columns:repeat(3,1fr);

    }

}

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

@media(max-width:768px){

    .footer-inner{

        width:92%;

        padding:70px 0;

    }

    .footer-left h2{

        font-size:40px;

    }

    .footer-left p{

        font-size:16px;

        line-height:30px;

    }

    .footer-right{

        grid-template-columns:1fr;

        gap:50px;

    }

    .footer-column{

        border-right:none !important;

        padding-right:0 !important;

    }

    .footer-bottom{

        flex-direction:column;

        align-items:flex-start;

        gap:25px;

    }

}

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

@media(max-width:576px){

    .footer-left h2{

        font-size:32px;

    }

    .footer-logo img{

        width:160px;

    }

    .footer-btn{

        width:100%;

        justify-content:center;

    }

    .footer-social{

        flex-wrap:wrap;

    }

    .scroll-top{

        right:20px;

        bottom:20px;

        width:50px;

        height:50px;

    }

}