nav {
    position: relative;
    z-index: 50;
    }
        
    @keyframes fadeUp {
        from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
    }
        
    .animate-fade-up {
        animation: fadeUp 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    }
        
    .animate-fade-up-delay {
        opacity: 0;
        animation: fadeUp 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.2s forwards;
    }
        
    @keyframes slideDown {
        from {
            opacity: 0;
            transform: translateY(-20px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
        
    .animate-slide-down {
        opacity: 0;
        animation: slideDown 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    }
        
    @keyframes scaleX {
        from {
            opacity: 0;
            transform: scaleX(0);
        }
        to {
            opacity: 1;
            transform: scaleX(1);
        }
    }
        
    .animate-scale-x {
        opacity: 0;
        animation: scaleX 0.8s cubic-bezier(0.4, 0, 0.2, 1) 0.4s forwards;
    }
        
    * {
        transition-property: background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 300ms;
    }