@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

        body {
            background-color: #0b0b0b;
            color: #ffffff;
            font-family: 'Segoe UI', sans-serif;
        }

        .hero-section {
            padding: 100px 0;
        }

        .hero-title {
            font-size: 3rem;
            font-weight: 800;
            line-height: 1.2;
        }

        .highlight {
            color: #f5b400;
        }

        .hero-text {
            color: #bfbfbf;
            margin: 20px 0 30px;
            max-width: 520px;
        }

        .btn-gold {
            background: #f5b400;
            color: #000;
            font-weight: 600;
            padding: 12px 24px;
            border-radius: 8px;
            border: none;
        }

        .btn-outline-gold {
            border: 1px solid #f5b400;
            color: black;
            padding: 12px 24px;
            border-radius: 8px;
            margin-left: 15px;
        }

        .btn-outline-gold:hover {
            background: #f5b400;
            color: #000;
        }

        .hero-note {
            font-size: 14px;
            color: #aaa;
            margin-top: 15px;
        }

        .hero-note-no-margin {
            font-size: 14px;
            color: #aaa;
        }

        .stats {
            margin-top: 50px;
        }

        .stat-box h3 {
            color: #f5b400;
            font-weight: 700;
        }

        .hero-image {
            border: 2px solid #f5b400;
            border-radius: 16px;
            overflow: hidden;
        }

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

        /* ===========================
        MOBILE RESPONSIVE
        =========================== */
        @media (max-width: 768px) {
            .hero-section {
                padding: 20px 0;
            }

            .hero-title {
                font-size: 30px;
            }

            .hero-text {
                font-size: 13px;
            }

            .stats {
                margin-top: 30px;
            }

            .stat-box h3 {
                font-size: 22px;
            }
        }


        .custom-navbar {
        padding: 20;
        }

        .custom-navbar img {
        height: 70px;
        object-fit: contain;
        }

        .custom-navbar .container {
        height: auto;
        }

        .custom-navbar .navbar-toggler {
        border-color: transparent;
        }

        .custom-navbar .navbar-toggler:active,
        .custom-navbar .navbar-toggler:focus {
        box-shadow: none;
        outline: none;
        }

        /* Desktop spacing between nav items */
        @media (min-width: 992px) {
            .custom-navbar .custom-navbar-nav li {
                margin-left: 15px;
                margin-right: 15px;
            }
        }

        /* Nav link default style */
        .custom-navbar .custom-navbar-nav li a {
        font-weight: 500;
        color: #fae198 !important;
        opacity: 0.5;
        font-size: 16px;
        transition: 0.3s ease;
        position: relative;
        }

        /* Active link */
        .custom-navbar .custom-navbar-nav li a.active {
        color: #fae198 !important;
        border-bottom: 5px solid #f9bf29;
        opacity: 1;
        font-weight: 700;
        }

        /* Hover animation */
        .custom-navbar .custom-navbar-nav li a:hover:before {
        width: calc(100% - 16px);
        }

        /* Add responsiveness for logo and spacing */
        @media (max-width: 768px) {
            .custom-navbar img {
                height: 50px;
            }

            .custom-navbar .custom-navbar-nav li {
                margin: 10px 0;
            }
        }


        .before-footer-section {
            padding: 7rem 0 12rem 0 !important;
        }

        .footer-section {
            padding: 60px 0 10px;
            font-size: 15px;
        }

        .footer-section .relative {
            position: relative;
        }

        .footer-section a {
            text-decoration: none;
            color: bisque;
            font-size: 16px;
            -webkit-transition: .3s all ease;
            -o-transition: .3s all ease;
            transition: .3s all ease;
        }

        .footer-section a:hover {
            color: #f9bf29;
        }

        @media (max-width: 767px) {
            .footer-section ul {
            list-style: none !important;
            padding-left: 0;
            }
        }

        .footer_right_pera {
            display: flex;
            align-items: flex-start;
            justify-content: space-around;
        }

        .footer_list h1 {
            color: white;
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 20px;
        }

        .footer_list ul li {
            margin-bottom: 20px;
        }

        .footer_list ul li a {
            color: #9B9B9B;
            font-weight: normal;
            font-size: 16px;
        }

        .why-choose {
            padding: 50px 0;
            text-align: center;
        }

        .why-choose small {
            color: #f5b400;
            letter-spacing: 2px;
            font-weight: 600;
        }

        .why-title {
            font-size: 2.8rem;
            font-weight: 800;
            margin-top: 10px;
        }

        .why-title span {
            color: #f5b400;
        }

        .why-desc {
            max-width: 700px;
            margin: 15px auto 60px;
            color: #bfbfbf;
        }

        .feature-card {
            background: linear-gradient(180deg, #141414, #0d0d0d);
            border-radius: 16px;
            padding: 35px;
            height: 100%;
            transition: 0.3s ease;
            border: 1px solid #1f1f1f;
        }

        .feature-card:hover {
            transform: translateY(-8px);
            border-color: #f5b400;
        }

        .icon-box{
            width:44px;
            height:44px;
            background: #f5b400;
            border-radius:10px;

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

            padding:6px;
            box-sizing:border-box;
        }

        .icon-box i {
            color: #000;
            font-size: 26px;
        }

        .feature-card h5 {
            font-weight: 700;
            margin-bottom: 12px;
        }

        .feature-card p {
            color: #bfbfbf;
            font-size: 15px;
        }

        @media (max-width: 576px) {

            /* Feature card spacing */
            .feature-card {
                padding: 20px 16px;
                text-align: center;
            }

            /* Icon box size */
            .feature-card .icon-box {
                width: 48px;
                height: 48px;
                margin: 0 auto 12px;
                display: flex;
                align-items: center;
                justify-content: center;
            }

            /* SVG resize fix */
            .feature-card .icon-box svg {
                width: 26px;
                height: 26px;
                max-width: 100%;
                max-height: 100%;
            }

            /* Heading */
            .feature-card h5 {
                font-size: 15px;
                line-height: 1.3;
                margin-bottom: 6px;
            }

            /* Paragraph text */
            .feature-card p {
                font-size: 13px;
                line-height: 1.6;
                margin-bottom: 0;
                word-break: normal;
                white-space: normal;
            }
        }

        @media (max-width: 768px) {
            .why-title {
                font-size: 2.1rem;
            }
        }

        .cta-wrapper {
            text-align: center;
            margin-top: 60px;
        }

        .cta-btn {
            background: #f5b400;
            color: #000;
            font-weight: 600;
            padding: 14px 34px;
            border-radius: 10px;
            border: none;
            box-shadow: 0 10px 25px rgba(245,180,0,0.3);
            transition: 0.3s ease;
        }

        .cta-btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 15px 35px rgba(245,180,0,0.45);
        }

        .programs-section {
            padding: 50px 0 80px;
            text-align: center;
        }

        .program-badge {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            background: rgba(245, 180, 0, 0.15);
            color: #f5b400;
            padding: 8px 18px;
            border-radius: 50px;
            font-size: 13px;
            font-weight: 600;
            letter-spacing: 1px;
            margin-bottom: 20px;
        }

        .program-title {
            font-size: 3rem;
            font-weight: 800;
            line-height: 1.2;
        }

        .program-title span {
            color: #f5b400;
        }

        .program-desc {
            max-width: 650px;
            margin: 20px auto 0;
            color: #bdbdbd;
            font-size: 16px;
        }

        @media (max-width: 768px) {
            .program-title {
                font-size: 30px;;
            }

            .program-desc {
                max-width: 650px;
                margin: 20px auto 0;
                color: #bdbdbd;
                font-size: 13px;
            }

            .cta-text{
                color:#bfbfbf;
                max-width:600px;
                margin:0 auto 30px;
                font-size:13px;
            }

            .rating-badge {
                display: none !important;
                visibility: hidden !important;
            }

            .about-title{
                font-size: 30px !important;
            }

            .about-text{
                font-size: 13px !important;
            }

            .feature p{
                margin:0;
                font-size:13px !important;
                color:#bdbdbd;
            }
        }

        /* CARD */
        .program-card{
            background:#111;
            border-radius:18px;
            overflow:hidden;
            border:1px solid rgba(245,180,0,0.25);
        }

        /* IMAGE PART */
        .program-image{
            position:relative;
            height:240px;
        }

        .program-image img{
            width:100%;
            height:100%;
            object-fit:cover;
        }

        /* overlay only for top text */
        .image-overlay{
            position:absolute;
            inset:0;
            background:linear-gradient(to bottom, rgba(0,0,0,0.2), rgba(0,0,0,0.85));
        }

        .image-text{
            position:absolute;
            bottom:20px;
            left:20px;
            right:20px;
            z-index:2;
        }

        .image-text h4{
            font-weight:700;
        }

        .image-text p{
            font-size:14px;
            color:#cfcfcf;
        }

        /* BOTTOM CONTENT */
        .program-body{
            padding:25px;
        }

        .check-list{
            padding:0;
            margin:0 0 20px;
        }

        .check-list li{
            list-style:none;
            margin-bottom:10px;
            color:#dcdcdc;
        }

        .check-list li::before{
            content:"✔";
            color:#f5b400;
            margin-right:8px;
        }

        .start-link{
            color:#f5b400;
            font-weight:600;
            text-decoration:none;
        }

        .start-link:hover{
            text-decoration:underline;
        }

        /* CTA BOX */
        .cta-box{
            background:radial-gradient(
                circle at center,
                rgba(245,180,0,0.12),
                rgba(0,0,0,0.9) 70%
            );
            border:1px solid rgba(245,180,0,0.35);
            border-radius:22px;
            padding:40px 20px;
            text-align:center;
            box-shadow:0 0 60px rgba(245,180,0,0.15);
        }

        /* ICON */
        .cta-icon{
            width:48px;
            height:48px;
            background:#f5b400;
            color:#000;
            display:flex;
            align-items:center;
            justify-content:center;
            border-radius:50%;
            margin:0 auto 20px;
            font-size:22px;
            font-weight:700;
        }

        /* TEXT */
        .cta-title{
            font-size:1.5rem;
            font-weight:700;
            margin-bottom:10px;
        }

        .cta-text{
            color:#bfbfbf;
            max-width:600px;
            margin:0 auto 30px;
            font-size:15px;
        }

        /* BUTTON */
        .cta-btn{
            background:#f5b400;
            color:#000;
            font-weight:600;
            padding:14px 28px;
            border-radius:12px;
            border:none;
            box-shadow:0 0 20px rgba(245,180,0,0.6);
        }

        .cta-btn:hover{
            background:#ffcc33;
        }

        /* SECTION */
        .about-section{
            padding:80px 0;
        }

        /* IMAGE BOX */
        .about-image{
            position:relative;
            border-radius:20px;
            overflow:hidden;
            border:2px solid rgba(245,180,0,0.4);
        }

        .about-image img{
            width:100%;
            height:100%;
            object-fit:cover;
        }

        /* RATING BADGE */
        .rating-badge{
            position:absolute;
            bottom:20px;
            right:20px;
            background:#f5b400;
            color:#000;
            padding:16px;
            border-radius:14px;
            text-align:center;
            width:120px;
            box-shadow:0 0 25px rgba(245,180,0,0.6);
        }

        .rating-badge h4{
            font-weight:800;
            margin:0;
        }

        .rating-stars{
            font-size:14px;
            margin:4px 0;
        }

        /* CONTENT */
        .about-label{
            color:#f5b400;
            font-size:13px;
            letter-spacing:1px;
            font-weight:600;
            margin-bottom:10px;
        }

        .about-title{
            font-size:2.4rem;
            font-weight:800;
            line-height:1.2;
        }

        .about-title span{
            color:#f5b400;
        }

        .about-text{
            color:#cfcfcf;
            margin:20px 0;
            line-height:1.7;
        }

        /* FEATURES */
        .feature{
            display:flex;
            gap:15px;
            margin-bottom:18px;
        }

        .feature-icon{
            width:42px;
            height:42px;
            background:rgba(245,180,0,0.15);
            border-radius:10px;
            display:flex;
            align-items:center;
            justify-content:center;
            color:#f5b400;
            font-size:18px;
        }

        .feature h6{
            margin:0;
            font-weight:700;
        }

        .feature p{
            margin:0;
            font-size:14px;
            color:#bdbdbd;
        }

        /* BUTTONS */
        .btn-gold{
            background:#f5b400;
            color:#000;
            font-weight:600;
            padding:14px 26px;
            border-radius:10px;
            border:none;
        }

        .btn-outline-gold{
            border:1px solid rgba(245,180,0,0.6);
            color:black;
            padding:14px 26px;
            border-radius:10px;
            margin-left:12px;
        }

        .btn-outline-gold:hover{
            background:#f5b400;
            color:#000;
        }

        ul li {
            list-style: none;
            padding-left: 0;
            margin: 0;
        }

        .arrow{
            color:#f5b400;
            font-size:18px;
            line-height:1;
        }

        .hero-container {
            width: 100%;
            height: 550px;          /* Desktop height */
            overflow: hidden;
        }

        .about_bg {
            width: 100%;
            height: 100%;
            object-fit: cover;     /* Stretch & crop perfectly */
        }

        /* Mobile view */
        @media (max-width: 768px) {
            .hero-container {
                height: 180px;     /* Mobile height */
            }
        }

        .about_heading h3 {
            margin-top: 3rem;
            margin-bottom: 3rem;
            text-align: center;
            color: white;
            font-size: 2.8rem;
            font-weight: 800;
            font-style: italic;
        }


        .we-help-section {
            padding: 4rem 0 0;
        }

        .we-help-section .imgs-grid {
            display: -ms-grid;
            display: grid;
            /* -ms-grid-columns: (1fr)[27]; */
            grid-template-columns: repeat(27, 1fr);
            position: relative;
        }

        .we-help-section .imgs-grid:before {
            position: absolute;
            content: "";
            width: 255px;
            height: 217px;
            background-image: url("../images/dots-green.svg");
            background-size: contain;
            background-repeat: no-repeat;
            -webkit-transform: translate(-40%, -40%);
            -ms-transform: translate(-40%, -40%);
            transform: translate(-40%, -40%);
            z-index: -1;
        }

        .we-help-section .imgs-grid .grid {
            position: relative;
        }

        .we-help-section .imgs-grid .grid img {
            border-radius: 20px;
            max-width: 100%;
        }

        .we-help-section .imgs-grid .grid.grid-1 {
            -ms-grid-column: 1;
            -ms-grid-column-span: 18;
            grid-column: 1 / span 18;
            -ms-grid-row: 1;
            -ms-grid-row-span: 27;
            grid-row: 1 / span 27;
        }

        .we-help-section .imgs-grid .grid.grid-2 {
            -ms-grid-column: 19;
            -ms-grid-column-span: 27;
            grid-column: 19 / span 27;
            -ms-grid-row: 1;
            -ms-grid-row-span: 5;
            grid-row: 1 / span 5;
            padding-left: 20px;
        }

        .we-help-section .imgs-grid .grid.grid-3 {
            -ms-grid-column: 14;
            -ms-grid-column-span: 16;
            grid-column: 14 / span 16;
            -ms-grid-row: 6;
            -ms-grid-row-span: 27;
            grid-row: 6 / span 27;
            padding-top: 20px;
        }

        @media (max-width: 991px) {
            .about_heading h3 {
                margin-top: 2rem;
                font-size: 28px;
            }

            .about_bg {
                height: 100% !important;
            }

            .we-help-section {
                padding: 2rem 0 0;
            }

            .we-help-section .p-5 {
                padding: 1rem !important;
            }

            .we-help-section .imgs-grid .grid.grid-2 {
                display: none;
            }

            .we-help-section .imgs-grid .grid.grid-3 {
                grid-column: 12 / span 16;
                grid-row: 6 / span 26;
                padding-top: 20px;
            }

            .details_lumens {
                grid-template-columns: 1fr 1fr !important;
            }
        }

        .contact-section {
            background: #0b0b0b;
            padding: 80px 15px;
        }

        .contact-title {
            font-size: 2.2rem;
            font-weight: 800;
            color: #fff;
            margin-bottom: 10px;
        }

        .contact-subtitle {
            color: #bdbdbd;
            font-size: 15px;
            margin-bottom: 40px;
        }

        .highlight {
            color: #f5b301;
        }

        .contact-form {
            background: #111;
            padding: 35px;
            border-radius: 14px;
            box-shadow: 0 15px 40px rgba(0,0,0,0.6);
        }

        .contact-form .form-group {
            margin-bottom: 18px;
        }

        .contact-form input,
        .contact-form select,
        .contact-form textarea {
            width: 100%;
            background: #000;
            border: 1px solid #2a2a2a;
            padding: 14px 15px;
            border-radius: 10px;
            color: #fff;
            font-size: 14px;
            outline: none;
        }

        .contact-form input::placeholder,
        .contact-form textarea::placeholder {
            color: #888;
        }

        .contact-form input:focus,
        .contact-form select:focus,
        .contact-form textarea:focus {
            border-color: #f5b301;
        }

        .btn-gold {
            background: #f5b301;
            color: #000;
            font-weight: 700;
            border: none;
            padding: 14px;
            border-radius: 40px;
            font-size: 15px;
            transition: all 0.3s ease;
        }

        .btn-gold:hover {
            background: #e0a700;
            transform: translateY(-2px);
        }

        /* MOBILE OPTIMIZATION */
        @media (max-width: 767px) {
            .contact-title {
                font-size: 26px;
            }

            .contact-form {
                padding: 25px;
            }

            .btn-gold {
                font-size: 14px;
                padding: 12px;
            }
        }

        button:disabled {
            opacity: 0.6;
            cursor: not-allowed;
        }


