/* ==========================================================================
   RUSOV ACADEMY — DESIGN SYSTEM 2.0 / ANIMATIONS
   Всё движение — только transform/opacity (GPU-friendly).
   Уважает prefers-reduced-motion.
   ========================================================================== */

/* ---------- Базовые появления ---------- */
@keyframes ds-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes ds-fade-up {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes ds-fade-up-soft {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes ds-scale-in {
  from { opacity: 0; transform: scale(.92); }
  to   { opacity: 1; transform: scale(1); }
}

@keyframes ds-slide-in-left {
  from { opacity: 0; transform: translateX(-14px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* Экран уходит вперёд (ощущение путешествия вглубь) */
@keyframes ds-screen-in {
  from { opacity: 0; transform: translateY(26px) scale(.985); filter: blur(6px); }
  to   { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

/* ---------- Акценты ---------- */
@keyframes ds-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50%      { transform: scale(1.04); opacity: .85; }
}

@keyframes ds-blink {
  0%, 100% { opacity: 1; }
  50%      { opacity: .25; }
}

@keyframes ds-typing {
  from { width: 0; }
  to   { width: 100%; }
}

/* Бегущий блик по CTA */
@keyframes ds-shine {
  0%   { transform: translateX(-120%) skewX(-18deg); }
  60%, 100% { transform: translateX(240%) skewX(-18deg); }
}

/* Шиммер на прогресс-баре */
@keyframes ds-shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

/* ---------- Аврора: медленный дрейф фоновых пятен ---------- */
@keyframes ds-aurora-a {
  0%, 100% { transform: translate(-8%, -4%) scale(1); }
  50%      { transform: translate(10%, 8%) scale(1.15); }
}
@keyframes ds-aurora-b {
  0%, 100% { transform: translate(6%, 10%) scale(1.1); }
  50%      { transform: translate(-10%, -6%) scale(.95); }
}
@keyframes ds-aurora-c {
  0%, 100% { transform: translate(0%, 6%) scale(1); rotate: 0deg; }
  50%      { transform: translate(-6%, -10%) scale(1.2); rotate: 8deg; }
}

/* ---------- Театр вычисления ---------- */
@keyframes ds-ring-spin {
  to { transform: rotate(360deg); }
}

@keyframes ds-bar-grow {
  from { transform: scaleY(0); }
  to   { transform: scaleY(1); }
}

@keyframes ds-check-pop {
  0%   { opacity: 0; transform: scale(.4); }
  70%  { opacity: 1; transform: scale(1.15); }
  100% { opacity: 1; transform: scale(1); }
}

/* Галочка: прорисовка контура */
@keyframes ds-check-draw {
  to { stroke-dashoffset: 0; }
}

/* ---------- Результат: драматическое раскрытие ---------- */
@keyframes ds-reveal {
  0%   { opacity: 0; transform: translateY(30px) scale(.96); filter: blur(10px); }
  100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); }
}

@keyframes ds-glow-breathe {
  0%, 100% { box-shadow: 0 0 24px rgba(194,112,62,.18); }
  50%      { box-shadow: 0 0 52px rgba(194,112,62,.38); }
}

/* Мягкое «дыхание» иконки-метафоры */
@keyframes ds-float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}

/* Подсказка «листай/жми» */
@keyframes ds-nudge {
  0%, 100% { transform: translateY(0); opacity: .6; }
  50%      { transform: translateY(5px); opacity: 1; }
}

/* ---------- Утилиты- классы ---------- */
.ds-anim-fade-up    { animation: ds-fade-up .55s var(--ease-out-expo) both; }
.ds-anim-scale-in   { animation: ds-scale-in .45s var(--ease-spring) both; }
.ds-anim-reveal     { animation: ds-reveal .7s var(--ease-out-expo) both; }

/* Каскад: дети появляются друг за другом */
.ds-stagger > * { opacity: 0; animation: ds-fade-up .5s var(--ease-out-expo) forwards; }
.ds-stagger > *:nth-child(1) { animation-delay: .05s; }
.ds-stagger > *:nth-child(2) { animation-delay: .12s; }
.ds-stagger > *:nth-child(3) { animation-delay: .19s; }
.ds-stagger > *:nth-child(4) { animation-delay: .26s; }
.ds-stagger > *:nth-child(5) { animation-delay: .33s; }
.ds-stagger > *:nth-child(6) { animation-delay: .40s; }
.ds-stagger > *:nth-child(7) { animation-delay: .47s; }
.ds-stagger > *:nth-child(8) { animation-delay: .54s; }

/* ---------- Уважение к reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}