*{
            margin:0;
            padding:0;
            box-sizing:border-box;
        }
        
        body{
            font-family:'Poppins',sans-serif;
            background:#f7fbf8;
            overflow-x:hidden;
            color:#0f172a;
        }
        
        /* ========= HEADER ========= */
        
        .header{
        
            position:fixed;
            top:0;
            left:0;
        
            width:100%;
        
            padding:18px 22px;
        
            display:flex;
            justify-content:space-between;
            align-items:center;
        
            background:rgba(255,255,255,0.78);
        
            backdrop-filter:blur(20px);
        
            z-index:1000;
                box-shadow: 0px -2px 10px #737373;
        }
        
        .logo{
            font-size:34px;
            font-weight:800;
            color:#1fb76b;
        }
        
        .menu{
            font-size:34px;
            font-weight:700;
        }
        
        /* ========= HERO ========= */
        
        .hero{
        
            padding:
                120px 24px
                60px;
        
            position:relative;
        
            overflow:hidden;
        }
        
        /* GLOW */
        
        .hero::before{
        
            content:'';
        
            position:absolute;
        
            width:420px;
            height:420px;
        
            border-radius:50%;
        
            background:
              radial-gradient(
                circle,
                rgba(31,183,107,0.18),
                transparent 70%
              );
        
            top:180px;
            right:-100px;
        
            filter:blur(40px);
        
            z-index:0;
        }
        
        /* GRID */
        
        .hero::after{
        
            content:'';
        
            position:absolute;
            inset:0;
        
            background-image:
              linear-gradient(rgba(0,0,0,0.02) 1px, transparent 1px),
              linear-gradient(90deg, rgba(0,0,0,0.02) 1px, transparent 1px);
        
            background-size:40px 40px;
        
            z-index:0;
        }
        
        /* ========= CONTENT ========= */
        
        .hero-content{
        
            position:relative;
            z-index:3;
            width: 231px;
        }
        
        .hero-badge{
        
            display: inline-flex;
            align-items: center;
            gap: 10px;
            background: rgba(255, 255, 255, 0.85);
            color: #1fb76b;
            padding: 12px 20px;
            border-radius: 60px;
            font-size: 14px;
            font-weight: 600;
            margin-bottom: 28px;
            box-shadow: 0px 0px 10px -2px #83b995;
        }
        
        .hero-title{
            font-size: 28px;
            line-height: 1.5;
            font-weight: 800;
            margin-bottom: 24px;
            letter-spacing: 0;
        }
        
        .hero-title span{
            color:#1fb76b;
        }
        
        .hero-desc{
        
            font-size:20px;
            line-height:1.9;
        
            color:#5b6b63;
        
            margin-bottom:40px;
        
            max-width:650px;
        }
        
        /* ========= BUTTONS ========= */
        
        .hero-btns{
        
            display:flex;
            gap:18px;
        
            flex-wrap:wrap;
        
            margin-bottom:60px;
        }
        
        .btn-primary{
            background: #1fb76b;
            color: #fff;
            text-decoration: none;
            padding: 12px 25px;
            border-radius: 18px 60px;
            font-weight: 600;
            box-shadow: 0 15px 35px rgba(31, 183, 107, 0.30);
            transition: .3s;
        }
        
        .btn-primary:hover{
        
            transform:translateY(-5px);
        }
        
        .btn-outline{
        
            background:#fff;
        
            border:2px solid #dbe9e1;
        
            color:#13222f;
        
            text-decoration:none;
        
            padding:20px 34px;
        
            border-radius:60px;
        
            font-weight:600;
        }
        
        /* ========= IMAGE AREA ========= */
        
        .hero-image{
            position: absolute;
            z-index: 3;
            margin-top: 20px;
            text-align: center;
            
            width: 56vw;
            right: 0;
        }
        
        .hero-image-1{
            top: -20px;
            right: 45px !important;
        }
        
        .hero-image-2{
                top: 155px;
    right: 24px !important;
        }
        
        .hero-image-2 img{
            transform: scaleX(-1);
        }
        
        .hero-image-3{
            top: 95px;
                    right: 71px !important;
        }
        
        .hero-image-3 img{
            width: 82vw !important;
            transform: scaleX(-1);
        }
        
        
        
        .hero-image img{
        
            width:100%;
            max-width:520px;
        
            position:relative;
        
            z-index:5;
        
            filter:
              drop-shadow(0 25px 60px rgba(0,0,0,0.12));
        }
        
        /* ========= FLOATING TAGS ========= */
        
        .tag{
        
            position:absolute;
        
            background:rgba(255,255,255,0.85);
        
            backdrop-filter:blur(16px);
        
            padding:14px 24px;
        
            border-radius:22px;
        
            box-shadow:
              0 12px 30px rgba(0,0,0,0.08);
        
            font-weight:600;
        
            z-index:10;
        
            animation:float 4s ease-in-out infinite;
        }
        
        .tag1{
            top:30px;
            left:20px;
        }
        
        .tag2{
            top:120px;
            right:0;
        }
        
        .tag3{
            bottom:120px;
            left:0;
        }
        
        .tag4{
            bottom:40px;
            right:20px;
        }
        
        @keyframes float{
        
            0%,100%{
                transform:translateY(0);
            }
        
            50%{
                transform:translateY(-10px);
            }
        }
        
        /* ========= STATS ========= */
        
        .stats{
        
            position:relative;
        
            z-index:5;
        
            margin-top:70px;
        
            display:grid;
        
            grid-template-columns:repeat(2,1fr);
        
            gap:18px;
        }
        
        .stat-card{
        
            background:rgba(255,255,255,0.85);
        
            backdrop-filter:blur(16px);
        
            border:1px solid rgba(255,255,255,0.6);
        
            padding:30px 20px;
        
            border-radius:28px;
        
            text-align:center;
        
            box-shadow:
              0 10px 30px rgba(0,0,0,0.05);
        }
        
        .stat-card h3{
        
            font-size:34px;
        
            color:#1fb76b;
        
            margin-bottom:10px;
        }
        
        .stat-card p{
        
            color:#6a7b72;
        
            line-height:1.7;
        }
        
        /* ========= SERVICES ========= */
        
        .services{
        
            padding:
                30px 24px
                80px;
        
            position:relative;
        }
        
        .section-title{
        
            font-size:40px;
        
            font-weight:800;
        
            margin-bottom:30px;
        }
        
        .service-grid{
        
            display:grid;
        
            grid-template-columns:repeat(2,1fr);
        
            gap:20px;
        }
        
        .service-card{
        
            background:rgba(255,255,255,0.85);
        
            backdrop-filter:blur(14px);
        
            padding:30px 24px;
        
            border-radius:30px;
        
            box-shadow:
              0 12px 35px rgba(0,0,0,0.05);
        
            transition:.3s;
        }
        
        .service-card:hover{
        
            transform:translateY(-8px);
        }
        
        .service-icon{
        
            width:72px;
            height:72px;
        
            border-radius:22px;
        
            background:#eefbf3;
        
            display:flex;
            justify-content:center;
            align-items:center;
        
            font-size:34px;
        
            margin-bottom:20px;
        }
        
        .service-card h4{
        
            font-size:22px;
        
            margin-bottom:14px;
        }
        
        .service-card p{
        
            color:#6a7b72;
        
            line-height:1.8;
        }
        
        /* Popular Careers */
        
        .popular-careers{
            padding:25px 20px 6px;
        }
        
        .section-header{
            display:flex;
            justify-content:space-between;
            align-items:center;
            margin-bottom:20px;
        }
        
        .section-header h2{
            font-size:34px;
            font-weight:700;
            color:#13232f;
            margin:0;
        }
        
        .section-header a{
            color:#324552;
            text-decoration:none;
            font-size:22px;
        }
        
        .career-slider{
            display:flex;
            gap:18px;
            overflow-x:auto;
            scrollbar-width:none;
        }
        
        .career-slider::-webkit-scrollbar{
            display:none;
        }
        
        .career-card{
            min-width:170px;
            background:#fff;
            border-radius:28px;
            padding:30px 20px;
            text-align:center;
            box-shadow:0 10px 30px rgba(0,0,0,.05);
        }
        
        .career-icon{
            width:64px;
            height:64px;
            margin:auto;
            border-radius:50%;
            background:#f1ecff;
            display:flex;
            align-items:center;
            justify-content:center;
            color:#6d5bd0;
            font-size:28px;
        }
        
        .career-icon.green{
            background:#e9faf0;
            color:#17a65a;
            font-weight:700;
            font-size:26px;
        }
        
        .career-card h3{
            margin-top:18px;
            font-size:16px;
            line-height:1.5;
            color:#13232f;
        }
        
        
        
        /* Bottom Navigation */
        
        .bottom-nav{
            position:fixed;
            left:0;
            right:0;
            bottom:0;
        
            background:#fff;
            height:80px;
        
            display:flex;
            justify-content:space-around;
            align-items:center;
        
            border-radius:30px 30px 0 0;
        
            box-shadow:0 -5px 25px rgba(0,0,0,.08);
        }
        
        .nav-item{
            text-decoration:none;
            color:#1c2834;
        
            display:flex;
            flex-direction:column;
            align-items:center;
            gap:6px;
        
            font-size:13px;
        }
        
        .nav-item i{
            font-size:22px;
        }
        
        .nav-item.active{
            color:#1fb76b;
        }
        
        .center-btn{
            width:70px;
            height:70px;
            border-radius:50%;
        
            background:#1fb76b;
            color:#fff;
        
            display:flex;
            align-items:center;
            justify-content:center;
        
            margin-top:-64px;
        
            box-shadow:0 10px 25px rgba(31,183,107,.4);
        }
        
        .center-btn i{
            font-size:30px;
        }
        
        
        .testimonials{
            padding:0px 20px 100px;
            background:#f8faf9;
        }
        
        .section-head{
            text-align:left;
            margin-bottom:30px;
        }
        
        .section-head h2{
           font-size: 16px;
    font-weight: 700;
    color: #13232f;
    margin-bottom: 10px;
        }
        
        .section-head p{
            color:#6b7280;
            max-width:600px;
            margin:auto;
            font-size: 13px;
        }
        
        .testimonial-slider{
            display:flex;
            gap:20px;
            overflow-x:auto;
            scrollbar-width:none;
        }
        
        .testimonial-slider::-webkit-scrollbar{
            display:none;
        }
        
        .testimonial-card{
            min-width:320px;
            background:rgba(255,255,255,.85);
            backdrop-filter:blur(12px);
        
            border-radius:28px;
            padding:24px;
        
            box-shadow:
            0 10px 35px rgba(0,0,0,.06);
             margin-bottom: 30px;
        }
        
        .student-info{
            display:flex;
            align-items:center;
            gap:15px;
            margin-bottom:15px;
        }
        
        .student-info img{
            width:60px;
            height:60px;
            border-radius:50%;
            object-fit:cover;
        }
        
        .student-info h4{
            margin:0;
            font-size:16px;
            color:#13232f;
        }
        
        .student-info span{
            color:#1fb76b;
            font-size:12px;
        }
        
        .rating{
            color:#ffb800;
            font-size:20px;
            margin-bottom:12px;
        }
        
        .testimonial-card p{
            color:#52606d;
            line-height:1.8;
            font-size:13px;
           
        }
        
        .students-joined{
            margin-top:6px;
            display:flex;
            justify-content:center;
            align-items:center;
            gap:15px;
            flex-wrap:wrap;
            margin-bottom: 20px;
        }
        
        .avatars{
            display:flex;
        }
        
        .avatars img{
            width:48px;
            height:48px;
            border-radius:50%;
            border:3px solid #fff;
            object-fit:cover;
            margin-left:-12px;
        }
        
        .avatars img:first-child{
            margin-left:0;
        }
        
        .joined-text{
            font-size:16px;
            color:#13232f;
        }
        
        .joined-text strong{
            color:#1fb76b;
        }
        
        /* ========= MOBILE ========= */
        
        @media(max-width:768px){
            
            .swiper-wrapper{
                padding-left:24px !important;
            }
            
            .hero_home{
                        padding: 120px 0px 16px 0px !important;
            }
        
            .hero-title{
                font-size: 1.3rem;
            }
        
            .hero-desc{
               font-size: 11px;
                line-height: 1.5;
            }
            
            .tag {
                font-size: 10px;
                position: absolute;
                background: rgba(255, 255, 255, 0.85);
                backdrop-filter: blur(16px);
                padding: 12px 12px;
                border-radius: 16px;
                box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
                font-weight: 600;
                z-index: 10;
                animation: float 4s ease-in-out infinite;
            }
            
            .tag3 {
                bottom: 231px;
                left: 50px;
            }
            
            .tag1 {
                top: 18px;
                left: 108px;
            }
            
            .tag2 {
                top: 62px;
                right: -13px;
            }
            
            .tag4 {
                     bottom: 165px;
                right: -17px;
            }
            
            
            
            .tag31 {
                bottom: 234px;
                left: 40px;
            }
            
            .tag11 {
                top: -36px;
                left: 55px;
            }
            
            .tag21 {
                        top: -49px;
        right: 0px;
            }
            
            .tag41 {
                 bottom: 269px;
                right: 14px;
            }
            
            
            
            .tag311 {
                      bottom: 268px;
        left: 75px;
            }
            
            .tag111 {
                top: -11px;
        left: 89px;
            }
            
            .tag211 {
                        top: -48px;
        right: -38px;
            }
            
            .tag411 {
                                   bottom: 282px;
        right: -13px;
            }
            
            .btn-primary, .btn-outline{
                font-size: 11px;
                border-radius: 14px;
                padding: 12px 25px;
            }
            
            .btn-outline{
                padding: 12px 19px;
                border: solid 2px #1eb368;
            }
            
            
            .hero-content{
            
                width: 164px;
            }
            
            .hero-desc{
                margin-bottom: 16px;
            }
            
            .hero-image{
                right: 22px;
                width: 61vw;
            }
            
            .fa-solid, .fas{
                font-size: 17px;
            }
            
            .stats{
                display: block;
                margin-top: 2px;
                        padding: 0 24px;
            }
            
            .stat-card{
                float: left;
                background: rgba(255, 255, 255, 0.85);
                backdrop-filter: blur(16px);
                border: 1px solid rgba(255, 255, 255, 0.6);
                padding: 17px 5px;
                border-radius: 0px;
                text-align: center;
                box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
                width: 25%;
            }
            
            .stat-card h3 {
                font-size: 18px;
                color: #1fb76b;
                margin-bottom: 10px;
            }
            
            .stat-card p {
                color: #6a7b72;
                line-height: 1.7;
                font-size: 12px;
            }
            
            .hero-btns{
                margin-bottom: 30px;
            }
            
            .hero{
                padding: 120px 0px 16px 24px;
            }
            
            .services{
                padding: 0px 24px 80px;
            }
            
            .section-title{
                font-size: 16px;
                margin-bottom: 12px;
            }
            
            .section-title-pages{
                font-size: 26px;
                font-weight: 600;
            }
            
            .service-grid {
                display: block;
            }
            
            .service-card{
              width: 30.5%;
                float: left;
                padding: 15px 10px;
                border-radius: 12px;
                margin-left: 9px;
                text-align: center;
                min-height: 210px;
                
            }
            
            .service-card p{
            font-size: 10px;
            text-align: center;
            }
            
            .service-card h4{
                font-size: 12px;
                margin-bottom: 14px;
                text-align: center;
            }
            
            .stat-card .fas{
                color: #1eb469;
                padding: 10px;
                background-color: #edfaf4;
                border-radius: 37px;
                margin-bottom: 7px;
            }
            
            .service-icon{
                font-size: 22px;
                border-radius: 66px;
                text-align: center;
                padding: 8px 14px;
                width: min-content;
                display: inline-block;
                margin-bottom: 9px;
                height: auto;
            }
            
            .section-header h2{
                font-size: 16px;
            }
            
            .section-header a{
                font-size: 14px;
            }
            
            .section-header a i{
                font-size: 13px;
                color: #7d88ff;
            }
            
            .career-card {
                min-width: 96px;
                background: #fff;
                border-radius: 28px;
                padding: 15px 12px;
                text-align: center;
                box-shadow: 0 10px 30px rgba(0, 0, 0, .05);
                margin-bottom: 20px;
            }
            
            .career-card h3 {
                margin-top: 9px;
                font-size: 12px;
                line-height: 1.5;
                color: #13232f;
            }
            
            .career-icon{
                font-size: 28px;
                width: 44px;
                height: 44px;
            }
            
            .career-slider {
                display: flex;
                gap: 9px;
                overflow-x: auto;
                scrollbar-width: none;
            }
            
            .center-btn i {
                font-size: 25px;
            }
            
            .center-btn {
                width: 62px;
                height: 62px;
            }
        
        }
        
        
        /* Mobile Sidebar */

