/* =========================================================
   ANIMATION.CSS — Fade-in / scroll reveal / misc motion
   ========================================================= */

/* Generic fade-in-up utility, toggled by IntersectionObserver in script.js */
.reveal{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .7s ease,transform .7s ease;
}

.reveal.in-view{
  opacity:1;
  transform:translateY(0);
}

/* Stagger helper (applies incremental delay via nth-child, used on grids) */
.food-grid .card:nth-child(1){animation-delay:.02s;}
.food-grid .card:nth-child(2){animation-delay:.08s;}
.food-grid .card:nth-child(3){animation-delay:.14s;}
.food-grid .card:nth-child(4){animation-delay:.20s;}
.food-grid .card:nth-child(5){animation-delay:.26s;}
.food-grid .card:nth-child(6){animation-delay:.32s;}
.food-grid .card:nth-child(7){animation-delay:.38s;}
.food-grid .card:nth-child(8){animation-delay:.44s;}
.food-grid .card:nth-child(9){animation-delay:.50s;}

/* Bounce for cart badge when item added */
@keyframes badgeBounce{
  0%{transform:scale(1);}
  40%{transform:scale(1.5);}
  100%{transform:scale(1);}
}
.cart-badge.bounce{animation:badgeBounce .4s ease;}

/* Shake for invalid form fields */
@keyframes shake{
  10%,90%{transform:translateX(-1px);}
  20%,80%{transform:translateX(2px);}
  30%,50%,70%{transform:translateX(-4px);}
  40%,60%{transform:translateX(4px);}
}
.field.shake{animation:shake .5s ease;}

/* Fade for page content on load */
@keyframes pageFade{
  from{opacity:0;}
  to{opacity:1;}
}
main{animation:pageFade .5s ease;}

/* Pulse for flash-sale eyebrow */
@keyframes pulseDot{
  0%,100%{opacity:1;}
  50%{opacity:.4;}
}
.pulse-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--color-accent-red);
  display:inline-block;
  animation:pulseDot 1.2s ease infinite;
}

/* Respect reduced motion preference */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:0.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
    scroll-behavior:auto !important;
  }
}