:root{
  /* ══ 赛博朋克底色（参考 SiliconFlow：深紫黑） ══ */
  --bg:#0d0d18; --bg-2:#12131d; --surface:#161722; --surface-2:#1a1b29;
  --border:#2a2b40; --border-2:#3d3f5c;
  --text:#f0f0f7; --muted:#81859f; --muted-2:#6a6b83;
  /* ══ 霓虹三原色：青 / 品紫 / 荧光绿 ══ */
  --neon:#4cc9ff; --neon-soft:rgba(76,201,255,.5);
  --purple:#844bf7; --purple-2:#6e29f6;
  --green:#29e67b;
  --radius-sm:.35rem; --radius-md:.5rem; --radius-lg:.75rem; --radius-xl:1rem; --radius-pill:9999px;
  --maxw:1140px;
  /* 动效变量 */
  --ease-out-expo:cubic-bezier(0.16,1,0.3,1);
  --ease-out-quart:cubic-bezier(0.25,1,0.5,1);
  --duration-fast:.25s; --duration-normal:.5s; --duration-slow:.8s;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,"Noto Sans SC",system-ui,sans-serif;background:var(--bg);color:var(--text);line-height:1.7;-webkit-font-smoothing:antialiased;font-size:16px;overflow-x:hidden}

/* ═══════════════ 网格点阵背景（赛博） ═══════════════ */
body::before{
  content:"";
  position:fixed;top:0;left:0;width:100%;height:100%;
  background-image:
    radial-gradient(circle,var(--border) 1px,transparent 1px);
  background-size:38px 38px;opacity:.35;z-index:-3;pointer-events:none;
}
/* 扫描线叠加层 */
body::after{
  content:"";
  position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:repeating-linear-gradient(0deg, rgba(76,201,255,.022) 0 1px, transparent 1px 3px);
  opacity:.7;
}
/* 顶部霓虹辉光晕染 */
.hero{position:relative}
.hero::after{
  content:"";position:absolute;top:-200px;left:50%;transform:translateX(-50%);
  width:900px;height:500px;z-index:-1;pointer-events:none;
  background:radial-gradient(ellipse,rgba(132,75,247,.18) 0%,rgba(76,201,255,.10) 35%,transparent 70%);
}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* ═══════════════ 导航栏 ═══════════════ */
.nav{position:sticky;top:0;z-index:50;transition:background .4s var(--ease-out-quart),box-shadow .4s var(--ease-out-quart),border-color .4s}
.nav.scrolled{background:rgba(13,13,24,.92);backdrop-filter:blur(10px);box-shadow:0 4px 30px rgba(0,0,0,.5);border-bottom-color:var(--border-2)}
.nav-inner{max-width:var(--maxw);margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:24px}
.brand{font-weight:800;font-size:1.15rem;letter-spacing:.3px;display:flex;align-items:center;gap:8px;position:relative}
.brand-mark{color:var(--neon);font-size:1.1rem;transition:transform var(--duration-fast) ease;text-shadow:0 0 10px var(--neon-soft)}
.brand:hover .brand-mark{transform:rotate(15deg) scale(1.15);box-shadow:0 0 14px var(--neon-soft)}
.nav-links{display:flex;gap:26px;margin-left:auto;font-size:.95rem;color:var(--muted)}
.nav-links a{position:relative;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.88rem;letter-spacing:.3px}
.nav-links a::after{content:"";position:absolute;bottom:-4px;left:0;width:0;height:2px;background:var(--neon);border-radius:1px;box-shadow:0 0 8px var(--neon-soft);transition:width var(--duration-normal) var(--ease-out-expo)}
.nav-links a:hover{color:var(--text)}
.nav-links a:hover::after{width:100%}

