/* Custom CSS for Card Animations and Structure */

.menu-card {
    @apply bg-white rounded-[1.5rem] p-6 flex flex-col items-center justify-center cursor-pointer;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.04);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.menu-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 31, 115, 0.1);
}

/* Base fade-in state */
.hidden-start {
    opacity: 0;
}

.fade-in-up {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Staggered animation delays */
.delay-100 { animation-delay: 100ms; }
.delay-150 { animation-delay: 150ms; }
.delay-200 { animation-delay: 200ms; }
.delay-250 { animation-delay: 250ms; }
.delay-300 { animation-delay: 300ms; }
.delay-350 { animation-delay: 350ms; }
.delay-400 { animation-delay: 400ms; }
.delay-500 { animation-delay: 500ms; }

/* Fallbacks just in case images are missing while testing */
.fall-back-icon {
    background-color: #f1f5f9;
    border-radius: 20%;
    color: transparent;
    min-width: 64px;
    min-height: 64px;
}
.fall-back-logo {
    background-color: #ffffff;
    border-radius: 0;
    color: transparent;
    min-width: 40px;
}
footer {background:#ffffff !important}