.mobile-sidebar{

    padding:13px;
}

.mobile-sidebar.active{
    right:0;
}

.mobile-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.45);
    opacity:0;
    visibility:hidden;
    transition:.3s;
    z-index:9998;
}

.mobile-overlay.active{
    opacity:1;
    visibility:visible;
}

.close-btn{
    text-align:right;
    font-size:26px;
    cursor:pointer;
    margin-bottom:25px;
}

.mobile-nav ul{
    list-style:none;
}

.mobile-nav ul li{
    border-bottom:1px solid #eee;
}

.mobile-nav ul li a,
.dropdown-head{
    display:inline-block;
    justify-content:space-between;
    align-items:center;
    padding:15px 6px;
    text-decoration:none;
    color:#13232f;
    font-weight:500;
}

.dropdown-head{
    cursor:pointer;
}

.submenu{
    display:none;
    padding-left:15px;
}

.submenu li{
    border:none;
}

.submenu a{
    font-size:14px;
    color:#666;
    padding:10px 0;
}

.mobile-dropdown.active .submenu{
    display:block;
}


.mobile-sidebar{
    position: fixed;
    top: 0;
    right: -280px;
    width: 280px;
    max-width: 85%;
    height: 100vh;
    background: #fff;
    z-index: 9999;
    transition: all .35s ease;
    box-shadow: -10px 0 30px rgba(0,0,0,.08);
    overflow-y: auto;
    border-radius: 20px 0 0 20px;
}

