/* ===========================
   FOOTER CTA
=========================== */

.footer{

    background:#000;

}

.footer-cta{

    padding:120px 0 100px;

    text-align:center;

    border-top:1px solid rgba(255,255,255,.08);

}

.footer-cta .section-tag{

    display:inline-block;

    margin-bottom:18px;

}

.footer-cta h2{

    font-size:clamp(2.5rem,5vw,4rem);

    line-height:1.15;

    margin-bottom:24px;

}

.footer-cta p{

    max-width:720px;

    margin:0 auto 45px;

    color:var(--text-light);

    line-height:1.8;

    font-size:1.05rem;

}

.cta-button{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:18px 42px;

    border-radius:999px;

    background:var(--primary-color);

    color:#fff;

    font-weight:600;

    transition:.35s ease;

}

.cta-button:hover{

    transform:translateY(-4px);

    background:var(--secondary-color);

}

/* ===========================
   FOOTER MAIN
=========================== */

.footer-main{

    padding:70px 0;

    border-top:1px solid rgba(255,255,255,.08);

}

.footer-grid{

    display:grid;

    grid-template-columns:2fr 1fr 1.3fr;

    gap:60px;

    align-items:start;

}

.footer-logo{

    width:180px;

    margin-bottom:24px;

}

.footer-description{

    color:var(--text-light);

    line-height:1.9;

    max-width:420px;

}

.footer-column h3{

    font-size:1.2rem;

    margin-bottom:24px;

}

.footer-column ul{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.footer-column a{

    color:var(--text-light);

    transition:.3s ease;

}

.footer-column a:hover{

    color:#fff;

}

/* ===========================
   SOCIAL
=========================== */

.footer-social{

    margin-top:40px;

    padding-top:35px;

    border-top:1px solid rgba(255,255,255,.08);

}

.social-links{

    display:flex;

    align-items:center;

    gap:18px;

}

.social-links a{

    color:var(--text-light);

    transition:.3s ease;

}

.social-links a{

    width:46px;

    height:46px;

    display:flex;

    align-items:center;

    justify-content:center;

    border:1px solid rgba(255,255,255,.12);

    border-radius:50%;

    color:#fff;

    font-size:18px;

    transition:.35s ease;

}

.social-links a:hover{

    background:var(--primary-color);

    border-color:var(--primary-color);

}

.social-links a:hover{

    color:#fff;

    transform:translateX(6px);

}

/* ===========================
   FOOTER ANIMATION
=========================== */

.footer .section-tag,
.footer-cta h2,
.footer-cta p,
.cta-button,
.footer-column{

    opacity:0;

    transform:translateY(40px);

    transition:
        opacity .8s cubic-bezier(.22,1,.36,1),
        transform .8s cubic-bezier(.22,1,.36,1);

}

.footer.active .section-tag{

    opacity:1;

    transform:translateY(0);

    transition-delay:.10s;

}

.footer.active .footer-cta h2{

    opacity:1;

    transform:translateY(0);

    transition-delay:.25s;

}

.footer.active .footer-cta p{

    opacity:1;

    transform:translateY(0);

    transition-delay:.40s;

}

.footer.active .cta-button{

    opacity:1;

    transform:translateY(0);

    transition-delay:.55s;

}

.footer.active .footer-column:nth-child(1){

    opacity:1;

    transform:translateY(0);

    transition-delay:.75s;

}

.footer.active .footer-column:nth-child(2){

    opacity:1;

    transform:translateY(0);

    transition-delay:.90s;

}

.footer.active .footer-column:nth-child(3){

    opacity:1;

    transform:translateY(0);

    transition-delay:1.05s;

}

/* ===========================
   FOOTER BOTTOM
=========================== */

.footer-bottom{

    padding:28px 0;

    border-top:1px solid rgba(255,255,255,.08);

    text-align:center;

}

.footer-bottom p{

    color:var(--text-light);

    font-size:.95rem;

    letter-spacing:.3px;

}

.footer-bottom{

    opacity:0;

    transform:translateY(30px);

    transition:
        opacity .8s cubic-bezier(.22,1,.36,1),
        transform .8s cubic-bezier(.22,1,.36,1);

}

.footer.active .footer-bottom{

    opacity:1;

    transform:translateY(0);

    transition-delay:1.20s;

}

/* ===========================
   FOOTER RESPONSIVE
=========================== */

@media (max-width:992px){

    .footer-cta{

        padding:90px 0 80px;

    }

    .footer-grid{

        grid-template-columns:1fr;

        gap:45px;

        text-align:center;

    }

    .footer-description{

        max-width:100%;

        margin:auto;

    }

    .footer-logo{

        margin:0 auto 24px;

    }

    .social-links{

        justify-content:center;

    }

}

@media (max-width:768px){

    .footer-cta{

        padding:70px 0 60px;

    }

    .footer-cta h2{

        font-size:2rem;

    }

    .footer-cta p{

        font-size:.95rem;

    }

    .cta-button{

        width:100%;

        justify-content:center;

    }

    .footer-main{

        padding:50px 0;

    }

    .footer-column h3{

        margin-bottom:18px;

    }

    .footer-column ul{

        gap:14px;

    }

    .footer-social{

        margin-top:30px;

        padding-top:25px;

    }

    .social-links{

        gap:14px;

        flex-wrap:wrap;

    }

}