/* ============================================================
   云鉴官网 · 配色覆盖（最小改动）
   ------------------------------------------------------------
   完整保留 style.css + claude-ui.css 的布局与结构，
   只调整配色变量，把暖米/橙红系换成克制的深灰蓝系。
   ============================================================ */

/* ---------- 全局变量覆盖 ---------- */
:root{
  --claude-bg:#eef1f6;
  --claude-card:#ffffff;
  --claude-text:#1c1c1e;
  --claude-muted:#6b7280;
  --claude-border:#e3e6ec;
  --claude-accent:#2b3440;
  --claude-accent-dark:#1a212a;
  --claude-shadow:0 18px 50px rgba(28,34,48,.10),0 4px 14px rgba(28,34,48,.06);
}

/* ---------- 页面底色：冷调灰白 ---------- */
body{
  background:#eef1f6;
}

/* hero 背景：去掉暖色渐变，改冷灰蓝 */
#hero{
  background:
    radial-gradient(circle at 18% 18%,rgba(45,66,110,.10),transparent 30%),
    radial-gradient(circle at 84% 20%,rgba(38,52,82,.08),transparent 32%),
    linear-gradient(135deg,#f7f9fc 0%,#e8edf5 100%) !important;
}

/* hero 内部卡片：白玻璃 + 冷调阴影。
   注意 z-index 必须低于 .hero-container，否则会盖住文案。 */
#hero::before{
  border-color:rgba(28,34,48,.08);
  background:
    linear-gradient(115deg,rgba(255,255,255,.86),rgba(255,255,255,.62)),
    var(--hero-image,none);
  background-size:cover;
  background-position:center;
  box-shadow:0 20px 56px rgba(28,34,48,.12),0 4px 16px rgba(28,34,48,.06);
  z-index:0;
}
/* 文案与预览卡必须在背景层之上 */
#hero .hero-container{position:relative;z-index:1}

/* 环境光斑：由暖橙改为冷蓝 */
#hero::after{
  background:radial-gradient(circle,rgba(45,66,110,.10),transparent 62%);
  z-index:0;
}

/* ---------- 导航 ---------- */
#logo h2 a::before{
  color:#1c1c1e;
}

.nav-menu a{
  color:#6b7280 !important;
}
.nav-menu a:hover,
.nav-menu .menu-active a{
  color:#1a212a !important;
}
.nav-menu .menu-active a{
  background:rgba(43,52,64,.08) !important;
}

/* ---------- 主按钮：深灰而非橙红 ---------- */
.btn-get-started.primary-action,
.btn-get-started:hover{
  background:#2b3440 !important;
  color:#fff !important;
  border-color:transparent !important;
  box-shadow:0 12px 30px -12px rgba(28,34,48,.5) !important;
}

/* ---------- hero 文案 ---------- */
.hero-copy h1{
  color:#1a212a;
  background:none;
  -webkit-text-fill-color:currentColor;
}
.hero-copy h2{
  color:#6b7280;
}
.hero-kicker{
  background:rgba(255,255,255,.8);
  border-color:rgba(28,34,48,.08);
  color:#2b3440;
}
.hero-uptime{
  color:#8a919c;
}
.hero-uptime span{
  color:#2b3440;
}

/* ---------- 特性卡 ---------- */
#features{
  background:#eef1f6;
}
#features .box{
  background:#fff;
  border:1px solid rgba(28,34,48,.06);
  box-shadow:0 10px 30px rgba(28,34,48,.07);
}
#features .box:hover{
  box-shadow:0 18px 46px rgba(28,34,48,.12);
}
#features .box .icon{
  background:rgba(43,52,64,.07);
  color:#2b3440;
  border:1px solid rgba(28,34,48,.06);
}
#features .box h4{
  color:#1c1c1e;
}
#features .box p{
  color:#8a919c;
}
.section-header h3{
  color:#1c1c1e;
}
.section-header p{
  color:#8a919c;
}

/* ---------- 预览卡配色 ---------- */
.preview-toolbar span{
  box-shadow:none;
}
.preview-badge{
  background:rgba(43,52,64,.08);
  color:#2b3440;
}
.preview-line{
  background:#e7eaf0;
}
.preview-grid div{
  background:#f3f5f9;
  border:1px solid rgba(28,34,48,.06);
  box-shadow:none;
}

/* ---------- 返回顶部 ---------- */
.back-to-top{
  background:#fff;
  color:#2b3440;
  border:1px solid rgba(28,34,48,.08);
  box-shadow:0 10px 26px rgba(28,34,48,.12);
}

/* ---------- 深色模式：保留原主题处理，仅校正色相 ---------- */
@media (prefers-color-scheme:dark){
  body{background:#12151b}
  #hero{
    background:
      radial-gradient(circle at 18% 18%,rgba(90,120,170,.12),transparent 30%),
      linear-gradient(135deg,#161a21 0%,#0f1218 100%) !important;
  }
  #logo h2 a::before{color:#f2f4f9}
  .nav-menu a{color:#9aa3b0 !important}
  .nav-menu a:hover,.nav-menu .menu-active a{color:#fff !important}
  .hero-copy h1{color:#f2f4f9}
  .hero-copy h2{color:#9aa3b0}
  #features{background:#12151b}
  #features .box{
    background:#181c23;
    border-color:rgba(255,255,255,.07);
  }
  #features .box h4{color:#f2f4f9}
  #features .box p{color:#8a919c}
  .section-header h3{color:#f2f4f9}
  .back-to-top{background:#181c23;color:#f2f4f9;border-color:rgba(255,255,255,.08)}
}

/* ---------- 修复：入场动画把元素卡在 opacity:0 ----------
 * claude-ui.css 用 animation:...both 做入场，
 * 当动画被内核节流不执行时，元素会永久停在 from 状态的透明。
 * 这里强制恢复可见，只保留轻微位移效果。 */
.hero-copy,
.hero-preview,
.claude-hero .hero-copy{
  opacity:1 !important;
  animation:none !important;
  transform:none !important;
}
/* 想要入场感就用不依赖 opacity 的写法 */
@keyframes tintRise{
  from{transform:translateY(12px)}
  to{transform:translateY(0)}
}
.hero-copy{animation:tintRise .55s cubic-bezier(.16,1,.3,1)}
.hero-preview{animation:tintRise .55s cubic-bezier(.16,1,.3,1) .08s}
