/* Одна система движения для витрины и подбора. original сохраняет прежний вид. */
:root:where([data-motion]:not([data-motion="original"])) {
  --motion-duration: 360ms;
  --motion-fast: 180ms;
  --motion-ease: cubic-bezier(.22, 1, .36, 1);
  --motion-x: 0px;
  --motion-y: 12px;
  --motion-scale: .985;
  --motion-lift: -2px;
  --motion-stagger: 0ms;
  --t-ease: var(--motion-ease);
  --g-spring: var(--motion-ease);
  scrollbar-gutter: stable;
}
:root[data-motion="dissolve"] { --motion-duration: 300ms; --motion-x: 0px; --motion-y: 0px; --motion-scale: 1; --motion-lift: 0px; }
:root[data-motion="slide"] { --motion-duration: 420ms; --motion-x: 28px; --motion-y: 0px; --motion-scale: 1; --motion-stagger: 35ms; }
:root[data-motion="depth"] { --motion-duration: 400ms; --motion-x: 0px; --motion-y: 4px; --motion-scale: .94; --motion-lift: -1px; }
:root[data-motion="flow"] { --motion-duration: 480ms; --motion-x: 0px; --motion-y: 18px; --motion-scale: 1; --motion-stagger: 24ms; }

:root[data-motion]:not([data-motion="original"]) :is(.tr-item, .tr-tile, .tr-btn, .tr-tool, .tr-tool__icon, .tr-nav__link, .tr-topmenu a, .aq-tabs__tab, .ps-type-btn, .ps-mode-btn, .ps-btn, .ps-sotr-knopka, .ps-results tbody tr) {
  transition-timing-function: var(--motion-ease) !important;
  transition-duration: var(--motion-duration) !important;
}
:root[data-motion]:not([data-motion="original"]) :is(.tr-header__row, .tr-phone, .tr-hlinks, .tr-header__top, .tr-tools, .tr-logo img, .tr-logo .tsk-logo) { transition-duration: var(--motion-duration); transition-timing-function: var(--motion-ease); }
:root[data-motion]:not([data-motion="original"]) .tr-header--compact :is(.tr-phone, .tr-hlinks) { visibility: visible; }
:root[data-motion]:not([data-motion="original"]) :is(.tr-suggest, .pr-modal, .chat-okno, .tr-stock-popup, .nal__pop, .aq-sort__list, .pwa-predl) { animation: none !important; }
:root[data-motion]:not([data-motion="original"]) [data-motion-surface="true"] { animation: none !important; }
:root[data-motion]:not([data-motion="original"]) :is(.pr-modal__box, .tr-stock-popup__box) { animation: aq-motion-in var(--motion-duration) var(--motion-ease); transition: transform calc(var(--motion-duration) * .72) var(--motion-ease); }
:root[data-motion]:not([data-motion="original"]) [data-motion-surface][inert] :is(.pr-modal__box, .tr-stock-popup__box) { transform: translate(var(--motion-x), var(--motion-y)) scale(var(--motion-scale)); }
:root[data-motion]:not([data-motion="original"]) :is(.ps-modal-bg, .ps-modal-box) { animation: none !important; }
:root[data-motion]:not([data-motion="original"]) .ps-modal.open .ps-modal-box { animation: aq-motion-in var(--motion-duration) var(--motion-ease) !important; }

@keyframes aq-motion-in {
  from { opacity: 0; transform: translate(var(--motion-x), var(--motion-y)) scale(var(--motion-scale)); }
  to { opacity: 1; transform: none; }
}
:root[data-motion]:not([data-motion="original"]) :is(.tr-tile, .tr-item, .tr-product .aq-tabs__pane, .aq-gallery__slide, .aq-zoom__img, .tr-banner .aq-slide__inner) { animation: aq-motion-in var(--motion-duration) var(--motion-ease) both; }
:root[data-motion]:not([data-motion="original"]) .tr-nav__sub {
  transform: translateX(calc(var(--motion-x) * -.35)) translateY(calc(var(--motion-y) * .35)) scale(var(--motion-scale));
  transform-origin: left top;
  transition: opacity var(--motion-duration) var(--motion-ease), transform var(--motion-duration) var(--motion-ease), visibility var(--motion-duration) step-end !important;
  animation: none !important;
}
:root[data-motion]:not([data-motion="original"]) :is(.tr-nav__item:hover, .tr-nav__item:focus-within) > .tr-nav__sub { transform: none; transition-delay: 0s !important; }

