/* ============================================================
   Spacejeux — animations.css
   Оживление статичного макета: аврора, шары, сканер, ховеры,
   scroll-reveal, меню и модалки. Уважает prefers-reduced-motion.
   ============================================================ */

/* ---------- Scroll reveal (класс вешает JS; без JS всё видно) ---------- */
.reveal {
  opacity: 0;
  transform: translateY(22px);
}
.reveal.is-in {
  opacity: 1;
  transform: none;
  transition:
    opacity .6s cubic-bezier(.22, .61, .36, 1),
    transform .6s cubic-bezier(.22, .61, .36, 1);
  transition-delay: var(--reveal-delay, 0s);
}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; }
  .reveal.is-in { transition: none; }
}

@media (prefers-reduced-motion: no-preference) {

  /* ---------- HERO: аврора дышит ---------- */
  .aurora__glow--green {
    animation: aurora-drift-a 11s ease-in-out infinite alternate;
  }
  .aurora__glow--teal {
    animation: aurora-drift-b 13s ease-in-out infinite alternate;
  }
  .aurora__glow--warm {
    animation: aurora-pulse 8s ease-in-out infinite alternate;
  }
  @keyframes aurora-drift-a {
    from { transform: translate(0, 0) scale(1); opacity: .5; }
    50%  { opacity: .62; }
    to   { transform: translate(4%, 6%) scale(1.08); opacity: .55; }
  }
  @keyframes aurora-drift-b {
    from { transform: translate(0, 0) scale(1.05); opacity: .46; }
    50%  { opacity: .58; }
    to   { transform: translate(-5%, 4%) scale(1); opacity: .5; }
  }
  @keyframes aurora-pulse {
    from { transform: scale(.94); opacity: .2; }
    to   { transform: scale(1.1);  opacity: .34; }
  }

  /* звёзды мерцают */
  .aurora__stars::before {
    animation: star-twinkle 3.4s ease-in-out infinite alternate;
  }
  @keyframes star-twinkle {
    from { opacity: .55; }
    45%  { opacity: 1; }
    to   { opacity: .7; }
  }

  /* линия хребта переливается */
  .aurora__ridge {
    background-size: 200% 100%;
    animation: ridge-sheen 6s linear infinite;
  }
  @keyframes ridge-sheen {
    from { background-position: 0% 0; }
    to   { background-position: 200% 0; }
  }

  /* шары в hero плавают (стаггер по nth-child) */
  .aurora__ball {
    animation: ball-float 5.2s ease-in-out infinite;
  }
  .aurora__row:nth-child(1) .aurora__ball:nth-child(1) { animation-delay: 0s; }
  .aurora__row:nth-child(1) .aurora__ball:nth-child(2) { animation-delay: .55s; }
  .aurora__row:nth-child(1) .aurora__ball:nth-child(3) { animation-delay: 1.1s; }
  .aurora__row:nth-child(1) .aurora__ball:nth-child(4) { animation-delay: 1.65s; }
  .aurora__row:nth-child(2) .aurora__ball:nth-child(1) { animation-delay: .3s; }
  .aurora__row:nth-child(2) .aurora__ball:nth-child(2) { animation-delay: .85s; }
  .aurora__row:nth-child(2) .aurora__ball:nth-child(3) { animation-delay: 1.4s; }
  @keyframes ball-float {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-9px); }
  }
  .aurora__ball:hover { transform: none; }

  /* выбор числа в pick-панели — мягкий поп */
  .pick-cell { transition: background-color .12s ease, color .12s ease, transform .12s ease; }
  .pick-cell:active { transform: scale(.9); }
  .pick-cell.is-picked { animation: pick-pop .28s cubic-bezier(.34, 1.56, .64, 1); }
  @keyframes pick-pop {
    0%   { transform: scale(.7); }
    70%  { transform: scale(1.12); }
    100% { transform: scale(1); }
  }

  /* ---------- Чекер: лазер сканера ---------- */
  .verify-step__laser {
    animation: laser-scan 2.4s ease-in-out infinite;
    box-shadow: 0 0 8px rgba(13, 148, 136, .55);
  }
  @keyframes laser-scan {
    0%, 100% { transform: translateY(-16px); }
    50%      { transform: translateY(16px); }
  }
  .verify-step__check { animation: check-beat 2.4s ease-in-out infinite; }
  @keyframes check-beat {
    0%, 86%, 100% { transform: scale(1); }
    92%           { transform: scale(1.12); }
  }
  .verify-card__arrow svg { animation: arrow-nudge 2.4s ease-in-out infinite; }
  @keyframes arrow-nudge {
    0%, 100% { transform: translateX(0); opacity: .8; }
    50%      { transform: translateX(4px); opacity: 1; }
  }

  /* ---------- Карточки: ховер-подъём ---------- */
  .game-card, .result-card, .instant-card,
  .gm-card, .gm-icard, .dg-card, .ig-card, .lr-card, .ab-card {
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  }
  .game-card:hover, .result-card:hover, .instant-card:hover,
  .gm-card:hover, .gm-icard:hover, .dg-card:hover, .ig-card:hover,
  .lr-card:hover, .ab-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 18px 36px -18px rgba(9, 30, 47, .22);
  }

  /* шары в артворках карточек чуть подпрыгивают на ховер карточки */
  .game-art .ball, .game-art__tiles span,
  .game-art__mainball, .game-art__markers span {
    transition: transform .3s cubic-bezier(.34, 1.56, .64, 1);
  }
  .game-card:hover .game-art .ball,
  .game-card:hover .game-art__tiles span { transform: translateY(-4px); }
  .game-card:hover .game-art__mainball { transform: scale(1.06); }

  /* instant-билеты выравниваются и бликуют на ховер */
  .iticket { transition: transform .35s cubic-bezier(.22, .61, .36, 1); position: relative; overflow: hidden; }
  .instant-card:hover .iticket--tilt-r,
  .ig-card:hover .iticket--tilt-r,
  .gm-icard:hover .iticket--tilt-r { transform: rotate(2deg) translateY(-3px); }
  .instant-card:hover .iticket--tilt-l,
  .ig-card:hover .iticket--tilt-l,
  .gm-icard:hover .iticket--tilt-l { transform: rotate(-2deg) translateY(-3px); }
  .iticket::before {
    content: '';
    position: absolute; top: -60%; bottom: -60%; left: -80%;
    width: 45%;
    background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, .18) 50%, transparent 100%);
    transform: skewX(-18deg);
    pointer-events: none;
    transition: left .7s ease;
  }
  .instant-card:hover .iticket::before,
  .ig-card:hover .iticket::before,
  .gm-icard:hover .iticket::before { left: 140%; }

  /* ---------- Play Bright: пульс кольца поддержки ---------- */
  .support-node__circle--accent { animation: support-pulse 2.6s ease-out infinite; }
  @keyframes support-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(9, 162, 159, .28), 0 0 0 6px rgba(9, 162, 159, .06); }
    70%  { box-shadow: 0 0 0 14px rgba(9, 162, 159, 0), 0 0 0 6px rgba(9, 162, 159, .04); }
    100% { box-shadow: 0 0 0 0 rgba(9, 162, 159, 0), 0 0 0 6px rgba(9, 162, 159, .06); }
  }

  /* ---------- Кнопки: лёгкий подъём ---------- */
  .btn--primary:hover { transform: translateY(-1px); box-shadow: 0 8px 18px -8px rgba(13, 148, 136, .55); }
  .btn--primary:active { transform: translateY(1px); box-shadow: none; }

  /* ---------- Мега-меню ---------- */
  .mega-menu {
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity .22s ease, transform .22s ease;
    pointer-events: none;
  }
  .mega-menu.is-in {
    opacity: 1;
    transform: none;
    pointer-events: auto;
  }
  .mega-menu__item { transition: background-color .15s ease, transform .15s ease; }
  .mega-menu__item:hover { transform: translateX(3px); }

  /* ---------- Мобильное меню ---------- */
  .mobile-menu {
    opacity: 0;
    transform: translateX(6%);
    transition: opacity .25s ease, transform .25s ease;
  }
  .mobile-menu.is-in { opacity: 1; transform: none; }

  /* ---------- Модалки ---------- */
  .modal__backdrop { opacity: 0; transition: opacity .25s ease; }
  .modal__card {
    opacity: 0;
    transform: translateY(16px) scale(.96);
    transition: opacity .28s cubic-bezier(.22, .61, .36, 1), transform .28s cubic-bezier(.22, .61, .36, 1);
  }
  .modal.is-in .modal__backdrop { opacity: 1; }
  .modal.is-in .modal__card { opacity: 1; transform: none; }
  .modal__icon-circle { animation: none; }
  .modal.is-in .modal__icon-circle { animation: icon-ring .5s cubic-bezier(.34, 1.56, .64, 1) .15s backwards; }
  @keyframes icon-ring {
    from { transform: scale(.6); opacity: 0; }
    to   { transform: scale(1); opacity: 1; }
  }

  /* ---------- Ссылки-стрелки ---------- */
  .link-more svg { transition: transform .2s ease; }
  .link-more:hover svg { transform: translateX(3px); }

  /* ---------- Результат проверки билета ---------- */
  .ticket-result:not([hidden]) { animation: result-in .35s ease; }
  @keyframes result-in {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
  }

} /* /prefers-reduced-motion */