/* =========================================================
   ATHARV NEXUS - CLEAN RESPONSIVE CSS
   =========================================================
   • Header / navbar styling is intentionally excluded.
   • Duplicate media-query rules have been consolidated.
   • Mobile / tablet / desktop breakpoints are kept consistent.
   • Hero text and images are protected from overflow/cropping.
   ========================================================= */

*, *::before, *::after{
    box-sizing:border-box;
}

html, body{
    max-width:100%;
    overflow-x:hidden;
}

img{
    max-width:100%;
    height:auto;
}

.hero-image img{
    max-height:none !important;
    object-fit:contain !important;
    object-position:center !important;
}

.hero-bg{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    overflow:hidden;
    z-index:0;
}

.hero-bg img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
}

/* =========================================================
   HERO CONTAINER - DESKTOP WIDTH
   ========================================================= */
.hero-container{
    width:min(1180px, calc(100% - 200px));
    max-width:1180px;
    margin-left:auto;
    margin-right:auto;
    min-width:0;
}

.hero-content,
.hero-image{
    min-width:0;
}

.hero-content h1,
.hero-content > p{
    overflow-wrap:break-word;
    word-wrap:break-word;
}

.hero-content h1{
    max-width:760px;
    margin-left:auto;
    margin-right:auto;
    text-wrap:balance;
}

.hero-content > p{
    max-width:680px;
}

.hero-buttons{
    flex-wrap:wrap;
}

.hero-buttons a{
    max-width:100%;
}

.hero-image img{
    display:block;
    width:auto;
    max-width:100%;
    height:auto;
    object-fit:contain;
    object-position:center;
}



@media (max-width:1300px){

    .hero-container{
        width:min(1180px, calc(100% - 120px));
    }

    .about-section{
        padding:90px 25px;
    }

    .about-container{
        gap:40px;
    }

    .about-images{
        width:50%;
        min-height:730px;
    }

    .about-image-one{
        width:65%;
        height:460px;
    }

    .about-image-two{
        top:445px;
        width:86%;
        height:400px;
    }

    .experience-badge{
        left:37%;
        width:110px;
        height:275px;
    }

    .experience-text{
        height:178px;
        font-size:22px;
    }

    .experience-number{
        width:88px;
        height:88px;
        font-size:44px;
    }

    .about-content h2{
        font-size:31px;
    }

    .about-content p{
        font-size:15px;
    }

    .about-features{
        margin-top:55px;
        gap:25px;
    }

    .feature-icon{
        width:66px;
        height:66px;
        font-size:24px;
    }

    .feature-text h4{
        font-size:17px;
    }

    .why-grid{
        gap:70px;
    }

    .why-image > img{
        height:520px;
    }

    .floating-card{
        left:-25px;
        bottom:30px;
    }

    .hero-section{
        width:100%;
        overflow:hidden;
    }

    .hero-slider{
        width:100%;
        height:auto;
        min-height:600px;
        overflow:hidden;
    }

    .hero-container{
        gap:40px;
        width:min(1180px, calc(100% - 200px));
    }

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

    .hero-image img{
        display:block;
        width:100%;
        max-width:500px;
        height:auto;
        object-fit:contain;
    }

}



