/*
  Motion-система: тайминги, easing и ключевые кадры анимаций сайта.
  Общий стиль движения Silvana: мягкое появление снизу-вверх с блюром
  (эффект "проявления в фокусе"), используется почти на каждой секции
  при скролле (data-reveal / .scroll-reveal).
*/

:root {
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --motion-ease: cubic-bezier(.16, 1, .3, 1);
  --motion-fast: .18s;
  --motion-medium: .28s;
  --motion-slow: .72s;
  --dur-micro: .2s;
}

/* Появление секции при попадании во вьюпорт (основной паттерн сайта) */
@media (prefers-reduced-motion: no-preference) {
  .scroll-reveal {
    transition: opacity var(--motion-slow) var(--motion-ease) var(--reveal-delay, 0s),
                transform var(--motion-slow) var(--motion-ease) var(--reveal-delay, 0s);
  }
  .scroll-reveal[data-reveal-pending="true"] {
    opacity: 0;
    transform: translateY(8px);
  }
}

@keyframes page-section-reveal {
  0%  { opacity: 0; filter: blur(2px); transform: translateY(8px); }
  to  { opacity: 1; filter: blur(0);   transform: translateY(0); }
}

/* Тонкая полоса-"блик", пробегающая при смене страницы */
@keyframes page-transition-sheen {
  0%  { opacity: 0;   transform: scaleX(0); }
  62% { opacity: .7;  transform: scaleX(1); }
  to  { opacity: 0;   transform: scaleX(1); }
}

/* Появление хедера */
@keyframes header-reveal {
  0% { opacity: 0; filter: blur(8px); transform: translateY(-10px); }
  to { opacity: 1; filter: blur(0);   transform: translateY(0); }
}
@keyframes header-line-down  { 0% { opacity: 0; transform: scaleY(0); } 16% { opacity: 1; } to { opacity: 1; transform: scaleY(1); } }
@keyframes header-line-right { 0% { opacity: 0; transform: scaleX(0); } 16% { opacity: 1; } to { opacity: var(--header-line-opacity, 1); transform: scaleX(1); } }

/* "Премиальное" мягкое появление крупных блоков/визуалов hero */
@keyframes premium-soft-reveal {
  0% { opacity: 0; filter: blur(12px); transform: translateY(18px) scale(.985); }
  to { opacity: 1; filter: blur(0);    transform: translateY(0) scale(1); }
}
@keyframes premium-visual-reveal {
  0% { opacity: 0; filter: blur(16px); clip-path: inset(0 0 0 18% round 1.5rem); transform: translateX(54px) scale(.965); }
  to { opacity: 1; filter: blur(0);    clip-path: inset(0 0 0 0% round 1.5rem);  transform: translateX(0) scale(1); }
}

@keyframes footer-reveal { 0% { opacity: 0; filter: blur(2px); } to { opacity: 1; filter: blur(0); } }

/* Выпадающее мега-меню */
@keyframes mega-menu-in {
  0%  { opacity: 0; clip-path: inset(0 0 18%); transform: translateY(-10px) scaleY(.985); }
  55% { opacity: 1; clip-path: inset(0);       transform: translateY(1px) scaleY(1); }
  to  { opacity: 1; clip-path: inset(0);       transform: translateY(0); }
}
@keyframes mega-menu-scrim-in { 0% { opacity: 0; } to { opacity: 1; } }

/* Рост снизу вверх (для графиков/полос) */
@keyframes grow-up { 0% { clip-path: inset(100% 0 0); } to { clip-path: inset(0); } }

/* Декоративные motif-анимации ("дерево"/сеть узлов — визуализация Canton/агентов) */
@keyframes tree-pulse       { 0%, to { opacity: .88; transform: scale(1); } 50% { opacity: 1; transform: scale(1.03); } }
@keyframes tree-orbit-y     { to { transform: rotateY(360deg); } }
@keyframes tree-orbit-y-rev { to { transform: rotateY(-360deg); } }

/* Иконки */
@keyframes icon-in-up   { 0% { opacity: 0; transform: translateY(18px); }  to { opacity: 1; transform: translateY(0); } }
@keyframes icon-in-down { 0% { opacity: 0; transform: translateY(-18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes icon-float   { 0%, to { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes icon-sonar   { 0% { opacity: .55; transform: scale(1); } to { opacity: 0; transform: scale(1.7); } }
@keyframes icon-spin-y  { to { transform: rotateY(360deg); } }