.mobile-sidebar.active{
    right: 0;
}

.mobile-overlay{
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.25);
    backdrop-filter: blur(2px);
    opacity: 0;
    visibility: hidden;
    transition: .3s;
    z-index: 9998;
}

.mobile-overlay.active{
    opacity: 1;
    visibility: visible;
}

.close-btn{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    height: 60px;
    font-size: 22px;
    cursor: pointer;
    border-bottom: 1px solid #f1f1f1;
}

.mobile-nav{
    padding: 10px 0;
}

.mobile-nav ul{
    list-style: none;
    margin: 0;
    padding: 0;
}

.mobile-nav > ul > li{
    border-bottom: 1px solid #f5f5f5;
}


.mobile-nav a:hover{
    color: #1fb76b;
}

.submenu{
    display: none;
    background: #fafafa;
}

.mobile-dropdown.active .submenu{
    display: block;
}

.submenu li a{
    padding: 14px 40px;
    font-size: 14px;
    color: #555;
}

.mobile-dropdown.active .fa-chevron-down{
    transform: rotate(180deg);
}

.fa-chevron-down{
    transition: .3s;
}


.drawer-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:18px 0px;
    border-bottom:1px solid #f1f1f1;
}

.drawer-header img{
    max-height:40px;
    width:auto;
}

