/* ============================================
   动效增强层：在 style.css 之后加载
   仅包含入场/hover/滚动动效，可整体移除而不影响配色与布局
   ============================================ */

/* ---- 1. Hero 入场动画 ---- */
.hero-content > * {
  opacity: 0;
  transform: translateY(24px);
  animation: heroFadeUp 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}

.hero-title { animation-delay: 0.1s; }
.hero-slogan { animation-delay: 0.22s; }
.hero-desc { animation-delay: 0.34s; }
.hero-actions { animation-delay: 0.46s; }

@keyframes heroFadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ---- 2. Hero 真实点位浮卡：入场 + 静置微浮 ---- */
.hero-spot-card {
  animation: spotCardIn 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) both;
}

.hero-spot-1 { animation-delay: 0.5s; }
.hero-spot-2 { animation-delay: 0.66s; }
.hero-spot-3 { animation-delay: 0.82s; }

@keyframes spotCardIn {
  from {
    opacity: 0;
    transform: translateY(18px) rotate(0deg);
  }
  to {
    opacity: 1;
  }
}

/* 入场结束后交给常驻浮动动画（保留各自的旋转角） */
@media (min-width: 1025px) {
  .hero-spot-1 { animation: spotCardIn 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) 0.5s both, spotFloatA 6s ease-in-out 1.4s infinite; }
  .hero-spot-2 { animation: spotCardIn 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) 0.66s both, spotFloatB 7s ease-in-out 1.6s infinite; }
  .hero-spot-3 { animation: spotCardIn 0.8s cubic-bezier(0.22, 0.61, 0.36, 1) 0.82s both, spotFloatC 6.5s ease-in-out 1.8s infinite; }
}

@keyframes spotFloatA {
  0%, 100% { transform: rotate(-5deg) translateY(0); }
  50% { transform: rotate(-5deg) translateY(-8px); }
}

@keyframes spotFloatB {
  0%, 100% { transform: rotate(3deg) translateY(0); }
  50% { transform: rotate(3deg) translateY(-7px); }
}

@keyframes spotFloatC {
  0%, 100% { transform: rotate(2.5deg) translateY(0); }
  50% { transform: rotate(2.5deg) translateY(-9px); }
}

/* ---- 3. 卡片 hover 效果增强 ---- */
.feature-card,
.channel-card,
.season-card,
.dest-card,
.spot-card,
.why-item,
.step {
  transition: transform 0.3s cubic-bezier(0.22, 0.61, 0.36, 1),
              box-shadow 0.3s ease,
              border-color 0.3s ease;
}

.feature-card:hover,
.channel-card:hover,
.season-card:hover,
.dest-card:hover,
.spot-card:hover,
.why-item:hover,
.step:hover {
  box-shadow: 0 14px 34px rgba(33, 29, 21, 0.1);
}

/* 卡片内图标 hover 放大 */
.feature-card:hover .feature-icon,
.channel-card:hover .channel-icon,
.why-item:hover .why-icon {
  transform: scale(1.12);
}

.feature-icon,
.channel-icon,
.why-icon {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* ---- 4. 按钮点击反馈 ---- */
.btn,
.footer-link,
.float-btn,
.modal-close {
  transition: transform 0.15s ease, background 0.2s ease, border-color 0.2s ease;
}

.btn:active,
.footer-link:active,
.float-btn:active,
.modal-close:active {
  transform: scale(0.96);
}

.btn-primary:hover svg {
  animation: arrowBounce 0.6s ease infinite alternate;
}

@keyframes arrowBounce {
  from { transform: translateX(0); }
  to { transform: translateX(5px); }
}

/* ---- 5. 步骤箭头上下浮动 ---- */
.step-arrow {
  animation: arrowFloat 1.8s ease-in-out infinite;
}

@keyframes arrowFloat {
  0%, 100% { transform: translateY(0); opacity: 0.6; }
  50% { transform: translateY(6px); opacity: 1; }
}

/* ---- 6. 引用区大引号视差呼吸 ---- */
.section-quote::before {
  animation: quoteBreath 6s ease-in-out infinite;
}

@keyframes quoteBreath {
  0%, 100% { opacity: 0.06; transform: scale(1); }
  50% { opacity: 0.12; transform: scale(1.03); }
}

/* ---- 7. CTA 卡片光晕呼吸（品牌黄调） ---- */
.cta-card::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 140%;
  height: 140%;
  background: radial-gradient(circle, rgba(255, 196, 0, 0.16) 0%, transparent 60%);
  transform: translate(-50%, -50%);
  animation: ctaGlow 4s ease-in-out infinite;
  pointer-events: none;
}

