        /* Base styles for font and anti-aliasing */
        body {
            font-family: 'Inter', sans-serif;
            -webkit-font-smoothing: antialiased;
            -moz-osx-smoothing: grayscale;
            /* Prevent horizontal scrolling on mobile */
            overflow-x: hidden; 
        }

        /* Ensure consistent box-sizing for all elements */
        html {
            box-sizing: border-box;
        }
        *, *::before, *::after {
            box-sizing: inherit;
        }

        /* Custom scrollbar styles */
        ::-webkit-scrollbar {
            width: 8px;
        }
        ::-webkit-scrollbar-track {
            background: #f1f5f9; /* Light slate background */
        }
        ::-webkit-scrollbar-thumb {
            background: #64748b; /* Darker slate thumb */
            border-radius: 10px;
        }
        ::-webkit-scrollbar-thumb:hover {
            background: #475569; /* Even darker slate on hover */
        }
        
        /* Hero section glow effect */
        .hero-glow::before {
            content: '';
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: radial-gradient(circle, rgba(66, 153, 225, 0.15) 0%, rgba(66, 153, 225, 0) 60%);
            animation: rotateGlow 20s linear infinite;
            z-index: 0;
        }
        
        /* Keyframe animation for the glow effect */
        @keyframes rotateGlow {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }

        /* Scroll-triggered animation styles */
        [data-scroll] {
            transition: opacity 0.8s, transform 0.8s;
            transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }
        /* Initial state for elements animating in from below */
        [data-scroll='out-up'] {
            opacity: 0;
            transform: translateY(40px);
        }
        /* Final state for elements that have scrolled into view */
        [data-scroll='in'] {
            opacity: 1;
            transform: translateY(0);
        }