/* ===== 动画特效（不影响布局） ===== */

/* ---------- 页面加载淡入 ---------- */
body {
  opacity: 0;
  animation: pageFadeIn 0.6s ease forwards;
}

@keyframes pageFadeIn {
  to { opacity: 1; }
}

/* ---------- 滚动渐入（Scroll Reveal） ---------- */
.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}

.reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

/* 交错延迟 */
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

/* ---------- 卡片悬浮效果 ---------- */
.solution-grid article,
.case-grid article,
.three-cards article,
.lifecycle-grid article,
.process-grid article,
.consult-image-cards article {
  transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94),
              box-shadow 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  will-change: transform;
}

.solution-grid article:hover,
.case-grid article:hover,
.three-cards article:hover,
.lifecycle-grid article:hover,
.process-grid article:hover,
.consult-image-cards article:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 40px rgba(31, 65, 108, 0.12);
}

/* ---------- 图片悬浮缩放 ---------- */
.case-grid article > img,
.consult-image-cards article > img,
.about-visual,
.feature-mosaic > img {
  transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.case-grid article:hover > img,
.consult-image-cards article:hover > img,
.about-visual:hover,
.feature-mosaic > img:hover {
  transform: scale(1.05);
}

/* 确保溢出隐藏 */
.case-grid article,
.consult-image-cards article,
.feature-mosaic {
  overflow: hidden;
}

/* ---------- 标题下划线渐变动画 ---------- */
.section-title::after,
.about-copy h2::after {
  background: linear-gradient(90deg, var(--color-blue), #38bdf8, #818cf8, var(--color-blue));
  background-size: 300% 100%;
  animation: shimmer 3s ease-in-out infinite;
}

@keyframes shimmer {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* ---------- 服务 Tab 图片切换过渡 ---------- */
.service-art > img {
  transition: opacity 0.45s ease;
}

/* ---------- 导航链接悬浮动效 ---------- */
.nav-links a {
  transition: color 0.25s ease;
}

.nav-links a::after {
  content: "";
  position: absolute;
  bottom: -4px;
  left: 50%;
  width: 28px;
  height: 3px;
  background: #1677ff;
  border-radius: 2px;
  transform: translateX(-50%) scaleX(0);
  transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.nav-links a:hover::after,
.nav-links a.active::after {
  transform: translateX(-50%) scaleX(1);
}

/* ---------- 光晕脉冲 ---------- */
@keyframes pulseGlow {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.4);
  }
  50% {
    box-shadow: 0 0 0 12px rgba(37, 99, 235, 0);
  }
}

.contact-banner-action {
  animation: pulseGlow 2.5s ease-in-out infinite;
}

.service-choice.active {
  animation: pulseGlow 2.5s ease-in-out infinite;
}

/* ---------- Hero 区域视差（由 JS 驱动） ---------- */
.hero-ai,
.hero-consultant {
  transition: background-position 0.15s ease-out;
}

/* ---------- 品牌 Logo 微动 ---------- */
.brand-logo {
  transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.brand:hover .brand-logo {
  transform: rotate(-5deg) scale(1.08);
}

/* ---------- Metric 图标悬浮弹跳 ---------- */
.metric-icon {
  transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}

.metric:hover .metric-icon {
  transform: scale(1.2);
}

/* ---------- 按钮 hover 过渡 ---------- */
button,
a {
  transition: opacity 0.2s ease, transform 0.2s ease;
}

button:hover,
a:hover {
  opacity: 0.88;
}

/* ---------- 移动端减弱动画 ---------- */
@media (max-width: 720px) {
  .reveal {
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
  }

  .solution-grid article:hover,
  .case-grid article:hover,
  .three-cards article:hover,
  .lifecycle-grid article:hover,
  .process-grid article:hover,
  .consult-image-cards article:hover {
    transform: translateY(-4px);
  }

  .case-grid article:hover > img,
  .consult-image-cards article:hover > img,
  .about-visual:hover,
  .feature-mosaic > img:hover {
    transform: scale(1.03);
  }
}

/* 平板及以下 - 下拉导航禁用 hover 下划线 */
@media (max-width: 1100px) {
  .nav-links a::after {
    display: none;
  }
}

/* 减少动画偏好 */
@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .section-title::after,
  .about-copy h2::after {
    animation: none;
  }

  .contact-banner-action,
  .service-choice.active {
    animation: none;
  }

  body {
    animation: none;
    opacity: 1;
  }
}