/* ===========================
   MOODY FOODY | ANIMATIONS
=========================== */

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

@keyframes fadeIn{
    from{ opacity:0; }
    to{ opacity:1; }
}

@keyframes popIn{
    0%{ transform:scale(.85); opacity:0; }
    100%{ transform:scale(1); opacity:1; }
}

@keyframes bounceCart{
    0%,100%{ transform:scale(1); }
    50%{ transform:scale(1.3); }
}

.hero-left,
.page-banner h1,
.page-banner p{
    animation:fadeInUp .7s ease both;
}

.food-card,
.recipe-card,
.category-card{
    animation:popIn .5s ease both;
}

.cart-item{
    animation:fadeIn .35s ease both;
}

.toast.show{
    animation:fadeIn .3s ease;
}

.cart-count.bump,
.cart-badge.bump{
    animation:bounceCart .35s ease;
}

/* Stagger food-card entrance a little for a nicer feel */
.food-grid .food-card:nth-child(3n+1){ animation-delay:.03s; }
.food-grid .food-card:nth-child(3n+2){ animation-delay:.08s; }
.food-grid .food-card:nth-child(3n+3){ animation-delay:.13s; }