.drawer-header .fa-xmark{
    font-size:22px;
    cursor:pointer;
    color:#333;
}

.mobile-nav a{
    display:block;
    width:100%;
    text-align:left !important;
    padding:16px 22px;
    color:#1f2937;
    text-decoration:none;
    font-weight:500;
    font-size:16px;
}

.dropdown-head{
    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:16px 0px;
    cursor:pointer;
}

.mobile-nav li{
    text-align:left !important;
}


.vision-formula {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 12px;
}

.vision-item,
.vision-result {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 12px 18px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.vision-item {
    background: #fff;
    color: #1f2937;
}

.vision-result {
    background: #16a34a;
    color: #fff;
}

.vision-plus,
.vision-equals {
    font-size: 28px;
    font-weight: 700;
    color: #16a34a;
    line-height: 1;
}

/* Mobile */
@media (max-width: 767px) {

    .vision-formula {
        flex-direction: column;
        gap: 8px;
    }

    .vision-item,
    .vision-result {
        width: 240px;
        max-width: 100%;
        padding: 14px 20px;
    }

    .vision-plus,
    .vision-equals {
        font-size: 24px;
        margin: 0;
    }
}


.lead{
    font-size: 0.9rem;
}

.how-it-works .step-card {
    background: #fff;
    border-radius: 16px;
    padding: 30px 20px;
    height: 100%;
    position: relative;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
}

.how-it-works .step-card:hover {
    transform: translateY(-5px);
}

.how-it-works .step-number {
    width: 40px;
    height: 40px;
    margin: 0 auto 15px;
    border-radius: 50%;
    background: #18a558;
    color: #fff;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.how-it-works .step-icon {
    width: 70px;
    height: 70px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: rgba(24,165,88,.1);
    color: #18a558;
    font-size: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.how-it-works .step-card h4 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 15px;
}

.how-it-works .step-card p {
    margin-bottom: 0;
    color: #666;
    line-height: 1.7;
}

/* Desktop arrows */
@media (min-width: 992px) {

    .how-it-works .col-lg-4:not(:last-child) .step-card::after {
        content: "➜";
        position: absolute;
        right: -32px;
        top: 50%;
        transform: translateY(-50%);
        font-size: 28px;
        color: #18a558;
        font-weight: bold;
        z-index: 2;
    }
}

/* Mobile Design */
@media (max-width: 767px) {

    .how-it-works .section-header h2 {
        font-size: 28px;
    }

    .how-it-works .step-card {
        padding: 20px 15px;
        margin-bottom: 20px;
    }

    .how-it-works .step-icon {
        width: 60px;
        height: 60px;
        font-size: 24px;
        margin-bottom: 15px;
    }

    .how-it-works .step-card h4 {
        font-size: 18px;
    }

    .how-it-works .step-card p {
        font-size: 14px;
    }

    /* Vertical connector */
    .how-it-works .col-lg-4:not(:last-child) .step-card::after {
        content: "↓";
        display: block;
        text-align: center;
        font-size: 28px;
        color: #18a558;
        margin-top: 15px;
    }
}


/* Course Tags */
.course-tags-modern {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 30px;
}

.course-tags-modern span {
    background: linear-gradient(135deg, #18a558, #0f7c42);
    color: #fff;
    padding: 8px 16px;
    border-radius: 50px;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
}

/* Feature Cards */
.modern-feature-card {
    background: #fff;
    border-radius: 18px;
    padding: 28px 22px;
    text-align: center;
    height: 100%;
    transition: all .3s ease;
    box-shadow: 0 10px 30px rgba(0,0,0,.08);
    border: 1px solid rgba(0,0,0,.04);
}

.modern-feature-card:hover {
    transform: translateY(-6px);
}

.modern-feature-card .icon {
    width: 70px;
    height: 70px;
    margin: 0 auto 18px;
    border-radius: 20px;
    background: rgba(24,165,88,.12);
    color: #18a558;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
}

.modern-feature-card h4 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px;
}

.modern-feature-card p {
    margin: 0;
    color: #6b7280;
    line-height: 1.7;
}

/* Desktop spacing */
#core-vision .row {
    row-gap: 25px;
}

/* Mobile Design */
@media (max-width: 767px) {

    #core-vision {
        padding: 115px 0 120px !important;
    }

    #core-vision .section-header h2 {
        font-size: 30px;
        margin-bottom: 12px;
    }

    #core-vision .section-header p {
        font-size: 15px;
        line-height: 1.7;
        padding: 0 10px;
    }

    /* Horizontal scroll tags */
    .course-tags-modern {
        flex-wrap: nowrap;
        overflow-x: auto;
        justify-content: flex-start;
        padding-bottom: 10px;
        margin-top: 25px;

        -ms-overflow-style: none;
        scrollbar-width: none;
    }

    .course-tags-modern::-webkit-scrollbar {
        display: none;
    }

    .course-tags-modern span {
        flex-shrink: 0;
    }

    /* 2 cards per row */
    #core-vision .col-lg-4 {
        width: 50%;
        padding: 8px;
    }

    .modern-feature-card {
        padding: 20px 15px;
        border-radius: 16px;
    }

    .modern-feature-card .icon {
        width: 56px;
        height: 56px;
        border-radius: 14px;
        font-size: 24px;
        margin-bottom: 12px;
    }

    .modern-feature-card h4 {
        font-size: 15px;
        line-height: 1.4;
        min-height: 42px;
    }

    .modern-feature-card p {
        font-size: 13px;
        line-height: 1.5;
    }
}

