/* Усиленные анимации и плавность. Отключаются при prefers-reduced-motion. */
html.fx-smooth{ scroll-behavior:auto; }
.fx-progress{ position:fixed; top:0; left:0; height:3px; width:100%; transform-origin:0 50%; transform:scaleX(0); background:linear-gradient(90deg,#ff7a1a,#ffb25a); z-index:120; pointer-events:none; }

/* Появление при прокрутке (translate/scale — отдельные свойства, не мешают hover-transform) */
.fx-pre{ opacity:0; translate:0 34px; scale:.95; }
.fx-pre.fx-left{ translate:-40px 0; }
html .fx-in{ opacity:1; translate:0 0; scale:1; transition:opacity .7s cubic-bezier(.2,.8,.2,1), translate .8s cubic-bezier(.2,.9,.25,1.1), scale .8s cubic-bezier(.2,.9,.25,1.1), transform .25s cubic-bezier(.2,.8,.2,1), border-color .2s, box-shadow .25s; }

/* Карточки каталога и шаги: заметный подъём и свечение */
.item-card, .step-card, .support-box{ transition:transform .25s cubic-bezier(.2,.8,.2,1), border-color .2s, box-shadow .25s; }
.item-card:hover{ transform:translateY(-9px) scale(1.025); border-color:var(--accent-orange); box-shadow:0 18px 38px #000a, 0 0 0 1px #ff7a1a55, 0 0 34px #ff7a1a33; }
.step-card:hover{ transform:translateY(-6px); border-color:var(--accent-orange); box-shadow:0 14px 30px #0009, 0 0 26px #ff7a1a26; }
.item-thumb img{ transition:transform .15s ease-out, filter .3s; }
.item-card:hover .item-thumb img{ filter:drop-shadow(0 14px 22px #000b) drop-shadow(0 0 14px #ff7a1a55) saturate(1.15); }

/* Кнопки */
.btn{ transition:transform .18s cubic-bezier(.2,.8,.2,1), box-shadow .2s, filter .2s, background .2s; }
.btn:hover{ transform:translateY(-3px); box-shadow:0 10px 22px #ff7a1a40; filter:brightness(1.08); }
.btn:active{ transform:translateY(1px) scale(.95); box-shadow:none; transition-duration:.06s; }
.chip{ transition:transform .15s, background .2s, border-color .2s; }
.chip:hover{ transform:translateY(-2px) scale(1.06); }
.chip:active{ transform:scale(.93); }

/* Лого и шапка */
.logo img{ transition:transform .35s cubic-bezier(.2,1.4,.3,1), filter .3s; }
.logo:hover img{ transform:scale(1.07) rotate(-2deg); filter:drop-shadow(0 0 14px #ff7a1a80); }

/* Вход героя при загрузке */
@keyframes fxUp{ from{ opacity:0; transform:translateY(36px) scale(.97); filter:blur(6px); } to{ opacity:1; transform:none; filter:none; } }
@keyframes fxBanner{ from{ opacity:0; transform:scale(1.06); filter:blur(8px); } to{ opacity:1; transform:none; filter:none; } }
.banner{ animation:fxBanner 1s cubic-bezier(.2,.8,.2,1) both; }
.hero-badge, .hero h1, .hero p, .hero-actions, .hero-stats{ animation:fxUp .9s cubic-bezier(.2,.8,.2,1) both; }
.hero h1{ animation-delay:.12s; } .hero p{ animation-delay:.24s; } .hero-actions{ animation-delay:.36s; } .hero-stats{ animation-delay:.48s; }
.hero-visual{ animation:fxBanner 1.1s .2s cubic-bezier(.2,.8,.2,1) both; }
@keyframes fxFloat{ 0%,100%{ transform:translateY(0) rotate(-1.5deg); } 50%{ transform:translateY(-14px) rotate(1.5deg); } }
.hero-visual > img, .hero-visual > svg{ animation:fxFloat 5s ease-in-out infinite; }

/* Баннер: лёгкий параллакс управляется из JS через --fx-par */
.banner img{ transform:translate3d(0,var(--fx-par,0px),0) scale(1.08); will-change:transform; }

/* Модальные окна */
@keyframes fxFade{ from{ opacity:0; } to{ opacity:1; } }
@keyframes fxPop{ 0%{ opacity:0; transform:translateY(40px) scale(.88); } 60%{ opacity:1; transform:translateY(-6px) scale(1.02); } 100%{ transform:none; } }
.modal-overlay{ animation:fxFade .25s ease both; backdrop-filter:blur(4px); }
.modal-box{ animation:fxPop .5s cubic-bezier(.2,.9,.3,1) both; }

/* Чат */
@keyframes fxRing{ 0%{ box-shadow:0 8px 24px #000a, 0 0 0 0 #ff7a1a99; } 70%{ box-shadow:0 8px 24px #000a, 0 0 0 20px #ff7a1a00; } 100%{ box-shadow:0 8px 24px #000a, 0 0 0 0 #ff7a1a00; } }
.cw-fab{ animation:fxRing 2.4s ease-out infinite; transition:transform .2s cubic-bezier(.2,1.4,.3,1); }
.cw-fab:hover{ transform:scale(1.12) rotate(-6deg); }
.cw-fab:active{ transform:scale(.92); }
@keyframes fxPanel{ from{ opacity:0; transform:translateY(30px) scale(.9); transform-origin:100% 100%; } to{ opacity:1; transform:none; } }
.cw-panel.open{ animation:fxPanel .4s cubic-bezier(.2,.9,.3,1.1) both; }
@keyframes fxMsg{ from{ opacity:0; transform:translateY(12px) scale(.92); } to{ opacity:1; transform:none; } }
.cw-msg, .cw-opt{ animation:fxMsg .35s cubic-bezier(.2,.9,.3,1.2) both; }

/* Лента скинов */
.feed-card.enter{ animation:feedCardIn .6s cubic-bezier(.2,.9,.3,1.15); }

@media (prefers-reduced-motion:reduce){
  *, *::before, *::after{ animation:none !important; transition:none !important; }
  .fx-pre{ opacity:1; translate:none; scale:1; }
  .banner img{ transform:none; }
}