@media (max-width:1100px){

    .hero-container{
        width:min(100%, calc(100% - 80px));
    }

    .hero-slider{
        width:100%;
        height:auto;
        min-height:620px;
        overflow:hidden;
    }

    .hero-section{
        width:100%;
        min-height:auto;
        overflow:hidden;
    }

    .hero-content h1{
        font-size:44px;
        line-height:1.2;
    }

    .hero-image img{
        max-width:450px;
        width:100%;
        height:auto;
        display:block;
        max-height:none;
        object-fit:contain;
    }

    .services-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
        padding: 0px 50px;
    }

    .stats-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .process-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .projects-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .testimonial-section{
        padding:75px 0;
    }

    .testimonial-section .container{
        width:90%;
        max-width:100%;
    }

    .testimonial-grid{
        display:flex;
        flex-wrap:wrap;
        gap:22px;
    }

    .testimonial-card{
        width:calc(33.333333% - 15px);
        flex:0 0 calc(33.333333% - 15px);
        padding:29px 25px 26px;
        box-sizing:border-box;
    }

    .testimonial-section .section-heading h2{
        font-size:38px;
    }

    .client-logo-section{
        padding:30px 35px;
    }

    .client-logo-slider{
        width:100%;
        height:90px;
    }

    .client-logo-track{
        gap:25px;
        padding:0 48px;
    }

    .client-logo{
        width:145px;
        height:70px;
    }

    .client-logo img{
        max-width:135px;
        max-height:58px;
    }

    .why-grid{
        gap:45px;
    }

    .why-content > p{
        max-width:100%;
        font-size:14px;
        line-height:1.7;
    }

    .why-list{
        grid-template-columns:1fr 1fr;
        gap:22px 16px;
    }

    .why-item{
        gap:12px;
    }

    .why-icon{
        flex:0 0 42px;
        width:42px;
        height:42px;
        font-size:15px;
    }

    .why-item h3{
        font-size:13px;
        line-height:1.4;
    }

    .why-item p{
        font-size:11px;
        line-height:1.6;
    }

    .why-image > img{
        height:480px;
        border-radius:16px;
    }

    .floating-card{
        left:-18px;
        bottom:25px;
        gap:10px;
        padding:14px 16px;
    }

    .floating-card-icon{
        width:38px;
        height:38px;
        flex:0 0 38px;
    }

    .floating-card strong{
        font-size:12px;
    }

    .floating-card span{
        font-size:9px;
    }

    .hero-container{
        min-height:620px;
        gap:30px;
        width:min(100%, calc(100% - 180px));
        max-width:1180px;
        margin-left:auto;
        margin-right:auto;
    }

    .hero-content{
        width:100%;
        min-width:0;
    }

    .hero-image{
        width:100%;
        max-width:500px;
        margin:auto;
        display:flex;
        justify-content:center;
        align-items:center;
    }

}



@media (max-width:991px){

    .hero-container{
        width:calc(100% - 50px);
        max-width:900px;
    }

    .about-section{
        padding:80px 25px;
    }

    .about-container{
        display:flex;
        flex-direction:column;
        gap:50px;
    }

    .about-images{
        width:100%;
        max-width:750px;
        min-height:650px;
        margin:0 auto;
    }

    .about-image-one{
        width:62%;
        height:410px;
    }

    .about-image-two{
        top:395px;
        width:82%;
        height:330px;
    }

    .experience-badge{
        top:45px;
        left:90%;
        width:105px;
        height:255px;
    }

    .experience-text{
        height:165px;
        font-size:21px;
    }

    .experience-number{
        width:82px;
        height:82px;
        font-size:42px;
    }

    .about-content{
        width:100%;
        padding:0;
    }

    .about-small-title{
        margin-bottom:30px;
        text-align:left;
    }

    .about-content h2{
        font-size:30px;
    }

    .about-content p{
        font-size:15px;
        line-height:1.7;
    }

    .about-features{
        margin-top:45px;
    }

    .about-bottom{
        margin-top:45px;
    }

    .pricing-grid, .team-grid, .why-grid, .blog-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .why-section{
        padding-left:25px;
        padding-right:25px;
    }

    .why-section .container{
        width:100%;
        max-width:100%;
    }

    .why-grid{
        grid-template-columns:1fr;
        gap:50px;
    }

    .why-content{
        width:100%;
        max-width:800px;
        margin:0 auto;
    }

    .why-content > p{
        max-width:700px;
        font-size:14px;
        line-height:1.75;
    }

    .why-list{
        grid-template-columns:1fr 1fr;
        gap:25px 20px;
    }

    .why-item{
        gap:14px;
    }

    .why-icon{
        flex:0 0 45px;
        width:45px;
        height:45px;
        font-size:16px;
    }

    .why-item h3{
        font-size:14px;
    }

    .why-item p{
        font-size:11px;
        line-height:1.65;
    }

    .why-image{
        width:100%;
        max-width:750px;
        margin:0 auto;
    }

    .why-image > img{
        width:100%;
        height:500px;
        object-fit:cover;
        border-radius:18px;
    }

    .floating-card{
        left:20px;
        bottom:25px;
    }

    .hero-section{
        width:100%;
        min-height:auto;
        overflow:hidden;
    }

    .hero-slider{
        width:100%;
        height:auto;
        min-height:650px;
        overflow:hidden;
    }

    .hero-slide{
        width:100%;
        min-height:650px;
        height:auto;
        overflow:hidden;
    }

    .hero-container{
        width:100%;
        min-height:650px;
        height:auto;
        padding:65px 30px;
        display:flex;
        flex-direction:column;
        justify-content:center;
        align-items:center;
        gap:35px;
    }

    .hero-content{
        width:100%;
        max-width:700px;
    }

    .hero-content h1{
        font-size:40px;
        line-height:1.2;
    }

    .hero-content > p{
        max-width:650px;
    }

    .hero-image{
        width:100%;
        max-width:600px;
        margin:0 auto;
        display:flex;
        justify-content:center;
        align-items:center;
        overflow:visible;
    }

    .hero-image img{
        display:block;
        width:100%;
        max-width:420px;
        height:auto;
        max-height:none;
        object-fit:contain;
        object-position:center;
    }

    .hero-bg{
        width:100%;
        height:100%;
    }

    .hero-bg img{
        width:100%;
        height:100%;
        object-fit:cover;
        object-position:center center;
    }

}



