/* ═══════════════════════════════════════════════════════════════
   财小云 V2 — 财小云 AI 产品页（日常线：亮、快、密）
   依赖：tokens.css / base.css / home.css（nav、btn、hero-fx、eyebrow、
   phone、msg、edit-list、stat、footer、faq）
   与税无忧页（夜航）刻意明暗对照——同一科技语言，两种节奏。
   ═══════════════════════════════════════════════════════════════ */

/* ────────── §1 Hero 工作台卡（玻璃拟真 + 数据感）────────── */
.aitx-stage { position: relative; }
.aitx-card {
  position: relative; z-index: 1;
  background: var(--cxy-surface-card);   /* V2.2：实底，修复蓝图网格透卡 */
  border: var(--cxy-border-hairline) solid var(--cxy-border);
  border-radius: var(--cxy-radius-2xl);
  box-shadow: var(--cxy-elevation-2),
              inset 0 1px 0 color-mix(in srgb, var(--cxy-on-color) 55%, transparent);
  overflow: hidden;
}
:root[data-theme="dark"] .aitx-card {
  box-shadow: var(--cxy-elevation-2),
              inset 0 1px 0 color-mix(in srgb, var(--cxy-on-color) 10%, transparent);
}
.aitx-card-h {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--cxy-space-4) var(--cxy-space-5);
  border-bottom: var(--cxy-border-hairline) solid var(--cxy-border);
  position: relative;
}
.aitx-card-h::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: var(--cxy-gradient-aurora); opacity: 0.55;
}
.aitx-card-h b { font-size: var(--cxy-size-body); color: var(--cxy-ink); }
.aitx-card-body { padding: var(--cxy-space-5); display: grid; gap: var(--cxy-space-4); background: var(--cxy-surface-subtle); }
.aitx-tile {
  background: var(--cxy-surface-card); border: var(--cxy-border-hairline) solid var(--cxy-border);
  border-radius: var(--cxy-radius-lg); padding: var(--cxy-space-4) var(--cxy-space-5);
}
.aitx-label {
  display: block; font-family: var(--cxy-font-display); font-size: var(--cxy-size-label);
  font-weight: var(--cxy-weight-semibold); letter-spacing: var(--cxy-tracking-label);
  text-transform: uppercase; color: var(--cxy-muted); margin-bottom: var(--cxy-space-2);
}
.aitx-deadline-row { display: flex; align-items: baseline; gap: var(--cxy-space-2); }
.aitx-big {
  font-family: var(--cxy-font-display); font-weight: var(--cxy-weight-bold);
  font-size: 44px; line-height: 1; letter-spacing: var(--cxy-tracking-display);
  color: var(--cxy-ink); font-variant-numeric: tabular-nums;
}
.aitx-unit { font-size: var(--cxy-size-sm); font-weight: var(--cxy-weight-semibold); color: var(--cxy-ink-2); }
.aitx-tile-sub { margin-left: auto; font-size: var(--cxy-size-caption); color: var(--cxy-muted); }
.aitx-invoice { display: grid; grid-template-columns: auto 1fr; gap: var(--cxy-space-4); align-items: center; }
.aitx-invoice-num b {
  font-family: var(--cxy-font-display); font-weight: var(--cxy-weight-bold);
  font-size: var(--cxy-size-h2); color: var(--cxy-ink); font-variant-numeric: tabular-nums;
}
.aitx-invoice-num span { font-size: var(--cxy-size-caption); color: var(--cxy-muted); margin-left: var(--cxy-space-1); }
.aitx-mini { list-style: none; }
.aitx-mini li { display: flex; align-items: center; gap: var(--cxy-space-2); font-size: var(--cxy-size-caption); color: var(--cxy-ink-2); padding: 2px 0; }
.aitx-mini li em { font-style: normal; margin-left: auto; font-size: var(--cxy-size-label); color: var(--cxy-muted); }
.aitx-risk-row { display: flex; align-items: center; gap: var(--cxy-space-2); font-size: var(--cxy-size-caption); color: var(--cxy-ink-2); }

/* ────────── §2 三句口诀（并入 hero 底部的口诀带，V2.2 结构调整）──────────
   原独立白底小节上不着下不靠：上与 hero 断裂、弹码被 hero 边界裁切。
   并入 hero 后：hero 变高覆盖口诀带，hero 弹码全程落在 hero 内部不被裁。
   creed-row / creed-band 基础样式已提升为共享组件（home.css）。 */
