/* --------------------------------------------------------------------------
   §3.16 首页专用组件（index.html）
   -------------------------------------------------------------------------- */

/* 价值证明带 .value-band（深色窄条，3 个数字锚点） */
.value-band {
  background: var(--ink-900);
  border-top: 1px solid var(--ink-800);
  border-bottom: 1px solid var(--ink-800);
  padding: 40px 0;
}
.value-band__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  text-align: center;
}
.value-band__item b {
  display: block;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.01em;
  background: var(--grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  margin-bottom: 4px;
}
.value-band__item span { font-size: 14px; color: var(--ink-300); }

/* 功能速览分组 .feat-group（热点 / 主力 / 全局） */
.feat-group {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.feat-group__col {
  background: var(--paper-50);
  border: 1px solid var(--paper-200);
  border-radius: 16px;
  padding: 24px;
}
.feat-group__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
  color: var(--ink-950);
  margin-bottom: 8px;
}
.feat-group__tag {
  font-size: 12px;
  font-weight: 500;
  color: var(--brand-600);
  background: var(--brand-50);
  border: 1px solid var(--brand-100);
  border-radius: 999px;
  padding: 2px 10px;
  white-space: nowrap;
}
.feat-item {
  padding: 14px 0;
  border-top: 1px dashed var(--paper-200);
}
.feat-item:first-child { border-top: none; padding-top: 0; }
.feat-item:last-child  { padding-bottom: 0; }
.feat-item__name {
  font-size: 14px;
  font-weight: 600;
  color: var(--ink-950);
  margin-bottom: 2px;
}
.feat-item__desc {
  font-size: 13px;
  color: var(--ink-500);
  line-height: 1.6;
}
.feat-more {
  text-align: center;
  font-size: 14px;
  color: var(--ink-500);
  margin-top: 32px;
}
.feat-more b { color: var(--ink-950); }

/* 下载与安装区 .install-wrap */
.install-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
}
.dl-card {
  text-align: center;
  align-self: start;
}
.dl-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin: 16px 0;
}
.dl-card__req {
  font-size: 13px;
  color: var(--ink-500);
  line-height: 1.6;
  margin-top: 12px;
}
.install-steps-title { margin-bottom: 16px; }
.tip-bar--cta {
  max-width: none;
  margin: 20px 0 0;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.tip-bar--cta .btn { flex-shrink: 0; }

/* 收银台 .qr-card */
.buy-flow { margin-bottom: 48px; }
.qr-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.qr-card {
  background: var(--paper-0);
  border: 1px solid var(--paper-200);
  border-radius: 16px;
  padding: 24px;
  box-shadow: var(--shadow-card);
  text-align: center;
}
.qr-card__name {
  font-size: 15px;
  font-weight: 600;
  margin-bottom: 16px;
}
.qr-card__img {
  width: 200px;
  height: 200px;
  margin: 0 auto 12px;
  border: 1px solid var(--paper-200);
  border-radius: 12px;
  background: var(--paper-100);
  overflow: hidden;
}
.qr-card__img img { width: 100%; height: 100%; object-fit: contain; }
.qr-card__note {
  font-size: 13px;
  color: var(--ink-500);
  line-height: 1.6;
}
.qr-card__note b { color: var(--ink-950); }

/* 信任与售后 4 条 .buy-notes */
.buy-notes {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 28px;
  justify-content: center;
  font-size: 13px;
  color: var(--ink-500);
  margin-top: 40px;
}
.buy-notes span { display: inline-flex; align-items: center; gap: 6px; }
.buy-notes .ok { color: var(--ok-green); font-weight: 700; }

/* 价格卡顶部产品线标签 */
.price-card__product {
  display: inline-block;
  font-size: 12px;
  color: var(--ink-300);
  margin-bottom: 6px;
}

/* 首页组件移动端适配 */
@media (max-width: 1023px) {
  .feat-group   { grid-template-columns: 1fr; }
  .install-wrap { grid-template-columns: 1fr; gap: 32px; }
  .qr-grid      { grid-template-columns: 1fr; }
}
@media (max-width: 639px) {
  .value-band__grid { grid-template-columns: 1fr; gap: 20px; }
  .value-band__item b { font-size: 28px; }
  .qr-card__img { width: 100%; max-width: 220px; height: auto; }
  .buy-notes { justify-content: flex-start; }
}/* --------------------------------------------------------------------------
   §3.16b 首页紧凑化覆盖（V1.3 · 用户反馈"太浪费版面"，仅作用 index.html）
   方式：body.page-index 前缀 → 特异性高于全局共享规则，不影响 features/partner
   -------------------------------------------------------------------------- */
body.page-index .hero { padding: 48px 0 56px; }
body.page-index .hero__badges { margin-bottom: 20px; }
body.page-index .hero__title { margin-bottom: 16px; }
body.page-index .hero__sub { margin-bottom: 24px; }
body.page-index .hero__ctas { margin-bottom: 20px; }
body.page-index .hero__trust { margin-bottom: 24px; }

/* 首页截图锚点 */
.hero-shot { padding-top: 0; }
.hero-shot__wrap { text-align: center; }
.hero-shot__img { max-width: 100%; height: auto; aspect-ratio: 1220/849; border-radius: 8px; box-shadow: 0 4px 24px rgba(0,0,0,0.12); }

body.page-index .section-pad { padding: 44px 0; }
body.page-index .section-header { margin-bottom: 28px; }
body.page-index .section-header__sub { margin-top: 8px; }

body.page-index .feat-group__col { padding: 20px; }
body.page-index .feat-item { padding: 10px 0; }
body.page-index .feat-more { margin-top: 24px; }

body.page-index .price-card { padding: 32px 28px; }
body.page-index .price-card__name { margin-bottom: 8px; }
body.page-index .price-card__anchor { margin-bottom: 14px; }
body.page-index .price-card__divider { margin: 0 0 14px; }
body.page-index .price-card__perks { margin-bottom: 16px; }
body.page-index .price-card__perk { margin-bottom: 6px; }

body.page-index .buy-flow { margin-bottom: 32px; }
body.page-index .qr-card { padding: 20px; }
body.page-index .buy-notes { margin-top: 28px; }

body.page-index .dl-card__meta { margin: 12px 0; }
body.page-index .install-steps-title { margin-bottom: 12px; }
body.page-index .step__num { margin-bottom: 8px; }
body.page-index .step__title { margin-bottom: 4px; }
body.page-index .tip-bar { margin-top: 24px; }

@media (max-width: 1023px) {
  body.page-index .hero { padding: 40px 0 48px; }
  body.page-index .section-pad { padding: 36px 0; }
}
@media (max-width: 639px) {
  body.page-index .section-pad { padding: 32px 0; }
  body.page-index .hero__badges { margin-bottom: 16px; }
  body.page-index .hero__sub { margin-bottom: 20px; }
  body.page-index .hero__trust { margin-bottom: 20px; }
  body.page-index .section-header { margin-bottom: 24px; }
}

/* --------------------------------------------------------------------------
   §3.16c 首页 V1.4 结构收敛组件（index.html）
   购买收敛为单一区；下载区双路径分流（已有码 / 没码）
   -------------------------------------------------------------------------- */
/* 首屏消除疑虑行（下载免费，不是先收费） */
.hero__hint {
  text-align: center;
  font-size: 14px;
  color: var(--ink-300);
  margin-top: 20px;
}

/* 价格与付款一体区（同区滚动） */
.pay-zone {
  margin-top: 56px;
  border-top: 1px solid var(--paper-200);
  padding-top: 40px;
}
.pay-zone__head { text-align: center; margin-bottom: 32px; }
.pay-zone__head .text-sub { margin-top: 6px; }

/* 下载区分流：两类用户两个明确入口 */
.split-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 24px;
}
.split-row__item {
  background: var(--paper-0);
  border: 1px solid var(--paper-200);
  border-radius: 12px;
  padding: 16px 20px;
}
.split-row__item--cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.split-row__tag {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: var(--brand-600);
  background: var(--brand-50);
  border: 1px solid var(--brand-100);
  border-radius: 999px;
  padding: 2px 10px;
  margin-bottom: 6px;
}
.split-row__item p { font-size: 13px; color: var(--ink-500); line-height: 1.6; }
.split-row__item--cta p { margin: 0; }
.split-row__item--cta .btn { flex-shrink: 0; }
@media (max-width: 639px) {
  .split-row { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   §3.16d 价格卡 = 收款台（V1.7：二维码直接印在价格卡上，无中间跳转）
   -------------------------------------------------------------------------- */
.anchor { display: block; height: 0; }
.price-card__pay {
  border-top: 1px dashed var(--paper-200);
  margin-top: 20px;
  padding-top: 16px;
}
.price-card__pay-title {
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-950);
  margin-bottom: 12px;
}
.price-card__qrs { display: flex; gap: 12px; justify-content: center; }
.qr-mini { text-align: center; }
.qr-mini img {
  width: 150px; height: 150px;
  border: 1px solid var(--paper-200);
  border-radius: 10px;
  background: var(--paper-100);
  object-fit: contain;
}
.qr-mini span { display: block; font-size: 12px; color: var(--ink-500); margin-top: 6px; }
.price-card__pay-note {
  text-align: center;
  font-size: 12px;
  color: var(--ink-500);
  margin-top: 10px;
  line-height: 1.5;
}
.qr-grid--single {
  grid-template-columns: 1fr;
  max-width: 320px;
  margin: 0 auto;
}
@media (max-width: 639px) {
  .qr-mini img { width: 120px; height: 120px; }
}

/* ==========================================================================
   桑田路AI复盘助手官网 — 共享样式 common.css
   依据：_output/design-spec.md V1.0（2026-08-05）
   约束：纯 CSS，零 JS 依赖；响应式断点 ≥1024 / 640–1023 / <640
   ========================================================================== */

/* --------------------------------------------------------------------------
   §一、配色体系（CSS 自定义属性）
   -------------------------------------------------------------------------- */
:root {
  /* 1.1 墨色阶 */
  --ink-950: #0A0C12;
  --ink-900: #10131C;
  --ink-800: #181C28;
  --ink-700: #252A3A;
  --ink-500: #4A5168;
  --ink-300: #A8ADC0;
  --ink-100: #E4E6EE;

  /* 1.2 纸色阶 */
  --paper-0:   #FFFFFF;
  --paper-50:  #F7F8FB;
  --paper-100: #EEF0F5;
  --paper-200: #E3E6EE;
  --paper-300: #CBD0DD;

  /* 1.3 品牌主色（靛蓝紫） */
  --brand-700: #4F46E5;
  --brand-600: #5B54F0;
  --brand-500: #6E63F6;
  --brand-400: #8B7CFF;
  --brand-100: #ECEBFF;
  --brand-50:  #F5F4FF;
  --grad-brand: linear-gradient(135deg, #5B54F0 0%, #8B7CFF 100%);
  --grad-hero: radial-gradient(1200px 600px at 50% -10%, rgba(110,99,246,.28), transparent 60%);

  /* 1.4 语义色 */
  --up-red:       #E5484D;
  --up-red-soft:  #FDEBEC;
  --ok-green:     #22A06B;
  --warn-amber:   #D97706;

  /* 1.5 阴影 / 玻璃 */
  --shadow-card:       0 1px 2px rgba(16,19,28,.06), 0 4px 16px rgba(16,19,28,.06);
  --shadow-lift:       0 4px 8px rgba(16,19,28,.08), 0 12px 32px rgba(16,19,28,.12);
  --shadow-screenshot: 0 8px 24px rgba(10,12,18,.18), 0 24px 64px rgba(10,12,18,.22);
  --glass-light: rgba(255,255,255,.72);
  --glass-dark:  rgba(16,19,28,.72);
}

/* 全局焦点可见样式 */
:focus-visible { outline: 2px solid var(--brand-600); outline-offset: 2px; border-radius: 4px; }

/* --------------------------------------------------------------------------
   §二、基础重置 & 字体层级
   -------------------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  font-family: -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  font-size: 16px;
  line-height: 1.7;
  color: var(--ink-950);
  background: var(--paper-0);
  -webkit-font-smoothing: antialiased;
  scroll-behavior: smooth;
}

body { min-height: 100vh; display: flex; flex-direction: column; }

img { max-width: 100%; height: auto; display: block; }
a   { color: inherit; text-decoration: none; transition: color .15s ease; }
ul  { list-style: none; }

/* 字体层级工具类 */
.text-display { font-size: 56px; font-weight: 700; line-height: 1.15; letter-spacing: -0.02em; }
.text-h1      { font-size: 40px; font-weight: 700; line-height: 1.2;  letter-spacing: -0.01em; }
.text-h2      { font-size: 32px; font-weight: 700; line-height: 1.25; letter-spacing: -0.01em; }
.text-h3      { font-size: 20px; font-weight: 600; line-height: 1.4; }
.text-body    { font-size: 16px; font-weight: 400; line-height: 1.7; }
.text-small   { font-size: 14px; font-weight: 400; line-height: 1.6; }
.text-caption { font-size: 12px; font-weight: 400; line-height: 1.5; letter-spacing: 0.02em; }
.text-price   { font-size: 48px; font-weight: 700; line-height: 1.1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }

/* 渐变文字 */
.grad-text {
  background: var(--grad-brand);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* 深色区文字覆盖 */
.dark-zone            { color: var(--ink-100); }
.dark-zone .text-sub  { color: var(--ink-300); }

/* 副标统一色 */
.text-sub { color: var(--ink-500); }
.dark-zone .text-sub { color: var(--ink-300); }

/* --------------------------------------------------------------------------
   §三、布局骨架
   -------------------------------------------------------------------------- */
.container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 24px;
}

.section-pad  { padding: 72px 0; }
.section-narrow { padding: 64px 0; }

/* 背景带 */
.bg-paper-0  { background: var(--paper-0); }
.bg-paper-50 { background: var(--paper-50); }
.bg-ink-950  { background: var(--ink-950); color: var(--ink-100); }
.bg-ink-900  { background: var(--ink-900); color: var(--ink-100); }

/* --------------------------------------------------------------------------
   §3.1 顶导航 .nav
   -------------------------------------------------------------------------- */
.nav {
  position: sticky;
  top: 0;
  z-index: 100;
  height: 64px;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--paper-200);
}

.nav--light {
  background: var(--glass-light);
  border-bottom-color: var(--paper-200);
}

.nav--dark {
  background: var(--glass-dark);
  border-bottom-color: var(--ink-700);
}

.nav__inner {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 24px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nav__brand {
  font-size: 18px;
  font-weight: 700;
  color: var(--ink-950);
  white-space: nowrap;
}
.nav--dark .nav__brand { color: var(--ink-100); }
.nav__brand span { color: var(--brand-600); }

.nav__links {
  display: flex;
  gap: 32px;
  align-items: center;
}

.nav__link {
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-500);
  position: relative;
  padding-bottom: 2px;
  transition: color .15s ease;
}
.nav--dark .nav__link { color: var(--ink-300); }

.nav__link:hover,
.nav__link.is-active {
  color: var(--ink-950);
}
.nav--dark .nav__link:hover,
.nav--dark .nav__link.is-active {
  color: var(--ink-100);
}

.nav__link.is-active::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -2px;
  height: 2px;
  background: var(--brand-600);
  border-radius: 1px;
}