/* Very small devices */
@media (max-width: 480px) {

    #core-vision .col-lg-4 {
        width: 100%;
    }

    .modern-feature-card {
        display: flex;
        align-items: center;
        text-align: left;
        gap: 15px;
    }

    .modern-feature-card .icon {
        margin: 0;
        flex-shrink: 0;
    }

    .modern-feature-card h4 {
        min-height: auto;
        margin-bottom: 5px;
    }
}


/* =========================
   Counsellor Platform
========================= */

#core-vision-c .counsellor-visual {
    text-align: center;
}

#core-vision-c .counsellor-visual img {
    max-width: 100%;
    height: auto;
}

/* Feature Cards */
#core-vision-c .counsellor-feature {
    background: #fff;
    border-radius: 18px;
    padding: 20px;
    height: 100%;
    text-align: center;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0,0,0,0.05);
    transition: all .3s ease;
}

#core-vision-c .counsellor-feature:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0,0,0,.12);
}

#core-vision-c .counsellor-feature i {
    width: 65px;
    height: 65px;
    border-radius: 18px;
    background: rgba(25, 135, 84, 0.12);
    color: #198754;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    margin-bottom: 15px;
}

#core-vision-c .counsellor-feature h5 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 10px;
}

#core-vision-c .counsellor-feature p {
    margin: 0;
    color: #666;
    font-size: 14px;
    line-height: 1.7;
}

/* spacing */
#core-vision-c .row .col-md-6 {
    margin-bottom: 20px;
}

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

@media (max-width: 767px) {

    #core-vision-c {
        padding: 90px 0 106px !important;
    }

    #core-vision-c .section-header {
        text-align: center;
        margin-bottom: 30px !important;
    }

    #core-vision-c .section-header h2 {
        font-size: 30px;
        margin-bottom: 12px;
    }

    #core-vision-c .section-header p {
        font-size: 15px;
        line-height: 1.7;
    }

    #core-vision-c .counsellor-visual {
        margin-bottom: 30px;
    }

    #core-vision-c .counsellor-visual img {
        max-width: 260px;
    }

    /* App style cards */
    #core-vision-c .counsellor-feature {
        display: flex;
        align-items: flex-start;
        text-align: left;
        gap: 15px;
        padding: 16px;
        border-radius: 16px;
        margin-bottom: 15px;
    }

    #core-vision-c .counsellor-feature i {
        margin: 0;
        width: 50px;
        height: 50px;
        font-size: 22px;
        flex-shrink: 0;
    }

    #core-vision-c .counsellor-feature h5 {
        font-size: 16px;
        margin-bottom: 5px;
    }

    #core-vision-c .counsellor-feature p {
        font-size: 13px;
        line-height: 1.5;
    }

    /* Single column on mobile */
    #core-vision-c .col-md-6 {
        width: 100%;
    }
}

/* =========================
   Tablet
========================= */

@media (min-width:768px) and (max-width:991px) {

    #core-vision-c .counsellor-visual {
        margin-bottom: 40px;
        text-align: center;
    }

    #core-vision-c .section-header {
        text-align: center;
    }
}


/* ====================================
   Institute Platform
==================================== */

#core-vision-i {
    position: relative;
    overflow: hidden;
}

#core-vision-i .section-header h2 {
    font-weight: 700;
    margin-bottom: 15px;
}

#core-vision-i .section-header p {
    color: #6b7280;
    line-height: 1.8;
}

/* Image */

#core-vision-i .institute-visual {
    text-align: center;
}

#core-vision-i .institute-visual img {
    max-width: 100%;
    animation: floatInstitute 4s ease-in-out infinite;
}

@keyframes floatInstitute {
    0% {
        transform: translateY(0px);
    }

    50% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(0px);
    }
}

/* Feature Cards */

#core-vision-i .institute-feature {
    background: #fff;
    border-radius: 18px;
    padding: 22px;
    height: 100%;
    position: relative;
    overflow: hidden;
    box-shadow: 0 10px 25px rgba(0,0,0,.08);
    border: 1px solid rgba(0,0,0,.05);
    transition: all .3s ease;
}

#core-vision-i .institute-feature:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(0,0,0,.12);
}

#core-vision-i .institute-feature i {
    width: 65px;
    height: 65px;
    border-radius: 18px;
    background: linear-gradient(135deg,#198754,#28c76f);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    margin-bottom: 18px;
}

#core-vision-i .institute-feature h5 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 10px;
}

#core-vision-i .institute-feature p {
    margin: 0;
    color: #6b7280;
    line-height: 1.6;
    font-size: 14px;
}

#core-vision-i .col-md-6 {
    margin-bottom: 20px;
}

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

@media (max-width: 767px) {

    #core-vision-i {
        padding: 101px 0 110px !important;
    }

   

    #core-vision-i .section-header {
        text-align: center;
        margin-top: 25px;
    }

    #core-vision-i .section-header h2 {
        font-size: 30px;
    }

    #core-vision-i .section-header p {
        font-size: 15px;
    }

    #core-vision-i .institute-visual {
        margin-bottom: 20px;
    }

    #core-vision-i .institute-visual img {
        max-width: 260px;
    }

    /* App Style Cards */

    #core-vision-i .institute-feature {
        display: flex;
        align-items: flex-start;
        gap: 15px;
        text-align: left;
        padding: 16px;
    }

    #core-vision-i .institute-feature i {
        width: 52px;
        height: 52px;
        font-size: 22px;
        margin-bottom: 0;
        flex-shrink: 0;
    }

    #core-vision-i .institute-feature h5 {
        font-size: 16px;
        margin-bottom: 5px;
    }

    #core-vision-i .institute-feature p {
        font-size: 13px;
        line-height: 1.5;
    }

    #core-vision-i .col-md-6 {
        width: 100%;
    }
}

/* ====================================
   Tablet
==================================== */

@media (min-width:768px) and (max-width:991px) {

    #core-vision-i .institute-visual {
        text-align: center;
        margin-top: 40px;
    }

    #core-vision-i .section-header {
        text-align: center;
    }
}



/* ==========================
   FIND COUNSELLOR SECTION
========================== */

#doctors,
#find-a-counsellor {
    position: relative;
    overflow: hidden;
}

/* Search Card */

.search-section {
    background: rgba(255,255,255,.85);
    backdrop-filter: blur(20px);
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 20px 50px rgba(0,0,0,.08);
    border: 1px solid rgba(255,255,255,.4);
}

.search-title {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 10px;
}

.search-subtitle {
    color: #6b7280;
    margin-bottom: 30px;
}

