@media(max-width:992px){

   


.va-welcome{

    align-items:flex-start;

}

.va-welcome-icon{

    width:56px;

    height:56px;

}

.va-welcome-text h2{

    font-size:28px;

}

}

@media(max-width:768px){

    .va-header{

        height:84px;

        padding:12px 18px;

    }

    .va-logo{

        height:50px;

    }

}
@media(max-width:768px){

    .va-grid{

        grid-template-columns:1fr;

    }

}

/*======================================================
Mobile Layout
======================================================*/

@media (max-width:992px){



    .va-bottom-nav{

        display:flex;

    }

    .va-content{

        padding-bottom:95px;

    }

}


@media(max-width:768px){

    .va-nav{

        display:none;

    }

}




/*======================================================
Responsive Hero
======================================================*/

@media (max-width:992px){

    .va-hero-grid{
        grid-template-columns:1fr;
        text-align:center;
        gap:50px;
    }

    .va-hero-buttons{
        justify-content:center;
    }

    .va-hero h1{
        font-size:42px;
    }

}

@media (max-width:768px){

    .va-hero{
        padding:60px 0;
    }

    .va-hero h1{
        font-size:34px;
        line-height:1.2;
    }

    .va-hero p{
        font-size:17px;
    }

    .va-hero-buttons{
        justify-content:center;
        margin-bottom:30px;
    }

}

/*======================================================
Desktop / Mobile Hero Image
======================================================*/


.hero-image{
    display:flex;
    justify-content:center;
    align-items:center;
}

.hero-image img{
    width:100%;
    height:auto;
    display:block;
}

.hero-mobile{
    display:none;
}

.hero-desktop{
    display:block;
}

@media (max-width:768px){

    .hero-desktop{
        display:none;
    }

    .hero-mobile{
        display:block;
        width:65%;
        max-width:280px;
        margin:30px auto 0;
    }

}


/*======================================================
Features
======================================================*/

@media(max-width:992px){

    .va-feature-grid{

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

    }

}

@media(max-width:768px){

    .va-features{

        padding:70px 0;

    }

    .va-section-title h2{

        font-size:32px;

    }

    .va-section-title p{

        font-size:16px;

    }

    .va-feature-grid{

        grid-template-columns:1fr;

        gap:20px;

    }

    .va-feature-card{

        padding:28px;

    }

}


/*======================================================
Workflow Responsive
======================================================*/

@media(max-width:992px){

    .va-workflow-grid{

        grid-template-columns:1fr;

        gap:25px;

    }

    .workflow-arrow{

        transform:rotate(90deg);

        font-size:32px;

    }

}

/*====================================================
Benefits
====================================================*/

@media(max-width:768px){

    .va-benefits{

        padding:80px 0;

    }

    .va-benefits-grid{

        max-width:100%;

        margin-top:50px;

    }

    .va-benefit{

        display:flex;

        align-items:flex-start;

        gap:18px;

    }

    .va-benefit h3{

        font-size:22px;

    }

}

/*====================================================
Testimonials
====================================================*/

@media(max-width:992px){

    .va-testimonial-card{

        flex:0 0 calc(50% - 20px);

    }

}

@media(max-width:768px){

    .va-testimonials{

        padding:80px 0;

    }

    .va-testimonial-card{

        flex:0 0 100%;

        margin:0;

        padding:30px;

        text-align:center;

    }

    .va-slider-btn{

        display:none;

    }

}


/*====================================================
CTA
====================================================*/

@media(max-width:768px){

    .va-cta{

        padding:80px 0;

    }

    .va-cta-box{

        padding:50px 30px;

        border-radius:22px;

    }

    .va-cta h2{

        font-size:36px;

    }

    .va-cta p{

        font-size:17px;

    }

    .va-cta-buttons{

        flex-direction:column;

        gap:15px;

    }

    .va-cta-buttons a{

        width:100%;

    }

}

/*====================================================
Footer
====================================================*/

@media (max-width:768px){

    .va-footer{

        padding:60px 0 100px;
         padding-bottom:95px;

    }

    .va-footer-grid{

        grid-template-columns:1fr;

        gap:40px;

        text-align:center;

    }

    .va-footer-brand{

        display:flex;

        flex-direction:column;

        align-items:center;

    }

    .va-footer-brand img{

        height:85px;

        margin-bottom:20px;

    }

    .va-footer-brand p{

        max-width:100%;

    }

    .va-footer-links{

        align-items:center;

    }

    .va-footer-bottom{

        margin-top:40px;

    }

}

/*====================================================
Landing Mobile Navigation
====================================================*/

@media (max-width:768px){

    .va-landing-mobile-nav{

        position:fixed;

        bottom:0;

        left:0;

        width:100%;

        height:72px;

        display:flex;

        justify-content:space-around;

        align-items:center;

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

        backdrop-filter:blur(16px);

        -webkit-backdrop-filter:blur(16px);

        border-top:1px solid #e5e7eb;

        box-shadow:0 -10px 25px rgba(0,0,0,.08);

        z-index:9999;

    }

    .va-landing-mobile-nav a{

        position:relative;

        flex:1;

        height:100%;

        display:flex;

        flex-direction:column;

        justify-content:center;

        align-items:center;

        gap:5px;

        text-decoration:none;

        color:#64748b;

        font-size:12px;

        font-weight:600;

        transition:all .25s ease;

    }

    .va-landing-mobile-nav a i{

        width:22px;

        height:22px;

        stroke-width:2;

    }

    .va-landing-mobile-nav a span{

        line-height:1;

    }

    .va-landing-mobile-nav a:hover{

        color:#ff6b00;

    }

    .va-landing-mobile-nav a:active{

        transform:scale(.92);

    }

    .va-landing-mobile-nav a.active{

        color:#ff6b00;

    }

    .va-landing-mobile-nav a.active::before{

        content:"";

        position:absolute;

        top:0;

        left:50%;

        transform:translateX(-50%);

        width:28px;

        height:3px;

        background:#ff6b00;

        border-radius:30px;

    }

}


/*====================================================
Scroll Top Mobile
====================================================*/

@media(max-width:768px){

    .va-scroll-top{

        bottom:90px;

        right:18px;

        width:48px;

        height:48px;

    }

}