/* --------------------------------------------------------------------------
   §3.2 按钮 .btn
   -------------------------------------------------------------------------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 24px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border: none;
  transition: all .2s ease;
  white-space: nowrap;
}

.btn-primary {
  background: var(--grad-brand);
  color: #fff;
  box-shadow: 0 2px 8px rgba(91,84,240,.35);
}
.btn-primary:hover {
  filter: brightness(1.06);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(91,84,240,.45);
}
.btn-primary:active { transform: translateY(0); }

.btn-secondary {
  background: transparent;
  border: 1px solid var(--paper-300);
  color: var(--ink-950);
}
.btn-secondary:hover { background: var(--paper-100); }

/* 深色区次级按钮 */
.btn-secondary--dark {
  border-color: var(--ink-500);
  color: var(--ink-100);
}
.btn-secondary--dark:hover { background: var(--ink-800); }

.btn-ghost {
  background: transparent;
  border: none;
  color: var(--brand-600);
  padding: 0;
  height: auto;
  font-weight: 500;
}
.btn-ghost:hover { text-decoration: underline; }

.btn-ghost--dark { color: var(--brand-400); }

.btn-lg {
  height: 52px;
  padding: 0 32px;
  font-size: 16px;
}

.btn-sm {
  height: 36px;
  padding: 0 18px;
  font-size: 13px;
}