/* 按钮基础 + 发光/涟漪 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 22px;border-radius:var(--radius-pill);font-weight:600;font-size:.95rem;cursor:pointer;transition:all var(--duration-fast) var(--ease-out-quart);border:1px solid transparent;position:relative;overflow:hidden;font-family:"JetBrains Mono",ui-monospace,monospace;letter-spacing:.4px}
.btn::before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:rgba(255,255,255,.18);border-radius:50%;transform:translate(-50%,-50%);transition:width .55s var(--ease-out-quart),height .55s var(--ease-out-quart)}
.btn:active::before{width:260px;height:260px}
.btn-primary{
  background:linear-gradient(135deg,var(--neon),var(--purple-2));
  color:#fff;
  box-shadow:0 0 18px rgba(76,201,255,.32),0 4px 20px rgba(110,41,246,.22);
  transition:all var(--duration-normal) var(--ease-out-quart);
}
.btn-primary:hover{
  transform:translateY(-2px) scale(1.02);
  box-shadow:0 0 30px rgba(76,201,255,.5),0 0 0 4px rgba(76,201,255,.12),0 8px 28px rgba(132,75,247,.3);
}
.btn-ghost{background:rgba(22,23,34,.6);border-color:var(--border-2);color:var(--text);backdrop-filter:blur(4px)}
.btn-ghost:hover{border-color:var(--neon);color:var(--neon);background:rgba(76,201,255,.06);box-shadow:0 0 16px rgba(76,201,255,.18)}

/* ═══════════════ HERO 区域 ═══════════════ */
.hero{padding:100px 0 80px;position:relative;overflow:hidden;min-height:85vh;display:flex;align-items:center}
/* 动态光晕层 */
.hero-glow{
  position:absolute;top:-150px;left:50%;transform:translateX(-50%);
  width:800px;height:600px;
  pointer-events:none;z-index:0;
}
.hero-glow .glow-1{
  position:absolute;width:100%;height:100%;
  background:radial-gradient(circle,rgba(76,201,255,.20) 0%,rgba(132,75,247,.12) 40%,transparent 70%);
  animation:glow-breathe 6s ease-in-out infinite alternate;
}
.hero-glow .glow-2{
  position:absolute;top:80px;left:-100px;width:500px;height:400px;
  background:radial-gradient(circle,rgba(41,230,123,.10) 0%,transparent 60%);
  animation:glow-drift 8s ease-in-out infinite alternate;
}
.hero-glow .glow-3{
  position:absolute;top:120px;right:-80px;width:450px;height:380px;
  background:radial-gradient(circle,rgba(132,75,247,.14) 0%,transparent 60%);
  animation:glow-drift-reverse 10s ease-in-out infinite alternate;
}
@keyframes glow-breathe{
  0%{opacity:.55;transform:scale(.92)}
  100%{opacity:1;transform:scale(1.08)}
}
@keyframes glow-drift{
  0%{transform:translate(0,0)}
  100%{transform:translate(40px,-30px)}
}
@keyframes glow-drift-reverse{
  0%{transform:translate(0,0)}
  100%{transform:translate(-50px,-20px)}
}

/* Hero 内容层级 */
.hero > .wrap{position:relative;z-index:1}

/* 入场动画 — 通用 reveal 类 */
.reveal{
  opacity:0;transform:translateY(32px);
  transition:opacity var(--duration-slow) var(--ease-out-expo),
             transform var(--duration-slow) var(--ease-out-expo);
}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.08s}
.reveal-delay-2{transition-delay:.16s}
.reveal-delay-3{transition-delay:.24s}
.reveal-delay-4{transition-delay:.32s}
.reveal-delay-5{transition-delay:.40s}
.reveal-delay-6{transition-delay:.48s}

/* Badge 微脉冲 */
.badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 16px;border-radius:var(--radius-pill);
  border:1px solid var(--neon-soft);background:rgba(76,201,255,.07);
  backdrop-filter:blur(8px);
  color:var(--neon);font-size:.82rem;font-weight:600;letter-spacing:.5px;
  font-family:"JetBrains Mono",ui-monospace,monospace;
  box-shadow:0 0 14px rgba(76,201,255,.12) inset;
}
.badge::before{
  content:"";width:6px;height:6px;border-radius:50%;
  background:var(--green);display:inline-block;
  animation:pulse-dot 2s ease-in-out infinite;
  box-shadow:0 0 8px var(--green);
}
@keyframes pulse-dot{
  0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(41,230,123,.45)}
  50%{opacity:.6;box-shadow:0 0 0 5px rgba(41,230,123,0)}
}

.hero h1{
  font-size:clamp(2.4rem,5.5vw,4rem);line-height:1.12;
  font-weight:800;margin:26px 0 20px;letter-spacing:-.5px;
}
.hero h1 .accent{
  color:var(--neon);
  position:relative;
  display:inline-block;
  background:linear-gradient(90deg,var(--neon),var(--purple));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  text-shadow:0 0 30px rgba(76,201,255,.25);
}
.hero h1 .accent::after{
  content:"";
  position:absolute;bottom:2px;left:-2px;right:-2px;
  height:8px;border-radius:4px;
  background:linear-gradient(90deg,rgba(76,201,255,.35),rgba(132,75,247,.35));
  z-index:-1;transition:opacity var(--duration-slow);
  opacity:.6;
}
.hero h1 .accent:hover::after{opacity:1}

