/* Freeze Foods · сдержанный motion (скилл animate, Эмиль Ковальски).
   Двигается только то, что помогает покупать: отклик на «в корзину», счётчик корзины, всплывающие меню и фильтры, переходы между страницами.
   Информационные страницы получают мягкое каскадное появление блоков (один раз). Каталог, корзина и оформление не анимируются при прокрутке.
   Только transform и opacity, ease-out, до 300 мс на интерфейсе; «уменьшить движение» = без сдвигов. Включается классом html.mo. */
:root { --dy: 14px; }

/* переходы между страницами: шапка стоит, содержимое проявляется */
@view-transition { navigation: auto; }
.hdr { view-transition-name: site-header; }
::view-transition-group(site-header) { animation-duration: 0s; }
::view-transition-old(root) { animation: vt-out 120ms var(--ease-out) both; }
::view-transition-new(root) { animation: vt-in 220ms var(--ease-out) 30ms both; }
@keyframes vt-out { to { opacity: 0; } }
@keyframes vt-in { from { opacity: 0; } }

/* меню каталога и мобильное: плавное раскрытие */
.mega:not([hidden]), .mmenu:not([hidden]) { transition: opacity 160ms var(--ease-out), transform 180ms var(--ease-out); }
@starting-style { .mega:not([hidden]), .mmenu:not([hidden]) { opacity: 0; transform: translateY(-8px); } }

/* подсказки поиска */
.search__sug:not([hidden]) { transition: opacity 140ms var(--ease-out), transform 160ms var(--ease-out); }
@starting-style { .search__sug:not([hidden]) { opacity: 0; transform: translateY(-4px); } }

/* уведомления */
.toast { animation: toast-in 220ms var(--ease-out) backwards; }
@keyframes toast-in { from { opacity: 0; transform: translateY(12px); } }

/* отклик корзины */
.btn.is-done { background: var(--ok); border-color: var(--ok); color: #fff; }
.hdr__cart.bump { animation: bump 320ms var(--ease-out); }
@keyframes bump { 35% { transform: scale(1.08); } }
.btn { transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform 160ms var(--ease-out); }

/* карточки: лёгкий отклик при наведении мышью */
@media (hover: hover) and (pointer: fine) {
  .pcard { transition: border-color .15s ease, box-shadow 200ms var(--ease-out); }
  .pcard:hover { box-shadow: 0 8px 22px -16px rgba(14, 28, 38, .5); }
  .cat:hover { transform: translateY(-2px); }
}

/* информационные страницы: каскадное появление блоков при прокрутке (один раз) */
.mo[data-reveal] .reveal:not(.is-in) { opacity: 0; }
.mo[data-reveal] .reveal.is-in { animation: rv-in 560ms var(--ease-out) var(--d, 0ms) backwards; }
@keyframes rv-in { from { opacity: 0; transform: translateY(var(--dy)); } }
.mo .hero h1, .mo .hero .lead, .mo .hero .actions, .mo .hero__facts { animation: rv-in 520ms var(--ease-out) backwards; }
.mo .hero .lead { animation-delay: 60ms; }
.mo .hero .actions { animation-delay: 120ms; }
.mo .hero__facts { animation-delay: 180ms; }

@media (prefers-reduced-motion: reduce) {
  .mega:not([hidden]), .mmenu:not([hidden]), .search__sug:not([hidden]) { transition: none; }
  .toast, .hdr__cart.bump { animation: none; }
  .mo[data-reveal] .reveal.is-in { animation: fade-only 240ms ease backwards; }
  .mo .hero h1, .mo .hero .lead, .mo .hero .actions, .mo .hero__facts { animation: none; }
  .cat:hover { transform: none; }
  .filters { transition: none; }
  @keyframes fade-only { from { opacity: 0; } }
}