.btn-block { width: 100%; }

/* --------------------------------------------------------------------------
   §3.3 徽章 .badge
   -------------------------------------------------------------------------- */
.badge {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}

.badge--brand {
  background: var(--brand-50);
  color: var(--brand-600);
  border: 1px solid var(--brand-100);
}

.badge--dark {
  background: rgba(110,99,246,.15);
  color: var(--brand-400);
  border: none;
}

.badge--neutral {
  background: var(--paper-100);
  color: var(--ink-500);
  border: none;
}

.badge--grad {
  background: var(--grad-brand);
  color: #fff;
  border: none;
}

.badge--sm {
  height: 22px;
  font-size: 11px;
}

/* --------------------------------------------------------------------------
   §3.4 通用卡片 .card
   -------------------------------------------------------------------------- */
.card {
  background: var(--paper-0);
  border: 1px solid var(--paper-200);
  border-radius: 16px;
  padding: 32px;
  box-shadow: var(--shadow-card);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lift);
  border-color: var(--brand-100);
}

.card__icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--brand-50);
  color: var(--brand-600);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  margin-bottom: 16px;
}

.card__title { margin-bottom: 8px; }
.card__desc  { color: var(--ink-500); font-size: 14px; line-height: 1.6; margin-bottom: 12px; }

/* --------------------------------------------------------------------------
   §3.5 价格卡 .price-card
   -------------------------------------------------------------------------- */
.price-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  max-width: 880px;
  margin: 0 auto;
}

.price-card {
  background: var(--paper-0);
  border: 1px solid var(--paper-200);
  border-radius: 16px;
  padding: 40px 32px;
  box-shadow: var(--shadow-card);
  display: flex;
  flex-direction: column;
  position: relative;
  transition: transform .25s ease, box-shadow .25s ease;
}

/* 推荐卡差异 */
.price-card--recommended {
  border: 2px solid var(--brand-600);
  background: linear-gradient(180deg, var(--paper-0) 0%, var(--brand-50) 100%);
  box-shadow: var(--shadow-lift);
}

.price-card__badge {
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
}

.price-card__name { margin-bottom: 12px; }

.price-card__price-row {
  display: flex;
  align-items: baseline;
  gap: 4px;
  margin-bottom: 8px;
}
.price-card__prefix  { font-size: 24px; font-weight: 700; color: var(--ink-950); }
.price-card__suffix  { font-size: 14px; color: var(--ink-500); font-weight: 400; }

.price-card__anchor {
  font-size: 14px;
  color: var(--brand-600);
  margin-bottom: 20px;
}

.price-card__divider {
  border: none;
  border-top: 1px solid var(--paper-200);
  margin: 0 0 20px;
}

.price-card__perks {
  flex: 1;
  margin-bottom: 24px;
}
.price-card__perk {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ink-950);
  margin-bottom: 8px;
}
.price-card__perk::before {
  content: "✓";
  color: var(--ok-green);
  font-weight: 700;
  flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   §3.6 版本信息条 .version-bar
   -------------------------------------------------------------------------- */
.version-bar {
  height: 48px;
  background: var(--paper-50);
  border-top: 1px solid var(--paper-200);
  border-bottom: 1px solid var(--paper-200);
  display: flex;
  align-items: center;
  justify-content: center;
}

.version-bar__inner {
  font-size: 14px;
  color: var(--ink-500);
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: center;
}

.version-bar__sep { color: var(--paper-300); }

/* --------------------------------------------------------------------------
   §3.7 功能展示行 .feature-row
   -------------------------------------------------------------------------- */
.feature-row { padding: 64px 0; }

.feature-row__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
}

/* 偶数行镜像：图左文右 */
.feature-row--reverse .feature-row__inner {
  direction: rtl;
}
.feature-row--reverse .feature-row__inner > * {
  direction: ltr;
}

.feature-row__num {
  font-size: 14px;
  font-weight: 700;
  color: var(--brand-600);
  letter-spacing: .08em;
  line-height: 1;
  margin-bottom: 8px;
}

.feature-row__title { margin-bottom: 16px; }

.feature-row__desc {
  color: var(--ink-500);
  font-size: 16px;
  line-height: 1.7;
  margin-bottom: 20px;
  max-width: 420px;
}

/* --------------------------------------------------------------------------
   §3.8 截图卡 .shot
   -------------------------------------------------------------------------- */
.shot {
  background: var(--paper-100);
  border-radius: 20px;
  padding: 24px;
}

.shot--dark {
  background: var(--ink-900);
}

.shot__frame {
  border-radius: 12px;
  border: 1px solid var(--paper-200);
  box-shadow: var(--shadow-screenshot);
  overflow: hidden;
  transition: transform .3s ease;
}
.shot__frame:hover { transform: scale(1.01); }

.shot__frame img {
  width: 100%;
  height: auto;
  display: block;
}

/* Hero 主截图渐变描边 */
.shot--hero .shot__frame {
  padding: 1px;
  background: var(--grad-brand);
  border: none;
}
.shot--hero .shot__frame img {
  border-radius: 11px;
}

.shot__caption {
  text-align: center;
  font-size: 12px;
  color: var(--ink-500);
  margin-top: 12px;
}
.shot--dark .shot__caption { color: var(--ink-300); }

/* --------------------------------------------------------------------------
   §3.9 步骤条 .steps
   -------------------------------------------------------------------------- */
.steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  position: relative;
}

/* 连接线 */
.steps::before {
  content: "";
  position: absolute;
  top: 16px;
  left: calc(16.67% + 16px);
  right: calc(16.67% + 16px);
  height: 0;
  border-top: 1px dashed var(--paper-300);
  z-index: 0;
}

.step {
  text-align: center;
  position: relative;
  z-index: 1;
}

.step__num {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--brand-50);
  color: var(--brand-600);
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
}

.step__title { margin-bottom: 6px; }
.step__desc  { font-size: 14px; color: var(--ink-500); line-height: 1.6; }

/* SmartScreen 提示条 */
.tip-bar {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  max-width: 640px;
  margin: 32px auto 0;
  padding: 14px 18px;
  background: #FFFBEB;
  border: 1px solid #FDE68A;
  border-radius: 10px;
  font-size: 14px;
  color: var(--ink-950);
  line-height: 1.6;
}
.tip-bar__icon {
  color: var(--warn-amber);
  font-size: 16px;
  flex-shrink: 0;
  line-height: 1.6;
}


/* --------------------------------------------------------------------------
   §3.11 页脚 .footer
   -------------------------------------------------------------------------- */
.footer {
  background: var(--ink-950);
  color: var(--ink-300);
  border-top: 1px solid var(--ink-800);
  padding: 48px 0;
  margin-top: auto;
}