@keyframes ctaGlow {
  0%, 100% { opacity: 0.6; transform: translate(-50%, -50%) scale(1); }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.08); }
}

/* ---- 8. 悬浮按钮依次进入 ---- */
.float-dock .float-btn {
  opacity: 0;
  transform: translateX(20px);
  animation: dockSlideIn 0.45s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}

.float-dock .float-btn:nth-child(1) { animation-delay: 0.6s; }
.float-dock .float-btn:nth-child(2) { animation-delay: 0.72s; }
.float-dock .float-btn:nth-child(3) { animation-delay: 0.84s; }
.float-dock .float-btn:nth-child(4) { animation-delay: 0.96s; }

@keyframes dockSlideIn {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* ---- 9. 滚动 reveal stagger 延迟 ---- */
html.js [data-reveal] {
  transition: opacity 0.6s cubic-bezier(0.22, 0.61, 0.36, 1),
              transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
}

.features-grid .feature-card:nth-child(1) { transition-delay: 0ms; }
.features-grid .feature-card:nth-child(2) { transition-delay: 60ms; }
.features-grid .feature-card:nth-child(3) { transition-delay: 120ms; }
.features-grid .feature-card:nth-child(4) { transition-delay: 180ms; }
.features-grid .feature-card:nth-child(5) { transition-delay: 240ms; }
.features-grid .feature-card:nth-child(6) { transition-delay: 300ms; }
.features-grid .feature-card:nth-child(7) { transition-delay: 360ms; }
.features-grid .feature-card:nth-child(8) { transition-delay: 420ms; }

.channels-grid .channel-card:nth-child(1) { transition-delay: 0ms; }
.channels-grid .channel-card:nth-child(2) { transition-delay: 50ms; }
.channels-grid .channel-card:nth-child(3) { transition-delay: 100ms; }
.channels-grid .channel-card:nth-child(4) { transition-delay: 150ms; }
.channels-grid .channel-card:nth-child(5) { transition-delay: 200ms; }
.channels-grid .channel-card:nth-child(6) { transition-delay: 250ms; }
.channels-grid .channel-card:nth-child(7) { transition-delay: 300ms; }
.channels-grid .channel-card:nth-child(8) { transition-delay: 350ms; }
.channels-grid .channel-card:nth-child(9) { transition-delay: 400ms; }
.channels-grid .channel-card:nth-child(10) { transition-delay: 450ms; }

.seasons-grid .season-card:nth-child(1) { transition-delay: 0ms; }
.seasons-grid .season-card:nth-child(2) { transition-delay: 80ms; }
.seasons-grid .season-card:nth-child(3) { transition-delay: 160ms; }
.seasons-grid .season-card:nth-child(4) { transition-delay: 240ms; }

.dest-grid .dest-card:nth-child(1) { transition-delay: 0ms; }
.dest-grid .dest-card:nth-child(2) { transition-delay: 100ms; }
.dest-grid .dest-card:nth-child(3) { transition-delay: 200ms; }

.spots-grid .spot-card:nth-child(1) { transition-delay: 0ms; }
.spots-grid .spot-card:nth-child(2) { transition-delay: 60ms; }
.spots-grid .spot-card:nth-child(3) { transition-delay: 120ms; }
.spots-grid .spot-card:nth-child(4) { transition-delay: 180ms; }
.spots-grid .spot-card:nth-child(5) { transition-delay: 240ms; }
.spots-grid .spot-card:nth-child(6) { transition-delay: 300ms; }

.why-grid .why-item:nth-child(1) { transition-delay: 0ms; }
.why-grid .why-item:nth-child(2) { transition-delay: 80ms; }
.why-grid .why-item:nth-child(3) { transition-delay: 160ms; }
.why-grid .why-item:nth-child(4) { transition-delay: 240ms; }
.why-grid .why-item:nth-child(5) { transition-delay: 320ms; }
.why-grid .why-item:nth-child(6) { transition-delay: 400ms; }

.steps .step:nth-child(1) { transition-delay: 0ms; }
.steps .step:nth-child(3) { transition-delay: 150ms; }
.steps .step:nth-child(5) { transition-delay: 300ms; }

/* ---- 10. 页面加载时导航 logo 轻微弹跳 ---- */
.nav-logo-img {
  animation: logoPop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) 0.2s both;
}

@keyframes logoPop {
  0% { transform: scale(0.6); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

/* ---- 11. 减少动画偏好 ---- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}