/* ==========================================================
   SCROLL ANIMATIONS
   Не меняет шрифты, цвета и размеры — только opacity/transform
   ========================================================== */

html {
  scroll-behavior: smooth;
}

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

  /* базовое состояние — блок скрыт и слегка смещён */
  .reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: opacity, transform;
  }
  .reveal.reveal-visible {
    opacity: 1;
    transform: translateY(0);
  }

  /* вариант выезда слева / справа (для чётных/нечётных блоков) */
  .reveal-left  { transform: translateX(-60px); }
  .reveal-left.reveal-visible  { transform: translateX(0); }

  .reveal-right { transform: translateX(60px); }
  .reveal-right.reveal-visible { transform: translateX(0); }

  /* лёгкое масштабирование, например для карточек */
  .reveal-scale { transform: scale(0.92); }
  .reveal-scale.reveal-visible { transform: scale(1); }

  /* заголовки и текст — тот же эффект, но чуть быстрее и мягче,
     чтобы длинные текстовые страницы (О нас, Тренировки) не выглядели "тяжело" */
  h1.reveal, h2.reveal, h3.reveal,
  p.reveal, blockquote.reveal {
    transform: translateY(22px);
    transition-duration: 0.55s;
  }

  /* карта в iframe: анимируем обёртку, не сам iframe, чтобы избежать
     артефактов рендеринга Google Maps во время transform */
  iframe.reveal {
    transform: scale(0.97);
  }

  /* элементы внутри блока (li, tr) появляются по очереди */
  .reveal-stagger > * {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.55s ease, transform 0.55s ease;
  }
  .reveal-stagger.reveal-visible > * {
    opacity: 1;
    transform: translateY(0);
  }
}

/* если у пользователя включена настройка "уменьшить анимацию" — просто показываем сразу */
@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-stagger > * {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* лёгкая интерактивность карточек при наведении/тапе — без смены размера и цвета фона */
.card_box {
  transition: box-shadow 0.35s ease, transform 0.35s ease;
}
.card_box:hover,
.card_box:focus-within {
  transform: translateY(-6px);
  box-shadow: 0 20px 35px 0 rgb(41 41 41 / 15%);
}

/* лёгкая анимация строк таблицы цен при наведении */
.table tbody tr {
  transition: background-color 0.25s ease;
}
.table tbody tr:hover {
  background-color: rgba(25, 40, 87, 0.04);
}

/* кнопка чуть "пружинит" при наведении, дополнительно к уже существующему стилю */
a.button {
  transform: translateY(0);
  transition: background-color .8s, transform .25s ease;
}
a.button:hover {
  transform: translateY(-3px);
}