.footer__links {
  display: flex;
  gap: 24px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.footer__link {
  font-size: 14px;
  color: var(--ink-300);
  transition: color .15s ease;
}
.footer__link:hover { color: var(--ink-100); }

.footer__disclaimer {
  text-align: center;
  font-size: 12px;
  color: var(--ink-500);
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.footer__disclaimer-icon { color: var(--warn-amber); font-size: 14px; }

.footer__copyright {
  text-align: center;
  font-size: 12px;
  color: var(--ink-500);
}


/* --------------------------------------------------------------------------
   §3.13 合作招募条 .recruit-bar
   -------------------------------------------------------------------------- */
.recruit-bar {
  background: var(--ink-900);
  padding: 32px 0;
  text-align: center;
}
.recruit-bar__text {
  font-size: 16px;
  color: var(--ink-100);
  margin-bottom: 12px;
}

/* --------------------------------------------------------------------------
   Hero 区块专用
   -------------------------------------------------------------------------- */
.hero {
  background: var(--ink-950);
  position: relative;
  overflow: hidden;
  padding: 80px 0 96px;
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--grad-hero);
  pointer-events: none;
}

.hero__badges {
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 28px;
}

.hero__title {
  text-align: center;
  margin-bottom: 20px;
}

.hero__sub {
  text-align: center;
  font-size: 18px;
  color: var(--ink-300);
  max-width: 540px;
  margin: 0 auto 32px;
  line-height: 1.7;
}

.hero__ctas {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 28px;
}

.hero__trust {
  display: flex;
  gap: 20px;
  justify-content: center;
  flex-wrap: wrap;
  font-size: 14px;
  color: var(--ink-300);
  margin-bottom: 48px;
}
.hero__trust-item { display: flex; align-items: center; gap: 6px; }
.hero__trust-check { color: var(--ok-green); font-weight: 700; }

.hero__shot-wrap {
  max-width: 960px;
  margin: 0 auto;
}

/* --------------------------------------------------------------------------
   功能速览网格（首页 4 卡）
   -------------------------------------------------------------------------- */
.features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

/* --------------------------------------------------------------------------
   安装步骤区块
   -------------------------------------------------------------------------- */
.install-section { text-align: center; }
.install-section .section-title { margin-bottom: 48px; }

/* 区块标题居中 */
.section-header { text-align: center; margin-bottom: 48px; }
.section-header__sub { margin-top: 12px; }


/* --------------------------------------------------------------------------
   Features 页头
   -------------------------------------------------------------------------- */
.page-header { padding: 32px 0; }
.page-header__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
}
.page-header__row .cat-pills { margin-top: 0; }
.page-header__sub { margin-top: 6px; font-size: 15px; color: var(--ink-500); }

/* Features 底部 CTA */
.features-cta {
  text-align: center;
  padding: 96px 0;
  position: relative;
  overflow: hidden;
}
.features-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--grad-hero);
  pointer-events: none;
}
.features-cta__title { margin-bottom: 28px; position: relative; }
.features-cta__btns  { position: relative; display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

/* --------------------------------------------------------------------------
   §3.14 features 页专用组件（分类锚点 / 分区头 / 终端窗口条 / 补充说明条）
   -------------------------------------------------------------------------- */

/* 分类锚点胶囊 .cat-pills（页头下方：通达信插件 / 复盘GUI 快速跳转） */
.cat-pills {
  display: flex;
  gap: 12px;
  justify-content: center;
  margin-top: 28px;
  flex-wrap: wrap;
}
.cat-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 20px;
  border-radius: 999px;
  border: 1px solid var(--paper-200);
  background: var(--paper-0);
  font-size: 14px;
  font-weight: 500;
  color: var(--ink-500);
  transition: all .2s ease;
}
.cat-pill:hover {
  border-color: var(--brand-600);
  color: var(--brand-600);
  transform: translateY(-1px);
  box-shadow: var(--shadow-card);
}
.cat-pill b { color: var(--brand-600); font-weight: 700; }

/* 分区头 .part-head（PART 01 / PART 02 大区分隔） */
.part-head { text-align: center; margin-bottom: 44px; }
.part-head + .feature-row { padding-top: 8px; }
.part-head__badge { display: inline-block; margin-bottom: 12px; }
.part-head__title { margin-bottom: 10px; }
.part-head__sub { max-width: 580px; margin: 0 auto; font-size: 16px; color: var(--ink-500); }
.bg-ink-950 .part-head__sub { color: var(--ink-300); }

/* 深色区内的功能行文字适配 */
.bg-ink-950 .feature-row__title { color: var(--ink-100); }
.bg-ink-950 .feature-row__desc  { color: var(--ink-300); }
.bg-ink-950 .feature-row__num   { color: var(--brand-400); }
.bg-ink-950 .shot__caption      { color: var(--ink-300); }

