/* ══════════════════════════════════════════════════════════════
   АНИМАЦИИ
   ══════════════════════════════════════════════════════════════ */

/* ── SCROLL ANIMATIONS ── */
.fade-up { 
  opacity: 0; 
  transform: translateY(30px); 
  transition: opacity .6s ease, transform .6s ease; 
}

.fade-up.visible { 
  opacity: 1; 
  transform: translateY(0); 
}

.fade-up-delay-1 { 
  transition-delay: .1s; 
}

.fade-up-delay-2 { 
  transition-delay: .2s; 
}

.fade-up-delay-3 { 
  transition-delay: .3s; 
}

.fade-up-delay-4 { 
  transition-delay: .4s; 
}

.fade-up-delay-5 { 
  transition-delay: .5s; 
}

/* ── KEYFRAME ANIMATIONS ── */

@keyframes pulse {
  0%, 100% { 
    opacity: 1; 
    transform: scale(1); 
  }
  50% { 
    opacity: .5; 
    transform: scale(.8); 
  }
}

@keyframes barGrow { 
  from { 
    transform: scaleY(0); 
    transform-origin: bottom; 
  } 
  to { 
    transform: scaleY(1); 
  } 
}

@keyframes float {
  0%,100% { 
    transform: translateY(0); 
  }
  50% { 
    transform: translateY(-8px); 
  }
}

@keyframes msgIn {
  from { 
    opacity: 0; 
    transform: translateY(12px) scale(.95); 
  }
  to   { 
    opacity: 1; 
    transform: none; 
  }
}

@keyframes typingDot {
  0%,60%,100% { 
    transform: translateY(0); 
    opacity: .5; 
  }
  30% { 
    transform: translateY(-5px); 
    opacity: 1; 
  }
}

@keyframes fadeInDesc { 
  from { 
    opacity:0; 
    transform: translateY(6px); 
  } 
  to { 
    opacity:1; 
    transform: none; 
  } 
}

@keyframes pulseFlow { 
  0% { 
    left: 0; 
    opacity: 1; 
  } 
  80% { 
    left: 90%; 
    opacity: 0.6; 
  } 
  100% { 
    left: 100%; 
    opacity: 0; 
  } 
}

@keyframes orbitSpin { 
  from { 
    transform: translate(-50%, -50%) rotate(0deg); 
  } 
  to { 
    transform: translate(-50%, -50%) rotate(360deg); 
  } 
}

@keyframes orbitCounterSpin { 
  from { 
    transform: rotate(0deg); 
  } 
  to { 
    transform: rotate(-360deg); 
  } 
}

@keyframes modTabProgress { 
  from { 
    width: 0; 
  } 
  to { 
    width: 100%; 
  } 
}

@keyframes netRingPulse {
  0%   { 
    transform: scale(0.85); 
    opacity: 0.8; 
  }
  100% { 
    transform: scale(1.4);  
    opacity: 0; 
  }
}

/* ══════════════════════════════════════════════════════════════
   АДАПТИВНЫЕ НАСТРОЙКИ
   ══════════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
  .hero-inner { 
    grid-template-columns: 1fr; 
    gap: 40px; 
  }
  
  .hero-visual { 
    margin: 0 auto; 
    width: 100%; 
    max-width: 560px; 
  }
  
  .float-badge { 
    display: none; 
  }
  
  .mod-tabs-layout { 
    grid-template-columns: 1fr; 
    min-height: 0; 
  }
  
  .mod-tabs-left { 
    position: static !important; 
    height: auto !important; 
    overflow: visible !important; 
  }
  
  .mod-preview-area { 
    min-height: 360px !important; 
  }
}

@media (max-width: 768px) {
  .hero-stats { 
    gap: 20px; 
    flex-wrap: wrap; 
  }
  
  .tg-float-badge-top { 
    display: none; 
  }
  
  .iphone-bezel { 
    width: min(320px, calc(100vw - 48px)); 
  }
  
  .mod-tabs-left { 
    height: auto !important; 
    overflow: visible !important; 
  }
  
  .mod-preview-area { 
    min-height: 280px !important; 
  }
  
  .payment-inner { 
    gap: 32px; 
  }
  
  .hero-visual { 
    max-width: 100%; 
  }
  
  .db-metrics { 
    grid-template-columns: 1fr 1fr 1fr; 
    gap: 6px; 
  }
  
  .db-chart { 
    margin-bottom: 14px; 
  }
  
  .chart-bars { 
    height: 48px !important; 
    gap: 4px; 
  }
  
  .db-table th { 
    font-size: 9px; 
    padding-bottom: 5px; 
  }
  
  .db-table td { 
    font-size: 11px; 
    padding: 4px 0; 
  }
  
  .metric-label { 
    font-size: 9px; 
  }
  
  .metric-val { 
    font-size: 14px; 
  }
}

@media (max-width: 480px) {
  .hero-btns { 
    flex-direction: column; 
  }
  
  .viz-connections, 
  .viz-orbit, 
  .viz-netmap, 
  .viz-eco { 
    transform: scale(0.78); 
    transform-origin: center; 
  }
  
  .section-title { 
    font-size: clamp(24px, 7vw, 36px) !important; 
  }
  
  .hero-title { 
    font-size: clamp(32px, 8vw, 48px) !important; 
  }
}