.hero { padding-bottom: var(--cxy-space-10); }   /* 页级覆盖：口诀带收尾，底距 96→64 */
/* 页级覆盖：移除 hero 底部「淡出到白」渐变层（原用于融入下一段；
   口诀带并入后这层白渐变正好罩在带上，像挡了层玻璃） */
.hero::after {
  background: radial-gradient(34% 30% at 30% 8%, color-mix(in srgb, var(--cxy-blue) 7%, transparent), transparent 70%);
}
.hero-creed {
  position: relative; z-index: 1;   /* 抬到 hero 材质层之上 */
  margin-top: var(--cxy-space-9); padding-top: var(--cxy-space-7); border-top: var(--cxy-border-hairline) solid var(--cxy-border);
}

/* ────────── §3 四个演示：左右交替 ────────── */
.zig { display: grid; grid-template-columns: 1fr 1fr; gap: var(--cxy-space-10); align-items: center; margin-top: var(--cxy-space-9); }
.zig-r .zig-text { order: 1; }
.zig-r .zig-stage { order: 2; }
.zig-l .zig-text { order: 2; }
.zig-l .zig-stage { order: 1; }
.zig-text h3 { font-family: var(--cxy-font-cn); font-weight: var(--cxy-weight-heavy); font-size: var(--cxy-size-h3); color: var(--cxy-ink); margin: var(--cxy-space-4) 0 var(--cxy-space-3); }
.zig-text p { font-size: var(--cxy-size-body); color: var(--cxy-text); max-width: 26em; }
.zig .phone { margin: 0 auto; }
.zig .chat { min-height: 0; }   /* 演示卡不锁高 */
.aitx-listcard { width: 100%; }
/* 体检报告卡 */
.report {
  background: var(--cxy-surface-card); border: var(--cxy-border-hairline) solid var(--cxy-border);
  border-radius: var(--cxy-radius-xl); overflow: hidden; box-shadow: var(--cxy-elevation-1);
}
.report-h {
  display: flex; align-items: baseline; justify-content: space-between;
  padding: var(--cxy-space-4) var(--cxy-space-5);
  border-bottom: var(--cxy-border-hairline) solid var(--cxy-border);
  position: relative;
}
.report-h::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: var(--cxy-gradient-aurora); opacity: 0.55;
}
.report-h b { font-size: var(--cxy-size-body); color: var(--cxy-ink); }
.report-h span { font-size: var(--cxy-size-caption); color: var(--cxy-muted); }
.report-list { list-style: none; padding: var(--cxy-space-3) var(--cxy-space-5); }
.report-list li { display: flex; align-items: center; gap: var(--cxy-space-2); font-size: var(--cxy-size-sm); color: var(--cxy-ink-2); padding: var(--cxy-space-2) 0; }
.report-list li em { font-style: normal; margin-left: auto; font-size: var(--cxy-size-caption); color: var(--cxy-muted); }
.report-foot { text-align: center; font-size: var(--cxy-size-label); color: var(--cxy-muted); padding: var(--cxy-space-3) 0 var(--cxy-space-4); background: var(--cxy-surface-subtle); }

/* ────────── §4 ≤2h 满版时刻（居中大 stat）────────── */
.stat--hero { align-items: center; text-align: center; gap: var(--cxy-space-4); display: flex; flex-direction: column; }
.stat--hero h2 { font-family: var(--cxy-font-display); font-size: var(--cxy-size-h3); font-weight: var(--cxy-weight-bold); color: var(--cxy-ink); margin: 0; }
.stat--hero .stat-label { max-width: 34em; }
.stat-caveat { font-size: var(--cxy-size-caption); color: var(--cxy-muted); }

