   @import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;700&family=Inter:wght@300;400;700;900&display=swap');

        :root {
            --bg-dark: #020617;
            --accent-blue: #2563eb;
        }

        body {
            background-color: var(--bg-dark);
            color: #cbd5e1;
            font-family: 'Inter', sans-serif;
            overflow-x: hidden;
        }

        .font-mono { font-family: 'JetBrains Mono', monospace; }

        .scramble {
            display: inline-block;
            font-family: 'JetBrains Mono', monospace;
            white-space: nowrap;
        }

        @keyframes loading-bar {
            0% { width: 0; }
            100% { width: 100%; }
        }

        .matrix-column {
            position: absolute;
            top: -100%;
            animation: matrix-fall linear infinite;
        }

        @keyframes matrix-fall {
            0% { transform: translateY(-100%); }
            100% { transform: translateY(200vh); }
        }

        .floating-container {
            animation: float 6s ease-in-out infinite;
        }

        @keyframes float {
            0%, 100% { transform: translateY(0) rotate(0); }
            50% { transform: translateY(-20px) rotate(1.5deg); }
        }

        .reveal {
            opacity: 0;
            transform: translateY(30px);
            transition: all 0.8s cubic-bezier(0.22, 1, 0.36, 1);
        }

        .reveal-visible {
            opacity: 1;
            transform: translateY(0);
        }

        ::-webkit-scrollbar { width: 8px; }
        ::-webkit-scrollbar-track { background: #020617; }
        ::-webkit-scrollbar-thumb {
            background: #1e293b;
            border-radius: 10px;
        }
        ::-webkit-scrollbar-thumb:hover { background: #2563eb; }

        .hero-photo {
            filter: grayscale(110%) brightness(90%);
            transition: all 0.7s ease-in-out;
        }
        .hero-photo-container:hover .hero-photo {
            filter: grayscale(0%) brightness(100%);
        }
        
        .noise-overlay {
            background-image: url('https://grainy-gradients.vercel.app/noise.svg');
            pointer-events: none;
        }

        #preloader {
            transition: opacity 0.5s ease-in-out;
        }

        .input-glow:focus {
            box-shadow: 0 0 15px rgba(37, 99, 235, 0.2);
            border-color: rgba(37, 99, 235, 0.5);
        }