/* =========================================
   RESPONSIVE.CSS - PART 1
   Base + Navbar + Hero
=========================================*/

*{
    box-sizing:border-box;
}

html{
    overflow-x:hidden;
}

body{
    overflow-x:hidden;
    width:100%;
}

/* Prevent horizontal scrolling */

section,
header,
footer,
.container{
    width:100%;
    max-width:100%;
}

/* -------------------------
   Container
------------------------- */

.container{
    width:min(1280px,100% - 32px);
    margin-inline:auto;
    padding-inline:16px;
}

/* -------------------------
   Navbar Fix
------------------------- */

.navbar{
    position:sticky;
    top:0;
    left:0;
    width:100%;
    z-index:9999;

    background:rgba(255,255,255,.96);

    backdrop-filter:blur(16px);

    border:none !important;

    box-shadow:0 2px 14px rgba(0,0,0,.06);
}

.navbar::before,
.navbar::after{
    display:none !important;
    content:none !important;
}

.navbar-container{

    display:flex;

    justify-content:space-between;

    align-items:center;

    min-height:80px;

    padding:14px 18px;
}

.logo{

    display:flex;

    align-items:center;
}

.logo-wrapper{

    display:flex;

    align-items:center;
}

.logo-img{

    max-width:100%;

    height:auto;

    width:auto;
   
    max-height:75px;

    object-fit:contain;
}

/* -------------------------
   Hero
------------------------- */

.hero{

    padding-top:120px;

    padding-bottom:80px;

    min-height:auto;

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;
}

.hero-content{

    width:100%;

    max-width:900px;

    margin:auto;
}

.hero h1{

    font-size:clamp(40px,7vw,78px);

    line-height:1.1;

    word-break:break-word;
}

.hero p{

    width:min(700px,100%);

    margin:auto;

    font-size:18px;

    line-height:1.7;
}

.hero-buttons{

    display:flex;

    justify-content:center;

    gap:16px;

    flex-wrap:wrap;
}

/* -------------------------
   Images
------------------------- */

img{

    max-width:100%;

    height:auto;

    display:block;
}

/* -------------------------
   Tablet
------------------------- */

@media(max-width:992px){

.logo-img{

height:50px;

}

.hero{

padding-top:110px;

}

.hero h1{

font-size:48px;

}

.hero p{

font-size:17px;

}

}

/* -------------------------
   Mobile
------------------------- */

@media(max-width:768px){

.navbar-container{

padding:12px 16px;

min-height:70px;

}

.logo-img{
max-height:70px;

}

/* Mobile Menu */

.menu-toggle{

display:flex;

z-index:10001;

}

.nav-actions{

display:none;

}

.nav-menu{

position:absolute;

top:100%;

left:16px;

right:16px;

display:flex;

flex-direction:column;

background:#fff;

border-radius:16px;

padding:0;

max-height:0;

overflow:hidden;

transition:.35s ease;

box-shadow:0 12px 35px rgba(0,0,0,.12);

}

.nav-menu.active{

max-height:500px;

padding:16px;

}

.nav-link{

width:100%;

text-align:center;

padding:14px;

}

.hero{

padding-top:100px;

padding-bottom:60px;

}

.hero h1{

font-size:38px;

}

.hero p{

font-size:16px;

line-height:1.7;

}

.hero-buttons{

flex-direction:column;

align-items:center;

}

.hero-buttons a{

width:100%;

max-width:320px;

}

}

/* -------------------------
   Small Phones
------------------------- */

@media(max-width:480px){

.hero{

padding-top:90px;

}

.hero h1{

font-size:32px;

}

.hero p{

font-size:15px;

}

.badge{

font-size:12px;

padding:10px 16px;

}

.logo-img{


max-height:65px;

}

}

/* part 2*/
/* =====================================================
   PART 2
   FEATURES + WHY US + STATS + PRICING
=====================================================*/

/* ---------- Section Spacing ---------- */

.features,
.why-us,
.pricing-section,
.faq,
.contact-section,
.testimonials,
.models,
.cta{

    padding:70px 0;

}

/* ---------- Section Header ---------- */

.section-header{

    margin-bottom:45px;

}

.section-header h2{

    font-size:clamp(30px,5vw,52px);

    line-height:1.2;

}

.section-header p{

    width:min(650px,100%);

    margin:auto;

}

/* ---------- Features ---------- */

.features-grid{

    display:grid !important;

    grid-template-columns:repeat(4,1fr);

    gap:24px;

}

.feature-card{

    height:100%;

    padding:28px;

}

.feature-card h3{

    font-size:22px;

}

.feature-card p{

    font-size:15px;

}

/* ---------- Why Us ---------- */

.why-grid{

    display:grid !important;

    grid-template-columns:repeat(4,1fr);

    gap:24px;

}

.why-card{

    padding:28px;

    height:100%;

}

.why-card h3{

    font-size:22px;

}

.why-card p{

    font-size:15px;

}

/* ---------- Stats ---------- */

.stats-wrapper{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:20px;

    margin-top:40px;

}

.stat-card{

    width:100%;

}

/* ---------- Pricing ---------- */

