/* Фокси WOW — стили scroll-эффектов и 3D-маскота (все страницы) */

/* ---------- Scroll-reveal ---------- */
.wow-reveal {
  opacity: 0;
  transform: translateY(34px) scale(.985);
  transition:
    opacity .8s cubic-bezier(.25, .1, .25, 1),
    transform .8s cubic-bezier(.25, .1, .25, 1);
  transition-delay: inherit;
  will-change: opacity, transform;
}
.wow-reveal.is-in {
  opacity: 1;
  transform: none;
}

/* ---------- Магнитные кнопки ---------- */
.wow-magnet {
  will-change: transform;
}

/* ---------- 3D-tilt карточек ---------- */
.wow-tilt {
  transition: transform .35s cubic-bezier(.22, 1, .36, 1);
  transform-style: preserve-3d;
  position: relative;
}
.wow-tilt::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  opacity: 0;
  transition: opacity .35s;
  background: radial-gradient(
    circle at var(--glare-x, 50%) var(--glare-y, 50%),
    rgba(252, 249, 81, .14), transparent 55%
  );
}
.wow-tilt:hover::after {
  opacity: 1;
}

/* ---------- Входная анимация hero-заголовка ---------- */
.wow-hero-in {
  animation: wowHeroIn 1.1s cubic-bezier(.16, 1, .3, 1) .1s both;
}
.wow-hero-in .fxb-life {
  background: linear-gradient(100deg, #fcf951 10%, #ffd23f 45%, #ff9a3d 90%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  background-size: 220% 100%;
  animation: wowHeroLife 5s ease-in-out 1.2s infinite;
}
@keyframes wowHeroIn {
  from { opacity: 0; transform: translateY(46px); filter: blur(6px); }
  to   { opacity: 1; transform: none; filter: none; }
}
@keyframes wowHeroLife {
  0%, 100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}

/* ---------- 3D-маскот Фокси ---------- */
.foxi3d {
  position: fixed;
  right: 14px;
  bottom: 14px;
  width: 210px;
  height: 250px;
  z-index: 9990;
  pointer-events: none;
  opacity: 0;
  transform: translateY(24px) scale(.9);
  transition: opacity .7s ease, transform .7s cubic-bezier(.22, 1.4, .36, 1);
}
.foxi3d.is-ready {
  opacity: 1;
  transform: none;
}
.foxi3d__canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: auto;
  cursor: pointer;
  touch-action: manipulation;
}
.foxi3d__shadow {
  position: absolute;
  left: 50%;
  bottom: 10px;
  width: 62%;
  height: 20px;
  transform: translateX(-50%);
  background: radial-gradient(ellipse at center, rgba(30, 20, 51, .38), transparent 68%);
  pointer-events: none;
}
.foxi3d__bubble {
  position: absolute;
  top: -6px;
  right: 82%;
  min-width: 150px;
  max-width: 210px;
  padding: 10px 14px;
  background: #fff;
  color: #241a36;
  font: 600 13.5px/1.35 Montserrat, sans-serif;
  border-radius: 16px 16px 4px 16px;
  box-shadow: 0 8px 26px rgba(57, 40, 82, .22);
  border: 2px solid #662d92;
  pointer-events: auto;
  cursor: pointer;
  opacity: 0;
  transform: translateY(8px) scale(.85);
  transform-origin: bottom right;
  transition: opacity .3s, transform .3s cubic-bezier(.22, 1.4, .36, 1);
}
.foxi3d__bubble.is-on {
  opacity: 1;
  transform: none;
}
.foxi3d__bubble:hover {
  border-color: #b600a8;
}

@media (max-width: 760px) {
  .foxi3d {
    width: 130px;
    height: 158px;
    right: 8px;
    bottom: 8px;
  }
  .foxi3d__bubble {
    min-width: 120px;
    max-width: 150px;
    font-size: 12px;
    padding: 8px 11px;
  }
}

/* ---------- Reduced motion: всё статично ---------- */
@media (prefers-reduced-motion: reduce) {
  .wow-reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .wow-hero-in, .wow-hero-in .fxb-life {
    animation: none;
  }
}