 html{
    scroll-behavior: smooth;
 }
 /* --- NAVIGATION --- */
        #navbar {
            transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }
        #navbar.scrolled {
            /* background: #101e38f2;  */
             /* Updated Transparent Navy */
              background: #040e37;
            backdrop-filter: blur(15px);
            padding: 0.8rem 0;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        }

        /* --- HERO / BANNER --- */
        .hero-bg {
            position: relative;
            /* Updated to use rgb values of #101e38 for the gradient overlay */
            background-image: linear-gradient(to right, rgba(16, 30, 56, 0.98) 35%, rgba(16, 30, 56, 0.4) 100%), 
                              url('https://images.unsplash.com/photo-1519494026892-80bbd2d6fd0d?auto=format&fit=crop&q=80&w=1920');
            background-size: cover;
            background-position: center;
            min-height: 100vh;
            display: flex;
            align-items: center;
        }

        .magenta-glow {
            color: #7d3665;
            /* Updated text-shadow to match #7d3665 */
            text-shadow: 0 0 25px rgba(125, 54, 101, 0.5); 
        }

        .floating-ui {
            border-radius: 40px;
            box-shadow: 0 50px 100px -20px rgba(0, 0, 0, 0.6);
            border: 1px solid rgba(255, 255, 255, 0.15);
            backdrop-filter: blur(5px);
            overflow: hidden;
        }

        /* --- ANIMATIONS --- */
        @keyframes float {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(-20px); }
        }
        .animate-float { animation: float 6s ease-in-out infinite; }

        .reveal { 
            opacity: 0; 
            transform: translateY(30px); 
            transition: all 0.8s cubic-bezier(0.2, 1, 0.3, 1); 
        }
        .reveal.active { 
            opacity: 1; 
            transform: translateY(0); 
        }

         
        .reveal { opacity: 1; transform: translateY(0); } /* Assuming reveal is handled elsewhere */
        
        /* Hide scrollbar for Chrome, Safari and Opera */
        .no-scrollbar::-webkit-scrollbar {
            display: none;
        }
        /* Hide scrollbar for IE, Edge and Firefox */
        .no-scrollbar {
            -ms-overflow-style: none;  /* IE and Edge */
            scrollbar-width: none;  /* Firefox */
        }
   