.pricing-grid{

    display:grid !important;

    grid-template-columns:repeat(3,1fr);

    gap:28px;

    align-items:stretch;

}

.pricing-card{

    width:100%;

    max-width:100%;

    height:100%;

}

.card{

    max-width:none;

}

.price-card h2{

    font-size:42px;

}

.plan-actions{

    margin-top:auto;

}

/* ---------- Tablet ---------- */

@media(max-width:992px){

.features-grid{

grid-template-columns:repeat(2,1fr);

}

.why-grid{

grid-template-columns:repeat(2,1fr);

}

.stats-wrapper{

grid-template-columns:repeat(2,1fr);

}

.pricing-grid{

grid-template-columns:1fr;

}

}

/* ---------- Mobile ---------- */

@media(max-width:768px){

.features{

padding:55px 0;

}

.why-us{

padding:55px 0;

}

.pricing-section{

padding:55px 0;

}

.features-grid{

grid-template-columns:1fr !important;

gap:18px;

}

.why-grid{

grid-template-columns:1fr !important;

gap:18px;

}

.stats-wrapper{

grid-template-columns:1fr;

gap:16px;

}

.stat-card{

padding:20px;

}

.pricing-grid{

grid-template-columns:1fr !important;

gap:22px;

}

.card{

padding:24px;

border-radius:22px;

}

.price-card h2{

font-size:36px;

}

.plan-actions{

display:flex;

flex-direction:column;

gap:12px;

}

.plan-actions button{

width:100%;

}

.feature-card,

.why-card{

padding:24px;

}

}

/* ---------- Small Mobile ---------- */

@media(max-width:480px){

.section-header h2{

font-size:28px;

}

.section-header p{

font-size:15px;

}

.feature-card{

padding:20px;

}

.why-card{

padding:20px;

}

.card{

padding:20px;

}

.price-card h2{

font-size:32px;

}

}
/* ===================================
   PRICING RESPONSIVE FIX
===================================*/

@media (max-width:768px){

    .pricing-grid{
        display:flex !important;
        flex-direction:column;
        gap:24px;
        align-items:center;
    }

    .pricing-card,
    .plan-card,
    .card{

        width:100% !important;
        max-width:360px !important;
        margin:0 auto;

    }

    .card-header h2,
    .plan-title{

        font-size:2.4rem !important;
        line-height:1.1;

    }

    .price{

        font-size:2.8rem !important;

    }

    .feature-group{

        margin:20px 0;

    }

    .bullet-list li{

        font-size:15px;
        line-height:1.6;

    }

    .select-btn{

        width:100%;
        padding:15px;

    }

}


/* ==========================================
   PRICING CARD MOBILE FIX
========================================== */

@media (max-width:768px){

    .pricing-grid{
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:24px;
    }

    .pricing-card{
        width:100%;
        max-width:360px;
        margin:0 auto;
        padding:24px;
    }

    .card-header h4{
        font-size:2rem;
        line-height:1.15;
        margin-top:15px;
        margin-bottom:10px;
    }

    .card-header p{
        font-size:15px;
        margin-bottom:18px;
    }

    .price-card h2{
        font-size:3rem;
        line-height:1;
        margin:10px 0;
    }

    .old{
        display:flex;
        justify-content:center;
        align-items:center;
        gap:10px;
        flex-wrap:wrap;
    }

    .old-amount{
        font-size:18px;
    }

    .discount-badge{
        font-size:12px;
        padding:6px 10px;
    }

    .feature-group{
        margin:20px 0;
    }

    .feature-group h5{
        font-size:18px;
        margin-bottom:12px;
    }

    .bullet-list li{
        font-size:15px;
        line-height:1.7;
    }

    .plan-actions{
        display:flex;
        flex-direction:column;
        gap:12px;
    }

    .select-btn,
    .demo-app-btn{
        width:100%;
    }

}/* ======================================
   FOOTER RESPONSIVE
====================================== */

@media (max-width:768px){

.footer{

padding:60px 0 25px;
overflow:hidden;

}

.footer-cta{

padding:30px 20px;
text-align:center;
border-radius:20px;

}

.footer-cta h2{

font-size:28px;
line-height:1.3;
margin-bottom:12px;

}

.footer-cta p{

font-size:15px;
line-height:1.7;

}

.footer-grid{

display:grid;
grid-template-columns:1fr !important;
gap:35px;
text-align:center;
margin-top:45px;

}

.footer-col{

width:100%;

}

.footer-logo{

justify-content:center;
margin-bottom:18px;

}

.footer-col h3,
.footer-col h4{

font-size:20px;
margin-bottom:15px;

}

.footer-col p{

font-size:15px;
line-height:1.8;

}

.footer-links{

display:flex;
flex-direction:column;
gap:12px;

}

.footer-links a{

font-size:15px;

}

.contact-info{

display:flex;
flex-direction:column;
gap:12px;

}

.contact-info li{

justify-content:center;
text-align:center;
line-height:1.6;

}

.social-links{

justify-content:center;
margin-top:18px;
gap:14px;

}

.footer-bottom{

margin-top:35px;
padding-top:20px;

display:flex;
flex-direction:column;
gap:12px;

text-align:center;

font-size:14px;

}

.footer-bottom-links{

display:flex;
justify-content:center;
flex-wrap:wrap;
gap:12px;

}

}