/* ────────── §5 五问五答决策树 ────────── */
.quiz { margin-top: var(--cxy-space-8); display: grid; gap: var(--cxy-space-5); }
.quiz-q { border: none; display: flex; flex-wrap: wrap; align-items: center; gap: var(--cxy-space-3); }
.quiz-q legend {
  float: left; display: flex; align-items: center; gap: var(--cxy-space-3);
  font-size: var(--cxy-size-title); font-weight: var(--cxy-weight-bold); color: var(--cxy-ink);
  margin-right: var(--cxy-space-5); padding: var(--cxy-space-2) 0;
}
.quiz-n {
  display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: var(--cxy-radius-pill);
  font-family: var(--cxy-font-num); font-size: var(--cxy-size-caption); font-weight: var(--cxy-weight-bold);
  color: var(--cxy-action); background: var(--cxy-tint-blue-bg);
}
.quiz-opt { position: relative; }
.quiz-opt input { position: absolute; opacity: 0; pointer-events: none; }
.quiz-opt span {
  display: inline-flex; padding: var(--cxy-space-2) var(--cxy-space-5);
  border: var(--cxy-border-hairline) solid var(--cxy-border); border-radius: var(--cxy-radius-pill);
  font-size: var(--cxy-size-sm); color: var(--cxy-ink-2); background: var(--cxy-surface-card);
  cursor: pointer;
  transition: border-color var(--cxy-duration-fast) var(--cxy-ease-standard),
              color var(--cxy-duration-fast) var(--cxy-ease-standard),
              background var(--cxy-duration-fast) var(--cxy-ease-standard);
}
.quiz-opt:hover span { border-color: var(--cxy-border-strong); }
.quiz-opt input:checked + span {
  border-color: var(--cxy-action); color: var(--cxy-tint-blue-fg);
  background: var(--cxy-tint-blue-bg); font-weight: var(--cxy-weight-semibold);
}
.quiz-opt input:focus-visible + span { box-shadow: var(--cxy-ring); }
.quiz-result { margin-top: var(--cxy-space-3); }
.quiz-result-card {
  background: var(--cxy-gradient-soft); border-radius: var(--cxy-radius-xl);
  padding: var(--cxy-space-7); display: flex; flex-direction: column; align-items: flex-start; gap: var(--cxy-space-3);
}
.quiz-result-card h3 { font-family: var(--cxy-font-cn); font-weight: var(--cxy-weight-heavy); font-size: var(--cxy-size-h3); color: var(--cxy-ink); }
.quiz-result-card p { font-size: var(--cxy-size-body); color: var(--cxy-text); }
.quiz-result-ctas { display: flex; gap: var(--cxy-space-4); margin-top: var(--cxy-space-2); }