@media (max-width:900px){

    .hero-container{
        grid-template-columns:1fr;
        text-align:center;
        min-height:680px;
        height:auto;
        padding:60px 25px 70px;
        display:flex;
        flex-direction:column;
        justify-content:center;
        align-items:center;
        gap:30px;
    }

    .hero-content{
        width:100%;
        max-width:650px;
        order:1;
        text-align:center;
    }

    .hero-content > p{
        max-width:600px;
    }

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

    .hero-image{
        width:100%;
        max-width:550px;
        margin:auto;
        order:2;
        display:flex;
        justify-content:center;
        align-items:center;
        overflow:visible;
    }

    .about-container{
        grid-template-columns:1fr;
        gap:50px;
    }

    .about-image{
        width:100%;
        max-width:650px;
        margin:auto;
    }

    .appointment-container{
        grid-template-columns:1fr;
    }

    .appointment-info{
        width:100%;
        max-width:700px;
    }

    .pricing-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .team-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .why-grid{
        grid-template-columns:1fr;
        display:grid;
        gap:45px;
    }

    .blog-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .testimonial-section{
        padding:70px 0;
    }

    .testimonial-section .section-heading{
        margin-bottom:40px;
    }

    .testimonial-section .section-heading h2{
        font-size:35px;
    }

    .testimonial-grid{
        gap:20px;
    }

    .testimonial-card{
        width:calc(50% - 10px);
        flex:0 0 calc(50% - 10px);
        padding:28px 25px;
    }

    .testimonial-card > p{
        font-size:14px;
        line-height:1.75;
    }

    .why-content{
        text-align:left;
    }

    .why-content > p{
        margin-bottom:30px;
    }

    .why-list{
        grid-template-columns:1fr 1fr;
        gap:22px 18px;
    }

    .why-image{
        max-width:700px;
    }

    .why-image > img{
        height:450px;
    }

    .hero-slider{
        min-height:680px;
        height:auto;
    }

    .hero-slide{
        min-height:680px;
        height:auto;
    }

    .hero-content h1{
        font-size:38px;
        line-height:1.2;
    }

    .hero-image img{
        width:100%;
        max-width:380px;
        height:auto;
        max-height:none;
        object-fit:contain;
    }

    .hero-image::before{
        width:330px;
        height:330px;
    }

}