/* Small Mobile */

@media (max-width:480px){

.footer-cta{

padding:25px 16px;

}

.footer-cta h2{

font-size:24px;

}

.footer-cta p{

font-size:14px;

}

.footer-grid{

gap:28px;

}

.footer-col h3,
.footer-col h4{

font-size:18px;

}

.footer-bottom{

font-size:13px;

}

}
/* ==========================================
   ABOUT PAGE RESPONSIVE
==========================================*/

@media (max-width:992px){

.about-page{

padding:70px 0;

}

.offer-grid{

display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;

}

.why-grid{

display:grid;
grid-template-columns:repeat(2,1fr);
gap:20px;

}

.company-info{

overflow-x:auto;

}

.company-info table{

min-width:650px;

}

}

/* ============================= */

@media (max-width:768px){

.page-banner{

padding:110px 0 60px;
text-align:center;

}

.page-banner h1{

font-size:38px;
line-height:1.2;

}

.page-banner p{

font-size:16px;
padding:0 10px;

}

.about-page{

padding:55px 0;

}

.about-intro{

text-align:center;

}

.about-intro h2{

font-size:32px;

}

.about-intro p{

font-size:16px;
line-height:1.8;

}

.about-card{

padding:24px;
margin-bottom:22px;

}

.about-card h3{

font-size:24px;

}

.about-card p{

font-size:15px;
line-height:1.8;

}

.offer-grid{

grid-template-columns:1fr;
gap:16px;

}

.offer-item{

padding:18px;

font-size:16px;

}

.why-grid{

grid-template-columns:1fr;
gap:16px;

}

.why-box{

padding:18px;
font-size:16px;

}

.company-info{

overflow-x:auto;
border-radius:16px;

}

.company-info table{

min-width:600px;

}

.contact-section{

padding:55px 0;

}

.contact-section h2{

font-size:30px;

}

.contact-info{

font-size:15px;

}

}

/* ============================= */

@media (max-width:480px){

.page-banner{

padding-top:95px;

}

.page-banner h1{

font-size:30px;

}

.about-intro h2{

font-size:28px;

}

.section-title h2{

font-size:28px;

}

.about-card{

padding:20px;

}

.offer-item{

padding:16px;
font-size:15px;

}

.why-box{

padding:16px;
font-size:15px;

}

.contact-section h2{

font-size:26px;

}

}
/* ===================================
   FOOTER CTA FIX
=================================== */

@media (max-width:768px){

.footer-cta{

width:100% !important;
max-width:100% !important;

display:flex;
flex-direction:column;

padding:28px 22px !important;

border-radius:24px;

text-align:center;

margin:0 auto 35px;

}

.footer-cta h2{

font-size:30px !important;
line-height:1.3;

margin-bottom:16px;

}

.footer-cta p{

font-size:16px !important;
line-height:1.8;

margin-bottom:24px;

}

.footer-btn{

display:block;

width:100%;
max-width:280px;

margin:auto;

text-align:center;

}

.footer{

overflow:hidden;

}

.footer .container{

padding-left:18px;
padding-right:18px;

}

}
html,
body{

overflow-x:hidden;

}

.footer,
.footer-cta{

max-width:100vw;

}
/* ==========================
   REFUND POLICY CARDS FIX
========================== */

@media (max-width:768px){

.refund-grid,
.policy-grid,
.services-grid,
.refund-services{

display:grid !important;

grid-template-columns:1fr !important;

gap:18px;

}

.refund-card,
.policy-card,
.service-card,
.refund-item{

width:100% !important;

max-width:none !important;

margin:0 auto;

padding:20px;

}

}
/* Refund Policy Card Spacing */

@media (max-width:768px){

.policy-page{

padding:50px 0;

}

.policy-page > *{

margin-bottom:24px;

}

.policy-card{

margin-bottom:24px !important;

padding:24px;

border-radius:24px;

}

}
/* Desktop Pricing Center Fix */

@media (min-width: 992px){

    .pricing-grid{
        display:grid !important;

        grid-template-columns:repeat(2, minmax(320px, 420px)) !important;

        justify-content:center;

        gap:40px;

        max-width:900px;

        margin:0 auto;
    }

    .pricing-card{
        width:100%;
        max-width:420px;
        margin:0;
    }

}
/* LOGO FIX */

.navbar .logo{
    display:flex;
    align-items:center;
    justify-content:center;
    width:auto !important;
    min-width:140px !important;
}

.navbar .logo-img{
    width:140px !important;
    height:auto !important;
    max-width:none !important;
    max-height:none !important;
    object-fit:contain;
}

@media (max-width:768px){

    .navbar .logo{
        min-width:90px !important;
    }

    .navbar .logo-img{
        width:90px !important;
    }

}

/* ==========================
   STATS MOBILE RESPONSIVE
========================== */

