/* ===== motion.css — Purposeful motion polish =====
   Веса: Jakub (производственная полировка) + Emil (сдержанность, <300ms),
   Jhey — точечно (zoom карточек, hero-вход).
   Правила: только transform / opacity / filter; кастомные кривые;
   prefers-reduced-motion обязателен. */

:root {
  --ease-out-expo: cubic-bezier(.16, 1, .3, 1);
  --ease-out-quint: cubic-bezier(.22, 1, .36, 1);
}

/* 1. Тактильный отклик нажатия (Emil): быстрый, без анимации layout */
.btn:active { transform: scale(.97); }
.social-link:active { transform: scale(.97); }
.cart-btn:active, .scroll-top:active, .btn-quick:active { transform: scale(.92); }

/* 2. Плавный зум изображений карточек при наведении (transform-only, Jhey) */
.category-card img,
.product-card img,
.product-card .product-img img {
  transition: transform .7s var(--ease-out-expo);
}
.category-card:hover img,
.product-card:hover img,
.product-card:hover .product-img img { transform: scale(1.06); }

/* 3. Вход hero-блока (Jakub: opacity + translateY + blur, stagger) */
.hero-title,
.hero-subtitle,
.hero-buttons {
  opacity: 0;
  animation: hero-enter .7s var(--ease-out-expo) forwards;
}
.hero-subtitle { animation-delay: .12s; }
.hero-buttons { animation-delay: .24s; }

@keyframes hero-enter {
  from { opacity: 0; transform: translateY(14px); filter: blur(4px); }
  to   { opacity: 1; transform: translateY(0); filter: blur(0); }
}

/* 4. Появление секций при скролле (активируется только при JS: html.js-reveal) */
.js-reveal .reveal {
  opacity: 0;
  transform: translateY(22px);
  transition:
    opacity .55s var(--ease-out-quint),
    transform .55s var(--ease-out-quint);
  transition-delay: var(--reveal-delay, 0s);
}
.js-reveal .reveal.in-view {
  opacity: 1;
  transform: translateY(0);
}

/* 5. Доступность: уважаем prefers-reduced-motion (обязательно) */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .js-reveal .reveal { opacity: 1 !important; transform: none !important; }
  .hero-bg-video { display: none !important; }
}

/* 6. Плавный скролл (Lenis): отключаем нативный smooth, чтобы не было двойной анимации */
html.lenis,
html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }