body {
            font-family: 'Inter', sans-serif;
            overflow-x: hidden;
        }

        .material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
            transition: all 0.3s ease;
        }

        .reveal {
            opacity: 0;
            transform: translateY(30px);
            transition: all 0.8s cubic-bezier(0.5, 0, 0, 1);
        }

        .reveal.active {
            opacity: 1;
            transform: translateY(0);
        }

        .reveal-delay-1 {
            transition-delay: 0.1s;
        }

        .reveal-delay-2 {
            transition-delay: 0.2s;
        }

        .reveal-delay-3 {
            transition-delay: 0.3s;
        }

        /* Menu animations */
        #mobile-menu {
            transition: transform 0.3s ease-in-out;
            transform: translateX(100%);
        }

        #mobile-menu.open {
            transform: translateX(0);
        }

        .backdrop {
            opacity: 0;
            pointer-events: none;
            transition: opacity 0.3s ease-in-out;
        }

        .backdrop.open {
            opacity: 1;
            pointer-events: auto;
        }

        @keyframes flow {
            0% {
                transform: translateX(-100%);
            }

            100% {
                transform: translateX(100%);
            }
        }

        .animate-flow {
            animation: flow 2s linear infinite;
        }

        /* Respect user's motion preferences (WCAG 2.1 AA) */
        @media (prefers-reduced-motion: reduce) {

            .animate-float,
            .animate-blob,
            .animate-flow,
            .animate-pulse-glow {
                animation: none !important;
            }

            .reveal {
                opacity: 1 !important;
                transform: none !important;
                transition: none !important;
            }
        }