@media (max-width:768px){

.stats-wrapper{

    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:12px;
    margin-top:20px;

}

.stat-card{

    padding:14px 10px;
    min-height:90px;

    border-radius:18px;

    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;

    text-align:center;

}

.stat-card h2{

    font-size:24px !important;
    line-height:1;
    font-weight:700;
    margin-bottom:6px;
    color:#2d63f6;

}

.stat-card span{

    font-size:13px !important;
    line-height:1.3;
    font-weight:600;
    color:#486081;

}

}
/* ==========================================
   FOOTER MOBILE RESPONSIVE
========================================== */

@media (max-width:768px){

.footer{

    padding:60px 0 30px;
}

.footer .container{

    padding:0 24px;
}

/* CTA */

.footer-cta{

    display:flex;
    flex-direction:column;
    align-items:flex-start;

    text-align:left;

    padding:28px 24px;

    border-radius:24px;

    gap:18px;

    margin-bottom:45px;
}

.footer-cta h2{

    font-size:30px;
    line-height:1.3;
    margin-bottom:12px;
}

.footer-cta p{

    font-size:16px;
    line-height:1.8;
    margin:0;
}

.footer-btn{

    width:100%;
    max-width:260px;

    text-align:center;
}

/* Footer Grid */

.footer-grid{

    display:grid;

    grid-template-columns:1fr;

    gap:40px;

}

/* All Columns */

.footer-column{

    text-align:left;
}

.footer-column h3{

    font-size:24px;

    margin-bottom:18px;
}

.footer-column p{

    font-size:16px;

    line-height:2;

    margin-bottom:18px;
}

.footer-column ul{

    list-style:none;

    padding:0;

    margin:0;
}

.footer-column ul li{

    margin-bottom:14px;

    font-size:16px;

    line-height:1.8;
}

/* Social */

.footer-social{

    display:flex;

    justify-content:flex-start;

    gap:16px;

    margin-top:22px;
}

.footer-social a{

    width:48px;
    height:48px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;
}

/* Contact */

.contact-list li{

    display:flex;

    align-items:flex-start;

    justify-content:flex-start;

    gap:12px;
}

.contact-list i{

    margin-top:4px;

    min-width:18px;
}

/* Footer Bottom */

.footer-bottom{

    display:flex;

    flex-direction:column;

    align-items:flex-start;

    text-align:left;

    gap:18px;

    margin-top:40px;
}

.footer-bottom p{

    font-size:15px;

    line-height:1.7;

    margin:0;
}

.footer-bottom-links{

    display:flex;

    flex-direction:column;

    align-items:flex-start;

    gap:12px;
}

.footer-bottom-links a{

    font-size:15px;
}

}
@media (max-width:768px){

/* About Section */

.footer-column:first-child{

    width:100% !important;
    max-width:100% !important;
    flex:0 0 100%;

}

.footer-about{

    width:100% !important;
    max-width:100% !important;

    display:block;

    text-align:left;

    line-height:1.8;

    font-size:16px;

    margin:0;

    padding:0;

}

.footer-column h3{

    text-align:left;
    margin-bottom:18px;

}

.footer-social{

    justify-content:flex-start;

}

}
.footer .container{
    padding-left:16px !important;
    padding-right:16px !important;
}

.footer-column{
    width:100%;
}

.footer-about{
    width:100%;
    max-width:100%;
    margin:0;
    padding:0;
    font-size:18px;
    line-height:1.8;
}
/* ===========================
   COMPANY INFO - MOBILE
=========================== */

.company-info{
    width:100%;
    overflow:hidden !important;
    padding:20px 0;
}

.company-info h2{
    font-size:42px;
    line-height:1.15;
    text-align:center;
    margin-bottom:28px;
}

