/* Base styles */
        body {
            background-color: #051020; /* Darker than deep-blue for contrast */
            color: #F4F7F9;
            overflow-x: hidden;
        }

        /* Hero Gradient Background */
        .hero-bg-gradient {
            background: linear-gradient(135deg, #0A1931 0%, #00CED1 50%, #00FFFF 100%);
        }

        /* Glassmorphism Card Style */
        .glass-card {
            background: rgba(255, 255, 255, 0.08);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(0, 255, 255, 0.2);
            border-radius: 30px;
            transition: all 0.3s ease-out;
        }
        .glass-card:hover {
            background: rgba(255, 255, 255, 0.15);
            transform: translateY(-5px);
            box-shadow: var(--tw-shadow), 0 0 10px rgba(0, 255, 255, 0.5);
        }

        /* Road Map Visualization Styles (Timeline) */
        .roadmap-container {
            position: relative;
            padding-bottom: 2rem;
            overflow-x: auto;
            white-space: nowrap;
        }
        .roadmap-line {
            position: absolute;
            top: 25%;
            left: 0;
            height: 4px;
            width: 100%;
            background: linear-gradient(to right, #0A1931, #00BFFF, #00CED1, #0A1931);
            background-size: 200% 100%;
            animation: moveGradient 5s linear infinite;
        }
        @keyframes moveGradient {
            0% { background-position: 200% 0; }
            100% { background-position: -200% 0; }
        }
        .roadmap-step {
            position: relative;
            display: inline-block;
            width: 300px; /* Fixed width for horizontal scroll */
            padding: 2rem 1rem;
            margin-right: 30px;
            white-space: normal;
            vertical-align: top;
        }
        .roadmap-dot {
            position: absolute;
            top: 25%;
            left: 50%;
            transform: translate(-50%, -50%);
            width: 16px;
            height: 16px;
            border-radius: 50%;
            background-color: #00FFFF;
            box-shadow: 0 0 8px #00FFFF, 0 0 4px #00FFFF inset;
            z-index: 10;
        }

        /* Custom Scrollbar for aesthetic reasons */
        ::-webkit-scrollbar {
            height: 8px;
            width: 8px;
        }
        ::-webkit-scrollbar-thumb {
            background: #00CED1;
            border-radius: 4px;
        }
        ::-webkit-scrollbar-track {
            background: #0A1931;
        }