body {
            background-color: #F9FAFB;
            color: #111827;
            scroll-behavior: smooth;
        }

        .glass-nav {
            background: rgba(249, 250, 251, 0.8);
            backdrop-filter: blur(12px);
            border-bottom: 1px solid rgba(0,0,0,0.05);
        }

        .page-section {
            display: none;
            animation: fadeIn 0.4s ease-out;
        }

        .page-section.active {
            display: block;
        }

        .code-gradient {
            background: linear-gradient(135deg, #3B82F6 0%, #0D9488 100%);
        }

        .text-gradient {
            background: linear-gradient(to right, #3B82F6, #0D9488);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .no-scrollbar::-webkit-scrollbar { display: none; }
        .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

        .btn-glow:hover {
            box-shadow: 0 0 20px rgba(59, 130, 246, 0.4);
        }

        input:focus {
            outline: none;
            border-color: #3B82F6;
            box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1);
        }

        .timeline-step:not(:last-child)::after {
            content: '';
            position: absolute;
            left: 50%;
            bottom: -2rem;
            width: 2px;
            height: 2rem;
            background: #e5e7eb;
        }

        @media (min-width: 768px) {
            .timeline-step:not(:last-child)::after {
                left: 100%;
                top: 50%;
                bottom: auto;
                width: 4rem;
                height: 2px;
            }
        }