/* ────────── §6 定价区 ────────── */
.price-toggle {
  display: inline-flex; background: var(--cxy-subtle-2); border-radius: var(--cxy-radius-pill);
  padding: 3px; gap: 2px;
}
.price-toggle-btn {
  padding: var(--cxy-space-2) var(--cxy-space-5); border-radius: var(--cxy-radius-pill);
  font-size: var(--cxy-size-sm); font-weight: var(--cxy-weight-semibold); color: var(--cxy-muted);
  transition: background var(--cxy-duration-fast) var(--cxy-ease-standard),
              color var(--cxy-duration-fast) var(--cxy-ease-standard),
              box-shadow var(--cxy-duration-fast) var(--cxy-ease-standard);
}
.price-toggle-btn.is-active { background: var(--cxy-surface-card); color: var(--cxy-ink); box-shadow: var(--cxy-elevation-1); }
.price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--cxy-space-6); margin-top: var(--cxy-space-8); }
.price-card {
  background: var(--cxy-surface-card); border: var(--cxy-border-hairline) solid var(--cxy-border);
  border-radius: var(--cxy-radius-xl); padding: var(--cxy-space-7);
  display: flex; flex-direction: column;
  box-shadow: var(--cxy-elevation-1);   /* V2.2：默认有影 */
  transition: transform var(--cxy-duration-base) var(--cxy-ease-out),
              box-shadow var(--cxy-duration-base) var(--cxy-ease-out),
              border-color var(--cxy-duration-base) var(--cxy-ease-standard);
}
.price-card:hover { transform: translateY(-3px); box-shadow: var(--cxy-elevation-2); border-color: var(--cxy-border-strong); }
/* L0 免费档：极光浅底高亮 + 顶部签名条（全页唯一「主推视觉」） */
.price-card-l0 { background: var(--cxy-gradient-soft); position: relative; overflow: hidden; }
.price-card-l0::before {
  content: ""; position: absolute; left: 0; top: 0; right: 0; height: 4px;
  background: var(--cxy-gradient-aurora);
}
.price-card-h { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cxy-space-3); }
.price-id {
  font-family: var(--cxy-font-display); font-size: var(--cxy-size-label); font-weight: var(--cxy-weight-bold);
  letter-spacing: var(--cxy-tracking-label); color: var(--cxy-action);
}
.price-card-h h3 { font-size: var(--cxy-size-title); font-weight: var(--cxy-weight-bold); color: var(--cxy-ink); flex: 1; }
.price-flag { font-size: var(--cxy-size-label); font-weight: var(--cxy-weight-bold); padding: 2px var(--cxy-space-2); border-radius: var(--cxy-radius-pill); }
.price-flag-free { color: var(--cxy-tint-green-fg); background: var(--cxy-tint-green-bg); }
.price-flag-roll { color: var(--cxy-tint-cyan-fg); background: var(--cxy-tint-cyan-bg); }
.price-card-price { margin: var(--cxy-space-5) 0; color: var(--cxy-ink); }
.price-cur { font-family: var(--cxy-font-num); font-size: var(--cxy-size-h3); font-weight: var(--cxy-weight-semibold); }
.price-num {
  font-family: var(--cxy-font-num); font-weight: var(--cxy-weight-bold);
  font-size: 44px; letter-spacing: var(--cxy-tracking-display); font-variant-numeric: tabular-nums;
}
.price-card-l0 .price-num, .price-card-l5 .price-num { font-size: var(--cxy-size-h2); }
.price-unit { font-size: var(--cxy-size-sm); color: var(--cxy-muted); margin-left: var(--cxy-space-1); }
.price-feats { list-style: none; margin-bottom: var(--cxy-space-7); }
.price-feats li {
  font-size: var(--cxy-size-sm); color: var(--cxy-text);
  padding: var(--cxy-space-2) 0 var(--cxy-space-2) var(--cxy-space-5); position: relative;
}
.price-feats li::before {
  content: ""; position: absolute; left: 0; top: calc(50% - 3px);
  width: 6px; height: 6px; border-radius: 50%; background: var(--cxy-action);
}
.price-card-cta { margin-top: auto; }
.price-card-cta .btn { width: 100%; }
.price-notes { list-style: none; margin-top: var(--cxy-space-7); }
.price-notes li { font-size: var(--cxy-size-caption); color: var(--cxy-muted); padding: var(--cxy-space-1) 0; }

/* 价值锚 */
.value-anchor {
  margin-top: var(--cxy-space-9); padding: var(--cxy-space-8);
  background: var(--cxy-surface-card); border: var(--cxy-border-hairline) solid var(--cxy-border);
  border-radius: var(--cxy-radius-xl);
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--cxy-space-6) var(--cxy-space-8);
}
.value-col { text-align: center; }
.value-label { display: block; font-size: var(--cxy-size-caption); color: var(--cxy-muted); margin-bottom: var(--cxy-space-2); }
.value-num {
  font-family: var(--cxy-font-num); font-weight: var(--cxy-weight-bold);
  font-size: clamp(30px, 3.4vw, 44px); color: var(--cxy-ink); letter-spacing: var(--cxy-tracking-display);
  font-variant-numeric: tabular-nums;
}
.value-col:first-child .value-num {
  background-image: var(--cxy-gradient-aurora);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
:root[data-theme="dark"] .value-col:first-child .value-num {
  background-image: linear-gradient(135deg, var(--cxy-tint-blue-fg), var(--cxy-tint-cyan-fg));
}
.value-vs { font-size: var(--cxy-size-caption); color: var(--cxy-faint); }
.value-note { flex-basis: 100%; text-align: center; font-size: var(--cxy-size-sm); color: var(--cxy-text); margin-top: var(--cxy-space-2); }

/* ────────── 响应式 ────────── */
@media (max-width: 960px) {
  .zig, .zig-r .zig-text, .zig-r .zig-stage, .zig-l .zig-text, .zig-l .zig-stage { grid-template-columns: 1fr; order: initial; }
  .zig { gap: var(--cxy-space-6); }
  .creed-row, .price-grid { grid-template-columns: 1fr; }
  .quiz-q legend { width: 100%; margin-right: 0; }
}

/* ═══ V2.1：能力 Bento + 分层定价 ═══ */
.cap-grid {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--cxy-space-6);
  margin-top: var(--cxy-space-9);
}
.cap-grid .zig {
  grid-template-columns: 1fr;
  align-items: stretch;
  gap: var(--cxy-space-6);
  margin: 0;
  padding: var(--cxy-space-7);
  border: var(--cxy-border-hairline) solid var(--cxy-border);
  border-radius: var(--cxy-radius-xl);
  background: var(--cxy-surface-card);
}
.cap-grid .zig:nth-child(1),
.cap-grid .zig:nth-child(4) { grid-column: span 7; }
.cap-grid .zig:nth-child(2),
.cap-grid .zig:nth-child(3) { grid-column: span 5; }
.cap-grid .zig-text,
.cap-grid .zig-stage { order: initial; }
.cap-grid .zig-stage { margin-top: auto; }
.cap-grid .phone { width: 100%; }
.cap-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  margin-top: var(--cxy-space-5);
  padding: 0 var(--cxy-space-5);
  border: var(--cxy-border-hairline) solid var(--cxy-border);
  border-radius: var(--cxy-radius-md);
  background: var(--cxy-surface-subtle);
  color: var(--cxy-action);
  font-size: var(--cxy-size-sm);
  font-weight: var(--cxy-weight-semibold);
}