.company-info table{
    width:100% !important;
    border-collapse:collapse;
    table-layout:fixed;
    background:#fff;
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.company-info tr{
    display:block;
    border-bottom:1px solid #E5E7EB;
}

.company-info tr:last-child{
    border-bottom:none;
}

.company-info td{
    display:block;
    width:100% !important;
    padding:12px 16px !important;
    white-space:normal !important;
    word-break:break-word;
    overflow-wrap:break-word;
    text-align:left;
}

.company-info td:first-child{
    background:#F8FAFC;
    font-size:15px;
    font-weight:700;
    color:#111827;
    border-bottom:1px solid #E5E7EB;
}

.company-info td:last-child{
    background:#fff;
    font-size:14px;
    color:#475569;
    line-height:1.6;
}

/* Extra Small Mobile */

@media (max-width:480px){

    .company-info{
        padding:15px 0;
    }

    .company-info h2{
        font-size:34px;
        margin-bottom:22px;
    }

    .company-info table{
        border-radius:14px;
    }

    .company-info td{
    padding:10px 14px !important;
    white-space:normal !important;
    word-break:break-word !important;
    overflow-wrap:anywhere !important;

    overflow:visible !important;
    text-overflow:unset !important;

    height:auto !important;
    max-width:100% !important;
    }

    .company-info td:first-child{
        font-size:14px;
    }

    .company-info td:last-child{
        font-size:13px;
        line-height:1.5;
    }


.company-info table{
    table-layout:auto !important;
    display:block;
    overflow-x:hidden;
}

.company-info tbody,
.company-info tr{
    display:block;
    width:100%;
}

.company-info tr{
    margin-bottom:18px;
    border:1px solid #E5E7EB;
    border-radius:14px;
    overflow:hidden;
}

.company-info td{
    display:block;
    width:100% !important;
    padding:14px 16px !important;

    white-space:normal !important;
    word-break:break-word !important;
    overflow-wrap:anywhere !important;

    overflow:visible !important;
    text-overflow:unset !important;
}

.company-info tr td:first-child{
    width:100% !important;   /* 280px hata diya */
    background:#F8FAFC;
    border-bottom:1px solid #E5E7EB;
    font-size:15px;
}

.company-info tr td:last-child{
    width:100% !important;
    font-size:14px;
    line-height:1.6;
}
.company-info table{
    table-layout:auto !important;
    display:block;
    overflow-x:visible;
}

.company-info tbody,
.company-info tr{
    display:block;
    width:100%;
}

.company-info tr{
    margin-bottom:18px;
    border:1px solid #E5E7EB;
    border-radius:14px;
    overflow:hidden;
}

.company-info td{
    display:block;
    width:100% !important;
    padding:14px 16px !important;
    white-space:normal !important;
    word-break:break-word !important;
    overflow-wrap:anywhere !important;
}

.company-info tr td:first-child{
    width:100% !important;
    background:#F8FAFC;
    border-bottom:1px solid #E5E7EB;
    font-weight:700;
}

.company-info tr td:last-child{
    width:100% !important;
    line-height:1.6;
}
/* ==========================
   COMPANY INFO MOBILE
========================== */

.company-info{
    margin-top:50px;
}

.company-info h2{
    font-size:32px;
    margin-bottom:24px;
}

.company-info table{
    width:100%;
    border-collapse:separate;
    border-spacing:0 14px;
    box-shadow:none;
    background:transparent;
}

.company-info tr{
    display:block;
    background:#fff;
    border-radius:16px;
    overflow:hidden;
    box-shadow:0 6px 18px rgba(0,0,0,.08);
}

.company-info td{
    display:block;
    width:100% !important;
    padding:12px 16px !important;
    border:none;
}

.company-info td:first-child{
    background:#F8FAFC;
    font-weight:700;
    color:#111827;
    border-bottom:1px solid #E5E7EB;
}

.company-info td:last-child{
    color:#475569;
    font-size:14px;
    line-height:1.6;
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
}

}
@media (max-width:768px){

.company-info{
    margin-top:60px;
}

.company-info h2{
    font-size:34px;
}

.company-grid{
    grid-template-columns:1fr;
    gap:18px;
}

.company-card{
    padding:20px;
    border-radius:18px;
}

.company-card h4{
    font-size:17px;
}

.company-card p{
    font-size:15px;
    line-height:1.7;
}

.company-full{
    grid-column:auto;
}

}
@media (max-width:768px){

.about-intro{
    text-align:left !important;
    padding:0 10px;
}

.about-intro h2{
    text-align:center !important;
    font-size:38px;
    margin-bottom:25px;
}

.about-intro p{
    text-align:left !important;
    font-size:17px;
    line-height:1.9;
    color:#64748B;
    margin-bottom:18px;
}

}
@media (max-width:768px){

.about-intro{
    padding:0 18px;
    max-width:100%;
}

.about-intro h2{
    font-size:34px;
    text-align:center;
    margin-bottom:22px;
    line-height:1.2;
}

.about-intro p{
    text-align:center;
    font-size:15px;
    line-height:1.8;
    color:#64748B;
    max-width:100%;
    margin:0 auto 18px;
}

}
@media (max-width:768px){

.about-intro{
    width:100%;
    max-width:100%;
    padding:0 14px !important;
    margin:0 auto;
    box-sizing:border-box;
}

.about-intro p{
    width:100%;
    max-width:100%;
    margin:0 auto 18px;
    padding:0 !important;
    text-align:left;
    font-size:14px;
    line-height:1.8;
    word-break:normal;
    overflow-wrap:break-word;
    white-space:normal;
}

.about-intro h2{
    text-align:center;
    font-size:32px;
    margin-bottom:20px;
}

}
@media (max-width:768px){

    .pricing-card{
        padding:20px 18px !important;
    }

    .feature-group{
        margin:12px 0 !important;
    }

    .feature-group + .feature-group{
        margin-top:8px !important;
    }

    .feature-group h5{
        margin:0 0 8px !important;
        font-size:18px;
    }

    .bullet-list{
        margin:0 !important;
        padding:0 !important;
    }

    .bullet-list li{
        margin:6px 0 !important;
        padding:0 !important;
        line-height:1.4;
    }

    .plan-actions{
        margin-top:16px !important;
    }
}
@media (max-width:768px){

    .pricing-card{
        display:flex;
        flex-direction:column;
        padding:20px 18px !important;
    }

    .feature-group{
        margin:0 !important;
        padding:0 !important;
    }

    .feature-group + .feature-group{
        margin-top:-35px !important;   /* gap kam karega */
    }

    .feature-group h5{
        margin:0 0 12px !important;
    }

    .bullet-list{
        margin:0 !important;
        padding:0 !important;
    }

    .bullet-list li{
        margin-bottom:8px !important;
    }

    .plan-actions{
        margin-top:18px !important;
    }
}
@media (max-width:768px){

    .feature-group{
        width:100%;
        max-width:270px;
        margin:0 auto 20px !important;
    }

    .feature-group h5{
        text-align:left;
        margin-bottom:12px;
    }

    .bullet-list{
        padding-left:0;
        margin:0;
    }

}
.feature-icon{
    background: linear-gradient(90deg, #7C3AED, #2563EB);
}
@media (max-width:768px){

.contact-row{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.label{
    width:100%;
}

.value{
    width:100%;
}

.value a{
    word-break: break-word;
    overflow-wrap: break-word;
}


/* Mobile Fix */

.contact-card{
    width: 100%;
    max-width: 100%;
    margin: 30px auto 0;
    padding: 30px 20px;
    box-sizing: border-box;
}

.contact-section .container{
    width: 100%;
    max-width: 100%;
    padding: 0 20px;
}
}
@media (max-width:768px){

.contact-section .container{
    padding:0 16px;
}

.contact-card{
    width:100%;
    max-width:none;
}

.contact-section{
    width: 100%;
}

.contact-section .contact-card{
    border-radius: 28px;
}

}
@media (max-width:992px){

    .page-banner h1{
        font-size:2.5rem;
    }

    .section-header h2{
        font-size:2.3rem;
    }

    .contact-info{
        grid-template-columns:1fr;
    }

}

@media (max-width:768px){

    .page-banner{
        padding:100px 20px 60px;
    }

    .page-banner h1{
        font-size:2rem;
    }

    .page-banner p{
        font-size:1rem;
    }

    .contact-details{
        padding:70px 20px;
    }

    .section-header{
        margin-bottom:45px;
    }

    .section-header h2{
        font-size:2rem;
    }

    .contact-card{
        padding:30px 22px;
        border-radius:20px;
    }

    .contact-card h2{
        font-size:1.7rem;
    }

    .info-item{
        padding:22px;
    }

    .info-item i{
        width:52px;
        height:52px;
        min-width:52px;
        font-size:20px;
    }

}

@media (max-width:480px){

    .page-banner h1{
        font-size:1.75rem;
    }

    .section-header h2{
        font-size:1.65rem;
    }

    .contact-card{
        padding:24px 18px;
    }

    .info-item{
        flex-direction:column;
        align-items:center;
        text-align:center;
    }

}

@media (min-width:992px){

    .pricing-grid{
        display:grid !important;
        grid-template-columns:repeat(2,1fr) !important;
        gap:40px;
        width:100%;
        max-width:100%;
        margin:0;
    }

    .pricing-card{
        width:100%;
        max-width:none;
    }

}
@media (max-width:768px){

    .price-card h2{
        font-size: 2.7rem !important;
        line-height: 1.1;
        margin: 8px 0;
    }

}
@media (max-width:768px){

    .price-card h2{
        font-size: 2.5rem !important;
    }

}
@media (max-width:768px){

    .contact-section h2{
        text-align: left !important;
        margin-bottom: 24px;
        padding-left: 8px;
    }

    .contact-section .container{
        padding: 0 20px;
    }

    .contact-card{
        width: 100%;
        max-width: 100%;
        margin: 0;
    }

}
@media (max-width:768px){

    .contact-section .container{
        display:block !important;
        text-align:left !important;
        padding:0 20px !important;
    }

    .contact-section .container > h2{
        display:block !important;
        width:100% !important;
        text-align:left !important;
        margin:0 0 24px 0 !important;
    }

}
@media (max-width:768px){

    .contact-row{
        display:flex !important;
        flex-direction:column;
        align-items:flex-start !important;
        text-align:left !important;
        padding:18px 0;
    }

    .contact-row .label{
        width:100%;
        text-align:left !important;
        margin-bottom:8px;
    }

    .contact-row .value{
        width:100%;
        text-align:left !important;
    }

}
/* CONTACT PAGE - MOBILE */
@media (max-width:768px){

    .contact-office-card{
        width:100%;
        max-width:100%;
        padding:28px 20px;
        border-radius:22px;
    }

    .policy-icon{
        width:70px;
        height:70px;
        margin:0 auto 18px;
    }

    .contact-office-card h2{
        font-size:2rem;
        line-height:1.2;
        margin-bottom:16px;
    }

    .contact-office-card strong{
        display:block;
        font-size:1.2rem;
        line-height:1.5;
        white-space:normal;
        word-break:normal;
        overflow-wrap:break-word;
        margin-bottom:14px;
    }

    .contact-office-card p{
        font-size:1rem;
        line-height:1.8;
        margin:0;
        text-align:center;
    }

}
/* CONTACT PAGE MOBILE */
@media (max-width:768px){

    .contact-office-card{
        width: calc(100% - 32px);
        margin: 0 auto 24px;
        padding: 24px 18px;
        border-radius: 20px;
    }

    .policy-icon{
        width: 64px;
        height: 64px;
        margin: 0 auto 14px;
    }

    .policy-icon i{
        font-size: 24px;
    }

    .contact-office-card h2{
        font-size: 1.8rem;
        line-height: 1.2;
        text-align: center;
        margin: 0 0 14px;
    }

    .contact-office-card strong{
        display: block;
        text-align: center;
        font-size: 1.05rem;
        line-height: 1.5;
        margin-bottom: 14px;
        word-break: normal;
        overflow-wrap: break-word;
    }

    .contact-office-card p{
        text-align: center;
        font-size: 1rem;
        line-height: 1.7;
        margin: 0;
    }
}
@media (max-width:768px){

    .contact-row{
        display:flex !important;
        flex-direction:row !important;
        align-items:center !important;
        gap:16px !important;
        padding:18px 20px !important;
    }

    .contact-row i{
        width:56px !important;
        height:56px !important;
        min-width:56px !important;
        font-size:20px !important;
        margin:0 !important;
    }

    .contact-row div{
        flex:1;
    }

    .contact-row h4{
        margin:0 0 6px !important;
        font-size:1.2rem !important;
        text-align:left !important;
    }

    .contact-row p{
        margin:0 !important;
        font-size:0.95rem !important;
        line-height:1.6;
        text-align:left !important;
        word-break:break-word;
    }

}
@media (max-width:768px){

    .contact-office-card{
        width:100% !important;
        max-width:100% !important;
        margin:0 0 24px !important;
        padding:24px 20px !important;
        border-radius:20px;
        box-sizing:border-box;
    }

    .contact-details .container{
        width:100%;
        max-width:100%;
        padding:0 16px !important;
    }

}
@media (max-width:768px){

    /* Heading */
    .contact-row h4{
        font-size: 1.1rem !important;
        font-weight: 700;
        margin-bottom: 4px !important;
    }

    /* Value */
    .contact-row p{
        font-size: 0.9rem !important;
        line-height: 1.5;
        word-break: break-word;
    }

    /* Icon bhi thoda compact */
    .contact-row i{
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
        font-size: 18px !important;
    }

    /* Row padding kam */
    .contact-row{
        padding: 16px 18px !important;
        gap: 14px !important;
    }

}
/* ABOUT PAGE MOBILE */
@media (max-width:768px){

    .company-box,
    .contact-card{
        width:100%;
        max-width:100%;
        overflow:hidden;
        border-radius:20px;
    }

    .info-row,
    .contact-row{
        display:block !important;
        padding:18px 20px !important;
    }

    .info-label,
    .contact-label{
        width:100% !important;
        margin-bottom:10px;
        font-size:1rem;
        font-weight:700;
    }

    .info-value,
    .contact-value{
        width:100% !important;
        display:block;
        font-size:.95rem;
        line-height:1.7;
        white-space:normal;
        word-break:break-word;
        overflow-wrap:anywhere;
    }

}
/* ABOUT PAGE MOBILE */
@media (max-width:768px){

    .company-box,
    .contact-card{
        width:100% !important;
        max-width:100% !important;
        margin:0 auto 24px !important;
        box-sizing:border-box;
    }

    .company-info,
    .contact-section{
        width:100% !important;
    }

    .company-info .container,
    .contact-section .container{
        width:100% !important;
        max-width:100% !important;
        padding:0 16px !important;
        box-sizing:border-box;
    }

}
/* ==========================
   CONTACT PAGE MOBILE
========================== */

@media (max-width:768px){

.contact-card{
    margin:30px 15px;
    border-radius:20px;
}

.office-section{
    padding:35px 20px;
}

.office-section h2{
    font-size:2rem;
}

.office-section h3{
    font-size:1.8rem;
    line-height:1.25;
    word-break:break-word;
}

.office-section p{
    font-size:1rem;
    line-height:1.8;
}

/* One column */

.contact-grid{
    grid-template-columns:1fr;
}

/* Each item */

.contact-item{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    gap:15px;
    padding:30px 20px;
    border-right:none !important;
    border-bottom:1px solid #ececec;
}

.contact-item:last-child{
    border-bottom:none;
}

/* Icon */

.contact-icon{
    width:65px;
    height:65px;
    min-width:65px;
}

/* Text */

.contact-content{
    width:100%;
}

.contact-content h4{
    font-size:1.35rem;
    margin-bottom:8px;
}

.contact-content p{
    font-size:1rem;
    line-height:1.6;
    word-break:break-word;
}

/* Long email */

.contact-content p,
.contact-content a{
    overflow-wrap:anywhere;
}

}
@media (max-width:768px){

.contact-grid{
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:20px;
}

.contact-item{
    width:100%;
    border:none !important;
    border-radius:16px;
    background:#fff;
    box-shadow:0 8px 20px rgba(0,0,0,.06);

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    text-align:center;

    padding:25px 18px;
    gap:15px;
}

.contact-icon{
    width:60px;
    height:60px;
    min-width:60px;
    border-radius:16px;
}

.contact-icon i{
    font-size:24px;
}

.contact-content{
    width:100%;
}

.contact-content h4{
    font-size:22px;
    margin-bottom:8px;
}

.contact-content p{
    font-size:16px;
    line-height:1.6;
    word-break:break-word;
}

.office-section h2{
    font-size:34px;
}

.office-section h3{
    font-size:24px;
    line-height:1.3;
}

.office-section p{
    font-size:17px;
}

}
@media (max-width:768px){

.contact-grid{
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:20px;
}

.contact-item{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;   /* <-- center ki jagah ye */
    text-align:center;

    gap:12px;                     /* 15-20px ki jagah */
    padding:25px 20px;

    min-height:220px;             /* Equal height */
    border:1px solid #ececec;
    border-radius:18px;
    background:#fff;
    box-shadow:0 8px 20px rgba(0,0,0,.05);
}

.contact-icon{
    width:60px;
    height:60px;
    margin-bottom:8px;
}

.contact-content{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
}

.contact-content h4{
    margin:0;
    font-size:1.35rem;
}

.contact-content p{
    margin:0;
    font-size:1rem;
    line-height:1.5;
    max-width:260px;
    word-break:break-word;
}

}
.contact-item{
    min-height:auto;
    padding:22px 20px;
}
@media (max-width:768px){

.contact-item{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
    padding:25px 20px;
}

.contact-icon{
    width:65px !important;
    height:65px !important;
    min-width:65px !important;
    margin:0 auto 15px;
}

.contact-content{
    text-align:center;
}

.contact-content h4{
    margin:0 0 8px;
}

.contact-content p{
    margin:0;
}

}
@media (max-width:768px){

.contact-content{
    width:100% !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
}

.contact-content h4{
    width:100% !important;
    text-align:center !important;
    margin:12px 0 8px !important;
}

.contact-content p{
    width:100% !important;
    text-align:center !important;
    margin:0 auto !important;
}

/* Email aur Website specifically */

.contact-item:nth-child(2) .contact-content,
.contact-item:nth-child(3) .contact-content{
    align-items:center !important;
    text-align:center !important;
}

}
@media (max-width:768px){

.contact-item{
    display:flex;
    flex-direction:column;
    align-items:center;
    text-align:center;
}

.contact-item > div:last-child{
    text-align:center;
}

.contact-item h4{
    margin:10px 0 8px;
}

.contact-item p{
    margin:0;
    white-space:nowrap;      /* Number nahi tutega */
    word-break:normal;
    overflow-wrap:normal;
}

}
@media (max-width:768px){

.contact-item > div:last-child{
    text-align:center !important;
}

.contact-item > div:last-child h4,
.contact-item > div:last-child p{
    text-align:center !important;
}

}
@media (max-width:768px){

/* Email */
.contact-item:nth-child(2) h4{
    transform: translateX(-20px);
}

/* Website */
.contact-item:nth-child(3) h4{
    transform: translateX(-20px);
}

}
@media (max-width:768px){

.contact-item{
    display:flex;
    flex-direction:column;
    align-items:center;
}

.contact-item > div:last-child{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}

.contact-item h4{
    margin:10px 0;
    width:auto;
}

.contact-item p{
    margin:0;
    width:auto;
}


.section-header h2,
.office-section h2{
    font-size:clamp(2rem,5vw,3rem);
}
}
@media (max-width:768px){

    .company-box{
        padding:20px;
    }

    .info-row{
        display:flex;
        flex-direction:column;
        align-items:flex-start;
        gap:8px;
        padding:18px 0;
    }

    .info-row .label{
        width:100%;
        display:block;
        font-size:18px;
        font-weight:700;
        margin:0;
    }

    .info-row .value{
        width:100%;
        display:block;
        font-size:16px;
        line-height:1.6;
        margin:0;
        word-break:break-word;
    }
}
/* Mobile Contact Card */
@media (max-width:768px){

    .contact-card{
        width:90%;
        margin:25px auto;
        padding:0 20px;
        border-radius:25px;
    }

    .contact-row{
        display:block !important;
        padding:22px 0;
        border-bottom:1px solid #ececec;
    }

    .contact-row:last-child{
        border-bottom:none;
    }

    .contact-row .label{
        display:block;
        width:auto !important;
        margin:0 0 8px;
        font-size:1.65rem;
        font-weight:700;
        color:#4f46e5;
        text-align:left;
    }

    .contact-row .value{
        display:block;
        width:100% !important;
        margin:0;
        font-size:1.35rem;
        color:#1f2937;
        line-height:1.6;
        text-align:left;
        word-break:break-word;
        overflow-wrap:break-word;
    }

    .contact-row .value a{
        color:#2563eb;
        text-decoration:none;
        word-break:break-word;
    }
}
@media (max-width:768px){

    .contact-row{
        display:block;
        padding:18px 0;
    }

    .contact-row .label{
        display:block;
        font-size:18px;   /* pehle 1.65rem tha */
        font-weight:700;
        margin-bottom:8px;
        color:#4f46e5;
    }

    .contact-row .value{
        display:block;
        font-size:16px;   /* pehle 1.35rem tha */
        line-height:1.6;
        color:#1f2937;
    }

    .contact-row .value a{
        font-size:16px;
    }

}