.hero p.lead{font-size:1.18rem;color:var(--muted);max-width:640px;margin-bottom:34px;line-height:1.7}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}

/* ═══════════════ 代码块（打字效果） ═══════════════ */
.hero-code{
  margin-top:52px;
  background:rgba(8,9,16,.9);backdrop-filter:blur(12px);
  border:1px solid var(--border-2);border-radius:var(--radius-lg);
  padding:22px 24px;
  font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:.89rem;color:#dbe6f7;max-width:580px;overflow-x:auto;
  position:relative;
  box-shadow:0 8px 32px rgba(0,0,0,.4),inset 0 1px 0 rgba(76,201,255,.08),0 0 24px rgba(76,201,255,.08);
}
.hero-code::before{
  content:"// quickstart.sh";position:absolute;top:0;left:0;right:0;
  padding:6px 16px;font-size:.72rem;color:var(--muted-2);
  background:rgba(76,201,255,.05);border-bottom:1px solid var(--border);
  letter-spacing:.5px;
}
.hero-code .code-line{padding-top:14px}
/* 代码块行 — 默认隐藏，逐行显现 */
.hero-code .code-line{
  display:block;opacity:0;transform:translateX(-8px);
  transition:opacity .4s var(--ease-out-expo),transform .4s var(--ease-out-expo);
}
.hero-code .code-line.show{opacity:1;transform:translateX(0)}
/* 光标闪烁 */
.hero-code .cursor{
  display:inline-block;width:2px;height:1.1em;
  background:var(--neon);
  vertical-align:text-bottom;margin-left:2px;
  animation:blink-cursor .9s step-end infinite;
  box-shadow:0 0 8px var(--neon-soft);
}
@keyframes blink-cursor{0%,100%{opacity:1}50%{opacity:0}}
.hero-code .c{color:var(--muted-2)}.hero-code .k{color:var(--neon)}.hero-code .s{color:var(--green)}

