.footer-section{
    position:relative;
    width:100%;
    min-height:100vh;
    background:url("../assets/images/16.png") center center/cover no-repeat;
    color:#fff;
    overflow:hidden;
}

.footer-section::before{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.28);
}

.footer-content{
    position:relative;
    z-index:1;
    width:100%;
    min-height:100vh;
    padding:10vh 7vw 30px;
    box-sizing:border-box;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}

.footer-main{
    max-width:850px;
    margin:0 auto;
    text-align:center;
}

.footer-main h2{
    margin:0 0 32px;
    font-family:var(--heading);
    font-size:clamp(1.5rem,5vw,5.8rem);
    font-weight:600;
    line-height:1.08;
    text-align: center;
}

.footer-main p{
    max-width:620px;
    margin-left:auto;
    margin-right:auto;
    font-family:var(--body);
    font-size:clamp(1rem,1.4vw,1.25rem);
    line-height:1.7;
    text-align: center;
}

.footer-main h3{
    margin-bottom: 30px;
    font-family:var(--heading);
    font-size:clamp(1.5rem,2.5vw,2.5rem);
    font-weight:500;
    text-align: center;
}

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

.footer-envelope{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:1rem;
    opacity:.95;
}

.footer-envelope i{
    font-size:1.25rem;
}

.footer-copyright{
    margin:0;
    font-family:var(--body);
    font-size:.8rem;
    letter-spacing:.04em;
    opacity:.8;
}

/* ===========================
   DESKTOP LARGE
=========================== */
@media (min-width:1600px){
    .footer-content{
        padding:11vh 8vw 35px;
    }

    .footer-main{
        max-width:950px;
    }

    .footer-main h2{
        font-size:6rem;
        margin-bottom:38px;
    }

    .footer-main p{
        max-width:700px;
        font-size:1.3rem;
    }
}

/* ===========================
   DESKTOP
=========================== */
@media (min-width:1200px){
    .footer-content{
        padding:10vh 7vw 30px;
    }

    .footer-main h2{
        font-size:3rem;
    }

    .footer-main h3{
        margin-top: 30px;
    }
}

/* ===========================
   DESKTOP SMALL
=========================== */
@media (min-width:1025px){
    .footer-content{
        padding-top:9vh;
    }
}

/* ===========================
   TABLET LARGE
=========================== */
@media (max-width:1199px){
    .footer-content{
        padding:9vh 6vw 28px;
    }

    .footer-main{
        max-width:760px;
    }

    .footer-main h2{
        font-size:4.2rem;
    }

    .footer-main h3{
        font-size: 1.9rem;
        margin-top: 20px;
    }
}

/* ===========================
   TABLET
=========================== */
@media (max-width:1024px){
    .footer-content{
        padding:9vh 6vw 25px;
    }

    .footer-main h2{
        font-size:50px;
    }

    .footer-main p{
        max-width:560px;
        font-size:1.05rem;
    }

    .footer-main h3{
        margin-top: 30px;
    }
}

/* ===========================
   TABLET SMALL
=========================== */
@media (max-width:992px){
    .footer-content{
        padding:8vh 6vw 25px;
    }

    .footer-main h2{
        font-size:3.5rem;
        text-align: center;
    }
}

/* ===========================
   MOBILE
=========================== */
@media (max-width:768px){
    .footer-content{
        padding:8vh 25px 22px;
    }

    .footer-main{
        max-width:100%;
    }

    .footer-main h2{
        font-size:3rem;
        line-height:1.12;
        margin-bottom:25px;
    }

    .footer-main p{
        font-size:1rem;
        line-height:1.6;
        margin-bottom:24px;
    }

    .footer-main h3{
        font-size:1.7rem;
    }
}

/* ===========================
   MOBILE SMALL
=========================== */
@media (max-width:480px){
    .footer-content{
        padding:7vh 20px 20px;
    }

    .footer-main h2{
        font-size:2.2rem;
        margin-bottom:22px;
    }

    .footer-main p{
        font-size:.95rem;
    }

    .footer-main h3{
        font-size:1.45rem;
    }

    .footer-envelope{
        font-size:.9rem;
    }

    .footer-copyright{
        font-size:.72rem;
    }
}

/* ===========================
   MOBILE EXTRA SMALL
=========================== */
@media (max-width:420px){
    .footer-content{
        padding:6vh 18px 18px;
    }

    .footer-main h2{
        font-size:2.2rem;
    }

    .footer-main p{
        font-size:.9rem;
    }

    .footer-main h3{
        font-size:1.3rem;
    }
}

/* ===========================
   MOBILE TINY
=========================== */
@media (max-width:360px){
    .footer-content{
        padding:5vh 15px 16px;
    }

    .footer-main h2{
        font-size:1.95rem;
    }

    .footer-main p{
        font-size:.85rem;
    }

    .footer-main h3{
        font-size:1.15rem;
    }

    .footer-copyright{
        font-size:.68rem;
    }
}

/* ========================================
   FOOTER ANIMATION
======================================== */
.footer-main,
.footer-bottom{
    opacity:0;
    transform:translateY(35px);
    transition:
        opacity 1.2s ease,
        transform 1.2s ease;
}

.footer-section.is-visible .footer-main{
    opacity:1;
    transform:translateY(0);
    transition-delay:.2s;
}

.footer-section.is-visible .footer-bottom{
    opacity:1;
    transform:translateY(0);
    transition-delay:.5s;
}