/* Define color palette and typography */
        :root {
            --color-midnight-blue: #0f172a; /* Slate-900 */
            --color-dark-teal: #1e3a8a;    /* Blue-800 for depth */
            --color-cyan: #06b6d4;         /* Cyan-500 */
            --color-teal: #14b8a6;         /* Teal-500 */
        }

        .font-space { font-family: 'Space Grotesk', sans-serif; }
        .font-inter { font-family: 'Inter', sans-serif; }

        /* Custom Gradients & Background */
        .bg-academic-gradient {
            background: linear-gradient(145deg, var(--color-midnight-blue) 0%, #0c183a 100%);
        }

        /* Hero Animation: Soft Analytical Lines */
        .hero-bg-animation {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
            opacity: 0.1;
            pointer-events: none;
        }
        .hero-bg-animation::before {
            content: '';
            position: absolute;
            width: 200%;
            height: 200%;
            background: repeating-linear-gradient(
                -45deg,
                rgba(6, 182, 212, 0.5), /* Cyan */
                rgba(6, 182, 212, 0.5) 1px,
                transparent 1px,
                transparent 50px
            );
            animation: moveGrid 60s linear infinite;
        }

        @keyframes moveGrid {
            from { transform: translate(0, 0); }
            to { transform: translate(50px, 50px); }
        }

        /* Glassmorphism Effect */
        .glass {
            background: rgba(255, 255, 255, 0.05); /* Soft White with low opacity */
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            border: 1px solid rgba(255, 255, 255, 0.1);
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }

        /* Neon Border Glow (for hover effects) */
        .neon-border-glow {
            transition: all 0.3s ease;
        }
        .neon-border-glow:hover {
            border-color: var(--color-cyan);
            box-shadow: 0 0 15px rgba(6, 182, 212, 0.5), 0 0 5px rgba(20, 184, 166, 0.3);
            transform: translateY(-4px);
        }

        /* Smooth Scroll Fade In */
        .fade-in-section {
            opacity: 0;
            transform: translateY(30px);
            transition: opacity 0.8s ease-out, transform 0.8s ease-out;
        }
        .fade-in-section.is-visible {
            opacity: 1;
            transform: translateY(0);
        }

        body {
            background-color: var(--color-midnight-blue);
            color: white;
            min-height: 100vh;
        }

        /* Custom Scrollbar for better aesthetic */
        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: var(--color-midnight-blue); }
        ::-webkit-scrollbar-thumb { background: var(--color-dark-teal); border-radius: 4px; }
        ::-webkit-scrollbar-thumb:hover { background: var(--color-cyan); }

        .hero-slideshow {
                position: absolute;
                inset: 0;
                overflow: hidden;
                z-index: 0;
            }

            .hero-slideshow .slide {
                position: absolute;
                inset: 0;
                width: 100%;
                height: 100%;
                object-fit: cover;
                opacity: 0;
                transition: opacity 1.5s ease-in-out;
            }

            .hero-slideshow .slide.active {
                opacity: 1;
            }