/* =========================================================
   OLD ZOMBIE — плавность: переходы между страницами, появление блоков,
   мягкие ховеры, загрузка картинок, нажатия кнопок
   ========================================================= */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: szOut .22s ease both; }
::view-transition-new(root) { animation: szIn .38s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes szOut { to { opacity: 0; } }
@keyframes szIn { from { opacity: 0; } }

/* Для браузеров без View Transitions — короткое мягкое появление страницы (только прозрачность, без сдвигов) */
@supports not (view-transition-name: none) {
  body { animation: szFade .4s ease both; }
}
@keyframes szFade { from { opacity: 0; } to { opacity: 1; } }

html { scroll-behavior: smooth; }
body { text-rendering: optimizeLegibility; }

/* Единая мягкая кривая для всего, у чего нет своих переходов */
a, button, input, select, textarea, summary, .panel {
  transition-property: color, background-color, border-color, box-shadow, transform, opacity;
  transition-duration: .22s;
  transition-timing-function: cubic-bezier(.2, .8, .2, 1);
}
.btn-neon:active, .btn-violet:active, .btn-ghost-oz:active, .btn-chip:active, .btn-gift:active, .vd-arrow:active, a.pw-pg:active { transform: scale(.97); }
.btn-neon:hover, .btn-violet:hover { transform: translateY(-1px); }

/* Появление блоков при прокрутке (класс .rv ставит smooth.js только тем, что ниже экрана) */
html.sz-js .rv { transition: opacity .7s ease, transform .7s cubic-bezier(.2, .8, .2, 1); transition-delay: var(--rv-d, 0ms); }
html.sz-js .rv:not(.in) { opacity: 0; transform: translateY(24px); }

/* Плавное проявление картинок после загрузки (через animation, чтобы не ломать hover-переходы картинок) */
html.sz-js img[loading="lazy"]:not(.sz-ld) { opacity: 0; }
html.sz-js img.sz-fade { animation: szImg .55s ease both; }
@keyframes szImg { from { opacity: 0; } to { opacity: 1; } }

/* Липкие панели и меню */
.topbar { transition: background-color .3s, box-shadow .3s, border-color .3s; }
.sb-submenu { transition: max-height .35s cubic-bezier(.2, .8, .2, 1), opacity .25s; }

/* Аккуратный фокус с клавиатуры */
:focus-visible { outline: 2px solid rgba(168, 85, 255, .7); outline-offset: 2px; border-radius: 6px; }

@media (prefers-reduced-motion: reduce) {
  html, html:focus-within { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  html.sz-js .rv:not(.in) { opacity: 1; transform: none; }
  html.sz-js img[loading="lazy"]:not(.sz-ld) { opacity: 1; }
  html.sz-js img.sz-fade { animation: none; }
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}

/* =========================================================
   «Новинки и хиты» на главной: плавный вход и наведение
   ========================================================= */
.home-shop .hs-track { scroll-behavior: smooth; }
.home-shop .hs-item { transform: translateZ(0); transition: transform .55s cubic-bezier(.16, 1, .3, 1), border-color .35s ease, box-shadow .55s cubic-bezier(.16, 1, .3, 1); }
.home-shop .hs-item:hover, .home-shop .hs-item:focus-visible { transform: translateY(-9px) scale(1.014); border-color: rgba(178, 77, 255, .55); box-shadow: 0 22px 46px rgba(0, 0, 0, .45), 0 0 34px rgba(140, 60, 255, .22); }
.home-shop .hs-item:active { transform: translateY(-4px) scale(.995); transition-duration: .15s; }
.home-shop .hs-visual::before { content: ""; position: absolute; z-index: 1; top: 0; left: -75%; width: 45%; height: 100%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .16), transparent); transform: skewX(-18deg); pointer-events: none; transition: left 1s cubic-bezier(.16, 1, .3, 1); }
.home-shop .hs-item:hover .hs-visual::before { left: 135%; }
.home-shop .hs-visual img { transition: transform .9s cubic-bezier(.16, 1, .3, 1), filter .6s ease; }
.home-shop .hs-item:hover .hs-visual img { transform: scale(1.1) translateY(-4px); filter: drop-shadow(0 16px 20px rgba(0, 0, 0, .5)) saturate(1.12); }
.home-shop .hs-visual .pc-art { transition: transform .7s cubic-bezier(.16, 1, .3, 1); }
.home-shop .hs-item:hover .hs-visual .pc-art { transform: scale(1.08) translateY(-3px); }
.home-shop .hs-visual .pc-art i { transition: transform .8s cubic-bezier(.16, 1, .3, 1), color .4s; }
.home-shop .hs-item:hover .hs-visual .pc-art i { transform: rotate(-8deg) scale(1.12); }
.home-shop .hs-badge { transition: transform .45s cubic-bezier(.16, 1, .3, 1); }
.home-shop .hs-item:hover .hs-badge { transform: translateY(-2px) scale(1.06); }
.home-shop .hs-title { transition: color .35s ease; }
.home-shop .hs-item:hover .hs-title { color: #fff; }
.home-shop .hs-foot em { transition: color .35s ease, transform .45s cubic-bezier(.16, 1, .3, 1); transform-origin: left center; }
.home-shop .hs-item:hover .hs-foot em { color: #ffe08a; transform: scale(1.06); }
.home-shop .hs-go { transition: transform .5s cubic-bezier(.16, 1, .3, 1), background-color .35s, box-shadow .45s, color .35s; }
.home-shop .hs-item:hover .hs-go { transform: translateX(3px) rotate(-10deg) scale(1.1); }
.home-shop .hs-head .panel-link i { transition: transform .35s cubic-bezier(.16, 1, .3, 1); }
.home-shop .hs-head .panel-link:hover i { transform: translateX(5px); }

/* Помощь: два шага вместо трёх */
.help-start.hs2 { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; }
.help-step { transition: transform .35s cubic-bezier(.16, 1, .3, 1), border-color .3s, box-shadow .4s; }
.help-step:hover { transform: translateY(-4px); border-color: var(--line-violet); box-shadow: 0 14px 32px rgba(0, 0, 0, .35); }
@media (max-width: 1199px) { .help-start.hs2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) { .help-start.hs2 { grid-template-columns: 1fr; } }