@media (max-width:767px){

    html, body{
        width:100%;
        max-width:100%;
        overflow-x:hidden !important;
    }

    .container{
        width:100%;
        max-width:100%;
        padding-left:15px;
        padding-right:15px;
        box-sizing:border-box;
    }

    .hero-section{
        width:100%;
        min-height:auto;
        padding:0;
        overflow:hidden;
    }

    .hero-slider{
        width:100%;
        height:auto;
        min-height:720px;
        overflow:hidden;
    }

    .hero-slide{
        position:absolute;
        width:100%;
        min-height:720px;
        height:100%;
        overflow:hidden;
    }

    .hero-container{
        width:100%;
        min-height:720px;
        height:auto;
        padding:55px 20px 70px;
        display:flex;
        flex-direction:column;
        justify-content:center;
        align-items:center;
        text-align:center;
        gap:28px;
        box-sizing:border-box;
    }

    .hero-content{
        width:100%;
        max-width:600px;
        order:1;
        text-align:center;
        min-width:0;
    }

    .hero-content h1{
        width:100%;
        max-width:100%;
        font-size:32px;
        line-height:1.2;
        word-wrap:break-word;
        word-break:normal;
        overflow-wrap:break-word;
    }

    .hero-content h1 span{
        display:block;
    }

    .hero-content > p{
        width:100%;
        max-width:560px;
        margin-bottom:25px;
        font-size:14px;
        line-height:1.7;
    }

    .hero-small-title{
        font-size:11px;
    }

    .hero-buttons{
        width:100%;
        display:flex;
        flex-direction:column;
        justify-content:center;
        align-items:center;
        gap:12px;
    }

    .hero-buttons a{
        width:100%;
        max-width:320px;
        box-sizing:border-box;
    }

    .primary-btn, .secondary-btn, .white-btn{
        min-height:48px;
        padding:0 20px;
        font-size:14px;
        box-sizing:border-box;
    }

    .hero-image{
        width:100%;
        max-width:100%;
        order:2;
        display:flex;
        justify-content:center;
        align-items:center;
        overflow:visible;
        min-width:0;
    }

    .hero-image img{
        width:auto;
        max-width:90%;
        max-height:none;
        height:auto;
        object-fit:contain;
        display:block;
        object-position:center;
        margin:0 auto;
    }

    .hero-image::before{
        width:270px;
        height:270px;
    }

    .hero-prev, .hero-next{
        width:38px;
        height:38px;
        font-size:13px;
        z-index:20;
    }

    .hero-prev{
        left:8px;
    }

    .hero-next{
        right:8px;
    }

    .hero-dots{
        bottom:18px;
    }

    .about-section, .services-section, .stats-section, .team-section, .pricing-section, .process-section, .faq-section, .projects-section, .appointment-section, .why-section, .blog-section{
        padding:70px 0;
    }

    .section-heading{
        margin-bottom:35px;
    }

    .section-heading h2, .stats-heading h2, .about-content h2, .appointment-info h2{
        font-size:30px;
    }

    .section-heading p{
        font-size:14px;
    }

    .about-section{
        width:100%;
        padding:65px 18px;
        box-sizing:border-box;
        overflow:hidden;
    }

    .about-container{
        width:100%;
        display:flex;
        flex-direction:column;
        gap:45px;
    }

    .about-images{
        width:100%;
        max-width:650px;
        min-height:480px;
        margin:0 auto;
        box-sizing:border-box;
    }

    .about-image-one{
        width:72%;
        height:300px;
        border-radius:0 22px 0 22px;
    }

    .about-image-two{
        top:285px;
        width:88%;
        height:235px;
        border-width:7px;
        border-radius:20px 0 12px 0;
    }

    .experience-badge{
        top:35px;
        left:80%;
        width:82px;
        height:205px;
        border-radius:6px 6px 45px 45px;
    }

    .experience-text{
        height:132px;
        font-size:16px;
    }

    .experience-number{
        width:66px;
        height:66px;
        font-size:34px;
    }

    .about-content{
        width:100%;
        max-width:100%;
        padding:0;
    }

    .about-small-title{
        font-size:18px;
        margin-bottom:22px;
        text-align:left;
    }

    .about-content h2{
        width:100%;
        max-width:100%;
        font-size:25px;
        line-height:1.3;
        letter-spacing:0;
    }

    .about-content p{
        width:100%;
        max-width:100%;
        font-size:14px;
        line-height:1.7;
        text-align:left;
    }

    .about-features{
        width:100%;
        margin-top:38px;
        display:flex;
        flex-direction:column;
        align-items:flex-start;
        gap:25px;
    }

    .about-feature{
        width:100%;
        max-width:100%;
        gap:18px;
    }

    .feature-icon{
        width:60px;
        height:60px;
        font-size:22px;
        flex-shrink:0;
    }

    .feature-text h4{
        font-size:16px;
    }

    .about-bottom{
        width:100%;
        margin-top:35px;
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:25px;
    }

    .about-btn{
        min-width:190px;
        height:48px;
    }

    .about-contact{
        gap:15px;
    }

    .contact-icon{
        width:52px;
        height:52px;
        font-size:21px;
        flex-shrink:0;
    }

    .about-contact strong{
        font-size:18px;
    }

    .services-grid, .stats-grid, .team-grid, .pricing-grid, .process-grid, .projects-grid, .why-grid, .blog-grid{
        width:100%;
        display:grid;
        grid-template-columns:1fr;
    }

    .service-card{
        width:100%;
        padding:30px 25px;
        box-sizing:border-box;
    }

    .consultation-section{
        padding:55px 0;
    }

    .consultation-container{
        flex-direction:column;
        text-align:center;
    }

    .consultation-container h2{
        font-size:30px;
    }

    .team-image{
        width:100%;
        height:350px;
    }

    .form-row{
        grid-template-columns:1fr;
    }

    .appointment-form{
        width:100%;
        padding:25px 20px;
        box-sizing:border-box;
    }

    .appointment-form .primary-btn{
        width:100%;
    }

    .project-card{
        width:100%;
        max-width:100%;
    }

    .project-card > img{
        width:100%;
        height:260px;
        object-fit:cover;
    }

    .testimonial-section{
        width:100%;
        padding:60px 0;
        overflow:hidden;
        box-sizing:border-box;
    }

    .testimonial-section .container{
        width:90%;
        max-width:100%;
        padding:0;
        margin:0 auto;
    }

    .testimonial-section .section-heading{
        margin-bottom:32px;
    }

    .testimonial-section .section-label{
        font-size:11px;
        letter-spacing:1.5px;
    }

    .testimonial-section .section-heading h2{
        font-size:31px;
    }

    .testimonial-grid{
        display:flex !important;
        flex-direction:column !important;
        flex-wrap:nowrap !important;
        width:100% !important;
        max-width:100% !important;
        gap:20px !important;
        align-items:center !important;
        justify-content:flex-start !important;
        overflow:visible !important;
    }

    .testimonial-card{
        display:block !important;
        width:100% !important;
        max-width:650px !important;
        min-width:0 !important;
        flex:0 0 auto !important;
        margin:0 !important;
        padding:28px 25px !important;
        box-sizing:border-box !important;
        overflow:visible !important;
    }

    .testimonial-card > p{
        width:100% !important;
        max-width:100% !important;
        min-height:0 !important;
        height:auto !important;
        font-size:14px !important;
        line-height:1.8 !important;
        white-space:normal !important;
        overflow:visible !important;
        word-break:normal !important;
        overflow-wrap:anywhere !important;
    }

    .client-logo-section{
        width:100%;
        max-width:100%;
        padding:25px 28px;
        box-sizing:border-box;
        overflow:hidden;
    }

    .client-logo-slider{
        width:100%;
        max-width:100%;
        height:80px;
        overflow:hidden;
    }

    .client-logo-track{
        width:max-content;
        max-width:none;
        gap:20px;
        padding:0 38px;
    }

    .client-logo{
        width:125px;
        height:65px;
        flex-shrink:0;
    }

    .client-logo img{
        max-width:115px;
        max-height:52px;
    }

    .logo-arrow{
        width:28px;
        height:35px;
    }

    .logo-arrow::before{
        width:11px;
        height:11px;
    }

    .hero-section, .hero-slider, .about-section, .testimonial-section, .client-logo-section{
        max-width:100vw;
    }

    .hero-container, .about-container, .testimonial-grid, .services-grid, .stats-grid, .team-grid, .pricing-grid, .process-grid, .projects-grid, .why-grid, .blog-grid{
        max-width:100%;
    }

    .hero-content, .hero-image, .about-content, .about-images, .testimonial-card, .service-card, .project-card{
        min-width:0;
    }

    .why-section{
        width:100%;
        padding:65px 18px;
        overflow:hidden;
    }

    .why-section .container{
        width:100%;
        max-width:100%;
        padding:0;
        margin:0 auto;
    }

    .why-grid{
        width:100%;
        display:flex;
        flex-direction:column;
        gap:40px;
    }

    .why-content{
        width:100%;
        max-width:100%;
    }

    .why-content > p{
        width:100%;
        max-width:100%;
        margin-bottom:28px;
        font-size:14px;
        line-height:1.75;
    }

    .why-list{
        width:100%;
        display:grid;
        grid-template-columns:1fr;
        gap:22px;
    }

    .why-item{
        width:100%;
        display:flex;
        align-items:flex-start;
        gap:14px;
    }

    .why-icon{
        flex:0 0 48px;
        width:48px;
        height:48px;
        border-radius:11px;
        font-size:17px;
    }

    .why-item h3{
        margin:0 0 5px;
        font-size:15px;
        line-height:1.4;
    }

    .why-item p{
        margin:0;
        font-size:12px;
        line-height:1.7;
    }

    .why-image{
        width:100%;
        max-width:650px;
        margin:0 auto;
    }

    .why-image > img{
        width:100%;
        height:380px;
        max-width:100%;
        object-fit:cover;
        border-radius:16px;
    }

    .floating-card{
        left:15px;
        bottom:18px;
        max-width:calc(100% - 30px);
        gap:10px;
        padding:13px 15px;
        border-radius:11px;
    }

    .floating-card-icon{
        width:38px;
        height:38px;
        flex:0 0 38px;
    }

    .floating-card strong{
        font-size:12px;
        line-height:1.3;
    }

    .floating-card span{
        font-size:9px;
        line-height:1.4;
    }

    .hero-bg{
        width:100%;
        height:100%;
        overflow:hidden;
    }

    .hero-bg img{
        width:100%;
        height:100%;
        object-fit:cover;
        object-position:center center;
    }

}



@media (max-width:600px){

    .testimonial-section{
        padding:52px 0;
    }

    .testimonial-section .container{
        width:90%;
    }

    .testimonial-section .section-heading{
        margin-bottom:28px;
    }

    .testimonial-section .section-label{
        padding:6px 14px;
        font-size:10px;
        letter-spacing:1.3px;
    }

    .testimonial-section .section-heading h2{
        font-size:27px;
        line-height:1.3;
    }

    .testimonial-grid{
        gap:17px !important;
    }

    .testimonial-card{
        width:100% !important;
        max-width:100% !important;
        padding:25px 21px 23px !important;
        border-radius:16px;
    }

    .testimonial-stars{
        margin-bottom:16px;
    }

    .testimonial-stars i{
        font-size:14px;
    }

    .testimonial-card > p{
        font-size:13px !important;
        line-height:1.8 !important;
    }

    .client-info{
        gap:12px;
        margin-top:20px;
        padding-top:16px;
    }

    .client-avatar{
        width:44px;
        height:44px;
        font-size:16px;
        flex-shrink:0;
    }

    .client-info strong{
        font-size:14px;
    }

    .client-info span{
        font-size:11px;
    }

    .why-section{
        padding:55px 15px;
    }

    .why-grid{
        gap:35px;
    }

    .why-content > p{
        font-size:13px;
        line-height:1.75;
        margin-bottom:25px;
    }

    .why-list{
        gap:20px;
    }

    .why-item{
        gap:12px;
    }

    .why-icon{
        flex:0 0 44px;
        width:44px;
        height:44px;
        border-radius:10px;
        font-size:16px;
    }

    .why-item h3{
        font-size:14px;
        margin-bottom:4px;
    }

    .why-item p{
        font-size:11px;
        line-height:1.7;
    }

    .why-image > img{
        height:330px;
        border-radius:14px;
    }

    .floating-card{
        left:12px;
        bottom:14px;
        max-width:calc(100% - 24px);
        padding:11px 13px;
    }

    .floating-card-icon{
        width:35px;
        height:35px;
        flex:0 0 35px;
    }

    .floating-card strong{
        font-size:11px;
    }

    .floating-card span{
        font-size:8px;
    }

    .hero-slider{
        min-height:680px;
    }

    .hero-slide{
        min-height:680px;
    }

    .hero-container{
        min-height:680px;
        padding:50px 18px 65px;
        gap:25px;
    }

    .hero-content h1{
        font-size:29px;
        line-height:1.22;
    }

    .hero-content > p{
        font-size:13px;
        line-height:1.7;
    }

    .hero-image{
        width:100%;
        max-width:100%;
    }

    .hero-image img{
        width:auto;
        max-width:88%;
        height:auto;
        max-height:none;
        object-fit:contain;
    }

    .hero-image::before{
        width:240px;
        height:240px;
    }

    .hero-prev, .hero-next{
        width:35px;
        height:35px;
    }

}