/* 终端窗口条 .term-shot（TDX 黑底截图 → 深色终端窗口，底图融合） */
.term-shot {
  background: #050608;
  border: 1px solid var(--ink-700);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: var(--shadow-screenshot);
}
.term-shot__bar {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 11px 16px;
  background: var(--ink-900);
  border-bottom: 1px solid var(--ink-700);
}
.term-shot__dot { width: 10px; height: 10px; border-radius: 50%; }
.term-shot__dot--r { background: #E5484D; }
.term-shot__dot--y { background: #D97706; }
.term-shot__dot--g { background: #22A06B; }
.term-shot__title { margin-left: 10px; font-size: 12px; color: var(--ink-300); letter-spacing: .02em; }
.term-shot__body { padding: 20px 22px; }
.term-shot__body img { width: 100%; border-radius: 6px; }

/* 功能项紧凑标题 .item-head（全宽功能块：序号+标题+说明三层合一，左对齐，标题区预算 ≤110px） */
.item-head { max-width: 720px; margin-bottom: 20px; }
.item-head__num { font-size: 14px; font-weight: 700; color: var(--brand-400); letter-spacing: .08em; margin-bottom: 6px; }
.item-head__title { font-size: 22px; font-weight: 700; margin-bottom: 8px; }
.item-head__desc { font-size: 15px; color: var(--ink-500); }
.bg-ink-950 .item-head__title { color: var(--ink-100); }
.bg-ink-950 .item-head__desc { color: var(--ink-300); }

/* --------------------------------------------------------------------------
   §3.15 数据重绘模块（截图数据 → HTML 原生组件，任何尺寸可读）
   原则：必读信息一律 HTML 排版（≥12px），截图仅作"界面实拍"佐证缩略
   -------------------------------------------------------------------------- */

/* grid/flex 容器内允许收缩（防 nowrap 表格 min-content 撑破移动端视口） */
.feature-row__inner > * { min-width: 0; }
.panel, .table-scroll, .col-shots figure { min-width: 0; }

/* 重绘面板 .panel（浅色区数据模块容器） */
.panel {
  background: var(--paper-0);
  border: 1px solid var(--paper-200);
  border-radius: 16px;
  padding: 22px;
  box-shadow: var(--shadow-card);
}
.panel + .panel { margin-top: 14px; }
.panel__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 4px 12px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.panel__title { font-size: 14px; font-weight: 600; color: var(--ink-950); }
.panel__note  { font-size: 11px; color: var(--ink-500); white-space: nowrap; }
.panel--dark { background: var(--ink-900); border-color: var(--ink-700); box-shadow: var(--shadow-screenshot); }
.panel--dark .panel__title { color: var(--ink-100); }

/* 板块条 .chip-strip（TDX 18 板块 HTML 重绘） */
.chip-strip { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 8px;
  background: var(--ink-800);
  border: 1px solid var(--ink-700);
  font-size: 13px;
  color: var(--ink-300);
}
.chip b { color: var(--ink-100); font-weight: 600; font-variant-numeric: tabular-nums; }
.chip--up { border-color: rgba(229, 72, 77, .55); }
.chip--up b { color: #F26D70; }
.chip--down { border-color: rgba(34, 160, 107, .55); }
.chip--down b { color: #3ECF94; }

/* 指标卡网格 .stat-grid */
.stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.stat-grid--2 { grid-template-columns: repeat(2, 1fr); }
.stat-card {
  background: var(--paper-50);
  border: 1px solid var(--paper-200);
  border-radius: 12px;
  padding: 12px 14px 10px;
}
.stat-card__v { font-size: 22px; font-weight: 700; line-height: 1.2; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.stat-card__v--up    { color: var(--up-red); }
.stat-card__v--down  { color: var(--ok-green); }
.stat-card__v--brand { color: var(--brand-600); }
.stat-card__v--amber { color: var(--warn-amber); }
.stat-card__k { font-size: 12px; font-weight: 600; color: var(--ink-950); margin-top: 2px; }
.stat-card__s { font-size: 11px; color: var(--ink-500); }

/* 简报引用块 .brief-block */
.brief-block {
  margin-top: 14px;
  background: var(--brand-50);
  border-left: 3px solid var(--brand-600);
  border-radius: 0 10px 10px 0;
  padding: 14px 16px;
  font-size: 13px;
  line-height: 1.75;
}
.brief-block b { color: var(--brand-700); font-weight: 600; }
.brief-block__src { font-size: 11px; color: var(--ink-500); margin-top: 8px; }

/* 条形榜 .bar-list */
.bar-list { display: flex; flex-direction: column; gap: 9px; }
.bar-row { display: grid; grid-template-columns: 78px 1fr auto; align-items: center; gap: 10px; font-size: 13px; }
.bar-row__name { font-weight: 600; }
.bar-row__track { height: 15px; background: var(--paper-100); border-radius: 4px; overflow: hidden; }
.bar-row__fill { height: 100%; border-radius: 4px; background: var(--brand-600); }
.bar-row__fill--s { background: var(--up-red); }
.bar-row__fill--c { background: var(--paper-300); }
.bar-row__val { display: flex; align-items: center; gap: 6px; font-variant-numeric: tabular-nums; color: var(--ink-500); }
/* 条宽数据档（HTML 用类名，不写内联样式） */
.w-37 { width: 37%; } .w-50 { width: 50%; } .w-62 { width: 62%; } .w-100 { width: 100%; }
.lv { font-size: 11px; font-weight: 600; padding: 1px 7px; border-radius: 4px; }
.lv--s { background: var(--up-red); color: #fff; }
.lv--b { background: var(--brand-600); color: #fff; }
.lv--c { background: var(--paper-200); color: var(--ink-500); }

/* 龙头标注行 .lead-lines */
.lead-lines { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--paper-200); display: flex; flex-direction: column; gap: 6px; font-size: 12px; color: var(--ink-500); }
.lead-lines b { color: var(--ink-950); font-weight: 600; }

/* 阶段条 .stage-bar（情绪六阶段） */
.stage-bar { display: flex; gap: 4px; margin-top: 16px; }
.stage {
  flex: 1;
  text-align: center;
  font-size: 12px;
  padding: 8px 2px;
  border-radius: 8px;
  background: var(--paper-100);
  color: var(--ink-500);
}
.stage--now { background: var(--ink-950); color: #fff; font-weight: 700; position: relative; }
.stage__tag {
  position: absolute;
  top: -9px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 10px;
  font-weight: 600;
  background: var(--up-red);
  color: #fff;
  padding: 0 7px;
  border-radius: 999px;
  line-height: 16px;
  white-space: nowrap;
}
.stage-desc { margin-top: 12px; font-size: 12px; color: var(--ink-500); }

/* 迷你表 .mini-table（含横向滚动容器） */
.table-scroll { overflow-x: auto; }
.mini-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.mini-table th {
  text-align: left;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink-500);
  padding: 7px 10px;
  border-bottom: 1px solid var(--paper-200);
  white-space: nowrap;
}
.mini-table td {
  padding: 7px 10px;
  border-bottom: 1px solid var(--paper-200);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.mini-table tr:last-child td { border-bottom: none; }
.mini-table .num { text-align: right; }
.mini-table .up   { color: var(--up-red); font-weight: 600; }
.mini-table .down { color: var(--ok-green); font-weight: 600; }
.bd {
  display: inline-block;
  min-width: 36px;
  text-align: center;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 700;
  background: var(--up-red);
  color: #fff;
}

/* 预警分级 .warn-grid */
.warn-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.warn-chip {
  border: 1px solid var(--paper-200);
  border-radius: 12px;
  padding: 12px 14px;
  background: var(--paper-0);
}
.warn-chip b { display: flex; align-items: center; gap: 7px; font-size: 14px; margin-bottom: 4px; }
.warn-chip p { font-size: 12px; color: var(--ink-500); line-height: 1.6; }
.warn-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.warn-dot--hit  { background: var(--ink-950); }
.warn-dot--near { background: var(--up-red); }
.warn-dot--watch{ background: var(--warn-amber); }
.warn-dot--safe { background: var(--ok-green); }

/* 实拍缩略 .real-shot（截图降级为佐证，不承担必读信息） */
.real-shot { margin-top: 16px; }
.real-shot__label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--ink-500);
  margin-bottom: 8px;
}
.real-shot__label::before { content: "▣"; color: var(--brand-600); }
.real-shot a { display: block; border-radius: 10px; overflow: hidden; border: 1px solid var(--paper-200); transition: opacity .2s ease; }
.real-shot a:hover { opacity: .85; }
.real-shot img { display: block; width: 100%; }
.bg-ink-950 .real-shot__label { color: var(--ink-300); }
.bg-ink-950 .real-shot a { border-color: var(--ink-700); }

/* 近 1:1 数据列实拍（TDX 竖条截图，原尺寸文字可读） */
.col-shots { display: flex; gap: 18px; justify-content: center; align-items: flex-start; flex-wrap: wrap; }
.col-shots figure {
  background: var(--ink-900);
  border: 1px solid var(--ink-700);
  border-radius: 12px;
  padding: 10px 10px 8px;
  box-shadow: var(--shadow-screenshot);
}
.col-shots figure { max-width: 100%; }
.col-shots img { border-radius: 6px; display: block; max-width: 100%; height: auto; }
.col-shots figcaption { text-align: center; font-size: 12px; color: var(--ink-300); margin-top: 8px; }

/* 深色区补充说明条 .note-strip（无截图功能的补充说明，承接首页锚点） */
.note-strip {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  max-width: 720px;
  margin: 24px auto 0;
  padding: 20px 24px;
  border: 1px dashed var(--ink-700);
  border-radius: 12px;
  font-size: 14px;
  color: var(--ink-300);
}
.note-strip__icon { color: var(--brand-400); font-size: 18px; line-height: 1.4; flex-shrink: 0; }
.note-strip b { color: var(--ink-100); font-weight: 600; }

/* --------------------------------------------------------------------------
   响应式断点
   -------------------------------------------------------------------------- */

/* 平板 640–1023px */
@media (max-width: 1023px) {
  .features-grid { grid-template-columns: repeat(2, 1fr); }
  .feature-row__inner { gap: 40px; }
  .text-display { font-size: 44px; }
  .text-h1 { font-size: 34px; }
}

/* 移动 <640px */
@media (max-width: 639px) {
  .text-display { font-size: 36px; }
  .text-h1      { font-size: 30px; }
  .text-h2      { font-size: 26px; }
  .text-price   { font-size: 40px; }

  .section-pad { padding: 48px 0; }
  .feature-row { padding: 40px 0; }

  .nav__links { gap: 16px; }
  .nav__link  { font-size: 13px; }

  .hero { padding: 56px 0 64px; }
  .hero__sub { font-size: 16px; }

  .features-grid { grid-template-columns: 1fr; }

  .price-grid { grid-template-columns: 1fr; }

  .feature-row__inner {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .feature-row--reverse .feature-row__inner { direction: ltr; }
  .feature-row__desc { max-width: none; }

  .steps { grid-template-columns: 1fr; gap: 24px; }
  .steps::before { display: none; }

  .hero__ctas { flex-direction: column; align-items: center; }
  .hero__ctas .btn { width: 100%; max-width: 320px; }

  /* 页头胶囊移动端独占一行，防止 flex 项溢出 */
  .page-header__row { gap: 14px; }
  .page-header__row .cat-pills { width: 100%; justify-content: flex-start; }

  /* §3.15 移动端：数据模块网格降列 */
  .stat-grid { grid-template-columns: repeat(2, 1fr); }
  .warn-grid { grid-template-columns: 1fr; }
  .bar-row { grid-template-columns: 64px 1fr auto; font-size: 12px; }
  .col-shots { flex-direction: column; align-items: center; }
}
/* =====================================================================
   §F 功能介绍页 V2.0 重设计（2026-08-09）
   独特性叙事：插件形态 = 复盘与交易无缝；立体化实拍卡片；排版紧凑
   ===================================================================== */

/* F0. 独特价值 Hero（深色） */
.fhero { position: relative; overflow: hidden; padding: 60px 0 52px; background: var(--ink-950); }
.fhero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(900px 420px at 18% -10%, rgba(110,99,246,.30), transparent 60%),
    radial-gradient(700px 380px at 92% 12%, rgba(91,84,240,.16), transparent 55%);
}
.fhero .container { position: relative; }
.fhero__badges { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px; }
.fhero__title { text-align: center; margin-bottom: 14px; }
.fhero__sub {
  max-width: 720px; margin: 0 auto 24px; text-align: center;
  font-size: 16px; line-height: 1.9; color: var(--ink-300);
}
.fhero__sub b, .fhero__sub strong { color: var(--ink-100); font-weight: 600; }
.fhero__ctas { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 28px; }
.fhero__proof { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 860px; margin: 0 auto; }
.fhero__proof-item {
  background: rgba(255,255,255,.045); border: 1px solid var(--ink-700);
  border-radius: 12px; padding: 14px 16px; text-align: center;
}
.fhero__proof-k { font-size: 17px; font-weight: 700; color: var(--brand-400); margin-bottom: 4px; }
.fhero__proof-d { font-size: 12px; color: var(--ink-300); line-height: 1.6; }

/* F1. 对比条：插件形态的意义 */
.f-compare { display: grid; grid-template-columns: 1fr auto 1fr; gap: 18px; align-items: stretch; }
.f-compare__col { border-radius: 14px; padding: 20px 22px 22px; }
.f-compare__col--old { background: var(--paper-100); border: 1px solid var(--paper-200); }
.f-compare__col--new {
  background: linear-gradient(180deg, var(--brand-50), #fff); border: 1px solid rgba(91,84,240,.28);
  box-shadow: var(--shadow-card); position: relative; overflow: hidden;
}
.f-compare__col--new::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--grad-brand); }
.f-compare__tag { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; margin-bottom: 12px; }
.f-compare__col--old .f-compare__tag { color: var(--ink-500); }
.f-compare__col--new .f-compare__tag { color: var(--brand-700); }
.f-compare__steps { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.f-compare__steps li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 1.6; color: var(--ink-950); }
.f-compare__steps .n {
  flex: 0 0 auto; width: 20px; height: 20px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 700; margin-top: 1px;
}
.f-compare__col--old .n { background: var(--paper-300); color: var(--ink-500); }
.f-compare__col--new .n { background: var(--grad-brand); color: #fff; }
.f-compare__steps li.dim { color: var(--ink-500); }
.f-compare__steps li.dim .n { text-decoration: none; }
.f-compare__vs {
  align-self: center; width: 46px; height: 46px; border-radius: 50%;
  background: var(--ink-950); color: #fff; font-weight: 800; font-size: 14px;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: var(--shadow-lift); flex: 0 0 auto;
}
/* F2. 立体实拍卡片（深色区） */
.f-shot3d {
  position: relative; border-radius: 16px; padding: 14px 14px 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow:
    0 40px 70px -18px rgba(0,0,0,.6),
    0 14px 30px rgba(0,0,0,.35);
  transform: perspective(1500px) rotateX(3deg) rotateY(-4deg);
  transition: transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease;
}
.f-shot3d:hover {
  transform: perspective(1500px) rotateX(.5deg) rotateY(-1deg) translateY(-5px);
  box-shadow: 0 50px 90px -16px rgba(0,0,0,.7), 0 18px 36px rgba(0,0,0,.4);
}
.f-shot3d::before {
  content: ""; position: absolute; inset: 0; border-radius: 16px; pointer-events: none;
  background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0) 26%);
}
.f-shot3d__img { display: block; border-radius: 9px; overflow: hidden; background: #0b0d14; }
.f-shot3d__img img { display: block; width: 100%; height: auto; }
.f-shot3d__cap {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  font-size: 12px; color: var(--ink-300); padding: 10px 4px 0;
}
.f-shot3d__cap b { color: var(--ink-100); font-weight: 600; }
.f-shot3d--tall { transform: perspective(1400px) rotateX(2deg) rotateY(-8deg); }
.f-shot3d--tall:nth-child(even) { transform: perspective(1400px) rotateX(2deg) rotateY(7deg); }
.f-shot3d--tall:hover { transform: perspective(1400px) rotateX(.5deg) rotateY(-1deg) translateY(-5px); }
.f-shot3d--tall:nth-child(even):hover { transform: perspective(1400px) rotateX(.5deg) rotateY(1deg) translateY(-5px); }
/* 浅色区立体卡（GUI 截图） */
.f-shot3d--light {
  background: #fff; border-color: var(--paper-200);
  box-shadow: 0 40px 70px -18px rgba(16,19,28,.35), 0 14px 30px rgba(16,19,28,.14);
}
.f-shot3d--light .f-shot3d__img { background: var(--paper-100); border: 1px solid var(--paper-200); }
.f-shot3d--light .f-shot3d__cap { color: var(--ink-500); }
.f-shot3d--light .f-shot3d__cap b { color: var(--ink-950); }
/* F3. 紧凑排版（仅功能页作用域） */
.page-features .feature-row { padding: 24px 0; }
.page-features .part-head { margin-bottom: 24px; }
.page-features .feature-row__inner { gap: 26px; }
.page-features .real-shot { margin-top: 10px; }
.f-shot-wrap { margin-top: 12px; }
.page-features .col-shots { gap: 16px; }

/* F4. 特色强调词 */
.f-strong { color: var(--brand-600); font-weight: 700; }
.bg-ink-950 .f-strong { color: var(--brand-400); }

/* 移动端适配 */
@media (max-width: 768px) {
  .fhero { padding: 42px 0 38px; }
  .fhero__proof { grid-template-columns: 1fr; }
  .f-compare { grid-template-columns: 1fr; }
  .f-compare__vs { width: 36px; height: 36px; margin: 0 auto; }
  .f-shot3d, .f-shot3d--tall { transform: none; }
}

/* =====================================================================
   §P 分销页 partner.html V1.0（2026-08-09）
   结构：Hero(40%佣金) / 两种模式 / 4步流程 / 申请条件 / 推广规范 / FAQ / 申请表
   设计约束：复用变量体系；专属 .partner-* / .mode-* / .flow-* 前缀；断点 768/480
   ===================================================================== */

/* P0. 页面紧凑化作用域 */
.page-partner .section-pad { padding: 48px 0; }
.page-partner .section-header { margin-bottom: 32px; }
.page-partner .price-card { padding: 32px 28px; }
.page-partner .price-card__name { margin-bottom: 8px; }
.page-partner .price-card__anchor { margin-bottom: 16px; }
.page-partner .price-card__divider { margin: 0 0 16px; }
.page-partner .price-card__perks { margin-bottom: 16px; }
.page-partner .price-card__perk { margin-bottom: 6px; }

/* P1. Hero（深色） */
.partner-hero { position: relative; overflow: hidden; padding: 60px 0 52px; background: var(--ink-950); }
.partner-hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(900px 420px at 18% -10%, rgba(110,99,246,.30), transparent 60%),
    radial-gradient(700px 380px at 92% 12%, rgba(91,84,240,.16), transparent 55%);
}
.partner-hero .container { position: relative; }
.partner-hero__badges { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px; }
.partner-hero__title { text-align: center; margin-bottom: 14px; }
.partner-hero__sub {
  max-width: 680px; margin: 0 auto 26px; text-align: center;
  font-size: 16px; line-height: 1.9; color: var(--ink-300);
}
.partner-hero__sub b { color: var(--ink-100); font-weight: 600; }
.partner-hero__ctas { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 30px; }
.partner-hero__cta-note { margin-top: .5rem; font-size: .85rem; color: rgba(255,255,255,.7); }
.partner-hero__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; max-width: 720px; margin: 0 auto; }
.partner-hero__stat {
  background: rgba(255,255,255,.045); border: 1px solid var(--ink-700);
  border-radius: 12px; padding: 14px 16px; text-align: center;
}
.partner-hero__stat b { display: block; font-size: 22px; font-weight: 700; color: var(--brand-400); margin-bottom: 4px; }
.partner-hero__stat span { font-size: 12px; color: var(--ink-300); line-height: 1.6; }
/* P2. 两种模式卡（基于 .price-card，模式A推荐高亮） */
/* deprecated: V2.0 已下线「两种模式」卡，样式保留待统一清理 */
.mode-card .mode-earn { font-size: 15px; color: var(--ink-500); margin-bottom: 16px; }
.mode-card .mode-earn b {
  font-size: 26px; font-weight: 800; color: var(--brand-700);
  background: var(--grad-brand);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.mode-card--b .mode-earn b { color: var(--ink-950); background: none; -webkit-text-fill-color: currentColor; }

/* P3. 合作流程 4 步（V2.1 并入 Hero 深色背景，模块缩小） */
.partner-flow {
  background: var(--ink-950);
  padding: 0 0 56px;
}
.flow-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.flow-item {
  background: rgba(255,255,255,.05); border: 1px solid var(--ink-700);
  border-radius: 12px; padding: 16px 14px; text-align: center;
}
.flow-item__num {
  width: 28px; height: 28px; margin: 0 auto 8px; border-radius: 50%;
  background: var(--grad-brand); color: #fff; font-size: 13px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
}
.flow-item__title { margin-bottom: 6px; }
.flow-item__desc { font-size: 12px; color: var(--ink-300); line-height: 1.6; }

/* P4. 申请条件 4 项 */
.req-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.req-item {
  background: var(--paper-0); border: 1px solid var(--paper-200);
  border-radius: 14px; padding: 20px 18px; box-shadow: var(--shadow-card);
}
.req-item__icon {
  width: 40px; height: 40px; border-radius: 10px; background: var(--brand-50);
  display: flex; align-items: center; justify-content: center; font-size: 20px; margin-bottom: 12px;
}
.req-item__title { margin-bottom: 6px; }
.req-item__desc { font-size: 13px; color: var(--ink-500); line-height: 1.6; }
/* P5. 推广规范 绿红双列 */
.rule-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 960px; margin: 0 auto; }
.rule-card { border-radius: 16px; padding: 32px 36px; }
.rule-card--ok { background: #F0FBF5; border: 1px solid #BDE8D2; }
.rule-card--no { background: #FDF0F1; border: 1px solid #F5C4C6; }
.rule-card__title { margin-bottom: 14px; }
.rule-card ul { display: flex; flex-direction: column; gap: 10px; }
.rule-card li { display: flex; gap: 8px; align-items: flex-start; font-size: 15px; line-height: 1.7; color: var(--ink-950); }
.rule-card--ok li::before { content: "✓"; color: var(--ok-green); font-weight: 700; flex-shrink: 0; }
.rule-card--no li::before { content: "✕"; color: var(--up-red); font-weight: 700; flex-shrink: 0; }
.rule-note { text-align: center; font-size: 13px; color: var(--ink-500); margin-top: 24px; }

/* P6. FAQ 折叠 */
.faq-list { max-width: 760px; margin: 0 auto; }
.faq-item {
  background: var(--paper-0); border: 1px solid var(--paper-200);
  border-radius: 12px; margin-bottom: 10px; overflow: hidden;
  box-shadow: var(--shadow-card);
}
.faq-item__q {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 16px 20px; font-size: 15px; font-weight: 600; color: var(--ink-950);
  cursor: pointer; list-style: none;
}
.faq-item__q::-webkit-details-marker { display: none; }
.faq-item__q::after { content: "+"; font-size: 18px; color: var(--brand-600); font-weight: 700; flex-shrink: 0; transition: transform .2s ease; }
.faq-item[open] .faq-item__q::after { transform: rotate(45deg); }
.faq-item__a { padding: 0 20px 16px; font-size: 14px; color: var(--ink-500); line-height: 1.7; }
/* P7. 申请表 */
.apply-card { max-width: 820px; margin: 0 auto; }
.apply-card__embed {
  background: var(--paper-0); border: 1px solid var(--paper-200);
  border-radius: 16px; padding: 32px; box-shadow: var(--shadow-card);
}
.apply-card__placeholder { text-align: center; padding: 24px 0; }
.apply-card__ph-title { font-size: 17px; font-weight: 700; color: var(--ink-950); margin-bottom: 8px; }
.apply-card__ph-desc { font-size: 14px; color: var(--ink-500); line-height: 1.7; }
.apply-card__alt {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  flex-wrap: wrap; margin-top: 20px; font-size: 14px; color: var(--ink-500);
}
.apply-card__alt-label { font-weight: 600; color: var(--ink-950); }
.apply-card__alt-note { font-size: 12px; color: var(--ink-500); }

/* P9. 自定义申请表单 */
.apply-form { max-width: 640px; margin: 0 auto; }
.apply-form__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.apply-form__field { display: flex; flex-direction: column; gap: 6px; }
.apply-form__field--full { grid-column: 1 / -1; margin-top: 4px; }
.apply-form__label { font-size: 14px; font-weight: 600; color: var(--ink-950); }
.apply-form__required { color: var(--up-red); }
.apply-form__input {
  height: 44px; padding: 0 14px; border: 1px solid var(--paper-300);
  border-radius: 10px; font-size: 15px; color: var(--ink-950); background: var(--paper-0);
  transition: border-color .15s ease, box-shadow .15s ease; font-family: inherit;
}
.apply-form__input:focus { outline: none; border-color: var(--brand-600); box-shadow: 0 0 0 3px rgba(91,84,240,.15); }
.apply-form__input::placeholder { color: var(--ink-500); }
select.apply-form__input { cursor: pointer; appearance: none; background-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M3 5l3 3 3-3' fill='none' stroke='%239BA1B5' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E\"); background-repeat: no-repeat; background-position: right 12px center; padding-right: 36px; }
.apply-form__textarea { height: auto; padding: 12px 14px; resize: vertical; min-height: 80px; }
.apply-form__submit { display: flex; align-items: center; gap: 14px; margin-top: 24px; flex-wrap: wrap; }
.apply-form__privacy { font-size: 13px; color: var(--ink-500); }
.apply-form__success { text-align: center; padding: 40px 0; }
.apply-form__success-icon { width: 56px; height: 56px; border-radius: 50%; background: var(--grad-brand); color: #fff; font-size: 28px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 16px; }
.apply-form__success .text-h3 { margin-bottom: 8px; }
.is-hidden { display: none; }

@media (max-width: 640px) {
  .apply-form__grid { grid-template-columns: 1fr; }
}

/* P8. 响应式（768 / 480） */
@media (max-width: 768px) {
  .page-partner .section-pad { padding: 40px 0; }
  .partner-hero { padding: 42px 0 38px; }
  .partner-hero__stats { grid-template-columns: 1fr; max-width: 340px; }
  .flow-grid { grid-template-columns: 1fr 1fr; }
  .req-grid { grid-template-columns: 1fr 1fr; }
  .rule-grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .flow-grid { grid-template-columns: 1fr; }
  .req-grid { grid-template-columns: 1fr; }
  .partner-hero__ctas .btn { width: 100%; max-width: 320px; }
  .apply-card__alt { flex-direction: column; text-align: center; }
}

/* --------------------------------------------------------------------------
   §3.18 飞书表单嵌入（partner.html R6修复）
   -------------------------------------------------------------------------- */
.apply-card { max-width: 720px; margin: 0 auto; }
.apply-card__embed { width: 100%; min-height: 400px; }
.apply-card__embed iframe { display: block; }
@media (max-width: 768px) {
  .apply-card__embed iframe { height: 600px; }
}

/* --------------------------------------------------------------------------
   §3.17 共享权益条（index.html 迁移自内嵌 style）
   -------------------------------------------------------------------------- */
.shared-perks { max-width: 880px; margin: 0 auto 32px; text-align: center; }
.shared-perks__title { font-size: 15px; font-weight: 600; color: var(--ink-800); margin-bottom: 16px; }
.shared-perks__list { display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: center; }
.shared-perks__item { font-size: 14px; color: var(--ink-600); line-height: 1.6; }
.shared-perks__item::before { content: "✓ "; color: var(--ok-green); font-weight: 700; }

/* 动效降级：尊重用户系统级"减少动态效果"设置 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* =====================================================================
   §B 博客栏目样式 V2.0（blog.html + blog/ 文章页）
   设计语言对齐 features.html：深色 hero、卡片网格、品牌 CTA
   ===================================================================== */

/* B0. 列表页 Hero（深色） */
.blog-hero {
  position: relative;
  overflow: hidden;
  padding: 60px 0 52px;
  background: var(--ink-950);
}
.blog-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(900px 420px at 18% -10%, rgba(110,99,246,.30), transparent 60%),
    radial-gradient(700px 380px at 92% 12%, rgba(91,84,240,.16), transparent 55%);
}
.blog-hero .container { position: relative; }
.blog-hero__badges { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 20px; }
.blog-hero__title { text-align: center; margin-bottom: 14px; color: var(--ink-100); }
.blog-hero__sub {
  max-width: 640px; margin: 0 auto; text-align: center;
  font-size: 16px; line-height: 1.9; color: var(--ink-300);
}

/* B1. 文章列表 */
.blog-list-section { padding: 56px 0 72px; background: var(--paper-50); }
.blog-list {
  max-width: 960px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.blog-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: var(--paper-0);
  border: 1px solid var(--paper-200);
  border-radius: 16px;
  padding: 28px;
  box-shadow: var(--shadow-card);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.blog-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lift);
  border-color: var(--brand-100);
}
.blog-card__badge { align-self: flex-start; }
.blog-card__title {
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  color: var(--ink-950);
}
.blog-card__title a { color: inherit; }
.blog-card__title a::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 16px;
}
.blog-card__title a:hover { color: var(--brand-600); }
.blog-card__summary {
  font-size: 14px;
  line-height: 1.7;
  color: var(--ink-500);
}

/* 分类标签颜色 */
.badge--ai { background: rgba(91,84,240,.08); color: var(--brand-600); border: 1px solid rgba(91,84,240,.12); }
.badge--tactic { background: rgba(217,119,6,.08); color: var(--warn-amber); border: 1px solid rgba(217,119,6,.15); }
.badge--indicator { background: rgba(34,160,107,.08); color: var(--ok-green); border: 1px solid rgba(34,160,107,.15); }
.badge--method { background: rgba(14,165,233,.08); color: #0284c7; border: 1px solid rgba(14,165,233,.15); }

/* B2. 分页导航 */
.blog-pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 40px;
}
.blog-pagination__item {
  min-width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--paper-200);
  border-radius: 8px;
  color: var(--ink-500);
  font-size: 14px;
  background: var(--paper-0);
  text-decoration: none;
}
.blog-pagination__item:hover { border-color: var(--brand-300); color: var(--brand-600); }
.blog-pagination__item.is-active {
  background: var(--brand-600);
  border-color: var(--brand-600);
  color: #fff;
}

/* B3. 文章页 */
.blog-article { padding: 48px 0 72px; }
.blog-article__inner { max-width: 720px; margin: 0 auto; }
.blog-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: var(--ink-500);
  margin-bottom: 24px;
  text-decoration: none;
  transition: color .15s ease;
}
.blog-back:hover { color: var(--brand-600); }

/* B4. 文章页头部 */
.blog-article-header {
  position: relative;
  padding: 0 0 32px;
  border-bottom: 1px solid var(--paper-200);
  margin-bottom: 40px;
}
.blog-article-header::before {
  content: "";
  position: absolute;
  left: 0; bottom: -1px;
  width: 120px; height: 3px;
  border-radius: 2px;
  background: var(--grad-brand);
}
.blog-article-header__title {
  font-size: 28px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--ink-950);
  margin-bottom: 10px;
}
.blog-article-header__meta {
  font-size: 13px;
  color: var(--ink-300);
  margin-bottom: 14px;
}
.blog-article-header__lead {
  position: relative;
  padding-left: 18px;
  font-size: 16px;
  line-height: 1.7;
  color: var(--ink-500);
}
.blog-article-header__lead::before {
  content: "";
  position: absolute;
  left: 0; top: 6px; bottom: 6px;
  width: 4px;
  border-radius: 2px;
  background: var(--grad-brand);
}

/* B5. 文章正文 */
.blog-article__body { font-size: 16px; line-height: 1.7; color: var(--ink-800); }
.blog-article__body p { margin-bottom: 18px; }
.blog-article__body h2 {
  position: relative;
  font-size: 22px;
  font-weight: 700;
  color: var(--ink-950);
  margin: 40px 0 16px;
  padding-left: 18px;
}
.blog-article__body h2::before {
  content: "";
  position: absolute;
  left: 0; top: 8px; bottom: 8px;
  width: 5px;
  border-radius: 3px;
  background: var(--grad-brand);
}
.blog-article__body ul,
.blog-article__body ol { padding-left: 24px; margin: 0 0 18px; }
.blog-article__body li { margin-bottom: 10px; line-height: 1.75; }
.blog-article__body blockquote {
  background: var(--brand-50);
  border-left: 3px solid var(--brand-500);
  padding: 16px 20px;
  border-radius: 0 12px 12px 0;
  margin: 0 0 20px;
  color: var(--ink-600);
}
.blog-article__body blockquote p { margin-bottom: 0; }
.blog-article__body strong { color: var(--brand-700); font-weight: 700; }
.blog-article__body code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 14px;
  background: var(--paper-100);
  padding: 2px 6px;
  border-radius: 4px;
  color: var(--ink-700);
}

