@media (max-width: 820px) and (prefers-reduced-motion: no-preference) {
  html.mobile-motion-ready {
    scroll-behavior: smooth;
  }

  .site-nav {
    animation: mm-nav-drop .8s cubic-bezier(.16, 1, .3, 1) both;
  }

  .site-brand img {
    animation: mm-logo-breathe 3.8s ease-in-out infinite;
  }

  .nav-play span {
    display: inline-grid;
    animation: mm-arrow-pulse 1.2s ease-in-out infinite alternate;
  }

  .hero-copy .site-kicker,
  .hero-copy h1,
  .hero-copy > p,
  .hero-actions,
  .hero-pills {
    animation: mm-rise .8s cubic-bezier(.16, 1, .3, 1) both;
  }

  .hero-copy h1 { animation-delay: .08s; }
  .hero-copy > p { animation-delay: .16s; }
  .hero-actions { animation-delay: .24s; }
  .hero-pills { animation-delay: .32s; }

  .hero-blob {
    animation: mm-blob-mobile 5.5s ease-in-out infinite alternate !important;
  }

  .hero-character > img {
    animation: mm-character-float 2.7s ease-in-out infinite alternate !important;
    transform-origin: 50% 90%;
  }

  .speech {
    animation: mm-speech-pop 2.4s ease-in-out infinite alternate;
  }

  .hero-sticker {
    animation: mm-sticker-spin 4s ease-in-out infinite alternate;
  }

  .hero-sprinkles i {
    animation: mm-sprinkle-drift 2.8s ease-in-out infinite alternate;
  }

  .hero-sprinkles i:nth-child(2n) { animation-delay: -1.2s; animation-duration: 3.6s; }
  .hero-sprinkles i:nth-child(3n) { animation-delay: -.6s; animation-duration: 2.2s; }

  .site-ticker > div {
    justify-content: flex-start !important;
    padding-left: 0 !important;
    animation: mm-ticker 13s linear infinite;
  }

  .mm-reveal {
    opacity: 0;
    transform: translate3d(0, 42px, 0) scale(.97);
    transition:
      opacity .72s ease,
      transform .82s cubic-bezier(.16, 1, .3, 1);
    will-change: transform, opacity;
  }

  .mm-reveal.mm-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1);
  }

  .flavor-card.mm-visible:nth-child(odd),
  .store-card.mm-visible:nth-child(odd) {
    transform: rotate(-1.2deg);
  }

  .flavor-card.mm-visible:nth-child(even),
  .store-card.mm-visible:nth-child(even) {
    transform: rotate(1.2deg);
  }

  .flavor-card.mm-visible img,
  .store-card.mm-visible img {
    animation: mm-photo-drift 6s ease-in-out infinite alternate;
  }

  .flavor-card.mm-visible:nth-child(even) img,
  .store-card.mm-visible:nth-child(even) img {
    animation-delay: -3s;
  }

  .flavor-callout.mm-visible > img,
  .story-mascot.mm-visible,
  .waiting-section > img.mm-visible,
  .faq-section img.mm-visible,
  .contact-character img.mm-visible {
    animation: mm-mascot-bob 2.6s ease-in-out infinite alternate;
    transform-origin: 50% 100%;
  }

  .section-heading h2.mm-visible em,
  .story-copy-site h2.mm-visible em,
  .waiting-section h2.mm-visible em,
  .faq-section h2.mm-visible em,
  .contact-copy-site h2.mm-visible em {
    display: inline-block;
    animation: mm-highlight 2.2s .5s ease-in-out infinite alternate;
  }

  .story-photo.mm-visible:first-child {
    transform: rotate(-3deg) translate3d(0, 0, 0);
  }

  .story-photo.mm-visible:nth-child(2) {
    transform: rotate(4deg) translate3d(0, 0, 0);
  }

  .story-photo.mm-visible img {
    animation: mm-photo-drift 7s ease-in-out infinite alternate;
  }

  .waiting-notes span.mm-visible,
  .story-milestones span.mm-visible {
    transition-delay: var(--mm-delay, 0ms);
  }

  .site-button,
  .store-copy a,
  .faq-list summary {
    -webkit-tap-highlight-color: transparent;
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
  }

  .site-button.mm-tapped,
  .store-copy a.mm-tapped,
  .faq-list summary.mm-tapped {
    transform: scale(.94) rotate(-1deg) !important;
  }

  .whatsapp-float {
    animation: mm-whatsapp 2.2s ease-in-out infinite alternate;
  }

  .back-top {
    animation: mm-backtop 1.8s ease-in-out infinite alternate;
  }
}

@keyframes mm-nav-drop {
  from { opacity: 0; transform: translateY(-22px) scale(.96); }
}

@keyframes mm-logo-breathe {
  50% { transform: scale(1.045) rotate(-1deg); filter: drop-shadow(0 5px 8px rgba(7,50,158,.14)); }
}

@keyframes mm-arrow-pulse {
  to { transform: translateX(4px) scale(1.12); }
}

@keyframes mm-rise {
  from { opacity: 0; transform: translateY(28px); }
}

@keyframes mm-blob-mobile {
  0% { border-radius: 43% 57% 60% 40% / 48% 42% 58% 52%; transform: rotate(-3deg) scale(.97); }
  100% { border-radius: 58% 42% 40% 60% / 44% 56% 44% 56%; transform: rotate(5deg) scale(1.04); }
}

@keyframes mm-character-float {
  0% { transform: translateY(5px) rotate(-1.5deg); }
  100% { transform: translateY(-13px) rotate(1.5deg); }
}

@keyframes mm-speech-pop {
  0% { transform: rotate(-2deg) translateY(3px); }
  100% { transform: rotate(4deg) translateY(-7px) scale(1.035); }
}

@keyframes mm-sticker-spin {
  0% { transform: rotate(-5deg) scale(.96); }
  100% { transform: rotate(12deg) scale(1.05); }
}

@keyframes mm-sprinkle-drift {
  to { transform: translate(10px, -17px) rotate(55deg) scale(1.12); }
}

@keyframes mm-ticker {
  to { transform: translateX(-33.333%); }
}

@keyframes mm-photo-drift {
  0% { transform: scale(1.01) translateX(-1%); }
  100% { transform: scale(1.08) translateX(1.5%); }
}

@keyframes mm-mascot-bob {
  0% { transform: translateY(5px) rotate(-2deg); }
  100% { transform: translateY(-12px) rotate(2deg); }
}

@keyframes mm-highlight {
  to { transform: rotate(-2deg) scale(1.045); filter: drop-shadow(0 6px 0 rgba(255,201,79,.26)); }
}

@keyframes mm-whatsapp {
  to { transform: translateY(-7px) scale(1.035); box-shadow: 0 18px 34px rgba(7,27,82,.3); }
}

@keyframes mm-backtop {
  to { transform: translateY(-7px); }
}

@media (prefers-reduced-motion: reduce) {
  .mm-reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}
