@layer utilities {
    .glass-card {
        background-color: rgba(255, 255, 255, 0.7);
        backdrop-filter: blur(12px);
        border: 1px solid rgba(255, 255, 255, 0.2);
        box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    }
    .glass-nav {
        background-color: rgba(255, 255, 255, 0.95);
        backdrop-filter: blur(16px);
        border-bottom: 1px solid rgba(229, 231, 235, 0.5);
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    }
    .animate-marquee {
        animation: marquee 40s linear infinite;
    }
    .pause {
        animation-play-state: paused;
    }
}

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