/* ============================================================
   0. 变量与主题
   ============================================================ */
:root{
  --gold:#D4AF37;
  --gold-light:#F7E7A8;
  --gold-dark:#9A7B1E;
  --crimson:#4A0E13;

  --body:#C4C4CC;
  --muted:#7D8590;
  --heading:#FFFFFF;

  --card-bg:rgba(255,255,255,0.04);
  --card-bg-hover:rgba(255,255,255,0.19);
  --card-border:rgba(255,255,255,0.06);
  --track:rgba(255,255,255,0.08);
  --hairline:rgba(255,255,255,0.08);

  --metal:linear-gradient(135deg, #F7E7A8 0%, #D4AF37 45%, #9A7B1E 70%, #F7E7A8 100%);

  --radius-card:28px;
  --radius-btn:12px;
  --radius-pill:999px;

  --page-bg:
    radial-gradient(ellipse at 20% 10%, rgba(74,14,19,0.35) 0%, transparent 55%),
    radial-gradient(ellipse at 80% 90%, rgba(212,175,55,0.12) 0%, transparent 60%),
    #050508;
}

html[data-theme="light"]{
  --body:#3F3F46;
  --muted:#6B7280;
  --heading:#1A1A1F;

  --card-bg:rgba(255,255,255,0.72);
  --card-bg-hover:rgba(255,255,255,0.96);
  --card-border:rgba(15,23,42,0.08);
  --track:rgba(15,23,42,0.10);
  --hairline:rgba(15,23,42,0.10);

  --metal:linear-gradient(135deg, #4A0E13 0%, #B8860B 100%);

  --page-bg:#F8FAFC;
}

/* ============================================================
   1. Reset / 基础
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box;}

html,body{overflow-x:hidden;}

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}

body{
  font-family:-apple-system, BlinkMacSystemFont, "SF Pro Display", "Segoe UI",
              "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  background:var(--page-bg);
  background-attachment:fixed;
  color:var(--body);
  font-size:16px;
  line-height:1.7;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  position:relative;
}

img,svg{display:block;max-width:100%;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
input,textarea{font-family:inherit;}
a{color:inherit;text-decoration:none;}
ul,ol{list-style:none;}

/* 防断网 / 防白屏：JS 未执行时全部可见 */
.js-ready .reveal{opacity:0;transition:opacity .5s ease-out;}
.js-ready .reveal.in-view{opacity:1;}

/* ============================================================
   2. 环境光斑
   ============================================================ */
.ambient{
  position:fixed;
  border-radius:50%;
  pointer-events:none;
  z-index:0;
  will-change:opacity, transform;
}
.ambient--crimson{
  width:640px;height:640px;
  left:-240px;top:-200px;
  background:rgba(74,14,19,0.85);
  filter:blur(180px);
  animation:breatheA 48s ease-in-out infinite;
}
.ambient--gold{
  width:560px;height:560px;
  right:-220px;bottom:-180px;
  background:rgba(212,175,55,0.22);
  filter:blur(200px);
  animation:breatheB 56s ease-in-out infinite;
}
.ambient--cool{
  width:700px;height:700px;
  left:50%;top:-380px;
  margin-left:-350px;
  background:rgba(150,168,196,0.16);
  filter:blur(240px);
  animation:breatheC 60s ease-in-out infinite;
}

@keyframes breatheA{
  0%,100%{opacity:.55;transform:scale(1);}
  50%{opacity:.92;transform:scale(1.12);}
}
@keyframes breatheB{
  0%,100%{opacity:.50;transform:scale(1.06);}
  50%{opacity:.88;transform:scale(0.94);}
}
@keyframes breatheC{
  0%,100%{opacity:.45;transform:scale(1);}
  50%{opacity:.78;transform:scale(1.10);}
}

html[data-theme="light"] .ambient{
  animation:none;
  opacity:.18;
}

/* ============================================================
   3. 顶部进度条
   ============================================================ */
.scroll-progress{
  position:fixed;
  top:0;left:0;
  width:100%;
  height:1px;
  z-index:200;
  background:transparent;
  pointer-events:none;
}
.scroll-progress__bar{
  height:1px;
  width:0;
  background:#4A0E13;
  box-shadow:0 0 10px rgba(74,14,19,1);
  transition:width .1s linear;
}

/* ============================================================
   4. 导航栏
   ============================================================ */
.nav{
  position:fixed;
  top:0;left:0;right:0;
  height:64px;
  z-index:150;
  background:rgba(5,5,8,0.55);
  backdrop-filter:blur(24px) saturate(140%);
  -webkit-backdrop-filter:blur(24px) saturate(140%);
  border-bottom:1px solid var(--card-border);
}
html[data-theme="light"] .nav{
  background:rgba(248,250,252,0.72);
}
.nav__inner{
  max-width:1200px;
  height:100%;
  margin:0 auto;
  padding:0 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.nav__brand{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:15px;
  font-weight:600;
  color:var(--heading);
  letter-spacing:.2px;
  white-space:nowrap;
}
.nav__logo{
  width:9px;height:9px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 14px rgba(212,175,55,.9);
  flex:none;
}
.theme-toggle{
  display:flex;
  align-items:center;
  gap:8px;
  height:36px;
  padding:0 16px;
  border-radius:var(--radius-pill);
  background:var(--card-bg);
  border:1px solid var(--card-border);
  backdrop-filter:blur(24px) saturate(140%);
  -webkit-backdrop-filter:blur(24px) saturate(140%);
  color:var(--body);
  font-size:13px;
  transition:all 500ms cubic-bezier(0.22,1,0.36,1);
}
.theme-toggle:hover{
  background:var(--card-bg-hover);
  border-color:var(--gold);
  color:var(--heading);
}
.theme-toggle__icon{
  font-size:14px;
  line-height:1;
  display:inline-block;
}

/* ============================================================
   5. 按钮
   ============================================================ */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  height:52px;
  padding:0 30px;
  border-radius:var(--radius-btn);
  font-size:15px;
  font-weight:600;
  letter-spacing:.3px;
  white-space:nowrap;
  transition:all 500ms cubic-bezier(0.22,1,0.36,1);
  background:var(--card-bg);
  border:1px solid var(--card-border);
  backdrop-filter:blur(24px) saturate(140%);
  -webkit-backdrop-filter:blur(24px) saturate(140%);
  color:var(--heading);
}
.btn:hover{
  background:var(--card-bg-hover);
  border-color:var(--gold);
  transform:perspective(1000px) rotateX(1.5deg) rotateY(-1.5deg) translateY(-4px);
  box-shadow:0 18px 40px rgba(0,0,0,.45), 0 0 0 1px rgba(212,175,55,.35);
}
.btn--primary{
  color:#1A1004;
  background:linear-gradient(135deg, #F7E7A8 0%, #D4AF37 50%, #B8912A 100%);
  border:1px solid rgba(247,231,168,.6);
  box-shadow:0 10px 30px rgba(212,175,55,.22);
}
.btn--primary:hover{
  background:linear-gradient(135deg, #FFF3C4 0%, #E5C155 50%, #D4AF37 100%);
  border-color:rgba(247,231,168,.9);
  box-shadow:0 20px 48px rgba(212,175,55,.42);
}
html[data-theme="light"] .btn--primary{
  color:#FFFFFF;
  background:linear-gradient(135deg, #4A0E13 0%, #B8860B 100%);
  border:1px solid rgba(74,14,19,.35);
}

/* ============================================================
   6. 磨砂玻璃卡片
   ============================================================ */
.glass{
  background:var(--card-bg);
  backdrop-filter:blur(24px) saturate(140%);
  -webkit-backdrop-filter:blur(24px) saturate(140%);
  border:1px solid var(--card-border);
  border-radius:var(--radius-card);
  transition:all 500ms cubic-bezier(0.22,1,0.36,1);
}
.glass:hover{
  background:var(--card-bg-hover);
  border-color:var(--gold);
  transform:perspective(1000px) rotateX(1.5deg) rotateY(-1.5deg) translateY(-4px);
}

/* ============================================================
   7. 布局：容器 / 区块 / 标题
   ============================================================ */
.container{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  padding:0 24px;
  position:relative;
  z-index:2;
}
.section{
  padding:80px 0;
  position:relative;
  z-index:2;
}
.section-head{
  margin-bottom:48px;
}
.section-title{
  display:flex;
  align-items:center;
  gap:14px;
  font-size:28px;
  font-weight:700;
  line-height:1.35;
  color:var(--heading);
  letter-spacing:.2px;
}
.section-title::before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 14px rgba(212,175,55,.9);
  flex:none;
}
.section-title::after{
  content:"";
  width:48px;
  height:2px;
  background:var(--gold);
  flex:none;
  opacity:.85;
}
.section-sub{
  margin-top:24px;
  font-size:16px;
  color:var(--muted);
  max-width:820px;
  line-height:1.75;
}

/* ============================================================
   8. Hero
   ============================================================ */
.hero{
  padding-top:152px;
  padding-bottom:80px;
}
.hero__badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:32px;
  padding:0 16px;
  border-radius:var(--radius-pill);
  background:var(--card-bg);
  border:1px solid var(--card-border);
  color:var(--body);
  font-size:12.5px;
  letter-spacing:.4px;
  margin-bottom:32px;
}
.hero__badge-dot{
  width:6px;height:6px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 10px rgba(212,175,55,.9);
  animation:badgePulse 2.4s ease-in-out infinite;
}
@keyframes badgePulse{
  0%,100%{opacity:1;transform:scale(1);}
  50%{opacity:.4;transform:scale(.8);}
}
.hero__title{
  font-size:72px;
  font-weight:800;
  line-height:1.15;
  letter-spacing:-1.2px;
  color:var(--heading);
  max-width:1000px;
  text-wrap:balance;
}
.hero__sub{
  margin-top:32px;
  font-size:20px;
  line-height:1.7;
  color:var(--body);
  max-width:760px;
}
.hero__actions{
  margin-top:48px;
  display:flex;
  flex-wrap:wrap;
  gap:16px;
}

/* SaaS 面板 */
.saas-panel{
  margin-top:80px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:24px;
  padding:22px 30px;
  border-radius:var(--radius-card);
}
.saas-panel__left{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:13.5px;
  color:var(--body);
  white-space:nowrap;
}
.pulse-dot{
  width:8px;height:8px;
  border-radius:50%;
  background:#2ED573;
  box-shadow:0 0 12px rgba(46,213,115,.95);
  animation:pulseDot 1.8s ease-in-out infinite;
  flex:none;
}
@keyframes pulseDot{
  0%,100%{opacity:1;transform:scale(1);}
  50%{opacity:.35;transform:scale(.75);}
}
.saas-panel__center{
  font-size:14px;
  color:var(--heading);
  font-family:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
  letter-spacing:.2px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:8px 16px;
  border-radius:var(--radius-pill);
  background:rgba(212,175,55,0.07);
  border:1px solid rgba(212,175,55,0.18);
}
.saas-panel__right{
  font-size:13.5px;
  color:var(--gold);
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}

/* ============================================================
   9. 痛点区
   ============================================================ */
.pain__grid{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:24px;
  align-items:stretch;
}
.pain__card{
  padding:40px 36px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.pain__tag{
  display:inline-flex;
  align-items:center;
  align-self:flex-start;
  height:26px;
  padding:0 14px;
  border-radius:var(--radius-pill);
  font-size:12px;
  letter-spacing:.6px;
  color:var(--muted);
  border:1px solid var(--hairline);
  background:rgba(255,255,255,0.03);
}
.pain__headline{
  font-size:30px;
  font-weight:800;
  line-height:1.3;
  color:var(--heading);
}
.pain__headline--gold{
  background:var(--metal);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.pain__text{
  font-size:14.5px;
  line-height:1.85;
  color:var(--body);
}
.pain__vs{
  display:flex;
  align-items:center;
  justify-content:center;
  align-self:center;
  width:64px;height:64px;
  border-radius:50%;
  font-size:15px;
  font-weight:800;
  letter-spacing:1px;
  color:var(--gold);
  border:1px solid rgba(212,175,55,.45);
  background:rgba(74,14,19,.55);
  box-shadow:0 0 40px rgba(74,14,19,.9), inset 0 0 20px rgba(212,175,55,.12);
  flex:none;
}
.pain__evidence{
  margin-top:24px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.evidence-card{
  padding:32px 28px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.evidence-card__num{
  font-size:13px;
  letter-spacing:1.4px;
  color:var(--gold);
  font-variant-numeric:tabular-nums;
}
.evidence-card__title{
  font-size:17px;
  font-weight:700;
  color:var(--heading);
  line-height:1.5;
}
.evidence-card__desc{
  font-size:13.5px;
  line-height:1.8;
  color:var(--muted);
}
.evidence-card__line{
  width:100%;
  height:1px;
  background:linear-gradient(90deg, rgba(212,175,55,.55), rgba(212,175,55,0));
  margin-top:4px;
}
.pain__footnote{
  margin-top:20px;
  font-size:12px;
  line-height:1.7;
  color:var(--muted);
  opacity:0.6;
  letter-spacing:.2px;
}

/* ============================================================
   10. 调研区
   ============================================================ */
.research__grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.research-card{
  padding:36px 32px;
  display:flex;
  flex-direction:column;
  gap:16px;
}
.research-card__label{
  font-size:12px;
  letter-spacing:1.6px;
  color:var(--gold);
}
.research-card__title{
  font-size:19px;
  font-weight:700;
  color:var(--heading);
  line-height:1.5;
}
.research-card__text{
  font-size:14px;
  line-height:1.85;
  color:var(--body);
}
.research-card__quote{
  font-size:14px;
  line-height:1.85;
  color:var(--muted);
  padding-left:14px;
  border-left:2px solid rgba(212,175,55,.5);
}

/* ============================================================
   11. 核心数据区
   ============================================================ */
.data__grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
}
.data-card{
  padding:56px 48px;
  display:flex;
  flex-direction:column;
  gap:8px;
  position:relative;
  overflow:hidden;
}
.data-card::after{
  content:"";
  position:absolute;
  width:340px;height:340px;
  right:-120px;bottom:-160px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(74,14,19,.85) 0%, transparent 70%);
  filter:blur(60px);
  pointer-events:none;
  z-index:0;
}
.data-card > *{position:relative;z-index:1;}
.data-card__num{
  font-size:120px;
  font-weight:800;
  line-height:1;
  letter-spacing:-4px;
  background:var(--metal);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
  font-variant-numeric:tabular-nums;
}
.data-card__title{
  font-size:18px;
  font-weight:700;
  color:var(--heading);
  margin-top:16px;
  letter-spacing:.3px;
}
.data-card__desc{
  font-size:14px;
  line-height:1.8;
  color:var(--muted);
  margin-top:4px;
}

/* ============================================================
   12. 多 Agent 协同区
   ============================================================ */
.agents__stage{
  border-radius:var(--radius-card);
  background:rgba(255,255,255,0.025);
  border:1px solid var(--card-border);
  backdrop-filter:blur(24px) saturate(140%);
  -webkit-backdrop-filter:blur(24px) saturate(140%);
  overflow:hidden;
  position:relative;
}
.agents__cards{
  margin-top:24px;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
.agent-card{
  padding:32px 26px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.agent-card__dot{
  width:10px;height:10px;
  border-radius:50%;
  background:var(--gold);
  box-shadow:0 0 16px rgba(212,175,55,.9);
  flex:none;
}
.agent-card__name{
  font-size:17px;
  font-weight:700;
  color:var(--heading);
  display:flex;
  align-items:center;
  gap:10px;
}
.agent-card__role{
  font-size:12px;
  letter-spacing:1.2px;
  color:var(--gold);
}
.agent-card__desc{
  font-size:13.5px;
  line-height:1.8;
  color:var(--muted);
}

/* ============================================================
   13. 溯源看板
   ============================================================ */
.trace__grid{
  display:grid;
  grid-template-columns:1.25fr 1fr;
  gap:24px;
}
.trace-card{
  padding:40px 36px 32px;
  display:flex;
  flex-direction:column;
  gap:20px;
}
.trace-card__head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
}
.trace-card__title{
  font-size:17px;
  font-weight:700;
  color:var(--heading);
}
.trace-card__hint{
  font-size:12.5px;
  color:var(--muted);
  letter-spacing:.4px;
}
.trace-card__legend{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  font-size:12.5px;
  color:var(--muted);
}
.legend-item{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.legend-swatch{
  width:10px;height:10px;
  border-radius:3px;
  flex:none;
}
.chart{width:100%;height:auto;display:block;overflow:visible;}

/* ============================================================
   14. 四步交互区
   ============================================================ */
.steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
.step-card{
  padding:32px 26px 36px;
  display:flex;
  flex-direction:column;
  gap:16px;
  position:relative;
}
.step-card__index{
  font-size:13px;
  letter-spacing:2px;
  color:var(--gold);
  font-variant-numeric:tabular-nums;
}
.step-card__title{
  font-size:18px;
  font-weight:700;
  color:var(--heading);
}
.step-card__desc{
  font-size:13.5px;
  line-height:1.8;
  color:var(--muted);
}
.step-card__chart{
  margin-top:8px;
  width:100%;
}
.step-card__metric{
  font-size:13px;
  color:var(--body);
  letter-spacing:.3px;
  text-align:center;
  margin-top:4px;
}
.step-card__metric strong{
  color:var(--gold);
  font-weight:700;
}

/* ============================================================
   15. 系统架构区
   ============================================================ */
.arch__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
.arch-col{
  padding:34px 28px;
  display:flex;
  flex-direction:column;
  gap:18px;
}
.arch-col__label{
  font-size:12px;
  letter-spacing:2px;
  color:var(--gold);
}
.arch-col__title{
  font-size:18px;
  font-weight:700;
  color:var(--heading);
}
.arch-col__list{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.arch-col__item{
  font-size:13.5px;
  line-height:1.7;
  color:var(--muted);
  padding-left:16px;
  position:relative;
}
.arch-col__item::before{
  content:"";
  position:absolute;
  left:0;
  top:9px;
  width:5px;height:5px;
  border-radius:50%;
  background:rgba(212,175,55,.75);
}

/* ============================================================
   16. 指标区（环形进度）
   ============================================================ */
.metrics{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:24px;
}
.metric-card{
  padding:36px 24px 32px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
}
.metric-card__ring{
  width:150px;
  height:150px;
  position:relative;
}
.metric-card__ring svg{width:100%;height:100%;display:block;}
.metric-card__value{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:2px;
}
.metric-card__num{
  font-size:26px;
  font-weight:800;
  color:var(--heading);
  letter-spacing:-.5px;
  font-variant-numeric:tabular-nums;
}
.metric-card__unit{
  font-size:11.5px;
  color:var(--muted);
  letter-spacing:.6px;
}
.metric-card__label{
  font-size:13.5px;
  color:var(--body);
  text-align:center;
  line-height:1.7;
}

/* ============================================================
   17. 核心功能
   ============================================================ */
.features{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}
.feature-card{
  padding:34px 30px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.feature-card__icon{
  width:42px;height:42px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(212,175,55,0.10);
  border:1px solid rgba(212,175,55,0.28);
  color:var(--gold);
  font-size:16px;
  font-weight:700;
  letter-spacing:.5px;
}
.feature-card__title{
  font-size:17px;
  font-weight:700;
  color:var(--heading);
  margin-top:4px;
}
.feature-card__desc{
  font-size:13.5px;
  line-height:1.8;
  color:var(--muted);
}

/* ============================================================
   18. 试试问 AI
   ============================================================ */
.ask{
  padding:48px 40px 44px;
  border-radius:var(--radius-card);
  display:flex;
  flex-direction:column;
  gap:24px;
}
.ask__bar{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.ask__input{
  flex:1 1 320px;
  min-width:0;
  height:54px;
  padding:0 22px;
  border-radius:var(--radius-btn);
  background:rgba(255,255,255,0.05);
  border:1px solid var(--card-border);
  color:var(--heading);
  font-size:15px;
  outline:none;
  transition:all 400ms cubic-bezier(0.22,1,0.36,1);
}
.ask__input::placeholder{color:var(--muted);}
.ask__input:focus{
  border-color:var(--gold);
  background:rgba(255,255,255,0.08);
  box-shadow:0 0 0 3px rgba(212,175,55,.12);
}
.ask__send{
  height:54px;
  padding:0 32px;
  border-radius:var(--radius-btn);
  background:linear-gradient(135deg, #F7E7A8 0%, #D4AF37 50%, #B8912A 100%);
  color:#1A1004;
  font-size:15px;
  font-weight:700;
  border:1px solid rgba(247,231,168,.6);
  transition:all 400ms cubic-bezier(0.22,1,0.36,1);
}
.ask__send:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 34px rgba(212,175,55,.35);
}
html[data-theme="light"] .ask__send{
  color:#FFFFFF;
  background:linear-gradient(135deg, #4A0E13 0%, #B8860B 100%);
}
.ask__chips{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.chip{
  height:38px;
  padding:0 20px;
  border-radius:var(--radius-pill);
  background:var(--card-bg);
  border:1px solid var(--card-border);
  color:var(--body);
  font-size:13px;
  letter-spacing:.3px;
  transition:all 400ms cubic-bezier(0.22,1,0.36,1);
}
.chip:hover{
  background:var(--card-bg-hover);
  border-color:var(--gold);
  color:var(--heading);
  transform:translateY(-2px);
}
.chip.is-active{
  border-color:var(--gold);
  color:var(--gold);
  background:rgba(212,175,55,0.10);
}
.ask__output{
  min-height:150px;
  padding:28px 30px;
  border-radius:20px;
  background:rgba(0,0,0,0.22);
  border:1px solid var(--hairline);
  font-size:14.5px;
  line-height:1.95;
  color:var(--body);
  white-space:pre-wrap;
  word-break:break-word;
  font-family:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "PingFang SC", monospace;
}
html[data-theme="light"] .ask__output{
  background:rgba(15,23,42,0.04);
}
.ask__output .cursor{
  display:inline-block;
  width:8px;
  height:16px;
  margin-left:2px;
  vertical-align:-3px;
  background:var(--gold);
  animation:blink .9s step-end infinite;
}
@keyframes blink{
  0%,100%{opacity:1;}
  50%{opacity:0;}
}

/* ============================================================
   19. 可信度区
   ============================================================ */
.trust__grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:20px 40px;
}
.trust-item{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:20px 24px;
  border-radius:16px;
  background:rgba(255,255,255,0.025);
  border:1px solid var(--card-border);
  font-size:14px;
  line-height:1.75;
  color:var(--body);
}
.trust-item__idx{
  flex:none;
  font-size:12px;
  letter-spacing:1.2px;
  color:var(--gold);
  font-variant-numeric:tabular-nums;
  padding-top:3px;
}

/* ============================================================
   20. 数据底座 · 标签云
   ============================================================ */
.cloud{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}
.cloud-tag{
  height:40px;
  display:inline-flex;
  align-items:center;
  padding:0 20px;
  border-radius:var(--radius-pill);
  font-size:13.5px;
  letter-spacing:.4px;
  color:var(--body);
  background:var(--card-bg);
  border:1px solid var(--card-border);
  backdrop-filter:blur(24px) saturate(140%);
  -webkit-backdrop-filter:blur(24px) saturate(140%);
  transition:all 400ms cubic-bezier(0.22,1,0.36,1);
}
.cloud-tag:hover{
  color:var(--gold);
  border-color:var(--gold);
  background:rgba(212,175,55,0.08);
  transform:translateY(-3px);
}

/* ============================================================
   21. 结尾
   ============================================================ */
.footer{
  padding:80px 0 100px;
  text-align:center;
  position:relative;
  z-index:2;
}
.footer__line{
  width:100%;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(212,175,55,.45), transparent);
  margin-bottom:56px;
}
.footer__title{
  font-size:22px;
  font-weight:700;
  color:var(--heading);
  letter-spacing:.4px;
}
.footer__sign{
  margin-top:20px;
  font-size:15px;
  color:var(--body);
  letter-spacing:.4px;
}
.footer__meta{
  margin-top:12px;
  font-size:13px;
  color:var(--muted);
  letter-spacing:.3px;
}

/* ============================================================
   22. 开场动画遮罩
   ============================================================ */
.intro-overlay{
  display:none;
  position:fixed;
  inset:0;
  z-index:9999;
  background:#050508;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:36px;
  overflow:hidden;
}
.js-ready .intro-overlay{display:flex;}
.intro-overlay.is-done{
  opacity:0;
  pointer-events:none;
  transition:opacity .7s ease-out;
}
.intro-overlay__particles{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.intro-overlay__particles span{
  position:absolute;
  width:3px;height:3px;
  border-radius:50%;
  background:var(--gold);
  opacity:0;
  box-shadow:0 0 12px rgba(212,175,55,.9);
  animation:particleIn 1.6s ease-out forwards;
}
@keyframes particleIn{
  0%{opacity:0;transform:translate(var(--px), var(--py)) scale(.2);}
  55%{opacity:.9;}
  100%{opacity:.15;transform:translate(0,0) scale(1);}
}
.intro-overlay__text{
  font-size:clamp(34px, 5.8vw, 80px);
  font-weight:800;
  line-height:1.15;
  letter-spacing:4px;
  background:var(--metal);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
  text-align:center;
  padding:0 24px;
  opacity:0;
  animation:introTextIn 1.4s ease-out .35s forwards;
}
@keyframes introTextIn{
  0%{opacity:0;filter:blur(14px);transform:scale(.96);}
  100%{opacity:1;filter:blur(0);transform:scale(1);}
}
.intro-overlay__skip{
  position:absolute;
  right:28px;
  bottom:28px;
  height:40px;
  padding:0 22px;
  border-radius:var(--radius-pill);
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.05);
  color:#C4C4CC;
  font-size:13px;
  letter-spacing:1px;
  transition:all 400ms ease-out;
}
.intro-overlay__skip:hover{
  border-color:var(--gold);
  color:var(--gold);
}

/* ============================================================
   23. 真实扫描面板
   ============================================================ */
.scan{
  margin-top:24px;
  padding:28px 30px;
  border-radius:var(--radius-card);
  display:flex;
  flex-direction:column;
  gap:18px;
  background:var(--card-bg);
  backdrop-filter:blur(24px) saturate(140%);
  -webkit-backdrop-filter:blur(24px) saturate(140%);
  border:1px solid var(--card-border);
}
.scan__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.scan__title{
  font-size:16px;
  font-weight:700;
  color:var(--heading);
  letter-spacing:.2px;
}
.scan__status{
  font-size:13px;
  color:var(--gold);
  font-variant-numeric:tabular-nums;
  letter-spacing:.3px;
}
.scan__input{
  width:100%;
  min-height:140px;
  max-height:260px;
  resize:vertical;
  padding:16px 18px;
  border-radius:14px;
  background:rgba(255,255,255,0.04);
  border:1px solid var(--card-border);
  color:var(--body);
  font-size:13.5px;
  line-height:1.8;
  font-family:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "PingFang SC", monospace;
  outline:none;
  transition:all 400ms cubic-bezier(0.22,1,0.36,1);
}
html[data-theme="light"] .scan__input{
  background:rgba(15,23,42,0.03);
}
.scan__input:focus{
  border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(212,175,55,.12);
}
.scan__bar{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}
.scan__file{
  display:inline-flex;
  align-items:center;
  gap:8px;
  height:42px;
  padding:0 18px;
  border-radius:var(--radius-btn);
  background:var(--card-bg);
  border:1px solid var(--card-border);
  color:var(--body);
  font-size:13px;
  cursor:pointer;
  transition:all 400ms cubic-bezier(0.22,1,0.36,1);
}
.scan__file:hover{
  border-color:var(--gold);
  color:var(--heading);
}
.scan__file input{display:none;}
.scan__btn{
  height:42px;
  padding:0 26px;
  border-radius:var(--radius-btn);
  background:linear-gradient(135deg, #F7E7A8 0%, #D4AF37 50%, #B8912A 100%);
  color:#1A1004;
  font-size:13.5px;
  font-weight:700;
  border:1px solid rgba(247,231,168,.6);
  transition:all 400ms cubic-bezier(0.22,1,0.36,1);
}
.scan__btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(212,175,55,.32);
}
html[data-theme="light"] .scan__btn{
  color:#FFFFFF;
  background:linear-gradient(135deg, #4A0E13 0%, #B8860B 100%);
}
.scan__btn--ghost{
  background:var(--card-bg);
  color:var(--body);
  border:1px solid var(--card-border);
}
.scan__btn--ghost:hover{
  border-color:var(--gold);
  color:var(--heading);
  box-shadow:none;
}
.scan__track{
  height:6px;
  border-radius:999px;
  background:rgba(255,255,255,0.08);
  overflow:hidden;
}
html[data-theme="light"] .scan__track{
  background:rgba(15,23,42,0.10);
}
.scan__progress{
  height:100%;
  width:0%;
  border-radius:999px;
  background:var(--metal);
  transition:width .3s ease-out;
}
.scan__phases{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
.scan__phase{
  padding:10px 14px;
  border-radius:12px;
  border:1px solid var(--card-border);
  background:rgba(255,255,255,0.03);
  font-size:12.5px;
  color:var(--muted);
  transition:all 300ms ease-out;
}
html[data-theme="light"] .scan__phase{
  background:rgba(15,23,42,0.03);
}
.scan__phase.is-active{
  border-color:var(--gold);
  color:var(--heading);
}
.scan__phase.is-done{
  border-color:rgba(212,175,55,.45);
  color:var(--body);
}
.scan__result{
  display:none;
  padding-top:18px;
  border-top:1px solid var(--hairline);
  flex-direction:column;
  gap:14px;
}
.scan__result.is-show{display:flex;}
.scan__result-head{
  display:flex;
  flex-wrap:wrap;
  gap:8px 24px;
  font-size:13px;
  color:var(--body);
}
.scan__result-head b{
  color:var(--gold);
  font-weight:700;
  font-variant-numeric:tabular-nums;
}
.scan__hits{
  display:flex;
  flex-direction:column;
  gap:10px;
  max-height:460px;
  overflow-y:auto;
  padding-right:6px;
}
.scan__hit{
  padding:14px 16px;
  border-radius:12px;
  border:1px solid var(--card-border);
  background:rgba(255,255,255,0.025);
  font-size:13px;
  line-height:1.8;
  color:var(--body);
}
html[data-theme="light"] .scan__hit{
  background:rgba(15,23,42,0.025);
}
.scan__hit--high{
  border-color:rgba(212,175,55,.55);
  box-shadow:0 0 0 1px rgba(212,175,55,.18);
}
.scan__hit-top{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin-bottom:6px;
  font-size:12px;
  letter-spacing:.3px;
}
.scan__hit-tag{
  padding:2px 10px;
  border-radius:999px;
  border:1px solid var(--hairline);
  color:var(--muted);
  font-size:11px;
}
.scan__hit-tag--high{
  border-color:rgba(212,175,55,.55);
  color:var(--gold);
}
.scan__hit-where{
  color:var(--gold);
  font-size:11.5px;
}
.scan__hit-text{
  color:var(--muted);
  font-size:12.5px;
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}
.scan__empty{
  padding:16px;
  border-radius:12px;
  border:1px dashed var(--hairline);
  font-size:13px;
  color:var(--muted);
  text-align:center;
}

/* ============================================================
   24. 响应式
   ============================================================ */
@media (max-width: 1080px){
  .agents__cards{grid-template-columns:repeat(2,1fr);}
  .steps{grid-template-columns:repeat(2,1fr);}
  .arch__grid{grid-template-columns:repeat(2,1fr);}
  .metrics{grid-template-columns:repeat(2,1fr);}
  .features{grid-template-columns:repeat(2,1fr);}
  .trace__grid{grid-template-columns:1fr;}
  .research__grid{grid-template-columns:1fr;}
  .pain__evidence{grid-template-columns:1fr;}
}

@media (max-width: 768px){
  .section{padding:40px 0;}
  .section-head{margin-bottom:48px;}
  .hero{padding-top:120px;}
  .hero__title{font-size:40px;letter-spacing:-.6px;}
  .hero__sub{font-size:17px;margin-top:24px;}
  .hero__actions{margin-top:36px;}
  .saas-panel{
    grid-template-columns:1fr;
    gap:16px;
    margin-top:48px;
    padding:22px;
  }
  .saas-panel__center{white-space:normal;word-break:break-all;}
  .pain__grid{grid-template-columns:1fr;}
  .pain__vs{width:56px;height:56px;margin:0 auto;}
  .pain__headline{font-size:24px;}
  .data__grid{grid-template-columns:1fr;}
  .data-card{padding:40px 28px;}
  .data-card__num{font-size:96px;letter-spacing:-2px;}
  .agents__cards{grid-template-columns:1fr;}
  .steps{grid-template-columns:1fr;}
  .arch__grid{grid-template-columns:1fr;}
  .metrics{grid-template-columns:1fr;}
  .features{grid-template-columns:1fr;}
  .trust__grid{grid-template-columns:1fr;}
  .ask{padding:32px 22px;}
  .ask__output{padding:22px;}
  .btn{height:48px;padding:0 22px;font-size:14px;}
  .footer{padding:60px 0 80px;}
  .section-sub{font-size:15px;}
  .scan{padding:22px;}
  .scan__phases{grid-template-columns:repeat(2,1fr);}
}

@media (max-width: 480px){
  .container{padding:0 18px;}
  .hero__title{font-size:32px;}
  .data-card__num{font-size:80px;}
  .nav__brand{font-size:13.5px;}
  .scan__phases{grid-template-columns:1fr;}
  .scan__bar{gap:8px;}
  .scan__btn, .scan__file{flex:1 1 auto;justify-content:center;}
}

/* ============================================================
   25. 打印
   ============================================================ */
@media print{
  *{color:#000 !important;-webkit-text-fill-color:#000 !important;background:none !important;}
}