@media (max-width:480px){

    .container{
        padding-left:12px;
        padding-right:12px;
    }

    .hero-slider, .hero-slide, .hero-container{
        min-height:900px;
    }

    .hero-container{
        padding:45px 15px 60px;
        gap:22px;
        min-height:650px;
    }

    .hero-content h1{
        font-size:26px;
        line-height:1.2;
    }

    .hero-content > p{
        font-size:12.5px;
        line-height:1.7;
    }

    .hero-image img{
        max-width:85%;
        max-height:none;
        width:auto;
        height:auto;
        object-fit:contain;
    }

    .hero-image::before{
        width:210px;
        height:210px;
    }

    .hero-prev, .hero-next{
        width:32px;
        height:32px;
    }

    .about-section{
        padding:55px 12px;
    }

    .about-images{
        min-height:405px;
    }

    .about-image-one{
        width:75%;
        height:250px;
    }

    .about-image-two{
        top:238px;
        width:91%;
        height:190px;
        border-width:6px;
    }

    .experience-badge{
        top:30px;
        left:80%;
        width:50px;
        height:160px;
        border-radius:5px 5px 38px 38px;
    }

    .experience-text{
        height:112px;
        font-size:11px;
    }

    .experience-number{
        width:40px;
        height:40px;
        font-size:29px;
    }

    .about-content h2{
        font-size:22px;
    }

    .about-content p{
        font-size:13px;
    }

    .feature-icon{
        width:55px;
        height:55px;
        font-size:20px;
    }

    .feature-text h4{
        font-size:15px;
    }

    .about-contact strong{
        font-size:16px;
    }

    .section-heading h2, .stats-heading h2, .about-content h2, .appointment-info h2{
        font-size:27px;
    }

    .stat-box{
        padding:28px 15px;
    }

    .stat-box strong{
        font-size:30px;
    }

    .pricing-card{
        padding:30px 22px;
    }

    .faq-list summary{
        padding:18px;
        font-size:14px;
    }

    .faq-list details p{
        padding:0 18px 18px;
        font-size:13px;
    }

    .project-card > img{
        height:220px;
    }

    .blog-image{
        height:220px;
    }

    .testimonial-section{
        padding:45px 0;
    }

    .testimonial-section .container{
        width:92%;
    }

    .testimonial-section .section-heading{
        margin-bottom:25px;
    }

    .testimonial-section .section-heading h2{
        font-size:24px;
    }

    .testimonial-grid{
        width:100%;
        gap:15px !important;
    }

    .testimonial-card{
        width:100% !important;
        max-width:none !important;
        padding:23px 19px 21px !important;
        border-radius:14px;
    }

    .testimonial-card > p{
        font-size:13px !important;
        line-height:1.75 !important;
    }

    .testimonial-card > p::before{
        top:-20px;
        left:-3px;
        font-size:65px;
    }

    .client-info{
        margin-top:18px;
    }

    .client-logo-section{
        padding:22px;
    }

    .client-logo-slider{
        height:72px;
    }

    .client-logo-track{
        gap:15px;
        padding:0 32px;
    }

    .client-logo{
        width:105px;
        height:60px;
    }

    .client-logo img{
        max-width:95px;
        max-height:48px;
    }

    .logo-arrow{
        width:25px;
    }

    .why-section{
        padding:50px 12px;
    }

    .why-grid{
        gap:32px;
    }

    .why-content > p{
        font-size:13px;
        line-height:1.7;
        margin-bottom:23px;
    }

    .why-list{
        gap:18px;
    }

    .why-item{
        gap:11px;
    }

    .why-icon{
        flex:0 0 42px;
        width:42px;
        height:42px;
        font-size:15px;
    }

    .why-item h3{
        font-size:13px;
        line-height:1.4;
    }

    .why-item p{
        font-size:10.5px;
        line-height:1.65;
    }

    .why-image > img{
        height:280px;
        border-radius:13px;
    }

    .floating-card{
        left:10px;
        bottom:10px;
        max-width:calc(100% - 20px);
        padding:10px 11px;
        gap:8px;
    }

    .floating-card-icon{
        width:32px;
        height:32px;
        flex:0 0 32px;
        border-radius:8px;
    }

    .floating-card strong{
        font-size:10px;
    }

    .floating-card span{
        font-size:8px;
    }

    .hero-slider{
        min-height:650px;
    }

    .hero-slide{
        min-height:650px;
    }

    .hero-content{
        max-width:100%;
    }

    .hero-buttons a{
        max-width:300px;
    }

    .hero-image{
        width:100%;
        max-width:100%;
        overflow:visible;
    }

    .hero-bg img{
        width:100%;
        height:100%;
        object-fit:cover;
        object-position:center center;
    }

}



