/* Professional Animation System (Cross-Platform) */

/* Keyframe Definitions - Global */
@keyframes slideInFromLeft {
    0% { transform: translateX(-100vw); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}

@keyframes slideInFromRight {
    0% { transform: translateX(100vw); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}

@keyframes plate-settle {
    0% { transform: translateY(0) scale(1); }
    50% { transform: translateY(-8px) scale(1.03); }
    100% { transform: translateY(0) scale(1); }
}

@keyframes scaleIn {
    0% { transform: scale(0.85); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

@keyframes fadeInUp {
    0% { transform: translateY(30px); opacity: 0; }
    100% { transform: translateY(0); opacity: 1; }
}

@keyframes kenBurns {
    0% { transform: scale(1.08); }
    100% { transform: scale(1); }
}

@keyframes slideInSubtleLeft {
    0% { transform: translateX(-60px); opacity: 0; }
    100% { transform: translateX(0); opacity: 1; }
}

@keyframes slideAndSpin {
    0% { transform: translateX(100vw) rotate(-360deg); opacity: 0; }
    100% { transform: translateX(0) rotate(-15deg); opacity: 1; }
}

/* Global Entrance Classes */
.slide-from-left.animate-active {
    animation: slideInFromLeft 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

.slide-from-right.animate-active {
    animation: slideInFromRight 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

.animate-active#hero-dish {
    animation: slideAndSpin 1.2s cubic-bezier(0.2, 0.8, 0.2, 1) 0.5s forwards !important;
}

.animate-active .category-img-wrapper img {
    animation: plate-settle 0.4s ease-out 0.8s forwards;
}

/* Hero Section Sequence */
.hero-entrance-1, .hero-entrance-2, .hero-entrance-3 { opacity: 0; }

.hero-active .hero-entrance-1 { animation: fadeInUp 0.7s ease-out forwards; }
.hero-active .hero-entrance-2 { animation: fadeInUp 0.7s ease-out 0.2s forwards; }
.hero-active .hero-entrance-3 { animation: scaleIn 0.6s ease-out 1.8s forwards; }

.hero-active .slide-from-right { animation-delay: 0.5s; }

/* Section Content Reveal */
.section-title-rev, .section-p-rev { opacity: 0; }
.animate-active .section-title-rev { animation: slideInSubtleLeft 0.6s ease-out forwards; }
.animate-active .section-p-rev { animation: fadeInUp 0.6s ease-out 0.2s forwards; }

/* Staggered Items Reveal */
.service-item, .footer-col { opacity: 0; transform: translateY(20px); }
.animate-active .service-item, .animate-active .footer-col { 
    animation: fadeInUp 0.6s ease-out forwards; 
}

/* Kenyan Burns */
.event-img { transition: transform 0.5s ease; }
.animate-active .event-img { animation: kenBurns 1.5s ease-out forwards; }

/* Desktop Specific Cleanup & Enhancements */
@media (min-width: 1025px) {
    .category-card {
        padding: 2rem;
        transition: transform 0.5s cubic-bezier(0.2, 1, 0.3, 1);
    }
    .category-card:hover {
        transform: translateY(-10px);
    }
    .category-img-wrapper::after {
        content: '';
        position: absolute;
        inset: -10px;
        border: 1px solid var(--gold-primary);
        border-radius: 50%;
        opacity: 0;
        transition: 0.5s;
    }
    .category-card:hover .category-img-wrapper::after {
        opacity: 0.3;
        inset: -20px;
    }
}

/* Mobile Layout Overrides - Restrict to small screens */
@media (max-width: 768px) {
    body.mobile-optimized { overflow-x: hidden; }
    
    section, .hero-section { padding: 60px 20px !important; }
    
    .footer-grid, .services-grid, .category-list, .hero-content, .info-bar, .flex-row {
        display: flex !important;
        flex-direction: column !important;
        gap: 3rem !important;
        text-align: center;
    }

    /* Carousel Persistence on Mobile */
    .dish-card, .testi-card {
        transform: scale(0.92);
        opacity: 0.6;
    }
    .dish-card.card-active, .testi-card.card-active {
        transform: scale(1);
        opacity: 1;
    }
}

/* Navigation & Utility */
.will-animate { will-change: transform, opacity; }

.has-animated {
    opacity: 1 !important;
}

@media (prefers-reduced-motion: reduce) {
    *, ::before, ::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}