.price-group { margin-top: var(--cxy-space-8); }
.price-group + .price-group { margin-top: var(--cxy-space-10); }
.price-group-label {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 var(--cxy-space-4);
  border-radius: var(--cxy-radius-pill);
  background: var(--cxy-tint-blue-bg);
  color: var(--cxy-tint-blue-fg);
  font-family: var(--cxy-font-display);
  font-size: var(--cxy-size-caption);
  font-weight: var(--cxy-weight-bold);
  letter-spacing: var(--cxy-tracking-label);
}
.price-group .price-grid { margin-top: var(--cxy-space-4); }
.price-group-future .price-group-label {
  background: var(--cxy-tint-cyan-bg);
  color: var(--cxy-tint-cyan-fg);
}
.price-card--future {
  background: var(--cxy-surface-subtle);
  border-style: dashed;
  box-shadow: none;
}
.price-card--future:hover { box-shadow: var(--cxy-elevation-1); }
.price-detail-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-bottom: var(--cxy-space-4);
  border: var(--cxy-border-hairline) solid var(--cxy-border);
  border-radius: var(--cxy-radius-md);
  color: var(--cxy-action);
  font-size: var(--cxy-size-sm);
  font-weight: var(--cxy-weight-semibold);
}

@media (max-width: 960px) {
  .cap-grid { grid-template-columns: 1fr; }
  .cap-grid .zig { grid-column: 1; }
}
@media (max-width: 768px) {
  .cap-grid .zig { padding: var(--cxy-space-6); }
  .cap-toggle { display: inline-flex; }
  .cap-grid .zig-stage { display: none; }
  .cap-grid .zig.is-open .zig-stage { display: block; }
  .price-group + .price-group { margin-top: var(--cxy-space-8); }
  .price-card--future { padding: var(--cxy-space-6); }
  .price-detail-toggle { display: inline-flex; }
  .price-card--future .price-feats { display: none; }
  .price-card--future.is-open .price-feats { display: block; }
}

/* ── V16 回迁（260720）：选档决策树无 JS 兜底表 ── */
.quiz-fallback { background: var(--cxy-subtle); border-radius: var(--cxy-radius-lg); padding: var(--cxy-space-6) var(--cxy-space-8); }
.quiz-fallback h3 { font-family: var(--cxy-font-cn); font-weight: var(--cxy-weight-bold); font-size: var(--cxy-size-title); color: var(--cxy-ink); margin: 0 0 var(--cxy-space-4); }
.quiz-table { width: 100%; border-collapse: collapse; font-size: var(--cxy-size-sm); color: var(--cxy-ink-2); }
.quiz-table th, .quiz-table td { text-align: left; padding: 10px var(--cxy-space-3); border-bottom: var(--cxy-border-hairline) solid var(--cxy-border); }
.quiz-table th { font-weight: var(--cxy-weight-semibold); color: var(--cxy-muted); font-size: var(--cxy-size-label); }