body {

                font-family: Poppins, system-ui, sans-serif;
                color: rgb(255, 255, 255);
                overflow-x: hidden;
                background: rgb(3, 4, 15);

            }

            /* Light Mode Gradient */
            body.light-mode {
                background: radial-gradient(circle at center, #e3f2fd, #90caf9);
                color: #000;
            }

            /* ================== */
            /* Navbar Base */
            .navbar {
                backdrop-filter: blur(10px);
                background: rgba(0,0,0,0.4);
                transition: 0.4s;
            }

            body.light-mode .navbar {
                background: rgba(255,255,255,0.4);
            }

            /* Navbar Brand */
            .navbar-brand {
                font-weight: bold;
                font-size: 1.5rem;
                color: #8b5cf6;
                transition: 0.3s;
                text-shadow: 0 0 1px #00e5ff;
            }
            body.light-mode .navbar-brand {
                color: #7c4dff;
                text-shadow: 0 0 5px #7c4dff;
            }
            .navbar-brand:hover {
                color: #7c4dff;
                text-shadow: 0 0 15px #00e5ff, 0 0 25px #7c4dff;
            }

            /* Navbar Links */
            .navbar .nav-link {
                color: rgba(255,255,255,0.8);
                margin: 0 10px;
                transition: 0.3s;
                position: relative;
            }
            body.light-mode .navbar .nav-link {
                color: rgba(0,0,0,0.8);
            }

            /* Neon Hover Effect */
            .navbar .nav-link:hover {
                color: #00e5ff;
                text-shadow: 0 0 5px #00e5ff, 0 0 15px #7c4dff, 0 0 25px #00e5ff;
            }
            body.light-mode .navbar .nav-link:hover {
                color: #7c4dff;
                text-shadow: 0 0 5px #7c4dff, 0 0 15px #00e5ff, 0 0 25px #7c4dff;
            }

            /* Active Link Highlight */
            .navbar .nav-link.active {
                color: #00e5ff;
                font-weight: 600;
            }
            body.light-mode .navbar .nav-link.active {
                color: #7c4dff;
            }

            /* Toggle Button (Dark/Light Mode) */
            .navbar .btn-outline-light {
                color: #fff;
                border-color: #00e5ff;
                transition: 0.3s;
            }
            .navbar .btn-outline-light:hover {
                color: #000;
                background: #00e5ff;
                border-color: #00e5ff;
            }
            body.light-mode .navbar .btn-outline-light {
                color: #000;
                border-color: #7c4dff;
            }
            body.light-mode .navbar .btn-outline-light:hover {
                color: #fff;
                background: #7c4dff;
                border-color: #7c4dff;
            }


            .navbar {
                backdrop-filter: blur(10px);
            }


            /*Navbar End */



            .section {
                padding: 80px 0;
            }

            /* Hero Section */
            .hero-slide {
                min-height: 100vh;
                background-size: cover;
                background-position: center;
                position: relative;
                padding: 20px;
            }

            /* Overlay Dark Layer */
            .hero-slide::before {
                content: "";
                position: absolute;
                inset: 0;

                background: radial-gradient(circle at center, rgba(10,16,82,0.7), rgba(0,0,0,0.85));
                backdrop-filter: blur(4px);
            }

            .overlay h1 {
                font-size: 3rem;
                animation: fadeUp 1s ease forwards;
            }

            .overlay p {
                animation: fadeUp 1.5s ease forwards;
            }

            .overlay .btn {
                animation: fadeUp 2s ease forwards;
            }

            /* Animation */
            @keyframes fadeUp {
                from {
                    opacity: 0;
                    transform: translateY(30px);
                }
                to {
                    opacity: 1;
                    transform: translateY(0);
                }
            }
            .hero-slide {
                min-height: 100vh;
                background-size: cover;
                background-position: center;
                position: relative;
                overflow: hidden;
            }

            /* Zoom Animation */
            .carousel-item.active .hero-slide {
                animation: zoomBg 8s ease forwards;
            }

            @keyframes zoomBg {
                from {
                    transform: scale(1);
                }
                to {
                    transform: scale(1.1);
                }
            }

            .carousel-control-prev,
            .carousel-control-next {
                width: 50px;
                height: 50px;
                background: rgba(255,255,255,0.1);
                border-radius: 50%;
                top: 50%;
                transform: translateY(-50%);
                backdrop-filter: blur(10px);
            }

            .carousel-control-prev:hover,
            .carousel-control-next:hover {
                background: linear-gradient(45deg, #00e5ff, #7c4dff);
            }
            
            .carousel-indicators button {
                width: 10px;
                height: 10px;
                border-radius: 50%;
                background: #00e5ff;
                opacity: 0.5;
            }

            .carousel-indicators .active {
                opacity: 1;
                box-shadow: 0 0 10px #00e5ff;
            }


            body.light-mode .hero-slide::before {
                background: radial-gradient(circle at center, rgba(255,255,255,0.6), rgba(255,255,255,0.9));
                backdrop-filter: blur(2px);
            }

            

            /* Light Mode */
            /*body.light-mode .overlay {
                color: #0a1052;
            }*/

            /* Light Mode Button */
            body.light-mode .overlay .btn {
                background: linear-gradient(45deg, #1b2b6b, #0a1052);
                color: #fff;
                border: none;
            }

            

            /* Light Mode */
            body.light-mode .overlay {
                color: #0a1052;
            }

            .hero-slide::before {
                background: linear-gradient(
                    to bottom,
                    rgba(0,0,0,0.6),
                    rgba(0,0,0,0.8)
                );
            }

            body.light-mode .hero-slide::before {
                background: linear-gradient(
                    to bottom,
                    rgba(255,255,255,0.5),
                    rgba(255,255,255,0.8)
                );
            }




            /* Content */
            .overlay {
                position: relative;
                z-index: 2;
                color: #fff;
            }

            /* Desktop */
            .overlay h1 {
                font-size: 3rem;
            }

            .overlay p {
                font-size: 1.25rem;
            }

            /* Tablet */
            @media (max-width: 992px) {
                .overlay h1 {
                    font-size: 2.2rem;
                }
            }

            /* Mobile */
            @media (max-width: 576px) {
                .hero-slide {
                    min-height: 80vh;
                }

                .overlay h1 {
                    font-size: 1.6rem;
                }

                .overlay p {
                    font-size: 1rem;
                }

                .overlay .btn {
                    padding: 8px 16px;
                    font-size: 14px;
                }
            }


            /* Glass Card */
            .about-card {
                background: rgba(255,255,255,0.08);
                border-radius: 15px;
                backdrop-filter: blur(12px);
                border: 1px solid rgba(255,255,255,0.1);
            }

            /* Subtitle */
            .text-light-sub {
                color: rgba(255,255,255,0.7);
            }

            /* Points */
            .about-point {
                display: flex;
                gap: 10px;
                margin-bottom: 10px;
            }

            .about-point i {
                color: #00e5ff;
            }

            /* Counter */
            .counter {
                font-size: 2rem;
                font-weight: bold;
                color: #00e5ff;
            }

            /* Light mode */
            body.light-mode .text-light-sub {
                color: #555;
            }

            @media (max-width: 576px) {
                .counter {
                    font-size: 1.5rem;
                }

                .about-card {
                    padding: 20px;
                }
            }




            /*About*/
                        /* ================== */
            /* Cyber Section (Light & Dark Mode) */
            /* ================== */
            .cyber-section {
                    position: relative;
                    margin-bottom: 0px;
                    background: radial-gradient(circle, rgb(27, 43, 107), rgb(10, 16, 82));
                    overflow: hidden;
                    padding: 20px 20px 180px;
            }

            /* Light Mode */
            body.light-mode .cyber-section {
                background: radial-gradient(circle at center, #e3f2fd, #90caf9);
            }

            /* ================== */
            /* Background Glow */
            .about-bg-glow {
                position: absolute;
                width: 500px;
                height: 500px;
                background: radial-gradient(circle, rgba(0,229,255,0.15), transparent);
                top: -100px;
                left: -100px;
                z-index: 0;
                animation: glowMove 15s linear infinite alternate;
                transition: 0.4s;
            }

            body.light-mode .about-bg-glow {
                background: radial-gradient(circle, rgba(124,77,255,0.15), transparent);
            }

            @keyframes glowMove {
                0% { transform: translate(0,0); }
                50% { transform: translate(50px,50px); }
                100% { transform: translate(0,0); }
            }

            /* ================== */
            /* Gradient Title */
            .gradient-text {
                background: linear-gradient(90deg, #00e5ff, #7c4dff);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                font-size: 2.8rem;
                color: linear-gradient(90deg, #8b5cf6, #4869ec);
                transition: 0.4s;
            }
            body.light-mode .gradient-text {
                /*background: linear-gradient(90deg, #7c4dff, #00e5ff);*/
            }

            /* ================== */
            /* Subtitle */
            .sub-text {
                color: rgba(255,255,255,0.7);
                font-size: 1.1rem;
                transition: 0.4s;
            }
            body.light-mode .sub-text {
                color: rgba(0,0,0,0.7);
            }

            /* ================== */
            /* Floating Wrapper */
            .floating-wrapper {
                position: relative;
                text-align: center;
            }

            /* Floating Items Container */
            .floating-items {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
            }

            /* Floating Items */
            .floating-items span {
                position: absolute;
                padding: 6px 12px;
                font-size: 12px;
                border-radius: 20px;
                color: #00e5ff;
                border: 1px solid rgba(0,229,255,0.5);
                background: rgba(0,229,255,0.05);
                text-shadow: 0 0 8px #00e5ff;
                backdrop-filter: blur(6px);
                animation: floatMove 6s ease-in-out infinite;
                transition: 0.4s;
            }

            body.light-mode .floating-items span {
                color: #7c4dff;
                border: 1px solid rgba(124,77,255,0.5);
                background: rgba(124,77,255,0.05);
                text-shadow: 0 0 6px #7c4dff;
            }

            /* Floating Animation */
            @keyframes floatMove {
                0% { transform: translateY(0); opacity: 0.7; }
                50% { transform: translateY(-10px); opacity: 1; }
                100% { transform: translateY(0); opacity: 0.7; }
            }

            /* Random positions for floating items */
            .floating-items span:nth-child(1) { top: 5%; left: 10%; }
            .floating-items span:nth-child(2) { top: 15%; right: 5%; }
            .floating-items span:nth-child(3) { top: 25%; left: 0%; }
            .floating-items span:nth-child(4) { top: 35%; right: 10%; }
            .floating-items span:nth-child(5) { top: 45%; left: 8%; }
            .floating-items span:nth-child(6) { top: 55%; right: 0%; }
            .floating-items span:nth-child(7) { top: 65%; left: 5%; }
            .floating-items span:nth-child(8) { top: 75%; right: 12%; }
            .floating-items span:nth-child(9) { top: 85%; left: 15%; }
            .floating-items span:nth-child(10){ top: 20%; left: 25%; }
            .floating-items span:nth-child(11){ top: 40%; right: 25%; }
            .floating-items span:nth-child(12){ top: 60%; left: 30%; }
            .floating-items span:nth-child(13){ top: 80%; right: 30%; }
            .floating-items span:nth-child(14){ top: 10%; left: 40%; }
            .floating-items span:nth-child(15){ top: 30%; right: 40%; }
            .floating-items span:nth-child(16){ top: 50%; left: 45%; }
            .floating-items span:nth-child(17){ top: 70%; right: 45%; }
            .floating-items span:nth-child(18){ top: 90%; left: 50%; }

            /* ================== */
            /* Feature Modern Cards */
            .feature-modern {
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 12px;
                border-radius: 12px;
                background: rgba(255,255,255,0.08);
                transition: 0.3s, background 0.4s;
            }
            .feature-modern i { color: #00e5ff; font-size: 1.2rem; }
            .feature-modern:hover {
                transform: scale(1.05);
                background: rgba(0,229,255,0.2);
            }
            body.light-mode .feature-modern {
                background: rgba(0,0,0,0.05);
            }
            body.light-mode .feature-modern:hover {
                background: rgba(124,77,255,0.2);
            }
            body.light-mode .feature-modern i { color: #7c4dff; }

            /* ================== */
            /* Button Glow */
            .btn-glow {
                background: linear-gradient(90deg, #8b5cf6, #4869ec);
                position: relative;
                overflow: hidden;
                box-shadow: 0 0 0 rgba(139, 92, 246, 0.6);
                animation: pulseGlow 2.5s infinite;
                transition: transform 0.25s ease, box-shadow 0.25s ease;
                transition: 0.3s;
            }
            .btn-glow:hover {
                box-shadow: 0 0 20px #00e5ff;
                transform: translateY(-3px);
            }
            body.light-mode .btn-glow {
                background: linear-gradient(45deg, #7c4dff, #00e5ff);
                color: #000;
            }

            /* ================== */
            /* Headings & Paragraphs */
            .cyber-heading {
                background: linear-gradient(120deg, #60a5fa, #a78bfa, #f472b6);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                transition: 0.4s;
            }
            body.light-mode .cyber-heading {
                color: #00e5ff;
                text-shadow: 0 0 8px #00e5ff;
            }

            .cyber-text {
                color: rgba(255,255,255,0.75);
                font-size: 1rem;
                transition: 0.4s;
            }
            body.light-mode .cyber-text {
                color: rgba(0,0,0,0.75);
            }

            /* ================== */
            /* Responsive Floating Items */
            @media (max-width: 768px) {
                .floating-items span {
                    font-size: 10px;
                    padding: 4px 8px;
                }
                .floating-items span:nth-child(n+10) {
                    display: none;
                }
            }


            /*About End*/


            /* ================== */
            /* Core Features Section */
            .cyber-section {
                position: relative;
                overflow: hidden;
                padding: 80px 0;
                background: radial-gradient(circle at center, #1b2b6b, #0a1052);
                transition: 0.4s;
            }

            /* Light Mode */
            body.light-mode .cyber-section {
                background: radial-gradient(circle at center, #e3f2fd, #90caf9);
            }

            /* Animated Glow Background */
            .features-bg-glow {
                position: absolute;
                width: 600px;
                height: 600px;
                background: radial-gradient(circle, rgba(0,229,255,0.2), transparent);
                top: -150px;
                left: -150px;
                z-index: 0;
                border-radius: 50%;
                animation: featuresGlow 20s linear infinite alternate;
            }
            @keyframes featuresGlow {
                0% { transform: translate(0,0) scale(1); }
                50% { transform: translate(50px,50px) scale(1.1); }
                100% { transform: translate(0,0) scale(1); }
            }

            /* Feature Card */
            /*.feature-card {

                background: linear-gradient(120deg, #60a5fa, #a78bfa, #f472b6);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                backdrop-filter: blur(12px);
                border: 1px solid rgba(0,229,255,0.3);
                border-radius: 15px;
                padding: 30px 20px;
                text-align: center;
                font-weight: 600;
                font-size: 1.1rem;
                color: #00e5ff;
                text-shadow: 0 0 5px #00e5ff, 0 0 15px #7c4dff;
                transition: 0.4s;
                cursor: pointer;
                position: relative;
                overflow: hidden;
            }*/
            /*.feature-card::before {
                content: "";
                position: absolute;
                width: 200%;
                height: 200%;
                -webkit-text-fill-color: transparent;
                background: linear-gradient(120deg, rgb(96, 165, 250), rgb(167, 139, 250), rgb(244, 114, 182)) text;
                top: -50%;
                left: -50%;
                transform: rotate(45deg);
                transition: 0.6s;
                opacity: 0.2;
            }
            .feature-card:hover::before {
                top: -20%;
                left: -20%;
                opacity: 0.35;
                transform: rotate(0deg);
            }
            .feature-card:hover {
                transform: translateY(-10px) scale(1.05);
                box-shadow: 0 0 20px #00e5ff, 0 0 40px #7c4dff;
            }*/

            /* Light Mode */
            body.light-mode .feature-card {
                background: rgba(255,255,255,0.1);
                border: 1px solid rgba(124,77,255,0.3);
                color: #7c4dff;
                text-shadow: 0 0 5px #7c4dff, 0 0 15px #00e5ff;
            }
            body.light-mode .feature-card:hover {
                box-shadow: 0 0 20px #7c4dff, 0 0 40px #00e5ff;
            }

            /* Responsive */
            @media (max-width: 768px) {
                .feature-card {
                    font-size: 1rem;
                    padding: 20px 15px;
                }
            }


            /* Feature Card 3D + Neon Hover */
            .feature-card {
                background: linear-gradient(90deg, rgb(139, 92, 246), rgb(72, 105, 236));
                -webkit-background-clip: text;
                backdrop-filter: blur(12px);
                border: 1px solid rgba(0,229,255,0.3);
                border-radius: 15px;
                padding: 30px 20px;
                text-align: center;
                font-weight: 600;
                font-size: 1.1rem;
                transition: transform 0.2s ease, box-shadow 0.3s ease;
                cursor: pointer;
                position: relative;
                perspective: 1000px; /* Required for 3D effect */
                overflow: hidden;
            }
            .feature-card::before {
                content: "";
                position: absolute;
                width: 200%;
                height: 200%;
                background: linear-gradient(120deg, #00e5ff, #7c4dff, #00e5ff, #7c4dff);
                top: -50%;
                left: -50%;
                transform: rotate(45deg);
                transition: 0.6s;
                opacity: 0.2;
            }
            .feature-card:hover::before {
                top: -20%;
                left: -20%;
                opacity: 0.35;
                transform: rotate(0deg);
            }
            .feature-card:hover {
                box-shadow: 0 0 25px #00e5ff, 0 0 50px #7c4dff;
            }

            /* Light Mode */
            body.light-mode .feature-card {
                background: rgba(255,255,255,0.1);
                border: 1px solid rgba(124,77,255,0.3);
                color: #7c4dff;
                text-shadow: 0 0 5px #7c4dff, 0 0 15px #00e5ff;
            }
            body.light-mode .feature-card:hover {
                box-shadow: 0 0 25px #7c4dff, 0 0 50px #00e5ff;
            }

            /* Responsive */
            @media (max-width: 768px) {
                .feature-card {
                    font-size: 1rem;
                    padding: 20px 15px;
                }
            }
            .network-bg {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                z-index: 0; /* behind everything */
                pointer-events: none; /* doesn’t block mouse */
                opacity: 0.25; /* subtle */
            }

            /*Core Feature List End*/



            /* Vision Start */
            /* Vision Background Glow */
            .vision-bg-glow {
                position: absolute;
                width: 400px;
                height: 400px;
                background: radial-gradient(circle, rgba(124,77,255,0.15), transparent);
                top: -80px;
                right: -80px;
                z-index: 0;
                animation: glowMove 12s linear infinite alternate;
            }

            /* Vision Image Shadow/Glow */
            .vision-img {
                border-radius: 20px;
                box-shadow: 0 0 20px #00e5ff, 0 0 40px #7c4dff;
                position: relative;
                z-index: 1;
            }

            /* Floating Neon Shapes */
            .vision-floating span.neon-shape {
                position: absolute;
                font-size: 24px;
                color: #00e5ff;
                text-shadow: 0 0 10px #00e5ff, 0 0 20px #7c4dff;
                animation: floatMove 6s ease-in-out infinite;
            }
            .vision-floating span:nth-child(1){ top: 10%; left: 20%; }
            .vision-floating span:nth-child(2){ top: 30%; right: 15%; }
            .vision-floating span:nth-child(3){ bottom: 20%; left: 25%; }
            .vision-floating span:nth-child(4){ bottom: 10%; right: 20%; }

            /* Highlighted Points hover effect */
            .feature-modern:hover {
                transform: scale(1.05);
                background: rgba(0,229,255,0.2);
            }

            /* Gradient Text for Neon Effect */
            .gradient-text {
                    background: linear-gradient(120deg, #60a5fa, #a78bfa, #f472b6);
                    -webkit-background-clip: text;
                    -webkit-text-fill-color: transparent;
            }

            /* Paragraph Text */
            .cyber-text {
                color: rgba(255,255,255,0.75);
            }

            /* Light Mode Adjustments */
            body.light-mode .cyber-text {
                color: #333;
            }
            body.light-mode .gradient-text {
                background: linear-gradient(90deg, #0077c2, #6a1b9a);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
            }
            body.light-mode .vision-img {
                box-shadow: 0 0 15px #0077c2, 0 0 25px #6a1b9a;
            }

            /* Responsive */
            @media(max-width: 768px){
                .vision-floating span.neon-shape{ font-size:18px; }
            }


            /*Vission Section End */





            /* App Play Store Start */
            .app-icon {
                width: 90px;
                height: 90px;
                border-radius: 20px;
                box-shadow: 0 0 20px rgba(0,229,255,0.4);
            }

            /* Install Button */
            .install-btn {
                background: linear-gradient(45deg, #00e5ff, #7c4dff);
                color: #fff;
                padding: 12px 30px;
                border-radius: 10px;
                font-weight: 600;
                border: none;
                transition: 0.3s;
            }
            .install-btn:hover {
                box-shadow: 0 0 20px #00e5ff;
                transform: translateY(-2px);
            }

            /* Stats */
            .app-stats div {
                text-align: center;
                color: rgba(255,255,255,0.7);
            }
            body.light-mode .app-stats div {
                color: #333;
            }

            /* App Download section */
            .screenshot-slider {
                display: flex;
                gap: 15px;
                overflow-x: auto;
                padding-bottom: 10px;
                scroll-behavior: smooth;
            }

            /* Hide Scrollbar (Clean UI) */
            .screenshot-slider::-webkit-scrollbar {
                display: none;
            }
            .screenshot-slider {
                -ms-overflow-style: none;
                scrollbar-width: none;
            }

            /* Images */
            .screenshot-slider img {
                height: 420px;
                border-radius: 15px;
                flex-shrink: 0;
                transition: 0.3s;
            }

            /* Hover Effect */
            .screenshot-slider img:hover {
                transform: scale(1.05);
            }

            /* Mobile Optimize */
            @media (max-width: 768px) {
                .screenshot-slider img {
                    height: 320px;
                }
            }

            /* Hide Scrollbar */
            .screenshot-slider::-webkit-scrollbar {
                display: none;
            }

            .screenshot-slider {
                scroll-snap-type: x mandatory;
            }

            .screenshot-slider img {
                scroll-snap-align: start;
            }
            /* App Download section */





            /* About */
            .app-about {
                max-width: 700px;
            }
            .app-about p {
                color: rgba(255,255,255,0.7);
            }
            body.light-mode .app-about p {
                color: #333;
            }

            /* App Play Store End */








            /* Service Section Start*/
            .service-category {
                background: rgba(255,255,255,0.05);
                border: 1px solid rgba(0,229,255,0.2);
                border-radius: 20px;
                padding: 30px;
                backdrop-filter: blur(12px);
                transition: 0.4s;
                height: 100%;
                position: relative;
                overflow: hidden;
            }

            /* Hover Effect */
            .service-category:hover {
                transform: translateY(-10px) scale(1.03);
                box-shadow: 0 0 25px #00e5ff;
                background: rgba(0,229,255,0.15);
            }

            /* Title */
            .service-category h4 {
                color: #8b5cf6;
                margin-bottom: 10px;
            }

            /* Text */
            .service-category p {
                color: rgba(255,255,255,0.7);
                font-size: 0.9rem;
            }

            /* Items */
            .service-items {
                margin-top: 15px;
                display: flex;
                flex-wrap: wrap;
                gap: 10px;
            }

            .service-items span {
                background: rgba(0,229,255,0.1);
                border: 1px solid rgba(0,229,255,0.3);
                padding: 6px 12px;
                border-radius: 20px;
                font-size: 13px;
                transition: 0.3s;
            }

            .service-items span:hover {
                background: linear-gradient(90deg, #8b5cf6, #4869ec);
                color: #000;
            }

            /* Light Mode */
            body.light-mode .service-category {
                background: rgba(0,0,0,0.05);
            }
            body.light-mode .service-category p {
                color: #333;
            }
            /* Service Section End*/








            /* FAQ Glow Start */
            .faq-bg-glow {
                position: absolute;
                width: 400px;
                height: 400px;
                background: radial-gradient(circle, rgba(124,77,255,0.2), transparent);
                bottom: -100px;
                right: -100px;
                z-index: 0;
            }

            /* Wrapper */
            .faq-wrapper {
                max-width: 800px;
                margin: auto;
                position: relative;
                z-index: 2;
            }

            /* FAQ Item */
            .faq-item {
                background: rgba(255,255,255,0.05);
                border: 1px solid rgba(0,229,255,0.2);
                border-radius: 15px;
                margin-bottom: 15px;
                overflow: hidden;
                transition: 0.3s;
            }

            /* Hover */
            .faq-item:hover {
                transform: translateY(-5px);
                box-shadow: 0 0 20px #00e5ff;
            }

            /* Question */
            .faq-question {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 18px 20px;
                cursor: pointer;
                font-weight: 600;
            }

            /* Icon */
            .faq-question i {
                transition: 0.3s;
            }

            /* Answer */
            .faq-answer {
                max-height: 0;
                overflow: hidden;
                padding: 0 20px;
                font-size: 0.95rem;
                color: rgba(255,255,255,0.75);
                transition: 0.4s ease;
            }

            /* Active State */
            .faq-item.active .faq-answer {
                max-height: 200px;
                padding: 15px 20px;
            }

            .faq-item.active .faq-question i {
                transform: rotate(45deg);
            }

            /* Light Mode */
            body.light-mode .faq-item {
                background: rgba(0,0,0,0.05);
            }
            body.light-mode .faq-answer {
                color: #333;
            }

            /* FAQ Glow End */






            /* Contact us section start */
            .contact-bg-glow {
                position: absolute;
                width: 400px;
                height: 400px;
                background: radial-gradient(circle, rgba(0,229,255,0.2), transparent);
                top: -100px;
                right: -100px;
                z-index: 0;
            }

            /* Contact Info Panel */
            .contact-info {
                background: rgba(255,255,255,0.05);
                padding: 30px;
                border-radius: 20px;
                border: 1px solid rgba(0,229,255,0.2);
                backdrop-filter: blur(12px);
            }

            /* Info Items */
            .info-item {
                display: flex;
                align-items: center;
                gap: 12px;
                margin-bottom: 15px;
                font-size: 0.95rem;
            }

            .info-item i {
                color: #4869ec;
                font-size: 1.2rem;
            }

            /* Social Icons */
            .contact-social a {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 40px;
                height: 40px;
                border-radius: 50%;
                background: rgba(0,229,255,0.1);
                margin-right: 10px;
                transition: 0.3s;
            }

            .contact-social a:hover {
                background: linear-gradient(90deg, #8b5cf6, #4869ec);
                color: #000;
            }

            /* Form Card */
            .contact-form {
                background: rgba(255,255,255,0.05);
                padding: 30px;
                border-radius: 20px;
                border: 1px solid rgba(0,229,255,0.2);
                backdrop-filter: blur(12px);
            }

            /* Inputs */
            .cyber-input {
                background: rgba(255,255,255,0.05) !important;
                border: 1px solid rgba(0,229,255,0.3) !important;
                color: #fff !important;
                border-radius: 10px;
                transition: 0.3s;
            }

            /* Focus Effect */
            .cyber-input:focus {
                border-color: #00e5ff !important;
                box-shadow: 0 0 10px #00e5ff;
            }

            /* Light Mode */
            body.light-mode .contact-info,
            body.light-mode .contact-form {
                background: rgba(0,0,0,0.05);
            }

            body.light-mode .cyber-input {
                color: #000 !important;
            }

            /* Responsive */
            @media (max-width: 768px) {
                .contact-info {
                    margin-bottom: 20px;
                }
            }


            /* Contact us section End */






            /* Footer Start*/
            .footer {
                padding: 80px 0 30px;
                position: relative;
            }

            /* Glow */
            .footer-bg-glow {
                position: absolute;
                width: 400px;
                height: 400px;
                background: radial-gradient(circle, rgba(124,77,255,0.2), transparent);
                bottom: -150px;
                left: -150px;
                z-index: 0;
            }

            /* Title */
            .footer-title {
                color: #8b5cf6;
                margin-bottom: 15px;
            }

            /* Links */
            .footer-links {
                list-style: none;
                padding: 0;
            }

            .footer-links li {
                margin-bottom: 8px;
            }

            .footer-links a {
                color: rgba(255,255,255,0.7);
                text-decoration: none;
                transition: 0.3s;
            }

            .footer-links a:hover {
                color: #00e5ff;
                padding-left: 5px;
            }

            /* Social */
            .footer-social a {
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 40px;
                height: 40px;
                border-radius: 50%;
                background: rgba(0,229,255,0.1);
                margin-right: 10px;
                transition: 0.3s;
            }

            .footer-social a:hover {
                background: linear-gradient(90deg, #8b5cf6, #4869ec);
                color: #000;
                transform: translateY(-3px);
            }

            /* Subscribe */
            .footer-subscribe {
                display: flex;
                margin-top: 10px;
            }

            .footer-subscribe input {
                flex: 1;
                border: none;
                padding: 10px;
                border-radius: 10px 0 0 10px;
                background: rgba(255,255,255,0.1);
                color: #fff;
            }

            .footer-subscribe button {
                border: none;
                padding: 10px 15px;
                background: linear-gradient(45deg, #00e5ff, #7c4dff);
                color: #fff;
                border-radius: 0 10px 10px 0;
            }

            /* Bottom */
            .footer-bottom {
                border-top: 1px solid rgba(255,255,255,0.1);
                padding-top: 20px;
                font-size: 0.9rem;
                color: rgba(255,255,255,0.6);
            }

            /* Light Mode */
            body.light-mode .footer-links a {
                color: #333;
            }
            body.light-mode .footer-subscribe input {
                color: #000;
                background: rgba(0,0,0,0.05);
            }

            /* Footer End*/




            /* Download Button */
            .btn-download {
                background: linear-gradient(90deg, #8b5cf6, #4869ec);
                position: relative;
                overflow: hidden;
                box-shadow: 0 0 0 rgba(139, 92, 246, 0.6);
                animation: pulseGlow 2.5s infinite;
                transition: transform 0.25s ease, box-shadow 0.25s ease;
                color: #fff;
            }

            /* Hover Effect */
            .btn-download:hover {
                transform: translateY(-2px);
                box-shadow: 0 0 20px #00e5ff;
                color: #fff;
            }

            /* Light Mode */
            body.light-mode .btn-download {
                color: #fff;
            }


            @media (max-width: 991px) {
                .navbar .nav-item button {
                    padding: 10px !important;
                    width: 38%;
                    margin-top: 10px;
                }
            }
           


            /* service details start */
            .service-viewer {
                position: fixed;
                inset: 0;
                z-index: 9999;
                overflow-y: auto;
                padding: 80px 20px;

                background: radial-gradient(circle at center, #1b2b6b, #0a1052);
            }

            /* LIGHT MODE */
            body.light-mode .service-viewer {
                background: radial-gradient(circle at center, #e3f2fd, #90caf9);
            }

            /* CLOSE */
            .viewer-close {
                position: fixed;
                top: 20px;
                right: 25px;
                font-size: 22px;
                cursor: pointer;
            }

            /* TITLE */
            .viewer-title {
                font-size: 2.5rem;
                font-weight: 700;
                background: linear-gradient(90deg, #00e5ff, #7c4dff);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
            }

            /* SUBTITLE */
            .viewer-subtitle {
                color: #00e5ff;
                margin-bottom: 10px;
            }

            /* DESCRIPTION */
            .viewer-desc {
                color: rgba(255,255,255,0.8);
            }

            /* BULLET */
            .viewer-list {
                margin-top: 15px;
            }
            .viewer-list li {
                margin-bottom: 6px;
            }

            /* ITALIC TEXT */
            .viewer-highlight {
                margin-top: 15px;
                font-style: italic;
                color: #7c4dff;
            }

            /* EXTRA */
            .viewer-extra {
                margin-top: 15px;
                padding: 15px;
                border-radius: 12px;
                background: rgba(255,255,255,0.08);
            }

            /* IMAGE GALLERY */
            .viewer-gallery {
                position: relative;
            }

            /* MAIN IMAGE */
            .main-img {
                width: 100%;
                border-radius: 20px;
                box-shadow: 0 0 30px rgba(0,229,255,0.3);
                margin-bottom: 15px;
            }

            /* THUMBNAILS */
            .thumbs {
                display: flex;
                gap: 10px;
                flex-wrap: wrap;
            }
            .thumbs img {
                width: 70px;
                border-radius: 10px;
                cursor: pointer;
                opacity: 0.7;
                transition: 0.3s;
            }
            .thumbs img:hover {
                opacity: 1;
                transform: scale(1.1);
            }

            /* NAV */
            .viewer-nav {
                position: fixed;
                bottom: 20px;
                left: 50%;
                transform: translateX(-50%);
                display: flex;
                gap: 20px;
            }

            .viewer-nav button {
                background: linear-gradient(45deg, #00e5ff, #7c4dff);
                border: none;
                padding: 12px 18px;
                border-radius: -10%;
                color: white;
                /*box-shadow: 0 0 20px #00e5ff;*/
            }
            .viewer-desc p::first-letter {
                /*font-size: 1.3rem;
                font-weight: bold;
                color: #00e5ff;*/
            }


            .viewer-desc p {
                margin-bottom: 12px;
                line-height: 1.7;
            }

            .viewer-list li {
                margin-bottom: 6px;
                position: relative;
                padding-left: 18px;
            }

            .viewer-list li::before {
                content: "";
                position: absolute;
                left: 0;
            }





            /* NAV CONTAINER */
            .viewer-nav {
                position: fixed;
                bottom: 25px;
                left: 50%;
                transform: translateX(-50%);
                display: flex;
                gap: 20px;
                z-index: 1000;
            }

            /* BUTTON */
            .nav-btn {
                display: flex;
                align-items: center;
                gap: 10px;
                padding: 12px 20px;
                border-radius: 50px;
                border: 1px solid rgba(0,229,255,0.3);

                background: rgba(255,255,255,0.05);
                backdrop-filter: blur(10px);

                color: #00e5ff;
                font-size: 14px;
                font-weight: 500;

                transition: 0.3s;
            }

            /* ICON */
            .nav-btn .icon {
                font-size: 16px;
            }

            /* HOVER EFFECT */
            .nav-btn:hover {
                background: linear-gradient(45deg, #00e5ff, #7c4dff);
                color: #fff;
                box-shadow: 0 0 20px #00e5ff;
                transform: translateY(-3px);
            }

            /* ACTIVE CLICK */
            .nav-btn:active {
                transform: scale(0.95);
            }

            .nav-btn:hover .icon {
                transform: translateX(3px);
            }
            .prev:hover .icon {
                transform: translateX(-3px);
            }

            /* LIGHT MODE */
            body.light-mode .nav-btn {
                background: rgba(255,255,255,0.7);
                color: #0a1052;
            }

            /* MOBILE */
            @media (max-width: 576px) {
                .nav-btn .text {
                    display: none; /* only arrow on mobile */
                }

                .nav-btn {
                    padding: 12px;
                    border-radius: 50%;
                }
            }

            /* MOBILE */
            @media(max-width:768px){
                .viewer-title {
                    font-size: 1.8rem;
                }
            }
            /* service details End */













            /* Core Feature Cards */
            .feature-box {
                border-radius: 10px;
                padding: 25px;
                background: rgba(255,255,255,0.1);
                border: 1px solid rgba(255,255,255,0.2);
                transition: 0.3s;
            }
            .feature-box:hover {
                transform: translateY(-10px);
                background: rgba(255,255,255,0.2);
            }

            /* Download Button */
            .download-btn {
                background: #000;
                color: #fff;
                padding: 12px 20px;
                border-radius: 10px;
                display: inline-flex;
                align-items: center;
                gap: 10px;
            }

            /* Service Card */
            .service-card {
                background: rgba(255,255,255,0.1);
                padding: 25px;
                border-radius: 15px;
            }

            /* Contact */
            input, textarea {
                border-radius: 10px !important;
            }








            /*service detals details page-*/

            /* TOGGLE BUTTON */

        .theme-btn{
            width:46px;
            height:46px;
            border:none;
            border-radius:50%;
            background:linear-gradient(45deg,#00d4ff,#7b5cff);
            color:#fff;
            font-size:20px;
            margin-left:20px;
            transition:.3s;
        }

        .theme-btn:hover{
            transform:rotate(180deg) scale(1.08);
            box-shadow:0 10px 25px rgba(0,212,255,.4);
        }


        /* =========================
           HERO
        ========================= */

        .hero{
            padding:170px 0 90px;
            position:relative;
            overflow:hidden;
        }

        .hero::before{
            content:"";
            position:absolute;
            width:600px;
            height:600px;
            background:#00d4ff;
            filter:blur(180px);
            opacity:.12;
            top:-250px;
            right:-250px;
            border-radius:50%;
        }

        .hero::after{
            content:"";
            position:absolute;
            width:500px;
            height:500px;
            background:#7b5cff;
            filter:blur(180px);
            opacity:.12;
            bottom:-250px;
            left:-250px;
            border-radius:50%;
        }

        body.light-mode .hero::before{
            opacity:.08;
        }

        body.light-mode .hero::after{
            opacity:.08;
        }

        .hero-title{
            font-size:78px;
            font-weight:800;
            line-height:1.1;
            margin-bottom:25px;
        }

        body.light-mode .hero-title{
            color:#111;
        }

        .gradient-text{
            background:#8b5cf6;
            -webkit-background-clip:text;
            -webkit-text-fill-color:transparent;
        }

        .hero-sub{
            color:rgba(255,255,255,.8);
            font-size:21px;
            line-height:1.9;
            max-width:850px;
        }

        body.light-mode .hero-sub{
            color:#555;
        }

        /* =========================
           SERVICE VIEWER
        ========================= */

        .service-viewer{
            position:relative;
            padding:40px 0 100px;
        }

        /* LEFT IMAGE */

        .viewer-gallery{
            position:relative;
        }

        .main-img{
            width:100%;
            height:520px;
            object-fit:cover;
            border-radius:28px;
            box-shadow:0 25px 70px rgba(0,0,0,.35);
            transition:.4s;
        }

        /* THUMBNAILS */

        .thumbs{
            display:flex;
            gap:14px;
            margin-top:20px;
            flex-wrap:wrap;
        }

        .thumbs img{
            width:95px;
            height:65px;
            object-fit:cover;
            border-radius:14px;
            cursor:pointer;
            opacity:.7;
            border:2px solid transparent;
            transition:.3s;
        }

        .thumbs img:hover{
            opacity:1;
            transform:translateY(-3px);
            border-color:#00d4ff;
        }

        .thumbs img.active{
            opacity:1;
            border-color:#00d4ff;
            transform:scale(1.05);
        }

        /* RIGHT SIDE */

        .viewer-title{
            font-size:35px;
            font-weight:800;
            line-height:1.1;
            margin-bottom:12px;
            color:#18d6ff;
        }

        body.light-mode .viewer-title{
            color:#0d6efd;
        }

        .viewer-subtitle{
            font-size:25px;
            font-weight:700;
            color:#00d4ff;
            margin-bottom:28px;
        }

        body.light-mode .viewer-subtitle{
            color:#5f85ff;
        }

        .viewer-desc{
            color:rgba(255,255,255,.85);
            font-size:15px;
            line-height:1.9;
        }

        body.light-mode .viewer-desc{
            color:#444;
        }

        .viewer-desc p{
            margin-bottom:24px;
        }

        .viewer-list{
            margin-top:28px;
            margin-bottom:35px;
            padding-left:25px;
        }

        .viewer-list li{
            margin-bottom:15px;
            font-size:15px;
            font-weight:500;
        }

        body.light-mode .viewer-list li{
            color:#222;
        }

        .viewer-highlight{
            color:#8d67ff;
            font-size:15px;
            line-height:1.8;
            font-style:italic;
            margin-bottom:35px;
        }

        body.light-mode .viewer-highlight{
            color:#6f42c1;
        }

        .viewer-extra{
            background:rgba(255,255,255,.08);
            padding:32px;
            border-radius:24px;
            backdrop-filter:blur(20px);
            border:1px solid rgba(255,255,255,.05);
            color:#fff;
            font-size:15px;
            line-height:1.9;
        }

        body.light-mode .viewer-extra{
            background:rgba(255,255,255,.75);
            color:#111;
            border:1px solid rgba(0,0,0,.05);
            box-shadow:0 10px 30px rgba(0,0,0,.05);
        }

        /* NAV BUTTONS */

        .viewer-nav{
            display:flex;
            justify-content:center;
            gap:20px;
            margin-top:70px;
        }

        .nav-btn{
            border:none;
            background:#16d8ff;
            color:#000;
            padding:16px 34px;
            border-radius:50px;
            font-weight:700;
            font-size:16px;
            transition:.3s;
        }

        .nav-btn:hover{
            transform:translateY(-3px);
            box-shadow:0 15px 35px rgba(0,212,255,.35);
        }

        /* RESPONSIVE */

        @media(max-width:991px){

            .hero{
                padding-top:140px;
            }

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

            .hero-sub{
                font-size:17px;
            }

            .viewer-title{
                font-size:44px;
                margin-top:40px;
            }

            .viewer-subtitle{
                font-size:24px;
            }

            .viewer-desc,
            .viewer-list li,
            .viewer-highlight,
            .viewer-extra{
                font-size:17px;
            }

            .main-img{
                height:350px;
            }

        }