/* B6. 文章页 CTA 卡片 */
.blog-article__cta {
  margin-top: 44px;
  background: linear-gradient(180deg, var(--brand-50) 0%, #fff 100%);
  border: 1px solid var(--brand-100);
  border-radius: 16px;
  padding: 28px 32px;
  box-shadow: var(--shadow-card);
}
.blog-article__cta p { color: var(--ink-700); margin-bottom: 16px; font-size: 15px; line-height: 1.7; }
.blog-article__cta p:last-child { margin-bottom: 0; }

/* B7. 免责声明 */
.blog-article__disclaimer {
  font-size: 13px;
  color: var(--ink-300);
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px dashed var(--paper-200);
}

/* B8. 响应式 */
@media (max-width: 1023px) {
  .blog-list { grid-template-columns: 1fr; max-width: 640px; }
}
@media (max-width: 639px) {
  .blog-hero { padding: 42px 0 38px; }
  .blog-hero__title { font-size: 30px; }
  .blog-list-section { padding: 40px 0 56px; }
  .blog-card { padding: 22px; }
  .blog-article-header__title { font-size: 24px; }
  .blog-article__body h2 { font-size: 20px; margin-top: 32px; }
  .blog-article__cta { padding: 22px; }
}

/* B9. 博客文章配图 */
.blog-figure { margin: 24px 0; text-align: center; }
.blog-figure img { max-width: 100%; height: auto; border: 1px solid var(--paper-200); border-radius: 10px; box-shadow: var(--shadow-card); }
.blog-figure figcaption { font-size: 13px; color: var(--ink-300); margin-top: 8px; }