.search-input-group {
    display: flex;
    gap: 15px;
    align-items: center;
}

.input-wrapper,
.select-wrapper {
    flex: 1;
    position: relative;
}

.input-wrapper i,
.select-wrapper i {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #198754;
    z-index: 2;
}

.input-wrapper input,
.select-wrapper select {
    height: 55px;
    padding-left: 45px;
    border-radius: 14px;
    border: 1px solid #e5e7eb;
}

.search-btn {
    height: 55px;
    border: none;
    border-radius: 14px;
    padding: 0 28px;
    background: linear-gradient(135deg,#198754,#28c76f);
    color: #fff;
    font-weight: 600;
    transition: .3s;
}

.search-btn:hover {
    transform: translateY(-2px);
}

/* Counsellor Grid */

.doctors-grid {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 25px;
}

/* Card */

.doctor-profile {
    background: #fff;
    border-radius: 22px;
    padding: 25px;
    box-shadow: 0 10px 30px rgba(0,0,0,.08);
    transition: all .35s ease;
    position: relative;
    overflow: hidden;
}

.doctor-profile::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: linear-gradient(90deg,#198754,#28c76f);
}

.doctor-profile:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 45px rgba(0,0,0,.12);
}

/* Avatar */

.doctor-avatar {
    position: relative;
}

.doctor-avatar img {
    width: 85px;
    height: 85px;
    object-fit: cover;
    border-radius: 50%;
    border: 4px solid #f3f4f6;
}

.status-indicator {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    position: absolute;
    bottom: 5px;
    right: 5px;
    border: 3px solid #fff;
}

.available {
    background: #22c55e;
}

.busy {
    background: #f97316;
}

/* Profile Header */

.profile-header {
    display: flex;
    gap: 15px;
    align-items: center;
}

.doctor-details h4 {
    margin-bottom: 5px;
    font-size: 20px;
    font-weight: 700;
}

.specialty-tag {
    display: inline-block;
    background: rgba(25,135,84,.1);
    color: #198754;
    padding: 6px 12px;
    border-radius: 50px;
    font-size: 13px;
    font-weight: 600;
}

/* Rating */

.rating-section {
    margin: 20px 0;
}

.stars {
    color: #fbbf24;
    margin-bottom: 8px;
}

/* Buttons */

.action-buttons {
    display: flex;
    gap: 10px;
}

.btn-primary,
.btn-secondary {
    flex: 1;
    text-align: center;
    padding: 12px;
    border-radius: 12px;
    text-decoration: none;
    transition: .3s;
}

.btn-primary {
    background: linear-gradient(135deg,#198754,#28c76f);
    color: #fff;
}

.btn-secondary {
    border: 1px solid #d1d5db;
    color: #374151;
}

.btn-primary:hover,
.btn-secondary:hover {
    transform: translateY(-2px);
}

/* View All */

.btn-view-all {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(135deg,#198754,#28c76f);
    color: #fff;
    padding: 15px 30px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
}

/* ==========================
   MOBILE
========================== */

@media (max-width:991px){

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

    .search-input-group{
        flex-direction:column;
    }

    .search-btn,
    .input-wrapper,
    .select-wrapper{
        width:100%;
    }
}

@media (max-width:767px){

    #find-a-counsellor{
        padding: 90px 0 148px !important;
    }

    .search-section{
        padding:25px;
    }

    .search-title{
        font-size:24px;
    }

    .doctors-grid{
        grid-template-columns:1fr;
    }

    .doctor-profile{
        padding:18px;
    }

    .doctor-avatar img{
        width:70px;
        height:70px;
    }

    .doctor-details h4{
        font-size:18px;
    }

    .action-buttons{
        flex-direction:column;
    }
}


#featured-departments{
    background:#f8fafc;
    position:relative;
    overflow:hidden;
}

#featured-departments .section-title h2{
    font-size:42px;
    font-weight:800;
    margin-bottom:15px;
}

#featured-departments .section-title p{
    max-width:700px;
    margin:auto;
    color:#64748b;
    font-size:17px;
}


.specialty-card{
    background:#fff;
    border-radius:28px;
    overflow:hidden;
    height:100%;
    display:flex;
    box-shadow:0 20px 50px rgba(0,0,0,.08);
    transition:.4s;
    border:1px solid rgba(255,255,255,.3);
}

.specialty-card:hover{
    transform:translateY(-8px);
    box-shadow:0 30px 70px rgba(0,0,0,.12);
}

.specialty-content{
    flex:1;
    padding:35px;
}

.specialty-label{
    background:linear-gradient(135deg,#16a34a,#22c55e);
    color:#fff;
    padding:8px 16px;
    border-radius:50px;
    font-size:13px;
    font-weight:600;
}

.specialty-content h3{
    font-size:30px;
    font-weight:800;
    margin:20px 0 15px;
}

.specialty-content p{
    color:#64748b;
    line-height:1.8;
}

.specialty-features{
    margin-top:20px;
}

.specialty-features span{
    display:block;
    margin-bottom:10px;
    color:#334155;
    font-weight:500;
}

.specialty-features i{
    color:#22c55e;
    margin-right:8px;
}

.specialty-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-top:20px;
    color:#16a34a;
    font-weight:700;
    text-decoration:none;
}

.specialty-link:hover{
    gap:14px;
}


.specialty-visual{
    width:280px;
    position:relative;
}

.specialty-visual img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.visual-overlay{
    position:absolute;
    top:20px;
    right:20px;
    width:70px;
    height:70px;
    border-radius:20px;
    background:rgba(255,255,255,.9);
    backdrop-filter:blur(10px);

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:30px;
    color:#16a34a;
}


.department-highlight{
    background:#fff;
    border-radius:24px;
    padding:30px;
    height:100%;
    position:relative;
    overflow:hidden;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    transition:.35s;
}

.department-highlight:hover{
    transform:translateY(-8px);
}