/* Плавный цикл сохраняется, но амплитуда и темп спокойнее. */
@keyframes aq-motion-breathe { 0%, 100% { box-shadow: 0 0 0 0 rgba(36, 138, 61, .18); } 50% { box-shadow: 0 0 0 3px rgba(36, 138, 61, 0); } }
@keyframes aq-motion-background { from { transform: scale(1); } to { transform: scale(1.025); } }
:root[data-motion]:not([data-motion="original"]) :is(.tr-avail.in, .tr-dot.in)::before { animation: aq-motion-breathe 4.8s ease-in-out infinite; }
:root[data-motion]:not([data-motion="original"]) .tr-banner .aq-slide__bg { animation: aq-motion-background 24s ease-in-out alternate infinite; }
:root[data-motion]:not([data-motion="original"]) .tr-marki__okno--bezhit .tr-marki__lenta { animation-duration: calc(var(--n, 10) * 5s); }
@media (hover: hover) {
  :root[data-motion]:not([data-motion="original"]) :is(.tr-btn, .btn, .tr-banner .aq-btn, .tr-search button):hover { transform: scale(1.012); }
  :root[data-motion]:not([data-motion="original"]) .tr-tool:hover .tr-tool__icon { transform: scale(1.04); }
  :root[data-motion]:not([data-motion="original"]) :is(.tr-item, .tr-tile):hover { transform: translateY(var(--motion-lift)) !important; }
  :root[data-motion="depth"] :is(.tr-item, .tr-tile):hover { transform: scale(1.008) !important; }
  :root[data-motion="slide"] :is(.tr-item, .tr-tile):hover { transform: translateX(2px) !important; }
}
:root[data-motion]:not([data-motion="original"]) :is(.tr-btn, .btn, .tr-banner .aq-btn, .tr-search button):active { transform: scale(.985); transition-duration: var(--motion-fast) !important; }
@media (hover: none) {
  :root[data-motion]:not([data-motion="original"]) :is(.tr-item, .tr-tile):hover { transform: none !important; }
}