/* ═══════════════ 通用 Section ═══════════════ */
section{padding:80px 0;position:relative}
.sec-head{text-align:center;max-width:700px;margin:0 auto 48px}
.sec-head .eyebrow{
  display:inline-block;
  font-family:"JetBrains Mono",ui-monospace,monospace;
  color:var(--neon);font-weight:600;font-size:.78rem;letter-spacing:2px;text-transform:uppercase;
  border:1px solid var(--neon-soft);background:rgba(76,201,255,.06);
  padding:5px 14px;border-radius:4px;
  position:relative;
}
.sec-head .eyebrow::before{content:"▌ ";opacity:.7}
.sec-head h2{
  font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;margin:16px 0 12px;letter-spacing:-.4px;
  background:linear-gradient(90deg,var(--text) 40%,var(--neon));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.sec-head p{color:var(--muted);font-size:1.05rem}

/* ═══════════════ 模块 HUD 角标（通用） ═══════════════ */
.card,.tier,.harness-flow,.compare .col,.faq-item,.trust{position:relative}
.card::before,.tier::before,.harness-flow::before,.compare .col::before,.faq-item::before,.trust::before{
  content:"";position:absolute;top:10px;left:10px;width:13px;height:13px;
  border-top:2px solid var(--neon);border-left:2px solid var(--neon);
  opacity:.45;transition:opacity .3s,width .3s,height .3s;z-index:2;pointer-events:none;
}
.card::after,.tier::after,.harness-flow::after,.compare .col::after,.faq-item::after,.trust::after{
  content:"";position:absolute;bottom:10px;right:10px;width:13px;height:13px;
  border-bottom:2px solid var(--neon);border-right:2px solid var(--neon);
  opacity:.45;transition:opacity .3s,width .3s,height .3s;z-index:2;pointer-events:none;
}
.card:hover::before,.card:hover::after,
.tier:hover::before,.tier:hover::after,
.harness-flow:hover::before,.harness-flow:hover::after,
.compare .col:hover::before,.compare .col:hover::after,
.faq-item:hover::before,.faq-item:hover::after,
.trust:hover::before,.trust:hover::after{opacity:1;width:20px;height:20px}

/* ═══════════════ 卡片 ═══════════════ */
.grid{display:grid;gap:22px}
.grid-4{grid-template-columns:repeat(4,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.card{
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius-xl);padding:28px;
  transition:all var(--duration-normal) var(--ease-out-quart);
  overflow:hidden;
}
.card:hover{
  border-color:var(--neon-soft);transform:translateY(-5px);
  box-shadow:0 16px 44px rgba(0,0,0,.4),0 0 24px rgba(76,201,255,.14);
}
.card .ico{
  width:46px;height:46px;border-radius:var(--radius-md);
  background:linear-gradient(135deg,rgba(76,201,255,.16),rgba(132,75,247,.10));
  color:var(--neon);display:flex;align-items:center;
  justify-content:center;font-size:1.35rem;margin-bottom:18px;
  border:1px solid rgba(76,201,255,.18);
  transition:transform var(--duration-fast) ease,box-shadow var(--duration-fast) ease;
}
.card:hover .ico{transform:scale(1.1) rotate(-3deg);box-shadow:0 0 18px rgba(76,201,255,.25)}
.card h3{font-size:1.15rem;margin-bottom:8px;transition:color var(--duration-fast)}
.card:hover h3{color:var(--neon)}
.card p{color:var(--muted);font-size:.96rem}
.card .big{font-size:2.4rem;font-weight:800;color:var(--neon);margin-bottom:6px;text-shadow:0 0 20px rgba(76,201,255,.3)}

/* ═══════════════ 统计数字（计数动画） ═══════════════ */
.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;text-align:center;padding:44px 0}
.stat .n{
  font-size:2.4rem;font-weight:800;color:var(--neon);
  display:inline-block;text-shadow:0 0 22px rgba(76,201,255,.32);
  transition:transform .3s var(--ease-out-quart);
}
.stat .n.counting{animation:number-pop .4s var(--ease-out-quart)}
@keyframes number-pop{
  0%{transform:scale(1.2);opacity:.6}
  100%{transform:scale(1);opacity:1}
}
.stat .l{color:var(--muted);font-size:.92rem;margin-top:6px}

/* ═══════════════ CTA 条带 ═══════════════ */
.cta-band{
  background:linear-gradient(135deg,rgba(22,23,34,.92),rgba(26,27,41,.92));
  border:1px solid var(--neon-soft);border-radius:var(--radius-xl);
  padding:56px 44px;text-align:center;margin:20px 0;
  position:relative;overflow:hidden;
  box-shadow:0 0 30px rgba(76,201,255,.08) inset;
}
.cta-band::before{
  content:"";position:absolute;top:-50%;left:-50%;
  width:200%;height:200%;
  background:conic-gradient(from 0deg,transparent,rgba(76,201,255,.06),transparent,rgba(132,75,247,.05),transparent);
  animation:cta-spin 12s linear infinite;
}
@keyframes cta-spin{to{transform:rotate(360deg)}}
.cta-band > *{position:relative;z-index:1}
.cta-band h2{font-size:2rem;font-weight:800;margin-bottom:14px;
  background:linear-gradient(90deg,var(--text),var(--neon));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.cta-band p{color:var(--muted);margin-bottom:28px;font-size:1.05rem}

/* ═══════════════ 引用金句 ═══════════════ */
.quote{font-size:1.5rem;font-weight:700;color:var(--neon);text-align:center;max-width:760px;margin:30px auto;line-height:1.5;position:relative;text-shadow:0 0 22px rgba(76,201,255,.2)}
.quote::before,.quote::after{content:'"';color:var(--purple);text-shadow:0 0 14px rgba(132,75,247,.4)}

/* ═══════════════ 定价 ═══════════════ */
.tier{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:32px;display:flex;flex-direction:column;transition:all var(--duration-normal) var(--ease-out-quart)}
.tier.featured{border-color:var(--neon);box-shadow:0 0 0 1px var(--neon),0 16px 48px rgba(76,201,255,.16),0 0 30px rgba(76,201,255,.1)}
.tier:hover{transform:translateY(-4px);border-color:var(--neon-soft);box-shadow:0 16px 48px rgba(0,0,0,.35),0 0 24px rgba(76,201,255,.14)}
.tier .name{font-weight:700;font-size:1.2rem;font-family:"JetBrains Mono",ui-monospace,monospace;letter-spacing:.5px}
.tier .price{font-size:2.6rem;font-weight:800;margin:12px 0;color:var(--text)}
.tier .price small{font-size:1rem;color:var(--muted);font-weight:500}
.tier ul{list-style:none;margin:20px 0 28px;display:flex;flex-direction:column;gap:11px}
.tier li{color:var(--muted);font-size:.95rem;padding-left:24px;position:relative;transition:color var(--duration-fast)}
.tier li:hover{color:var(--text)}
.tier li::before{content:"▹";position:absolute;left:0;color:var(--neon);font-weight:700;text-shadow:0 0 8px var(--neon-soft)}
.tier .btn{margin-top:auto}
.pay-chips{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:28px}
.chip{border:1px solid var(--border-2);background:var(--surface);border-radius:var(--radius-pill);padding:8px 20px;font-size:.9rem;color:var(--muted);transition:all var(--duration-fast);font-family:"JetBrains Mono",ui-monospace,monospace}
.chip:hover{border-color:var(--neon);color:var(--neon);transform:translateY(-1px);box-shadow:0 0 14px rgba(76,201,255,.15)}
.chip b{color:var(--text)}

/* 对比 */
.compare{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:32px}
.compare .col{border:1px solid var(--border);border-radius:var(--radius-xl);padding:28px;transition:all var(--duration-normal)}
.compare .col.good{border-color:var(--neon);background:rgba(76,201,255,.04)}
.compare h4{margin-bottom:16px;font-size:1.1rem;font-family:"JetBrains Mono",ui-monospace,monospace;letter-spacing:.5px}
.compare .col.good h4{color:var(--neon);text-shadow:0 0 12px var(--neon-soft)}
.compare ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.compare li{color:var(--muted);font-size:.95rem;padding-left:22px;position:relative}
.compare li::before{position:absolute;left:0}
.compare .bad li::before{content:"✕";color:#e0795b}
.compare .good li::before{content:"▹";color:var(--neon);font-weight:700}

/* ═══════════════ FAQ ═══════════════ */
.faq-item{
  border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:22px 26px;margin-bottom:14px;
  background:var(--surface);
  transition:all var(--duration-normal) var(--ease-out-quart);
  cursor:default;
}
.faq-item:hover{border-color:var(--neon-soft);background:rgba(22,23,34,.9);transform:translateX(4px);box-shadow:0 0 18px rgba(76,201,255,.1)}
.faq-item h3{font-size:1.08rem;margin-bottom:8px;color:var(--text)}
.faq-item p{color:var(--muted);font-size:.97rem}
.faq-search{margin-bottom:32px}
.faq-search input{
  width:100%;padding:14px 20px;border-radius:var(--radius-pill);
  border:1px solid var(--border-2);background:var(--surface);color:var(--text);
  font-size:1rem;font-family:inherit;
  transition:all var(--duration-fast);
  box-shadow:0 0 0 0 rgba(76,201,255,0);
}
.faq-search input:focus{outline:none;border-color:var(--neon);box-shadow:0 0 0 3px rgba(76,201,255,.12),0 0 18px rgba(76,201,255,.12)}
.faq-search input::placeholder{color:var(--muted-2)}

/* ═══════════════ Footer ═══════════════ */
.footer{border-top:1px solid var(--border);padding:56px 0 32px;margin-top:40px;background:var(--bg-2)}
.footer-inner{max-width:var(--maxw);margin:0 auto;padding:0 24px;display:flex;gap:40px;flex-wrap:wrap;justify-content:space-between}
.footer-tag{color:var(--neon);font-style:italic;margin-top:10px;text-shadow:0 0 12px var(--neon-soft)}
.footer-cols{display:flex;gap:50px;flex-wrap:wrap}
.footer-cols h4{font-size:.78rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted-2);margin-bottom:14px;font-family:"JetBrains Mono",ui-monospace,monospace}
.footer-cols a{display:block;color:var(--muted);margin-bottom:9px;font-size:.95rem;position:relative;transition:color var(--duration-fast)}
.footer-cols a:hover{color:var(--neon)}
.footer-bottom{max-width:var(--maxw);margin:38px auto 0;padding:22px 24px 0;border-top:1px solid var(--border);color:var(--muted-2);font-size:.85rem;font-family:"JetBrains Mono",ui-monospace,monospace}
/* KYB 法律页入口条（注入到每个页面 footer 前） */
.legal-bar{max-width:var(--maxw);margin:0 auto;padding:14px 24px;text-align:center;font-size:.85rem;color:var(--muted-2);font-family:"JetBrains Mono",ui-monospace,monospace;border-top:1px solid var(--border)}
.legal-bar a{color:var(--neon);text-decoration:none;margin:0 4px}
.legal-bar a:hover{text-decoration:underline}
.note{font-size:.85rem;color:var(--muted-2);margin-top:10px}
.trust-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:28px}
.trust{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;transition:all var(--duration-normal) var(--ease-out-quart)}
.trust:hover{border-color:var(--neon-soft);transform:translateY(-2px);box-shadow:0 0 20px rgba(76,201,255,.12)}
.trust h4{color:var(--neon);font-size:1.05rem;margin-bottom:8px;font-family:"JetBrains Mono",ui-monospace,monospace}
.trust p{color:var(--muted);font-size:.95rem}
.lang-en{font-family:Inter,system-ui,sans-serif}

/* ═══════════════ Harness 价值引擎 ═══════════════ */
.harness-hero{text-align:center;max-width:760px;margin:0 auto}
.harness-ratio{margin-top:24px}
.ratio-bar{
  height:14px;
  background:var(--surface);
  border-radius:var(--radius-pill);
  overflow:hidden;
  border:1px solid var(--border-2);
  position:relative;
  box-shadow:inset 0 0 10px rgba(0,0,0,.4);
}
.ratio-fill{
  height:100%;width:0;
  background:linear-gradient(90deg,var(--neon),var(--purple));
  border-radius:var(--radius-pill);
  transition:width 2s var(--ease-out-expo);
  position:relative;
  box-shadow:0 0 16px rgba(76,201,255,.5);
}
.ratio-fill::after{
  content:"";position:absolute;right:0;top:-4px;bottom:-4px;width:6px;
  background:var(--neon);border-radius:3px;
  box-shadow:0 0 12px var(--neon-soft);
  animation:pulse-dot 2s ease-in-out infinite;
}
.ratio-labels{display:flex;justify-content:space-between;margin-top:10px;font-size:.9rem;font-family:"JetBrains Mono",ui-monospace,monospace}
.ratio-label .left{color:var(--muted)}
.ratio-label.right{color:var(--neon);text-align:right}
.harness-note{margin-top:16px;font-size:.88rem;color:var(--muted-2);font-style:italic;line-height:1.6}

/* Harness 能力卡片 */
.harness-card{
  border-top:3px solid transparent;
  background:linear-gradient(var(--surface),var(--surface)) padding-box,
             linear-gradient(135deg,rgba(76,201,255,.35),rgba(132,75,247,.25)) border-box;
  border-top-color:var(--neon);
}
.harness-tag{
  display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;
  padding:3px 10px;border-radius:var(--radius-pill);
  background:linear-gradient(135deg,rgba(76,201,255,.2),rgba(132,75,247,.12));
  color:var(--neon);margin-bottom:12px;font-family:"JetBrains Mono",ui-monospace,monospace;
  box-shadow:0 0 12px rgba(76,201,255,.12);
}
.harness-tag.secondary{background:rgba(106,107,131,.15);color:var(--muted);box-shadow:none}
.harness-metric{margin-top:18px;padding-top:16px;border-top:1px solid var(--border);display:flex;flex-direction:column;gap:2px}
.metric-val{font-size:1.6rem;font-weight:800;color:var(--neon);text-shadow:0 0 16px rgba(76,201,255,.3)}
.metric-label{font-size:.82rem;color:var(--muted-2);font-family:"JetBrains Mono",ui-monospace,monospace}

/* 流程步骤 */
.harness-flow{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:36px 28px 28px}
.flow-steps{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}
.flow-step{
  flex:1 1 140px;min-width:140px;text-align:center;
  padding:16px 10px;border-radius:var(--radius-lg);
  background:var(--bg-2);border:1px solid var(--border);
  transition:all var(--duration-normal) var(--ease-out-quart);
}
.flow-step:hover{border-color:var(--neon-soft);transform:translateY(-3px);box-shadow:0 8px 28px rgba(0,0,0,.3),0 0 18px rgba(76,201,255,.12)}
.step-num{
  width:36px;height:36px;margin:0 auto 10px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.95rem;background:var(--surface);color:var(--muted);border:2px solid var(--border);
  font-family:"JetBrains Mono",ui-monospace,monospace;
}
.step-num.highlight{
  background:linear-gradient(135deg,var(--neon),var(--purple-2));color:#fff;border:none;
  box-shadow:0 4px 16px rgba(76,201,255,.4),0 0 16px rgba(132,75,247,.3);
}
.step-title{font-weight:700;font-size:.92rem;margin-bottom:4px;color:var(--text)}
.step-desc{font-size:.82rem;color:var(--muted);line-height:1.5}
.flow-arrow{color:var(--neon-soft);font-weight:700;font-size:1.2rem;flex-shrink:0;text-shadow:0 0 8px var(--neon-soft)}

/* Harness 对比表 */
.harness-compare{overflow-x:auto}
.compare-table{width:100%;border-collapse:collapse;font-size:.93rem}
.compare-table th{
  padding:14px 18px;text-align:left;font-weight:700;
  background:var(--bg-2);border-bottom:2px solid var(--border-2);
  font-size:.9rem;color:var(--neon);font-family:"JetBrains Mono",ui-monospace,monospace;letter-spacing:.5px;
}
.compare-table td{padding:13px 18px;border-bottom:1px solid var(--border);color:var(--muted);line-height:1.55}
.row-label{font-weight:600;color:var(--text);white-space:nowrap;min-width:180px}
.bad-col,.bad-cell{color:var(--muted)}
.good-col{color:var(--neon)}
.good-cell{background:rgba(76,201,255,.04)}
.compare-table tbody tr:hover td{background:rgba(22,23,34,.6)}
.compare-table tbody tr:last-child td{border-bottom:2px solid var(--neon-soft);font-weight:600}

/* 定价页 popular badge */
.popular-badge{
  font-size:.68rem;font-weight:700;
  background:linear-gradient(135deg,var(--neon),var(--purple));
  color:#fff;padding:2px 10px;border-radius:var(--radius-pill);
  vertical-align:middle;margin-left:6px;letter-spacing:.3px;
  box-shadow:0 0 12px rgba(76,201,255,.3);
}

/* ═══════════════ 页面整体淡入 ═══════════════ */
body{animation:page-fade-in .6s var(--ease-out-quart) both}
@keyframes page-fade-in{from{opacity:0}to{opacity:1}}

/* ═══════════════ 响应式 ═══════════════ */

/* (配图相关样式已随图片移除) */

@media(max-width:880px){
  .grid-4,.grid-3,.stats{grid-template-columns:repeat(2,1fr)}
  .grid-2,.compare,.trust-grid{grid-template-columns:1fr}
  .nav-links{display:none}
  .hero{min-height:auto;padding:70px 0 50px}
  .hero-glow{width:100%;height:400px}
  .hero h1{font-size:clamp(1.9rem,6vw,2.8rem)}
}
@media(max-width:520px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .hero-code{font-size:.78rem;padding:16px}
  .card{padding:22px}
}

/* ══ 登录态导航（nav-auth 注入） ══ */
.nav-login{color:var(--muted);font-weight:600;margin-left:10px;white-space:nowrap}
.nav-login:hover{color:var(--neon)}
.nav-user{color:var(--muted);font-size:.82rem;margin-right:8px;font-family:"JetBrains Mono",ui-monospace,monospace;white-space:nowrap}
.btn-sm{padding:6px 14px;font-size:.8rem}
@media(max-width:880px){
  .nav-user{display:none}
}

/* ═══════════════ BLOG / ARTICLES (GEO) ═══════════════ */
.blog-hero{padding:120px 0 36px;text-align:center}
.blog-hero .eyebrow{display:inline-block;font-family:"JetBrains Mono",ui-monospace,monospace;color:var(--neon);font-weight:600;font-size:.78rem;letter-spacing:2px;text-transform:uppercase;border:1px solid var(--neon-soft);background:rgba(76,201,255,.06);padding:5px 14px;border-radius:4px}
.blog-hero h1{font-size:clamp(2rem,4vw,3rem);font-weight:800;margin:16px 0 10px;background:linear-gradient(90deg,var(--text),var(--neon));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.blog-hero p{color:var(--muted);max-width:640px;margin:0 auto;font-size:1.05rem}
.post-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:44px}
.post-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);padding:30px;display:flex;flex-direction:column;transition:all var(--duration-normal) var(--ease-out-quart);position:relative;overflow:hidden}
.post-card::before{content:"";position:absolute;top:10px;left:10px;width:13px;height:13px;border-top:2px solid var(--neon);border-left:2px solid var(--neon);opacity:.45;transition:opacity .3s,width .3s,height .3s;z-index:2;pointer-events:none}
.post-card::after{content:"";position:absolute;bottom:10px;right:10px;width:13px;height:13px;border-bottom:2px solid var(--neon);border-right:2px solid var(--neon);opacity:.45;transition:opacity .3s,width .3s,height .3s;z-index:2;pointer-events:none}
.post-card:hover{border-color:var(--neon-soft);transform:translateY(-5px);box-shadow:0 16px 44px rgba(0,0,0,.4),0 0 24px rgba(76,201,255,.14)}
.post-card .tag{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--neon);background:rgba(76,201,255,.08);border:1px solid var(--neon-soft);padding:3px 10px;border-radius:var(--radius-pill);margin-bottom:14px;font-family:"JetBrains Mono",ui-monospace,monospace;align-self:flex-start}
.post-card h3{font-size:1.25rem;margin-bottom:10px;line-height:1.35}
.post-card p{color:var(--muted);font-size:.95rem;flex:1}
.post-card .meta{margin-top:18px;font-size:.82rem;color:var(--muted-2);font-family:"JetBrains Mono",ui-monospace,monospace;display:flex;gap:14px;flex-wrap:wrap}
.post-card .read{color:var(--neon);font-weight:600;margin-top:14px;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.88rem}
.post-card:hover .read{text-decoration:underline}

