/* ============================================================
   ZD-Hermes AI — 高端企业官网设计升级 v3
   对标 Google AI / OpenAI 企业官网
   特点：极简、大气、专业、信任感
   ============================================================ */

/* --- 全局高端字体 --- */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&family=Noto+Sans+SC:wght@400;500;700;900&display=swap');

/* --- 全局动画关键帧 --- */
@keyframes fadeInUp {
  from { opacity:0; transform:translateY(40px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeIn {
  from { opacity:0; }
  to   { opacity:1; }
}
@keyframes slideInLeft {
  from { opacity:0; transform:translateX(-40px); }
  to   { opacity:1; transform:translateX(0); }
}
@keyframes pulseGlow {
  0%,100% { box-shadow:0 0 20px rgba(59,130,246,0.3); }
  50%      { box-shadow:0 0 40px rgba(59,130,246,0.6); }
}
@keyframes gradientShift {
  0%   { background-position:0% 50%; }
  50%  { background-position:100% 50%; }
  100% { background-position:0% 50%; }
}

/* --- 导航栏高端升级 --- */
.main-nav {
  background: rgba(2,6,23,0.92) !important;
  backdrop-filter: blur(24px) saturate(1.8) !important;
  border-bottom:1px solid rgba(59,130,246,0.15) !important;
  height:72px !important;
  padding:0 3rem !important;
  transition: all 0.4s cubic-bezier(0.16,1,0.3,1);
}
.main-nav.scrolled {
  background: rgba(2,6,23,0.98) !important;
  box-shadow:0 4px 30px rgba(0,0,0,0.3);
}
.main-nav .logo {
  font-size:1.35rem !important;
  font-weight:900 !important;
  letter-spacing:-0.02em;
  background: linear-gradient(135deg, #3b82f6, #8b5cf6, #10b981) !important;
  -webkit-background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
}
.main-nav .nav-links a {
  font-weight:500 !important;
  font-size:0.9rem !important;
  letter-spacing:0.01em;
  position:relative;
  padding:4px 0 !important;
}
.main-nav .nav-links a::after {
  content:'';
  position:absolute;
  bottom:0; left:0; right:0;
  height:2px;
  background:linear-gradient(90deg, #3b82f6, #8b5cf6);
  transform:scaleX(0);
  transition:transform 0.3s cubic-bezier(0.16,1,0.3,1);
}
.main-nav .nav-links a:hover::after { transform:scaleX(1); }

/* --- Hero 区域高端升级 --- */
.hero-section {
  min-height:100vh !important;
  display:flex !important;
  align-items:center !important;
  padding:120px 2rem 80px !important;
  position:relative !important;
  overflow:hidden !important;
  background: radial-gradient(ellipse 80% 60% at 50% 20%, rgba(59,130,246,0.08), transparent),
              radial-gradient(ellipse 60% 40% at 80% 80%, rgba(139,92,246,0.06), transparent),
              var(--bg) !important;
}
.hero-section::before {
  content:'';
  position:absolute;
  top:-50%; left:-50%;
  width:200%; height:200%;
  background:conic-gradient(from 0deg, transparent 0deg, rgba(59,130,246,0.03) 60deg, transparent 120deg);
  animation: heroRotate 20s linear infinite;
  pointer-events:none;
}
@keyframes heroRotate {
  from { transform:rotate(0deg); }
  to   { transform:rotate(360deg); }
}
.hero-content h1 {
  font-size:clamp(2.8rem, 5.5vw, 4.8rem) !important;
  font-weight:900 !important;
  letter-spacing:-0.03em !important;
  line-height:1.08 !important;
  background:linear-gradient(135deg, #f1f5f9 0%, #3b82f6 40%, #8b5cf6 70%, #10b981 100%) !important;
  background-size:200% 200%;
  -webkit-background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  animation:gradientShift 6s ease infinite;
}
.hero-content .hero-sub {
  font-size:1.15rem !important;
  line-height:1.8 !important;
  color:rgba(148,163,184,0.9) !important;
  max-width:600px !important;
  margin:24px 0 40px !important;
}
.hero-stats {
  display:flex !important;
  gap:40px !important;
  margin-top:48px !important;
}
.hero-stat {
  text-align:center !important;
}
.hero-stat .num {
  font-size:2.8rem !important;
  font-weight:900 !important;
  letter-spacing:-0.02em;
  background:linear-gradient(135deg, #3b82f6, #10b981) !important;
  -webkit-background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
}
.hero-stat .label {
  font-size:0.82rem !important;
  color:rgba(148,163,184,0.7) !important;
  margin-top:4px !important;
  text-transform:uppercase !important;
  letter-spacing:0.08em !important;
}

/* --- 按钮高端升级 --- */
.btn-primary {
  background:linear-gradient(135deg, #3b82f6, #6366f1, #8b5cf6) !important;
  background-size:200% 200% !important;
  animation:gradientShift 4s ease infinite;
  box-shadow:0 4px 24px rgba(59,130,246,0.35), inset 0 1px 0 rgba(255,255,255,0.1) !important;
  border:none !important;
  font-weight:600 !important;
  letter-spacing:0.01em;
  transition:all 0.4s cubic-bezier(0.16,1,0.3,1) !important;
}
.btn-primary:hover {
  transform:translateY(-2px) !important;
  box-shadow:0 8px 32px rgba(59,130,246,0.5), inset 0 1px 0 rgba(255,255,255,0.15) !important;
}
.btn-outline {
  border:1.5px solid rgba(59,130,246,0.4) !important;
  background:rgba(59,130,246,0.05) !important;
  backdrop-filter:blur(8px);
  transition:all 0.4s cubic-bezier(0.16,1,0.3,1) !important;
}
.btn-outline:hover {
  background:rgba(59,130,246,0.12) !important;
  border-color:rgba(59,130,246,0.7) !important;
  transform:translateY(-2px) !important;
}

/* --- Section 高端升级 --- */
.section {
  padding:120px 0 !important;
  position:relative !important;
}
.section-header h2 {
  font-size:clamp(2rem, 4vw, 3.2rem) !important;
  font-weight:900 !important;
  letter-spacing:-0.02em !important;
  line-height:1.15 !important;
}
.section-header .tag {
  display:inline-block !important;
  padding:6px 18px !important;
  border-radius:100px !important;
  font-size:0.78rem !important;
  font-weight:600 !important;
  letter-spacing:0.06em !important;
  text-transform:uppercase !important;
  background:linear-gradient(135deg, rgba(59,130,246,0.12), rgba(139,92,246,0.12)) !important;
  border:1px solid rgba(59,130,246,0.2) !important;
  color:#8b5cf6 !important;
  margin-bottom:20px !important;
}

/* --- 功能卡片高端升级 --- */
.feature-card {
  background:linear-gradient(165deg, var(--surface) 0%, var(--surface2) 100%) !important;
  border:1px solid rgba(59,130,246,0.12) !important;
  border-radius:20px !important;
  padding:40px 32px !important;
  transition:all 0.5s cubic-bezier(0.16,1,0.3,1) !important;
  position:relative !important;
  overflow:hidden !important;
}
.feature-card::before {
  content:'';
  position:absolute;
  top:0; left:0; right:0;
  height:3px;
  background:linear-gradient(90deg, #3b82f6, #8b5cf6, #10b981);
  opacity:0;
  transition:opacity 0.4s;
}
.feature-card:hover::before { opacity:1; }
.feature-card:hover {
  transform:translateY(-8px) !important;
  border-color:rgba(59,130,246,0.3) !important;
  box-shadow:0 24px 48px rgba(0,0,0,0.25), 0 0 0 1px rgba(59,130,246,0.1) !important;
}
.feature-card .icon {
  width:56px !important;
  height:56px !important;
  border-radius:16px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:1.5rem !important;
  margin-bottom:20px !important;
  background:linear-gradient(135deg, rgba(59,130,246,0.12), rgba(139,92,246,0.12)) !important;
  border:1px solid rgba(59,130,246,0.15);
}
.feature-card h3 {
  font-size:1.2rem !important;
  font-weight:700 !important;
  letter-spacing:-0.01em;
  margin-bottom:12px !important;
}

/* --- 客户案例高端升级 --- */
.case-card {
  background:linear-gradient(165deg, var(--surface) 0%, rgba(15,23,42,0.5) 100%) !important;
  border:1px solid rgba(59,130,246,0.1) !important;
  border-radius:20px !important;
  padding:40px !important;
  transition:all 0.5s cubic-bezier(0.16,1,0.3,1) !important;
}
.case-card:hover {
  border-color:rgba(59,130,246,0.25) !important;
  box-shadow:0 20px 40px rgba(0,0,0,0.2) !important;
  transform:translateY(-4px);
}
.case-card .quote {
  font-size:1.05rem !important;
  line-height:1.9 !important;
  color:rgba(226,232,240,0.9) !important;
  font-style:normal !important;
  position:relative !important;
  padding-left:24px !important;
  border-left:3px solid rgba(59,130,246,0.3) !important;
}

/* --- 定价卡片高端升级 --- */
.price-card {
  background:linear-gradient(165deg, var(--surface) 0%, var(--surface2) 100%) !important;
  border:1px solid rgba(59,130,246,0.12) !important;
  border-radius:24px !important;
  padding:48px 36px !important;
  transition:all 0.5s cubic-bezier(0.16,1,0.3,1) !important;
  position:relative !important;
}
.price-card.featured {
  border-color:rgba(59,130,246,0.4) !important;
  box-shadow:0 0 60px rgba(59,130,246,0.12) !important;
}
.price-card.featured::before {
  content:'推荐' !important;
  position:absolute;
  top:20px; right:20px;
  padding:4px 16px;
  border-radius:100px;
  font-size:0.75rem;
  font-weight:700;
  background:linear-gradient(135deg, #3b82f6, #8b5cf6);
  color:#fff;
  letter-spacing:0.05em;
}
.price-card .p-price {
  font-size:3rem !important;
  font-weight:900 !important;
  letter-spacing:-0.02em;
  background:linear-gradient(135deg, #f1f5f9, #3b82f6) !important;
  -webkit-background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  margin:16px 0 !important;
}

/* --- 技术规格表格升级 --- */
.tech-table {
  width:100%;
  border-collapse:separate !important;
  border-spacing:0 8px !important;
}
.tech-table tr {
  background:var(--surface) !important;
  transition:all 0.3s !important;
}
.tech-table tr:hover {
  background:var(--surface2) !important;
  transform:scale(1.01);
}
.tech-table td {
  padding:16px 20px !important;
  border:none !important;
  font-size:0.95rem !important;
}

/* --- 页脚高端升级 --- */
footer {
  background:linear-gradient(180deg, var(--bg) 0%, rgba(2,6,23,1) 100%) !important;
  border-top:1px solid rgba(59,130,246,0.1) !important;
  padding:80px 0 40px !important;
}
.footer-brand .logo {
  font-size:1.4rem !important;
  font-weight:900 !important;
  letter-spacing:-0.02em;
  background:linear-gradient(135deg, #3b82f6, #8b5cf6) !important;
  -webkit-background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
}

/* --- 动画升级 --- */
.fade-up {
  opacity:0;
  transform:translateY(30px);
  transition:opacity 0.8s cubic-bezier(0.16,1,0.3,1), transform 0.8s cubic-bezier(0.16,1,0.3,1) !important;
}
.fade-up.visible {
  opacity:1 !important;
  transform:translateY(0) !important;
}

/* --- 响应式优化 --- */
@media(max-width:768px) {
  .hero-section { padding:100px 1.5rem 60px !important; }
  .hero-stats { gap:20px !important; flex-wrap:wrap; }
  .hero-stat .num { font-size:2rem !important; }
  .section { padding:80px 0 !important; }
  .feature-card { padding:28px 24px !important; }
  .price-card { padding:36px 28px !important; }
}