/* Checkbox-панели измеряет JS: без transform на предке fixed-подменю. */
@media (max-width: 1024px) {
  :root[data-motion]:not([data-motion="original"]) .tr-nav__list[data-motion-collapse] { display: grid !important; animation: none !important; transition: none !important; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
  :root[data-motion]:not([data-motion="original"]) .aq-filter[data-motion-collapse] { display: block !important; animation: none !important; transition: none !important; }
  :root[data-motion]:not([data-motion="original"]) [data-motion-collapse="closed"] { max-height: 0; opacity: 0; overflow: clip; pointer-events: none; margin-block: 0; padding-block: 0; border-block-width: 0; }
  :root[data-motion]:not([data-motion="original"]) [data-motion-collapse="open"] { overflow: clip; }
}

/* Display-переходы для zoom, вкладок, баннеров и режима расчёта. */
:root[data-motion]:not([data-motion="original"]) .aq-zoom[data-motion-zoom] { display: flex !important; animation: none !important; transition: none !important; }
:root[data-motion]:not([data-motion="original"]) .aq-zoom[data-motion-zoom="closed"] { opacity: 0; visibility: hidden; pointer-events: none; }
:root[data-motion]:not([data-motion="original"]) .aq-zoom[data-motion-zoom="closing"] { pointer-events: none; }
:root[data-motion]:not([data-motion="original"]).aq-motion-zoom-open { overflow: hidden; }
@supports (transition-behavior: allow-discrete) {
  :root[data-motion]:not([data-motion="original"]) :is(.aq-zoom, .aq-tabs__pane, .aq-gallery__slide, .aq-zoom__img, .aq-slide, #ps-calc-block, .ps-modal, .ps-auth-menu) {
    transition: opacity var(--motion-duration) var(--motion-ease), translate var(--motion-duration) var(--motion-ease), scale var(--motion-duration) var(--motion-ease), display var(--motion-duration) allow-discrete;
    transition-behavior: allow-discrete;
  }
  :root[data-motion]:not([data-motion="original"]) .aq-zoom:not([data-motion-zoom]):not(:is(.aq-zoom__toggle:checked ~ .aq-zoom)),
  :root[data-motion]:not([data-motion="original"]) .ps-modal:not(.open),
  :root[data-motion]:not([data-motion="original"]) #ps-calc-block[style*="display: none"] { opacity: 0; translate: var(--motion-x) var(--motion-y); scale: var(--motion-scale); }
  @starting-style {
    :root[data-motion]:not([data-motion="original"]) :is(.aq-zoom, .ps-modal.open, #ps-calc-block, .aq-tabs__pane, .aq-gallery__slide, .aq-zoom__img, .aq-slide) { opacity: 0; translate: var(--motion-x) var(--motion-y); scale: var(--motion-scale); }
  }
}

.adm-motion { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12px; }
.adm-motion select { min-height: 32px; max-width: 180px; border: 1px solid #94a3b8; border-radius: 7px; padding: 4px 7px; background: #fff; color: #17202e; font: inherit; }
.adm-motion-demo { position: fixed; z-index: 10050; right: 86px; bottom: 20px; width: 310px; max-width: calc(100% - 24px); box-sizing: border-box; border: 1px solid #d9e2ef; border-radius: 18px; padding: 16px; background: #fff; color: #17202e; box-shadow: 0 14px 48px #17202e26; font: 13px/1.45 system-ui, sans-serif; text-align: left; }
.adm-motion-demo__heading, .adm-motion-demo__footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.adm-motion-demo__heading strong { font-size: 15px; }
.adm-motion-demo button { border: 1px solid #d9e2ef; border-radius: 8px; padding: 5px 9px; background: #f4f7fc; color: #17202e; cursor: pointer; font: inherit; }
.adm-motion-demo__heading button { font-size: 20px; line-height: 1; }
.adm-motion-demo p { margin: 8px 0; }
.adm-motion-demo__stage { height: 112px; padding: 12px; box-sizing: border-box; overflow: hidden; border-radius: 12px; background: #edf4ff; }
.adm-motion-demo__anchor { display: block; margin-bottom: 12px; color: #51647e; font-size: 11px; }
.adm-motion-demo__sample { display: flex; align-items: center; gap: 10px; border: 1px solid #dbe6f7; border-radius: 12px; padding: 12px; background: #fff; box-shadow: 0 5px 14px #17202e0d; }
.adm-motion-demo__sample div { flex: 1; min-width: 0; }
.adm-motion-demo__sample b, .adm-motion-demo__sample div span { display: block; }
.adm-motion-demo__sample div span { font-size: 11px; color: #65758a; }
.adm-motion-demo__icon { color: #087eff; font-size: 26px; }
.adm-motion-demo__sample i { width: 6px; height: 6px; border-radius: 50%; background: #2fc176; }
.adm-motion-demo__hint { color: #51647e; }
.adm-motion-demo__footer { margin-top: 12px; }
.adm-motion-demo__footer > span { color: #51647e; font-size: 11px; }
@media (max-width: 760px) { .adm-motion-demo { right: 12px; bottom: 82px; } }
@media (max-width: 760px) { .adm-motion { width: 100%; } .adm-motion select { flex: 1; } }
@media (prefers-reduced-motion: reduce) {
  :root[data-motion]:not([data-motion="original"]) *,
  :root[data-motion]:not([data-motion="original"]) *::before,
  :root[data-motion]:not([data-motion="original"]) *::after { animation: none !important; transition: none !important; }
}
@media print {
  :root[data-motion]:not([data-motion="original"]) * { animation: none !important; transition: none !important; }
}