/* 文章页 */
.article-wrap{max-width:820px;margin:0 auto;padding:110px 0 40px}
.article-head{margin-bottom:28px}
.article-head .tag{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--neon);background:rgba(76,201,255,.08);border:1px solid var(--neon-soft);padding:3px 10px;border-radius:var(--radius-pill);margin-bottom:14px;font-family:"JetBrains Mono",ui-monospace,monospace}
.article-head h1{font-size:clamp(1.9rem,4vw,2.7rem);font-weight:800;line-height:1.2;margin:8px 0 14px;background:linear-gradient(90deg,var(--text),var(--neon));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.article-meta{color:var(--muted-2);font-size:.86rem;font-family:"JetBrains Mono",ui-monospace,monospace;display:flex;gap:16px;flex-wrap:wrap}
.article .lead{font-size:1.12rem;color:var(--muted);line-height:1.8;margin-bottom:26px}
.article h2{font-size:1.5rem;font-weight:700;margin:40px 0 14px;padding-top:16px;border-top:1px solid var(--border)}
.article h3{font-size:1.15rem;font-weight:700;margin:26px 0 10px;color:var(--neon)}
.article p{color:var(--muted);line-height:1.85;margin-bottom:18px;font-size:1.02rem}
.article ul,.article ol{color:var(--muted);line-height:1.85;margin:0 0 18px;padding-left:22px}
.article li{margin:8px 0}
.article a.inline{color:var(--neon);text-decoration:underline;text-underline-offset:3px}
.article blockquote{border-left:3px solid var(--neon);background:rgba(76,201,255,.05);padding:14px 20px;margin:22px 0;border-radius:0 var(--radius-md) var(--radius-md) 0;color:var(--text);font-style:italic}
.article code{font-family:"JetBrains Mono",ui-monospace,monospace;background:var(--surface-2);padding:2px 7px;border-radius:5px;font-size:.9em;color:var(--green)}
.article pre{background:rgba(8,9,16,.9);border:1px solid var(--border-2);border-radius:var(--radius-md);padding:18px 20px;overflow-x:auto;margin:18px 0;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.88rem;color:#dbe6f7}
.article pre code{background:none;padding:0;color:inherit}
.article .toc{background:var(--bg-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px 22px;margin:24px 0}
.article .toc h4{font-size:.78rem;text-transform:uppercase;letter-spacing:1.5px;color:var(--muted-2);margin-bottom:10px;font-family:"JetBrains Mono",ui-monospace,monospace}
.article .toc a{display:block;color:var(--muted);font-size:.95rem;margin:6px 0;transition:color var(--duration-fast)}
.article .toc a:hover{color:var(--neon)}
.faq-embed{margin:26px 0}
.faq-embed .q{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px 22px;margin-bottom:12px;transition:all var(--duration-normal)}
.faq-embed .q:hover{border-color:var(--neon-soft);box-shadow:0 0 18px rgba(76,201,255,.1)}
.faq-embed .q h4{color:var(--text);font-size:1.02rem;margin-bottom:6px}
.faq-embed .q p{margin:0;font-size:.96rem}
.article-foot{border-top:1px solid var(--border);margin-top:44px;padding-top:24px;color:var(--muted-2);font-size:.88rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.article-foot a{color:var(--neon)}
@media(max-width:880px){.post-grid{grid-template-columns:1fr}.article-wrap{padding:90px 0 30px}}