.highlight-icon{
    width:70px;
    height:70px;
    border-radius:20px;

    background:linear-gradient(135deg,#16a34a,#22c55e);
    color:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:28px;
    margin-bottom:20px;
}

.department-highlight h4{
    font-size:24px;
    font-weight:700;
    margin-bottom:15px;
}

.department-highlight p{
    color:#64748b;
}

.highlight-list{
    padding:0;
    margin:20px 0;
    list-style:none;
}

.highlight-list li{
    margin-bottom:10px;
    position:relative;
    padding-left:20px;
}

.highlight-list li:before{
    content:"✓";
    position:absolute;
    left:0;
    color:#16a34a;
    font-weight:700;
}

.highlight-cta{
    display:inline-block;
    padding:10px 24px;
    border-radius:50px;
    background:#16a34a;
    color:#fff;
    text-decoration:none;
    font-weight:600;
}

.emergency-banner{
    margin-top:80px;

    background:
    linear-gradient(
        135deg,
        #16a34a,
        #22c55e
    );

    border-radius:30px;

    padding:50px;

    color:#fff;

    box-shadow:
    0 30px 80px rgba(22,163,74,.25);
}

.emergency-content h3{
    font-size:34px;
    font-weight:800;
    margin-bottom:15px;
}

.emergency-content p{
    margin:0;
    opacity:.95;
}

.emergency-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;

    background:#fff;
    color:#16a34a;

    padding:16px 28px;

    border-radius:50px;

    text-decoration:none;
    font-weight:700;

    transition:.3s;
}

.emergency-btn:hover{
    transform:translateY(-3px);
}


@media(max-width:768px){

    #featured-departments{
        padding:108px 0 150px !important;
    }

    .specialty-card{
        flex-direction:column;
    }

    .specialty-visual{
        width:100%;
        height:220px;
    }

    .specialty-content{
        padding:25px;
    }

    .specialty-content h3{
        font-size:24px;
    }

    .department-highlight{
        padding:22px;
    }

    .emergency-banner{
        padding:30px 20px;
        text-align:center;
    }

    .emergency-content h3{
        font-size:24px;
    }

    .emergency-btn{
        margin-top:20px;
        width:100%;
        justify-content:center;
    }
}


#featured-services{
    background: linear-gradient(
        180deg,
        #ffffff 0%,
        #f8fafc 100%
    );
    position: relative;
    overflow: hidden;
}

#featured-services .section-title h2{
    font-size: 42px;
    font-weight: 800;
    margin-bottom: 15px;
}

#featured-services .section-title p{
    max-width: 700px;
    margin: auto;
    color: #64748b;
    font-size: 17px;
}


.featured-service-main{
    background:#fff;
    border-radius:30px;
    overflow:hidden;
    box-shadow:0 25px 60px rgba(0,0,0,.08);
    transition:.4s;
}

.featured-service-main:hover{
    transform:translateY(-8px);
}

.service-image-wrapper{
    position:relative;
    overflow:hidden;
}

.service-image-wrapper img{
    width:100%;
    height:420px;
    object-fit:cover;
    transition:.5s;
}

.featured-service-main:hover img{
    transform:scale(1.05);
}

.service-overlay{
    position:absolute;
    top:20px;
    left:20px;
}

.service-badge{
    background:rgba(255,255,255,.95);
    backdrop-filter:blur(15px);
    padding:12px 18px;
    border-radius:50px;
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:600;
}

.service-badge i{
    color:#16a34a;
}

.service-details{
    padding:35px;
}

.service-details h2{
    font-size:34px;
    font-weight:800;
    margin-bottom:15px;
}

.service-details p{
    color:#64748b;
    line-height:1.8;
}

.main-cta{
    display:inline-block;
    margin-top:20px;
    padding:14px 28px;
    border-radius:50px;
    background:linear-gradient(
        135deg,
        #16a34a,
        #22c55e
    );
    color:#fff;
    text-decoration:none;
    font-weight:700;
}

.services-sidebar{
    display:flex;
    flex-direction:column;
    gap:20px;
    height:100%;
}

.service-item{
    background:#fff;
    border-radius:24px;
    padding:25px;
    display:flex;
    gap:18px;
    align-items:flex-start;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    transition:.3s;
}

.service-item:hover{
    transform:translateX(8px);
}

.service-icon-wrapper{
    width:70px;
    height:70px;
    border-radius:20px;
    background:linear-gradient(
        135deg,
        #16a34a,
        #22c55e
    );

    color:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:28px;
    flex-shrink:0;
}

.service-info h4{
    font-size:20px;
    font-weight:700;
    margin-bottom:10px;
}

.service-info p{
    color:#64748b;
    margin-bottom:12px;
}

.service-link{
    color:#16a34a;
    text-decoration:none;
    font-weight:600;
}



.specialties-grid{
    margin-top:80px;
}

.specialty-card{
    background:#fff;
    border-radius:24px;
    padding:30px 20px;
    height:100%;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    transition:.35s;
}

.specialty-card:hover{
    transform:translateY(-8px);
}

.specialty-icon{
    width:80px;
    height:80px;
    margin:auto auto 20px;

    border-radius:22px;

    background:linear-gradient(
        135deg,
        #16a34a,
        #22c55e
    );

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;
    font-size:32px;
}

.specialty-content h5{
    font-size:20px;
    font-weight:700;
    margin-bottom:10px;
}

.specialty-content span{
    color:#64748b;
    font-size:14px;
}

@media(max-width:768px){

    #featured-services{
        padding: 110px 0 120px !important;
    }

    #featured-services .section-title h2{
        font-size:30px;
    }

    .service-image-wrapper img{
        height:250px;
    }

    .service-details{
        padding:22px;
    }

    .service-details h2{
        font-size:24px;
    }

    .service-item{
        padding:18px;
    }

    .service-icon-wrapper{
        width:50px;
        height:50px;
        font-size:20px;
    }

    .service-info h4{
        font-size:16px;
    }

    .service-info p{
        font-size:13px;
    }

    .specialties-grid{
        margin-top:40px;
    }

    .specialty-card{
        margin-bottom:15px;
    }

    .main-cta{
        width:100%;
        text-align:center;
    }
}


.career-contact-section{
    padding:100px 0;
    background:#f8fafc;
}

.career-contact-card{
    background:#fff;
    border-radius:32px;
    padding:50px;
    box-shadow:0 25px 60px rgba(0,0,0,.08);
}

.contact-badge{
    display:inline-block;
    padding:10px 18px;
    border-radius:50px;
    background:#dcfce7;
    color:#15803d;
    font-weight:600;
    margin-bottom:20px;
}

.contact-content h2{
    font-size:42px;
    font-weight:800;
    margin-bottom:20px;
}

.contact-content p{
    color:#64748b;
    line-height:1.8;
}

.contact-stats{
    display:flex;
    gap:20px;
    margin:30px 0;
}