@media (max-width:360px){

    .hero-container{
        padding-left:25px;
        padding-right:25px;
        min-height:620px;
        padding:40px 12px 55px;
        gap:20px;
    }

    .hero-content h1{
        font-size:23px;
    }

    .hero-content > p{
        font-size:12px;
    }

    .hero-image img{
        max-width:82%;
        max-height:none;
        width:auto;
        height:auto;
    }

    .testimonial-section{
        padding:40px 0;
    }

    .testimonial-section .container{
        width:92%;
    }

    .testimonial-section .section-heading h2{
        font-size:22px;
    }

    .testimonial-card{
        padding:21px 17px !important;
    }

    .testimonial-card > p{
        font-size:12.5px !important;
        line-height:1.75 !important;
    }

    .why-section{
        padding:45px 10px;
    }

    .why-content > p{
        font-size:12px;
        line-height:1.7;
    }

    .why-list{
        gap:17px;
    }

    .why-item{
        gap:10px;
    }

    .why-icon{
        flex:0 0 39px;
        width:39px;
        height:39px;
        font-size:14px;
    }

    .why-item h3{
        font-size:12.5px;
    }

    .why-item p{
        font-size:10px;
        line-height:1.6;
    }

    .why-image > img{
        height:245px;
    }

    .floating-card{
        left:8px;
        bottom:8px;
        max-width:calc(100% - 16px);
        padding:8px 10px;
    }

    .floating-card-icon{
        width:29px;
        height:29px;
        flex:0 0 29px;
    }

    .floating-card strong{
        font-size:9px;
    }

    .floating-card span{
        font-size:7px;
    }

    .hero-slider{
        min-height:620px;
    }

    .hero-slide{
        min-height:620px;
    }

    .hero-image::before{
        width:185px;
        height:185px;
    }

    .hero-bg img{
        width:100%;
        height:100%;
        object-fit:cover;
        object-position:center center;
    }

}

