/* Фокси MOTION — второй слой WOW-эффектов поверх foxi-wow (сессия 26.10.2026).
   ПРАВИЛО ВЛАДЕЛЬЦА: вёрстку, тексты, цвета и маскота не меняем —
   только движение. Всё через transform/opacity/тени, отдельные свойства
   translate/scale не конфликтуют с inline-transform из foxi-wow.js.
   prefers-reduced-motion — слой выключен целиком. */

/* ---------- Полоса прогресса прокрутки ---------- */
.fxm-progress{position:fixed;left:0;top:0;height:3px;width:100%;z-index:10001;pointer-events:none;
  background:linear-gradient(90deg,#662d92,#b600a8 55%,#fcf951);transform-origin:0 50%;transform:scaleX(0)}

/* ---------- Объёмные кнопки ---------- */
.fxm-key{--fxm-side:rgba(60,25,90,.55);--fxm-d:5px;
  translate:0 var(--fxm-lift,0px);
  box-shadow:0 var(--fxm-d) 0 var(--fxm-side),0 calc(var(--fxm-d) + 10px) 22px -10px rgba(40,20,70,.45),var(--fxm-orig,0 0 0 transparent)!important;
  transition:translate .3s cubic-bezier(.22,1.4,.36,1),box-shadow .2s ease,filter .2s ease!important}
.fxm-key:hover{--fxm-lift:-3px;--fxm-d:8px;filter:brightness(1.04) saturate(1.05)}
.fxm-key:active,.fxm-key.fxm-down{--fxm-lift:5px;--fxm-d:0px;transition-duration:.06s!important}
.fxm-rel{position:relative}
.fxm-fx{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none;z-index:0}
.fxm-fx::before{content:"";position:absolute;top:-20%;bottom:-20%;width:45%;left:-60%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-18deg);transition:left .8s cubic-bezier(.16,1,.3,1)}
.fxm-key:hover .fxm-fx::before{left:120%}
.fxm-ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.5);transform:scale(0);animation:fxmRip .65s cubic-bezier(.16,1,.3,1) forwards}
@keyframes fxmRip{to{transform:scale(1);opacity:0}}
.fxm-burst{position:fixed;left:0;top:0;z-index:10002;pointer-events:none;font:900 20px/1 Montserrat,sans-serif;will-change:transform,opacity}

/* ---------- Заголовки: слова поднимаются по очереди ---------- */
.fxm-w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .02em .1em;margin:0 -.02em -.1em}
.fxm-wi{display:inline-block;transform:translateY(110%) rotate(4deg);opacity:0;filter:blur(4px);
  transition:transform .9s cubic-bezier(.16,1,.3,1),opacity .6s ease,filter .7s ease}
.fxm-split.fxm-in .fxm-wi{transform:none;opacity:1;filter:none}
/* ---------- Плашки-«глазки» над заголовками ---------- */
.fxm-pop{opacity:0;transform:scale(.6) translateY(10px);transition:opacity .5s ease,transform .7s cubic-bezier(.22,1.6,.36,1)}
.fxm-pop.fxm-in{opacity:1;transform:none}
.fxm-pop .fxb-dot{animation:fxmDot 1.8s ease-in-out infinite}
@keyframes fxmDot{50%{transform:scale(1.8);opacity:.5}}

/* ---------- Карточки: 3D-вход ---------- */
.wow-reveal{transform:perspective(1000px) translateY(46px) rotateX(12deg) scale(.97);filter:blur(3px);
  transition:opacity .9s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1),filter .8s ease!important}
.wow-reveal.is-in{filter:none}

/* ---------- Подсветка под курсором на карточках ---------- */
.fxm-spot{position:relative;isolation:isolate}
.fxm-spot::before{content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;opacity:0;transition:opacity .4s;
  background:radial-gradient(380px circle at var(--fxm-x,50%) var(--fxm-y,50%),rgba(182,0,168,.10),rgba(252,249,81,.10) 40%,transparent 70%)}
.fxm-spot:hover::before{opacity:1}
.fxm-tilt{transition:transform .45s cubic-bezier(.22,1,.36,1)}

/* ---------- Параллакс фото внутри рамок ---------- */
.fxm-par{scale:1.14;translate:0 var(--fxm-py,0px);will-change:translate}


@media (prefers-reduced-motion:reduce){
  .fxm-wi,.fxm-pop{opacity:1!important;transform:none!important;filter:none!important}
  .fxm-progress{display:none}
}