.stat-box{
    text-align:center;
    flex:1;
}

.stat-box h4{
    color:#16a34a;
    font-weight:800;
    margin-bottom:5px;
}

.contact-actions{
    display:flex;
    gap:15px;
}

.btn-call{
    background:#16a34a;
    color:#fff;
    padding:14px 28px;
    border-radius:50px;
    text-decoration:none;
}

.btn-contact{
    border:2px solid #16a34a;
    color:#16a34a;
    padding:14px 28px;
    border-radius:50px;
    text-decoration:none;
}

.contact-info-card{
    background:#f8fafc;
    border-radius:24px;
    padding:30px;
}

.info-item{
    display:flex;
    gap:15px;
    margin-bottom:25px;
}

.info-item i{
    color:#16a34a;
    font-size:24px;
}

.info-item h6{
    margin-bottom:5px;
    font-weight:700;
}

.info-item p{
    margin:0;
    color:#64748b;
}

.map-wrapper{
    border-radius:18px;
    overflow:hidden;
}

.map-wrapper iframe{
    width:100%;
    height:250px;
    border:none;
}

@media(max-width:768px){

    .career-contact-card{
        padding:25px;
        border-radius:20px;
    }

    .contact-content h2{
        font-size:28px;
    }

    .contact-stats{
        flex-direction:column;
        gap:15px;
    }

    .contact-actions{
        flex-direction:column;
    }

    .btn-call,
    .btn-contact{
        width:100%;
        text-align:center;
    }

    .contact-info-card{
        margin-top:30px;
        padding:20px;
    }

    .map-wrapper iframe{
        height:220px;
    }
}

.mobile-sidebar{
    background: linear-gradient(
        180deg,
        #ffffff,
        #f8fafc
    );

    box-shadow:
    -10px 0 40px rgba(0,0,0,.15);
}


.drawer-header{
    padding:25px 20px;
    border-bottom:1px solid #e5e7eb;

    display:flex;
    align-items:center;
    justify-content:space-between;
}

.brand-box{
    display:flex;
    align-items:center;
    gap:12px;
}

.brand-icon{
    width:46px;
    height:46px;

    border-radius:14px;

    background:linear-gradient(
        135deg,
        #16a34a,
        #22c55e
    );

    color:#fff;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:20px;
}

.brand-box h3{
    margin:0;
    color:#16a34a;
    font-size:22px;
    font-weight:700;
}

.brand-box span{
    font-size:12px;
    color:#64748b;
}

#closeMenu{
    font-size:24px;
    cursor:pointer;
    color:#475569;
}


.mobile-nav{
    padding:15px;
}

.mobile-nav ul{
    list-style:none;
    padding:0;
    margin:0;
}

.mobile-nav li{
    margin-bottom:10px;
}

.mobile-nav a{
    display:flex;
    align-items:center;
    gap:12px;

    padding:14px 16px;

    border-radius:14px;

    color:#1e293b;
    text-decoration:none;

    font-weight:600;

    transition:.3s;
}


.mobile-nav a:hover{
    background:#f0fdf4;
    color:#16a34a;
}

.mobile-nav a i{
    width:20px;
    text-align:center;
    color:#16a34a;
}

.dropdown-head{
    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:14px 16px;

    background:#f8fafc;

    border-radius:14px;

    cursor:pointer;

    font-weight:600;
}


.submenu{
    padding-left:15px;
    margin-top:8px;
}

.submenu li{
    margin-bottom:8px;
}

.submenu a{
    background:#f8fafc;

    border-left:3px solid #16a34a;

    border-radius:10px;

    padding:12px 14px;
}


.menu-cta{
    margin:20px;
    padding:20px;

    background:
    linear-gradient(
        135deg,
        #16a34a,
        #22c55e
    );

    border-radius:18px;

    text-align:center;

    color:#fff;
}

.menu-cta h5{
    margin-bottom:8px;
    font-weight:700;
}

.menu-cta p{
    font-size:13px;
    margin-bottom:15px;
    opacity:.9;
}

.menu-call-btn{
    display:block;

    background:#fff;

    color:#16a34a;

    padding:12px;

    border-radius:50px;

    text-decoration:none;

    font-weight:700;
}

.active-menu{
    background:
    linear-gradient(
        135deg,
        #16a34a,
        #22c55e
    ) !important;

    color:#fff !important;
}

.active-menu i{
    color:#fff !important;
}


.modern-app-modal{
    border:none;
    border-radius:24px;
    overflow:hidden;
    box-shadow:0 25px 60px rgba(0,0,0,.15);
}

.modern-app-modal .modal-header{
    background:linear-gradient(135deg,#16a34a,#22c55e);
    color:#fff;
    padding:20px 25px;
}

.modern-app-modal .modal-title{
    font-weight:700;
    display:flex;
    align-items:center;
    gap:10px;
}

.modern-app-modal .btn-close{
    filter:brightness(0) invert(1);
}

.modern-app-modal .modal-body{
    padding:35px 30px;
}

.app-icon-circle{
    width:90px;
    height:90px;
    margin:0 auto 20px;
    border-radius:50%;
    background:rgba(34,197,94,.12);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:38px;
    color:#16a34a;
}

.modal-text{
    color:#64748b;
    line-height:1.8;
    margin-bottom:25px;
}

.download-buttons{
    display:flex;
    gap:15px;
    justify-content:center;
    flex-wrap:wrap;
}

.store-btn{
    min-width:180px;
    padding:14px 20px;
    border-radius:14px;
    text-decoration:none;
    font-weight:600;
    transition:.3s;
}

.android-btn{
    background:#16a34a;
    color:#fff;
}

.android-btn:hover{
    background:#15803d;
    color:#fff;
    transform:translateY(-2px);
}

.ios-btn{
    background:#111827;
    color:#fff;
}

.ios-btn:hover{
    background:#000;
    color:#fff;
    transform:translateY(-2px);
}

.contact-help{
    margin-top:25px;
    color:#64748b;
    font-size:14px;
}

.contact-help i{
    color:#16a34a;
    margin-right:6px;
}


.qr-section{
    border-top:1px solid #e5e7eb;
    padding-top:20px;
    margin-top:25px;
}

.qr-code{
    max-width:120px;
    border:1px solid #e5e7eb;
    border-radius:12px;
    padding:8px;
    background:#fff;
    transition:.3s;
}

.qr-code:hover{
    transform:scale(1.05);
}