/* =========================================================
   HERO CONTENT - CLEAN RESPONSIVE BASE
   ========================================================= */
.hero-content{
    min-width:0;
}

.hero-content h1{
    max-width:760px;
    margin-left:auto;
    margin-right:auto;
    text-wrap:balance;
    overflow-wrap:break-word;
}

.hero-content > p{
    max-width:650px;
    overflow-wrap:break-word;
}

.hero-buttons{
    flex-wrap:wrap;
}

.hero-buttons a{
    max-width:100%;
}

.hero-image{
    min-width:0;
}

.hero-image img{
    display:block;
    width:auto;
    max-width:100%;
    height:auto;
    object-fit:contain;
    object-position:center;
}

@media (max-width:991px){
    .hero-content h1{
        max-width:720px;
    }

    .hero-content > p{
        max-width:650px;
    }
}

@media (max-width:767px){
    .hero-content h1{
        max-width:100%;
        font-size:clamp(27px, 7vw, 34px);
        line-height:1.18;
    }

    .hero-content > p{
        max-width:560px;
        font-size:14px;
        line-height:1.7;
    }

    .hero-buttons{
        width:100%;
        align-items:center;
    }

    .hero-buttons a{
        width:100%;
        max-width:320px;
    }

    .hero-image img{
        max-width:min(90%, 420px);
    }
}

@media (max-width:480px){
    .hero-content h1{
        font-size:clamp(24px, 8vw, 29px);
    }

    .hero-content > p{
        font-size:13px;
    }

    .hero-buttons a{
        max-width:300px;
    }

    .hero-image img{
        max-width:85%;
    }
}

@media (max-width:360px){
    .hero-content h1{
        font-size:24px;
    }

    .hero-content > p{
        font-size:12px;
    }

    .hero-image img{
        max-width:82%;
    }
}


/* =========================================================
   FINAL RESPONSIVE SAFETY LAYER
   ========================================================= */

@media (max-width:767px){
    .hero-container{
        width:100%;
        max-width:100%;
        margin-left:0;
        margin-right:0;
    }

    .hero-content,
    .hero-image,
    .about-content,
    .about-images,
    .service-card,
    .project-card,
    .team-card,
    .pricing-card,
    .blog-card,
    .why-content,
    .why-image,
    .appointment-form,
    .appointment-info{
        min-width:0;
        max-width:100%;
    }

    .hero-content h1{
        width:100%;
        max-width:100%;
        font-size:clamp(25px, 7vw, 34px);
        line-height:1.18;
    }

    .hero-content > p{
        width:100%;
        max-width:620px;
    }

    .hero-buttons{
        width:100%;
        flex-direction:column;
        align-items:center;
    }

    .hero-buttons a{
        width:100%;
        max-width:320px;
    }

    .hero-image img{
        width:auto;
        max-width:min(90vw, 420px);
        height:auto;
    }

    .section-heading h2,
    .stats-heading h2,
    .about-content h2,
    .appointment-info h2{
        overflow-wrap:break-word;
    }

    .form-row,
    .services-grid,
    .stats-grid,
    .team-grid,
    .pricing-grid,
    .process-grid,
    .projects-grid,
    .why-grid,
    .blog-grid{
        width:100%;
        max-width:100%;
    }
}

@media (max-width:480px){
    .hero-container{
        padding-left:15px;
        padding-right:15px;
    }

    .hero-content h1{
        font-size:clamp(23px, 8vw, 29px);
    }

    .hero-content > p{
        font-size:13px;
    }

    .hero-buttons a{
        max-width:300px;
    }

    .hero-image img{
        max-width:85vw;
    }
}

@media (max-width:360px){
    .hero-container{
        padding-left:12px;
        padding-right:12px;
    }

    .hero-content h1{
        font-size:24px;
    }

    .hero-content > p{
        font-size:12px;
    }

    .hero-buttons a{
        max-width:280px;
    }

    .hero-image img{
        max-width:82vw;
    }
}