/* ===== KnowMate Landing Page Styles (Dark Theme) ===== */

/* 入场动画 */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes scaleIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}

.animate-fade-in {
  animation: fadeIn 0.6s ease-out forwards;
}

.animate-fade-in-up {
  animation: fadeInUp 0.6s ease-out forwards;
  opacity: 0;
}

.animate-scale-in {
  animation: scaleIn 0.5s ease-out forwards;
}

/* IntersectionObserver 入场动画 */
.animate-on-scroll {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.animate-on-scroll.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Stagger 延迟 */
.stagger-1 { transition-delay: 0s; }
.stagger-2 { transition-delay: 0.1s; }
.stagger-3 { transition-delay: 0.2s; }
.stagger-4 { transition-delay: 0.3s; }
.stagger-5 { transition-delay: 0.4s; }

/* 平滑滚动 */
html {
  scroll-behavior: smooth;
}

/* 自定义滚动条 */
::-webkit-scrollbar {
  width: 6px;
}
::-webkit-scrollbar-track {
  background: #090b10;
}
::-webkit-scrollbar-thumb {
  background: #30363d;
  border-radius: 3px;
}
::-webkit-scrollbar-thumb:hover {
  background: #484f58;
}

/* 移动端安全高度 */
@media (max-width: 767px) {
  .min-safe {
    min-height: 100vh;
    min-height: 100dvh;
  }
}

/* 聊天气泡模拟 */
.chat-bubble-received {
  background: #21262d;
  border: 1px solid #30363d;
  border-radius: 12px;
  border-bottom-left-radius: 4px;
}

.chat-bubble-sent {
  background: linear-gradient(135deg, #1f6feb, #238636);
  border-radius: 12px;
  border-bottom-right-radius: 4px;
}

/* 打字动画 */
.typing-dot {
  animation: typingBounce 1.4s infinite ease-in-out;
}
.typing-dot:nth-child(2) { animation-delay: 0.2s; }
.typing-dot:nth-child(3) { animation-delay: 0.4s; }

@keyframes typingBounce {
  0%, 60%, 100% { transform: translateY(0); }
  30% { transform: translateY(-6px); }
}

/* 胶卷光晕 */
.glow-green {
  box-shadow: 0 0 60px rgba(35, 134, 54, 0.15), 0 0 120px rgba(35, 134, 54, 0.05);
}

/* 统计数字 */
.stat-number {
  background: linear-gradient(135deg, #58a6ff, #3fb950);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* 场景卡片对比 */
.scene-before {
  background: #1c1015;
  border-color: #da3633;
}
.scene-now {
  background: #0d2137;
  border-color: #1f6feb;
}

/* 卡片 hover 效果 */
.card-hover {
  transition: all 0.3s ease;
  border: 1px solid #21262d;
}
.card-hover:hover {
  border-color: #30363d;
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(0,0,0,0.3);
}

/* 按钮样式 */
.btn-primary {
  background: linear-gradient(135deg, #238636, #2ea043);
  border: 1px solid #2ea043;
  transition: all 0.2s ease;
}
.btn-primary:hover {
  background: linear-gradient(135deg, #2ea043, #3fb950);
  box-shadow: 0 4px 20px rgba(46, 160, 67, 0.3);
}

.btn-outline {
  border: 1px solid #30363d;
  transition: all 0.2s ease;
}
.btn-outline:hover {
  border-color: #58a6ff;
  color: #58a6ff;
  background: rgba(88, 166, 255, 0.05);
}
