/* ================================================================
   Adsolutely × OpenClaw — 配色重设计
   高级感撞色方案：午夜深蓝(70%) × 落日橙refined(30%)
   原理：深色沉浸铺底 + 去火气的橙色精准点睛
   ================================================================ */

/* ── 全局 token 重置（覆盖 pitch-deck 默认蓝紫渐变）── */
.tpl-pitch-deck {
  /* ── 暗色系 slides 使用的 token ── */
  --dark-bg:       #0D1B2E;   /* 午夜深蓝 - 主背景 */
  --dark-surface:  #152640;   /* 稍浅表面 */
  --dark-surface2: #1C3158;   /* 卡片层 */
  --dark-border:   rgba(240,234,224,.10);
  --dark-text-1:   #F0EAE0;   /* 奶白主文字 */
  --dark-text-2:   #A8BDD4;   /* 雾感蓝灰副文字 */
  --dark-text-3:   #6A88A4;   /* muted */

  /* ── 亮色系 slides（内容页）── */
  --light-bg:      #F6F1EB;   /* 骨色暖白 - 非纯白 */
  --light-surface: #FFFFFF;
  --light-surface2:#EDE8E1;
  --light-border:  rgba(14,28,46,.08);
  --light-text-1:  #0E1C2E;   /* 深海蓝文字 */
  --light-text-2:  #4A6280;
  --light-text-3:  #8A9EB8;

  /* ── 强调色（全局共用）── */
  --accent:   #E8703A;        /* 落日橙·去火气版 */
  --accent-2: #FFB347;        /* 暖金·数字专用 */
  --accent-3: #C85A28;        /* 深橙·hover/active */
  --accent-soft: rgba(232,112,58,.12);  /* 橙色柔化背景 */
  --accent-glow:  rgba(232,112,58,.25);

  --good: #4CAF82;
  --warn: #F5A524;
  --bad:  #E05252;

  /* ── 渐变：仅橙色系，不再用蓝紫 ── */
  --grad:      linear-gradient(135deg, #E8703A 0%, #FFB347 100%);
  --grad-soft: linear-gradient(135deg, rgba(232,112,58,.14) 0%, rgba(255,179,71,.08) 100%);
  --grad-dark: linear-gradient(135deg, #0D1B2E 0%, #152640 100%);

  /* ── 覆盖 base.css & style.css 原有蓝紫渐变 token ── */
  --bg:          var(--light-bg);
  --bg-soft:     var(--light-surface2);
  --surface:     var(--light-surface);
  --surface-2:   var(--light-surface2);
  --border:      var(--light-border);
  --border-strong: rgba(14,28,46,.16);
  --text-1:      var(--light-text-1);
  --text-2:      var(--light-text-2);
  --text-3:      var(--light-text-3);

  font-family: 'Inter', 'Noto Sans SC', -apple-system, BlinkMacSystemFont,
               'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* ── 渐变文字（橙金，替换原蓝紫）── */
.gradient-text {
  background: var(--grad) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* ── metric 数字渐变 ── */
.tpl-pitch-deck .metric .n {
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* ── NUM-TAG 颜色 ── */
.tpl-pitch-deck .num-tag { color: var(--accent); }

/* ── kicker ── */
.tpl-pitch-deck .kicker { color: var(--accent); }

/* ── pill accent ── */
.tpl-pitch-deck .pill-accent {
  background: var(--accent) !important;
  color: #fff !important;
}

/* ── section-num（背景大数字）── 已废弃：藏起来避免占位 */
.tpl-pitch-deck .section-num { display: none !important; }

/* ── Agenda cards：浅色背景强制深色文字 ── */
.tpl-pitch-deck .agenda-light {
  background: var(--light-surface) !important;
  border: 1px solid #E9E1D6 !important;
  color: var(--light-text-1) !important;
}
.tpl-pitch-deck .agenda-light h4 {
  color: var(--light-text-1) !important;
  font-size: 20px;
  margin: 8px 0 6px;
}
.tpl-pitch-deck .agenda-light p {
  color: var(--light-text-2) !important;
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
}
.tpl-pitch-deck .agenda-light .agenda-num {
  color: var(--light-text-3) !important;
  font-size: 28px;
  font-weight: 900;
  letter-spacing: -.02em;
}
.tpl-pitch-deck .agenda-light .agenda-num.grad-num {
  background: var(--grad);
  -webkit-background-clip: text; background-clip: text;
  color: transparent !important;
}

/* ── 全局：标题 + lede 压紧，让下方内容有呼吸 ── */
.tpl-pitch-deck .slide { padding: 56px 88px !important; }
.tpl-pitch-deck .h2 {
  font-size: 44px !important;
  line-height: 1.15 !important;
  margin: 6px 0 0 !important;
  letter-spacing: -.01em;
}
.tpl-pitch-deck .num-tag {
  font-size: 12px;
  letter-spacing: .18em;
  font-weight: 700;
  margin: 0 0 4px;
}
.tpl-pitch-deck .lede {
  font-size: 17px !important;
  line-height: 1.55 !important;
  margin-top: 14px !important;
  color: var(--text-2);
}
.tpl-pitch-deck .mt-l  { margin-top: 24px !important; }
.tpl-pitch-deck .mt-m  { margin-top: 16px !important; }
.tpl-pitch-deck .mt-s  { margin-top: 8px !important; }
.tpl-pitch-deck .mt-xl { margin-top: 32px !important; }

/* dark slides 也别用巨型 padding */
.tpl-pitch-deck .slide-dark,
.tpl-pitch-deck .slide-dark-soft { padding: 56px 88px !important; }

/* ================================================================
   DARK SLIDE — 深色页（封面 / 视频 / 过渡 / Q&A）
   ================================================================ */
.slide-dark,
.slide-dark-soft {
  background: var(--dark-bg) !important;
  --bg: var(--dark-bg);
  --surface: var(--dark-surface);
  --surface-2: var(--dark-surface2);
  --border: var(--dark-border);
  --text-1: var(--dark-text-1);
  --text-2: var(--dark-text-2);
  --text-3: var(--dark-text-3);
  color: var(--dark-text-1);
}
.slide-dark-soft {
  background: linear-gradient(160deg, #0A1520 0%, #0D1B2E 60%, #132236 100%) !important;
}

/* ================================================================
   COVER SLIDE
   ================================================================ */
.cover-wrap {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
  padding: 0;
}
.cover-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 15px;
  font-weight: 700;
  color: var(--dark-text-2);
  letter-spacing: .04em;
}
.cover-brand-dot {
  color: var(--accent);
  font-size: 12px;
}
.cover-kicker {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 24px;
}
.cover-h1 {
  font-size: 92px;
  font-weight: 900;
  line-height: .96;
  letter-spacing: -.04em;
  color: var(--dark-text-1);
  margin: 0 0 36px;
}
.cover-h1 em {
  font-style: normal;
  color: var(--accent);
}
.cover-sub {
  font-size: 22px;
  color: var(--dark-text-2);
  max-width: 48ch;
  line-height: 1.5;
  margin: 0 0 48px;
}
.cover-meta {
  font-size: 14px;
  color: var(--dark-text-3);
  letter-spacing: .06em;
}
.cover-deco {
  position: absolute;
  right: -80px;
  top: 50%;
  transform: translateY(-50%);
  width: 520px;
  height: 520px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(232,112,58,.28) 0%, rgba(232,112,58,.06) 50%, transparent 70%);
  pointer-events: none;
}
.cover-line {
  width: 64px;
  height: 4px;
  background: var(--grad);
  border-radius: 2px;
  margin-bottom: 32px;
}
.cover-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid var(--dark-border);
  padding-top: 24px;
}
.cover-footer-tag {
  font-size: 13px;
  color: var(--dark-text-3);
  letter-spacing: .04em;
}

/* ================================================================
   VIDEO STAGE
   ================================================================ */
.video-stage {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  padding: 48px 96px;
}
.video-placeholder {
  width: 100%;
  max-width: 960px;
  aspect-ratio: 16/9;
  background: #0A121E;
  border: 1.5px dashed rgba(232,112,58,.3);
  border-radius: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
}
.play-btn {
  width: 80px; height: 80px;
  background: var(--grad);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 28px; color: #fff;
  box-shadow: 0 8px 40px var(--accent-glow);
}
.video-label { font-size: 20px; font-weight: 700; color: var(--dark-text-1); }
.video-sub   { font-size: 13px; color: var(--dark-text-3); }

/* ================================================================
   CHAIN DIAGRAM (Slide 02)
   ================================================================ */
.chain {
  display: flex;
  align-items: center;
  gap: 8px;
}
.chain-node {
  display: flex; flex-direction: column; align-items: center;
  gap: 6px; flex: 1; min-width: 0;
  padding: 16px 8px;
  border-radius: 12px;
  text-align: center;
  background: var(--light-surface);
  border: 1px solid #E9E1D6;
}
.chain-node.chain-active {
  background: var(--accent-soft);
  border-color: rgba(232,112,58,.35);
}
.chain-node.chain-end {
  background: linear-gradient(135deg, rgba(232,112,58,.18), rgba(255,179,71,.10));
  border-color: var(--accent);
}
.chain-icon  { font-size: 24px; }
.chain-label { font-size: 13px; font-weight: 700; color: var(--light-text-1); }
.chain-sub   { font-size: 11px; color: var(--accent); font-weight: 600; }
.chain-arrow { font-size: 18px; color: var(--light-text-3); flex-shrink: 0; padding: 0 2px; }

/* ================================================================
   AGENDA CARDS
   ================================================================ */
.agenda-card { padding: 28px 24px; }
.agenda-num  { font-size: 40px; font-weight: 900; color: var(--border-strong); line-height: 1; margin-bottom: 12px; }
.grad-num    { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.card-accent-bg { background: var(--accent-soft); border-color: rgba(232,112,58,.18); }

/* ================================================================
   3-LAYER CARDS (消费本质)
   ================================================================ */
.layer-tag { font-size: 11px; font-weight: 700; letter-spacing: .1em; color: var(--text-3); margin-bottom: 8px; }
.card-soft-accent { background: var(--accent-soft); border-color: rgba(232,112,58,.15); }

/* ================================================================
   HIGHLIGHT BOX
   ================================================================ */
.highlight-box {
  background: var(--accent-soft);
  border-radius: 12px;
  padding: 20px 24px;
  display: flex; align-items: flex-start; gap: 16px;
  border: 1px solid rgba(232,112,58,.18);
}
.highlight-icon { font-size: 22px; flex-shrink: 0; margin-top: 2px; }
.highlight-box p { margin: 0; font-size: 15px; line-height: 1.7; color: var(--text-2); }

/* ================================================================
   BIG QUOTE (广告目标)
   ================================================================ */
.big-statement { position: relative; padding-left: 48px; }
.quote-mark { position: absolute; left: 0; top: -16px; font-size: 72px; line-height: 1; color: var(--accent); font-family: Georgia, serif; opacity: .5; }
.quote-text { font-size: 28px; line-height: 1.5; color: var(--text-1); }

/* ================================================================
   ICON CIRCLE
   ================================================================ */
.icon-circle {
  width: 48px; height: 48px; border-radius: 50%;
  background: var(--accent-soft);
  border: 1.5px solid rgba(232,112,58,.25);
  display: flex; align-items: center; justify-content: center; font-size: 22px;
}

/* ================================================================
   PROCESS FLOW
   ================================================================ */
.process-flow { display: flex; flex-direction: column; gap: 0; }
.process-step { display: flex; align-items: flex-start; gap: 14px; padding: 10px 0; }
.process-line { width: 2px; height: 20px; background: rgba(232,112,58,.25); margin-left: 17px; }
.step-dot {
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 800; flex-shrink: 0; color: #fff;
}
.step-1 { background: #E8703A; }
.step-2 { background: #D45F28; }
.step-3 { background: #FFB347; }
.step-4 { background: var(--good); }

/* ================================================================
   RESULT BOX (Case①)
   ================================================================ */
.result-box { background: var(--surface-2); border-radius: 16px; padding: 28px; border: 1px solid var(--border); }
.result-metric { text-align: center; }
.result-n { font-size: 48px; font-weight: 900; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; line-height: 1; }
.result-l { font-size: 14px; color: var(--text-2); margin-top: 4px; }
.result-divider { height: 1px; background: var(--border); margin: 16px 0; }
.result-insight { background: var(--surface); border-radius: 10px; padding: 14px; font-size: 14px; line-height: 1.6; color: var(--text-2); border: 1px solid var(--border); }

/* ================================================================
   INSIGHT BLOCK
   ================================================================ */
.insight-block  { display: flex; flex-direction: column; gap: 10px; }
.insight-row    { display: flex; align-items: flex-start; gap: 12px; background: var(--surface-2); padding: 14px 16px; border-radius: 10px; }
.insight-tag    { font-size: 11px; font-weight: 700; letter-spacing: .06em; padding: 4px 10px; border-radius: 6px; white-space: nowrap; flex-shrink: 0; margin-top: 2px; }
.insight-tag-no { background: rgba(224,82,82,.12); color: var(--bad); }
.insight-tag-yes{ background: rgba(76,175,130,.12); color: var(--good); }
.insight-arrow  { font-size: 13px; font-weight: 700; color: var(--accent); padding: 4px 8px; text-align: center; }

/* ================================================================
   FEATURE LIST (Molly)
   ================================================================ */
.feature-list { display: flex; flex-direction: column; gap: 10px; }
.feature-item { display: flex; align-items: flex-start; gap: 12px; font-size: 15px; line-height: 1.5; color: var(--text-2); padding: 10px 14px; background: var(--surface-2); border-radius: 8px; }
.feature-icon { font-size: 16px; flex-shrink: 0; margin-top: 1px; }
.feature-item-note { background: var(--accent-soft); border: 1px solid rgba(232,112,58,.15); }

/* ================================================================
   COLLAB (Molly 怎么做)
   ================================================================ */
.collab-header { padding: 12px 16px; border-radius: 10px 10px 0 0; font-size: 14px; font-weight: 700; }
.collab-ai     { background: var(--accent-soft); color: var(--accent); }
.collab-human  { background: rgba(76,175,130,.10); color: var(--good); }
.collab-list   { border: 1px solid var(--border); border-top: none; border-radius: 0 0 10px 10px; overflow: hidden; }
.collab-item   { padding: 11px 16px; font-size: 14px; color: var(--text-2); border-bottom: 1px solid var(--border); line-height: 1.5; }
.collab-item:last-child { border-bottom: none; }
.collab-item-human { color: var(--text-1); }
.collab-divider { display: flex; align-items: center; justify-content: center; font-size: 22px; color: var(--text-3); flex-shrink: 0; padding: 0 4px; }

/* ================================================================
   75-CHAR DEMO
   ================================================================ */
.char-demo  { margin: 4px 0 0; }
.char-bar   { height: 10px; border-radius: 5px; background: var(--surface-2); position: relative; overflow: hidden; }
.char-fill  { position: absolute; left: 0; top: 0; bottom: 0; width: 75%; background: var(--good); border-radius: 5px; }
.char-cutoff{ position: absolute; right: 0; top: 0; bottom: 0; width: 25%; background: var(--bad); opacity: .5; }
.char-labels{ display: flex; justify-content: space-between; font-size: 12px; margin-top: 6px; color: var(--text-3); }

/* ================================================================
   STEP CARDS (如何开始)
   ================================================================ */
.step-card { background: var(--surface-2); border-radius: 20px; padding: 32px 24px; text-align: center; border: 1px solid var(--border); display: flex; flex-direction: column; align-items: center; gap: 10px; }
.step-card-active { background: var(--accent-soft); border-color: rgba(232,112,58,.3); }
.step-number { font-size: 52px; font-weight: 900; color: var(--border-strong); line-height: 1; }
.step-number-grad { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.step-card h3 { margin: 0; font-size: 18px; }
.step-tag { font-size: 12px; font-weight: 700; padding: 4px 12px; border-radius: 20px; background: rgba(0,0,0,.06); color: var(--text-3); }
.step-tag-grad { background: var(--grad); color: #fff; }

/* ================================================================
   QR PLACEHOLDER
   ================================================================ */
.qr-placeholder {
  width: 140px; height: 140px;
  border: 1.5px dashed rgba(240,234,224,.25);
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; color: var(--dark-text-3); text-align: center; padding: 8px;
}

/* ================================================================
   MOLLY CARD
   ================================================================ */
.molly-card { display: flex; align-items: center; gap: 16px; background: var(--accent-soft); border-radius: 14px; padding: 20px 24px; border: 1px solid rgba(232,112,58,.2); }
.molly-avatar { width: 56px; height: 56px; border-radius: 50%; background: var(--grad); display: flex; align-items: center; justify-content: center; color: #fff; font-size: 24px; font-weight: 800; flex-shrink: 0; }

/* ================================================================
   DELIVERABLE BOX
   ================================================================ */
.deliverable-box { background: var(--surface-2); border-radius: 16px; padding: 24px; border: 1px solid var(--border); }
.deliverable-icon { font-size: 32px; margin-bottom: 8px; }
.image-placeholder { background: var(--surface-2); border-radius: 10px; height: 120px; display: flex; align-items: center; justify-content: center; color: var(--text-3); font-size: 13px; border: 1px dashed var(--border-strong); }

/* ================================================================
   TRANSITION SLIDE (过渡页)
   ================================================================ */
.transition-block { display: flex; flex-direction: column; gap: 20px; }
.transition-item  { display: flex; align-items: center; gap: 16px; }
.t-icon { font-size: 32px; width: 52px; flex-shrink: 0; }
.gate-box { background: rgba(232,112,58,.08); border: 1px solid rgba(232,112,58,.25); border-radius: 12px; padding: 16px 20px; display: flex; align-items: flex-start; gap: 14px; margin-left: 16px; }
.gate-icon { font-size: 24px; flex-shrink: 0; }
.gate-text strong { color: var(--dark-text-1); font-size: 16px; }
.gate-text p { color: var(--dark-text-2); font-size: 13px; margin: 6px 0 0; line-height: 1.5; }

/* ================================================================
   MISC UTILITIES
   ================================================================ */
.mt-xl { margin-top: 48px; }
.tpl-pitch-deck .card { background: var(--surface); border: 1px solid var(--border); }
.tpl-pitch-deck .card-accent {
  background: var(--grad) !important;
  border-color: transparent !important;
  color: #fff;
}
.tpl-pitch-deck .card-accent h4 { color: #fff; }

/* ================================================================
   ★ CASE②: 竖向滚动幻灯片
   ================================================================ */
.slide-scroll-host {
  overflow: hidden !important;
  padding: 0 !important;
}
.scroll-panel {
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  scroll-behavior: smooth;
  scrollbar-width: none;  /* Firefox */
}
.scroll-panel::-webkit-scrollbar { display: none; }  /* Chrome */

/* 每个"屏"精确等于幻灯片高度 */
.scroll-section {
  width: 100%;
  height: 100%;
  flex-shrink: 0;
  display: flex;
  align-items: stretch;
  position: relative;
  padding: 64px 112px;
  box-sizing: border-box;
}

/* Section A: Mobile 高图 + 左侧内容 */
.scroll-sec-a {
  gap: 48px;
}
.scroll-sec-a .sec-left {
  flex: 1.1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 20px;
}
.scroll-sec-a .sec-right {
  flex: 0.7;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

/* Mobile frame — tall image */
.mobile-frame-wrap {
  position: relative;
  width: 100%;
  max-width: 280px;
}
.mobile-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--accent);
  text-align: center;
  margin-bottom: 8px;
}
.mobile-img-container {
  width: 100%;
  /* 竖向长图：固定高度，内部可滚动查看完整图 */
  height: calc(100vh - 180px);
  border-radius: 10px;
  border: 1.5px solid var(--border-strong);
  overflow-y: auto;
  overflow-x: hidden;
  background: var(--surface-2);
  scrollbar-width: thin;
  scrollbar-color: rgba(0,0,0,.15) transparent;
}
.mobile-img-container::-webkit-scrollbar { width: 4px; }
.mobile-img-container::-webkit-scrollbar-thumb { background: rgba(0,0,0,.15); border-radius: 2px; }
.mobile-img-container img {
  width: 100%;
  display: block;
}
.mobile-img-placeholder {
  width: 100%;
  min-height: 420px;
  background: linear-gradient(180deg, var(--surface-2) 0%, var(--bg-soft) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-3);
  font-size: 13px;
  flex-direction: column;
  gap: 8px;
  padding: 24px;
  text-align: center;
}

/* Scroll hint arrow */
.scroll-hint-down {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--accent);
  font-weight: 600;
  animation: bounce-y 1.8s ease-in-out infinite;
  margin-top: auto;
  padding-top: 8px;
}
@keyframes bounce-y {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(5px); }
}
.scroll-hint-up {
  position: absolute;
  top: 24px;
  right: 40px;
  font-size: 13px;
  color: var(--text-3);
  display: flex;
  align-items: center;
  gap: 6px;
}

/* Section B: Web/Desktop Amazon 风格 */
.scroll-sec-b {
  flex-direction: column;
  padding: 48px 80px;
  gap: 0;
  background: #F7F2EC;   /* 特意用暖白，区别于其他 slides */
}
.web-section-label {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}
.web-section-label .wsl-tag {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--accent);
}
.web-section-label .wsl-hint {
  font-size: 13px;
  color: var(--text-3);
}

/* Amazon A+ 容器 */
.amazon-aplus-wrap {
  width: 85%;
  margin: 0 auto;
  border: 1px solid #D5CAC0;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0,0,0,.08);
  background: #fff;
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 200px);
}

/* A+ 顶部 bar（模拟 Amazon chrome） */
.amazon-chrome-bar {
  background: #232F3E;
  height: 40px;
  display: flex;
  align-items: center;
  padding: 0 16px;
  gap: 10px;
}
.chrome-dot { width: 10px; height: 10px; border-radius: 50%; }
.chrome-dot-r { background: #FF5F56; }
.chrome-dot-y { background: #FFBD2E; }
.chrome-dot-g { background: #27C93F; }
.chrome-url-bar {
  flex: 1;
  background: rgba(255,255,255,.12);
  border-radius: 4px;
  height: 22px;
  margin-left: 8px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  font-size: 11px;
  color: rgba(255,255,255,.6);
}
.amazon-logo-mini { font-size: 13px; font-weight: 900; color: #FF9900; letter-spacing: -.03em; }

/* A+ content modules */
.aplus-body {
  padding: 0;
  overflow-y: auto;
  overflow-x: hidden;
  flex: 1;
  /* 让 scrollbar 可见以便演示 */
  scrollbar-width: thin;
  scrollbar-color: rgba(0,0,0,.2) transparent;
}
.aplus-body::-webkit-scrollbar { width: 6px; }
.aplus-body::-webkit-scrollbar-thumb { background: rgba(0,0,0,.18); border-radius: 3px; }
.aplus-module { width: 100%; }

/* Module 1: Full-width hero */
.aplus-hero {
  background: linear-gradient(135deg, #1A2840 0%, #2A3F5E 100%);
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 48px;
  gap: 40px;
}
.aplus-hero-text { flex: 1; }
.aplus-hero-text h3 { color: #fff; font-size: 26px; font-weight: 800; margin: 0 0 10px; line-height: 1.2; }
.aplus-hero-text p  { color: rgba(255,255,255,.75); font-size: 14px; line-height: 1.6; margin: 0; }
.aplus-hero-img { flex: 0.8; min-height: 140px; background: rgba(255,255,255,.08); border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.aplus-hero-img-ph { font-size: 13px; color: rgba(255,255,255,.4); text-align: center; padding: 16px; }

/* Module 2: Text left + image right */
.aplus-split { display: flex; }
.aplus-split-cell { flex: 1; padding: 28px 32px; }
.aplus-split-cell-img { background: var(--light-surface2); display: flex; align-items: center; justify-content: center; min-height: 160px; }
.aplus-split-cell-img-ph { font-size: 12px; color: var(--light-text-3); text-align: center; padding: 16px; }
.aplus-split-cell h4 { font-size: 16px; font-weight: 700; color: var(--light-text-1); margin: 0 0 10px; }
.aplus-split-cell p  { font-size: 13px; color: var(--light-text-2); line-height: 1.65; margin: 0; }
.aplus-split-divider { width: 1px; background: #E5DDD4; flex-shrink: 0; }

/* Module 3: 3-col grid */
.aplus-grid3 { display: flex; border-top: 1px solid #E5DDD4; }
.aplus-grid3-cell { flex: 1; padding: 22px 24px; border-right: 1px solid #E5DDD4; }
.aplus-grid3-cell:last-child { border-right: none; }
.aplus-grid3-cell .g3-icon { font-size: 24px; margin-bottom: 8px; }
.aplus-grid3-cell h5 { font-size: 13px; font-weight: 700; margin: 0 0 6px; color: var(--light-text-1); }
.aplus-grid3-cell p  { font-size: 12px; color: var(--light-text-2); line-height: 1.55; margin: 0; }

/* Nav hint */
.nav-hint-right {
  margin-top: 16px;
  font-size: 13px;
  color: var(--text-3);
  text-align: center;
  letter-spacing: .04em;
}

/* ================================================================
   PROGRESS DOTS (竖向滚动提示)
   ================================================================ */
.scroll-dots {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 10;
}
.scroll-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--border-strong);
  transition: all .3s;
}
.scroll-dot.active { height: 20px; border-radius: 3px; background: var(--accent); }

/* ================================================================
   iPHONE 17 Pro Max MOCKUP (Case② Section A)
   Real device ratio: 163mm x 77.6mm = 2.10:1 (H:W)
   ================================================================ */
.iphone-17-frame {
  position: relative;
  display: block;
  width: 260px;
  height: 546px;                              /* 260 × 2.10 = 546，真机 iPhone 17 Pro Max 比例 */
  background: linear-gradient(155deg, #d4d4d8 0%, #8e8e93 30%, #6e6e73 55%, #9c9ca0 80%, #5c5c60 100%);
  border-radius: 46px;
  padding: 8px;                               /* 边框统一 8px = 真机 3mm */
  box-shadow:
    0 0 0 1.5px rgba(0,0,0,.42),
    inset 0 0 0 1px rgba(255,255,255,.28),
    0 30px 70px rgba(0,0,0,.42),
    0 10px 24px rgba(0,0,0,.22);
  flex: 0 0 auto;                             /* 不被 flex 父级拉伸 */
  box-sizing: border-box;
}
.iphone-17-screen {
  background: #000;
  border-radius: 38px;
  overflow: hidden;
  position: relative;
  width: 100%;
  height: 100%;
}
.iphone-17-di {
  /* Dynamic Island - real: 122x37mm on 71mm screen = 27% wide */
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  width: 96px;
  height: 30px;
  background: #000;
  border-radius: 15px;
  z-index: 10;
  box-shadow: 0 0 0 1px rgba(255,255,255,.05);
}
/* iOS 状态栏（时间 & 图标） */
.ios-status {
  position: absolute;
  top: 12px;
  left: 0;
  right: 0;
  z-index: 9;
  display: flex;
  justify-content: space-between;
  padding: 0 22px;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  pointer-events: none;
}
.ios-status .ios-time { font-variant-numeric: tabular-nums; }
.ios-status .ios-icons { font-size: 10px; letter-spacing: 1px; opacity: .9; }

.iphone-17-content {
  padding-top: 0;                            /* Amazon 顶栏本身是黑色，与 DI 无缝衔接 */
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
  box-sizing: border-box;
  scrollbar-width: none;
  background: #131A22;                       /* 与 amazon topbar 同色，避免亮色渗透 */
}
.iphone-17-content::-webkit-scrollbar { display: none; }

/* Side hardware buttons */
.iphone-btn-action,
.iphone-btn-vol-up,
.iphone-btn-vol-dn,
.iphone-btn-power {
  position: absolute;
  background: linear-gradient(90deg, #5c5c60, #b8b8bc);
  border-radius: 2px;
  box-shadow: inset 0 1px 2px rgba(255,255,255,.25), 0 2px 5px rgba(0,0,0,.35);
}
.iphone-btn-action { left: -3px; top: 60px;  width: 3px; height: 26px; border-radius: 2px 0 0 2px; }
.iphone-btn-vol-up { left: -3px; top: 108px; width: 3px; height: 38px; border-radius: 2px 0 0 2px; }
.iphone-btn-vol-dn { left: -3px; top: 156px; width: 3px; height: 38px; border-radius: 2px 0 0 2px; }
.iphone-btn-power  { right: -3px; top: 120px; width: 3px; height: 60px; border-radius: 0 2px 2px 0;
                     background: linear-gradient(270deg, #5c5c60, #b8b8bc); }

/* ================================================================
   AMAZON PDP MOBILE (在 iPhone 内)
   ================================================================ */
.amz-pdp-hdr { background: #fff; }
.amz-pdp-topbar {
  display: flex;
  align-items: center;
  gap: 6px;
  background: #131A22;
  padding: 46px 10px 8px;                    /* 顶部留 46px 避开 Dynamic Island 与 iOS 状态栏 */
}
.amz-back { color: #fff; font-size: 18px; font-weight: 700; }
.amz-cart { color: #fff; font-size: 14px; padding: 0 2px; }
.amz-search-bar {
  flex: 1;
  background: #fff;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 11px;
  color: #333;
  display: flex;
  align-items: center;
  gap: 6px;
  border: 1px solid #d5d5d5;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.amz-search-ic { font-size: 10px; opacity: .5; }
.amz-pdp-loc {
  background: #37475A;
  color: #fff;
  padding: 5px 12px;
  font-size: 10px;
  display: flex;
  align-items: center;
  gap: 4px;
}
.amz-pdp-crumb {
  background: #EAEDED;
  color: #4B5D71;
  font-size: 10px;
  padding: 6px 12px;
  border-bottom: 1px solid #DDD;
}
.amz-aplus-img { width: 100%; display: block; }

.mobile-scroll-hint {
  font-size: 11px;
  color: var(--text-3);
  text-align: center;
  margin-top: 8px;
  letter-spacing: .03em;
}

/* ================================================================
   TEAM SLIDE
   ================================================================ */
.team-layout {
  display: flex;
  gap: 48px;
  align-items: flex-start;
  margin-top: 32px;
}
.team-section { flex: 1; }
.team-section-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--text-3);
  margin-bottom: 18px;
  text-transform: uppercase;
}
.team-humans { display: flex; flex-direction: column; gap: 14px; }
.human-card {
  display: flex;
  align-items: center;
  gap: 16px;
  background: var(--surface-2);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 14px 18px;
  transition: border-color .2s;
}
.human-card:hover { border-color: var(--accent); }
.human-avatar {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--grad);
  color: #fff;
  font-size: 18px;
  font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.human-card h4 { margin: 0 0 2px; font-size: 16px; }

/* AI Agent section */
.team-ai-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--accent);
  margin-bottom: 18px;
  text-transform: uppercase;
}
.agent-grid { display: flex; flex-direction: column; gap: 12px; }
.agent-card {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--accent-soft);
  border: 1px solid rgba(232,112,58,.18);
  border-radius: 12px;
  padding: 12px 16px;
  transition: border-color .2s, background .2s;
}
.agent-card:hover { border-color: var(--accent); background: rgba(232,112,58,.18); }
.agent-icon-wrap {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: var(--grad);
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}
.agent-card h4 { margin: 0 0 2px; font-size: 15px; }
.agent-featured { border-color: var(--accent) !important; background: rgba(232,112,58,.22) !important; }
.agent-featured h4 { color: var(--accent); }

/* ================================================================
   DR. LISTING EASTER EGG SLIDE
   ================================================================ */
.easter-layout {
  display: flex;
  gap: 80px;
  align-items: center;
  height: 100%;
  padding: 80px 112px;
  box-sizing: border-box;
}
.easter-left { flex: 1.2; }
.easter-right {
  flex: 0.8;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}
.dr-listing-name {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.dr-listing-name .dr-icon {
  font-size: 36px;
}
.dr-listing-name .dr-text {
  font-size: 28px;
  font-weight: 900;
  color: var(--dark-text-1);
  letter-spacing: -.02em;
}
.dr-listing-name .dr-text em {
  color: var(--accent);
  font-style: normal;
}
.dr-desc-list {
  list-style: none;
  padding: 0;
  margin: 20px 0 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.dr-desc-list li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  color: var(--dark-text-2);
}
.dr-desc-list li::before {
  content: '✓';
  color: var(--accent);
  font-weight: 700;
  font-size: 14px;
  width: 20px;
  flex-shrink: 0;
}
.dr-url-chip {
  display: inline-block;
  margin-top: 24px;
  background: rgba(232,112,58,.15);
  border: 1px solid rgba(232,112,58,.4);
  border-radius: 24px;
  padding: 8px 20px;
  font-size: 14px;
  color: var(--accent);
  font-weight: 600;
  letter-spacing: .02em;
}
.qr-frame {
  background: #fff;
  border-radius: 20px;
  padding: 20px;
  box-shadow: 0 8px 40px rgba(0,0,0,.25);
  text-align: center;
}
.qr-frame img {
  width: 200px;
  height: 200px;
  display: block;
  border-radius: 8px;
}
.qr-label {
  font-size: 12px;
  color: var(--light-text-2);
  margin-top: 12px;
  line-height: 1.5;
  max-width: 180px;
  margin-left: auto;
  margin-right: auto;
}
.qa-note {
  color: var(--dark-text-3);
  font-size: 15px;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid var(--dark-border);
}

/* ================================================================
   FUNNEL-3 (消费的本质)
   ================================================================ */
.funnel-3 {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.funnel-row {
  display: flex;
  align-items: stretch;
  gap: 20px;
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 18px 22px;
  transition: transform .2s, border-color .2s;
}
.funnel-row:hover { transform: translateX(4px); border-color: var(--accent); }
.funnel-row-accent { background: rgba(232,112,58,.06); border-color: rgba(232,112,58,.28); }
.funnel-row-hero   { background: rgba(232,112,58,.14); border-color: var(--accent); }
.funnel-idx {
  font-size: 26px;
  font-weight: 900;
  color: var(--accent);
  min-width: 46px;
  letter-spacing: -.02em;
  display: flex;
  align-items: center;
}
.funnel-body { flex: 1; }
.funnel-body h4 {
  font-size: 17px;
  margin: 0 0 4px;
  color: var(--light-text-1);
  font-weight: 800;
}
.funnel-body p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--light-text-2);
  margin: 0;
}
.funnel-tag {
  font-size: 11px;
  font-weight: 600;
  color: var(--accent);
  letter-spacing: .04em;
  margin-left: 6px;
}
.footnote-line {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 12px 18px;
  border-left: 3px solid var(--accent);
  background: rgba(232,112,58,.05);
  border-radius: 0 8px 8px 0;
}
.fn-num {
  font-size: 32px;
  font-weight: 900;
  color: var(--accent);
  letter-spacing: -.02em;
  flex-shrink: 0;
}
.fn-text {
  font-size: 14px;
  line-height: 1.55;
  color: var(--light-text-2);
}

/* ================================================================
   ADS TRIANGLE (亚马逊广告本质)
   ================================================================ */
.ads-triangle {
  display: flex;
  align-items: stretch;
  gap: 10px;
}
.ads-node {
  flex: 1;
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: border-color .2s;
}
.ads-node:hover { border-color: var(--accent); }
.ads-node-1 { border-top: 3px solid var(--accent); }
.ads-node-2 { border-top: 3px solid var(--accent-2); background: rgba(232,112,58,.06); }
.ads-node-3 { border-top: 3px solid #E8703A; background: linear-gradient(135deg, rgba(232,112,58,.14), rgba(255,179,71,.08)); }
.ads-node-hd {
  font-weight: 800;
  color: var(--light-text-1);
  font-size: 16px;
  letter-spacing: -.01em;
}
.ads-node-body p {
  font-size: 13px;
  line-height: 1.55;
  color: var(--light-text-2);
  margin: 0 0 6px;
}
.ads-node-body .ads-note {
  font-size: 12px;
  color: var(--light-text-3);
  padding-top: 6px;
  border-top: 1px dashed var(--border);
  margin: 0;
}
.ads-plus {
  align-self: center;
  font-size: 24px;
  color: var(--accent);
  font-weight: 700;
  padding: 0 4px;
}

/* ================================================================
   OPTIONS-3 (你想解决什么)
   ================================================================ */
.options-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.opt-card {
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  transition: transform .2s, border-color .2s;
}
.opt-card:hover { transform: translateY(-4px); border-color: var(--accent); }
.opt-card-active {
  background: linear-gradient(160deg, rgba(232,112,58,.14), rgba(255,179,71,.06));
  border-color: var(--accent);
}
.opt-tag {
  width: 40px; height: 40px;
  border-radius: 50%;
  background: var(--light-surface2);
  color: var(--light-text-2);
  font-weight: 900;
  font-size: 18px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.opt-tag-active {
  background: var(--grad);
  color: #fff;
}
.opt-card h3 {
  font-size: 19px;
  color: var(--light-text-1);
  margin: 4px 0 0;
  font-weight: 800;
}
.opt-card p {
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--light-text-2);
  margin: 0;
  flex: 1;
}
.opt-audience {
  font-size: 12px;
  color: var(--accent);
  font-weight: 600;
  padding-top: 10px;
  border-top: 1px dashed var(--border);
  margin-top: auto;
}

/* ================================================================
   APLUS DESKTOP INLINE (Case② Section B — 无容器)
   ================================================================ */
.aplus-desktop-inline {
  width: 100%;
  max-width: 1200px;
  margin: 12px auto 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(0,0,0,.10);
}
.aplus-desktop-inline img {
  width: 100%;
  display: block;
}
/* scroll-sec-b：让整个桌面图自然撑高，页面继续下拉即可看全 */
.scroll-sec-b {
  overflow-y: visible;
  align-items: flex-start;
  flex-direction: column;
  padding: 48px 80px 80px !important;
  height: auto !important;
  min-height: 100%;
}

/* ================================================================
   MOLLY 是谁 — 新布局
   ================================================================ */
.molly-intro {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 40px;
  margin-top: 32px;
  align-items: stretch;
}
.molly-hero-card {
  background: linear-gradient(160deg, #152640 0%, #1C3158 100%);
  border-radius: 18px;
  padding: 40px 36px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.molly-hero-card::after {
  content: '';
  position: absolute;
  right: -60px; bottom: -60px;
  width: 220px; height: 220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(232,112,58,.28), transparent 70%);
}
.molly-hero-avatar {
  width: 92px; height: 92px;
  border-radius: 24px;
  background: var(--grad);
  color: #fff;
  font-size: 44px;
  font-weight: 900;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 12px 32px rgba(232,112,58,.35);
}
.molly-hero-card h3 {
  font-size: 40px;
  margin: 0 0 6px;
  color: #fff;
  letter-spacing: -.02em;
  font-weight: 900;
}
.molly-role {
  font-size: 15px;
  color: rgba(255,255,255,.75);
  margin: 0;
  line-height: 1.55;
}
.molly-abilities {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.molly-ability-item {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 18px 22px;
  transition: border-color .2s, transform .2s;
}
.molly-ability-item:hover { border-color: var(--accent); transform: translateX(4px); }
.molly-ability-item .ma-num {
  font-size: 22px;
  font-weight: 900;
  color: var(--accent);
  letter-spacing: -.02em;
  min-width: 42px;
  padding-top: 2px;
}
.molly-ability-item h4 {
  font-size: 18px;
  margin: 0 0 4px;
  color: var(--light-text-1);
  font-weight: 800;
}
.molly-ability-item p {
  font-size: 14px;
  color: var(--light-text-2);
  margin: 0;
  line-height: 1.55;
}
.molly-ability-note {
  background: rgba(232,112,58,.08);
  border-color: rgba(232,112,58,.28);
}
.molly-ability-note h4 { color: var(--accent); }

/* ================================================================
   MOLLY 怎么做 — 大字版
   ================================================================ */
.collab-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 32px;
}
.collab-col {
  border-radius: 18px;
  padding: 28px 32px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.collab-col-ai {
  background: rgba(88,140,220,.10);
  border: 1px solid rgba(88,140,220,.28);
}
.collab-col-human {
  background: rgba(232,112,58,.10);
  border: 1px solid rgba(232,112,58,.28);
}
.collab-col-hd {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-bottom: 16px;
  border-bottom: 1px dashed rgba(0,0,0,.10);
}
.collab-col-ic {
  font-size: 32px;
  width: 54px; height: 54px;
  border-radius: 14px;
  background: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 12px rgba(0,0,0,.06);
}
.collab-col-hd h3 {
  font-size: 22px;
  color: var(--light-text-1);
  margin: 0 0 2px;
  font-weight: 800;
}
.collab-col-sub {
  font-size: 13px;
  color: var(--light-text-3);
  margin: 0;
  letter-spacing: .02em;
}
.collab-big-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.collab-big-list li {
  font-size: 18px;
  line-height: 1.55;
  color: var(--light-text-1);
  padding-left: 22px;
  position: relative;
}
.collab-big-list li::before {
  content: '';
  position: absolute;
  left: 0; top: 12px;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--accent);
}
.collab-col-ai .collab-big-list li::before { background: #5A88C8; }
.collab-big-list li strong {
  color: var(--accent);
  font-weight: 800;
}
.collab-col-ai .collab-big-list li strong { color: #4272B8; }

/* ================================================================
   MOLLY 内核 & 技能栈
   ================================================================ */
.molly-stack {
  display: grid;
  grid-template-columns: 0.85fr 1.15fr;
  gap: 32px;
  margin-top: 28px;
  align-items: stretch;
}
.stack-kernel {
  background: linear-gradient(160deg, rgba(28,49,88,.9) 0%, rgba(21,38,64,.9) 100%);
  border: 1px solid rgba(240,234,224,.14);
  border-radius: 18px;
  padding: 26px 28px;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.stack-kernel-hd {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  font-weight: 800;
  color: var(--accent);
  letter-spacing: .08em;
  text-transform: uppercase;
  padding-bottom: 14px;
  border-bottom: 1px dashed var(--dark-border);
}
.stack-kernel-ic {
  font-size: 22px;
  width: 40px; height: 40px;
  border-radius: 10px;
  background: rgba(232,112,58,.18);
  display: flex; align-items: center; justify-content: center;
}
.stack-kernel-body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.stack-k-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.stack-k-item strong {
  font-size: 16px;
  color: var(--dark-text-1);
  font-weight: 800;
}
.stack-k-item span {
  font-size: 13px;
  color: var(--dark-text-2);
  line-height: 1.55;
}

.stack-skills {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.skill-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--accent);
  text-transform: uppercase;
  margin: 0;
}
.skill-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.skill-chip {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: rgba(240,234,224,.05);
  border: 1px solid rgba(240,234,224,.10);
  border-radius: 12px;
  padding: 14px 16px;
  transition: border-color .2s, background .2s;
}
.skill-chip:hover { border-color: var(--accent); background: rgba(232,112,58,.10); }
.skill-chip .sk-ic {
  font-size: 22px;
  width: 38px; height: 38px;
  border-radius: 10px;
  background: rgba(240,234,224,.08);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.skill-chip h5 {
  font-size: 14px;
  font-family: 'SF Mono', 'Menlo', Consolas, monospace;
  color: var(--dark-text-1);
  margin: 0 0 4px;
  letter-spacing: -.02em;
  font-weight: 800;
}
.skill-chip p {
  font-size: 12px;
  color: var(--dark-text-2);
  margin: 0;
  line-height: 1.5;
}
.skill-chip-more {
  background: rgba(232,112,58,.12);
  border-color: rgba(232,112,58,.35);
  border-style: dashed;
}
.skill-chip-more h5 {
  font-family: inherit;
  color: var(--accent);
}
.skill-chip-more p { color: var(--dark-text-2); }
.skill-chip-more .sk-ic {
  background: rgba(232,112,58,.20);
}

/* ---- 封面页 inner wrapper (原内联 style) ---- */
.tpl-pitch-deck .cover-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
  padding: 88px 112px;
  box-sizing: border-box;
}

/* ================================================================
   =============  MOBILE · READER MODE  ===========================
   小屏（≤900px）把整个 deck 从"逐张切换"改成"从上到下阅读"。
   所有 slides 顺序渲染，自然滚动，禁用切页动画。
   目标：手机上像看长文，无需理会键盘/翻页。
   ================================================================ */
@media (max-width: 900px) {

  /* ---- Reader Mode 基础：deck 允许自然滚动 ---- */
  html, body { overflow-x: hidden; }
  body.tpl-pitch-deck {
    background: var(--light-bg);
    min-height: 100vh;
  }
  .tpl-pitch-deck .deck {
    height: auto !important;
    min-height: auto !important;
    overflow: visible !important;
    display: block !important;
    background: transparent;
  }

  /* ---- 每张 slide：从 absolute 全屏 → relative 顺序排列 ---- */
  .tpl-pitch-deck .slide {
    position: relative !important;
    inset: auto !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
    transition: none !important;
    z-index: auto !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    min-height: 100vh;
    padding: 40px 20px !important;
    overflow: visible !important;
    box-sizing: border-box;
  }

  /* ---- runtime 的循环克隆隐藏 ---- */
  .tpl-pitch-deck .slide.cloned { display: none !important; }

  /* ---- slide 之间加细分割线 ---- */
  .tpl-pitch-deck .slide + .slide { border-top: 1px solid rgba(0,0,0,.08); }
  .tpl-pitch-deck .slide-dark + .slide,
  .tpl-pitch-deck .slide + .slide-dark,
  .tpl-pitch-deck .slide-dark + .slide-dark,
  .tpl-pitch-deck .slide-dark + .slide-dark-soft,
  .tpl-pitch-deck .slide-dark-soft + .slide-dark { border-top: 0; }

  /* ---- Case② 竖向滚动幻灯片：完全铺开 ---- */
  .tpl-pitch-deck .slide-scroll-host {
    padding: 0 !important;
    height: auto !important;
    min-height: auto !important;
    display: block !important;
  }
  .tpl-pitch-deck .scroll-panel {
    height: auto !important;
    overflow: visible !important;
    display: block !important;
    scroll-behavior: auto !important;
  }
  .tpl-pitch-deck .scroll-section {
    height: auto !important;
    min-height: auto !important;
    display: block !important;
    padding: 40px 20px !important;
  }
  .tpl-pitch-deck .scroll-section + .scroll-section {
    border-top: 1px dashed rgba(0,0,0,.12);
    margin-top: 8px;
  }
  .tpl-pitch-deck .scroll-hint-down,
  .tpl-pitch-deck .scroll-hint-up,
  .tpl-pitch-deck .scroll-dots,
  .tpl-pitch-deck .nav-hint-right { display: none !important; }

  /* ---- 视频舞台：非全屏，正常内联播放 ---- */
  .tpl-pitch-deck .video-stage {
    position: relative !important;
    padding: 8px 0 !important;
    height: auto !important;
    inset: auto !important;
  }
  .tpl-pitch-deck .video-stage video {
    height: auto !important;
    max-height: 60vh;
    border-radius: 12px !important;
  }

  /* ---- 隐藏 deck-level 装饰 / 进度条 ---- */
  .tpl-pitch-deck .deck-progress,
  .tpl-pitch-deck .deck-footer,
  .tpl-pitch-deck .kb-hint { display: none !important; }

  /* ---- 封面 & dark slide 保持全高（首屏冲击）---- */
  .tpl-pitch-deck .slide-dark,
  .tpl-pitch-deck .slide-dark-soft { min-height: 100vh; }
  .tpl-pitch-deck .cover-inner {
    min-height: calc(100vh - 80px);
    padding: 40px 20px !important;
  }

  /* ---- iPhone mockup 在阅读版里居中显示，别飘边 ---- */
  .tpl-pitch-deck .sec-right { margin: 0 auto; }

  /* ---- 原有 slide padding 收紧规则失效（被上面覆盖）---- */


  /* ---- 字号缩放 ---- */
  .tpl-pitch-deck .h2 {
    font-size: 26px !important;
    line-height: 1.2 !important;
  }
  .tpl-pitch-deck .lede,
  .tpl-pitch-deck .lede.mt-m {
    font-size: 14px !important;
    line-height: 1.5 !important;
  }
  .tpl-pitch-deck .num-tag { font-size: 10px; letter-spacing: .12em; }

  /* ---- 通用 flex row / grid → 单列 ---- */
  .tpl-pitch-deck .row { flex-direction: column !important; gap: 12px !important; align-items: stretch !important; }
  .tpl-pitch-deck .grid.g2,
  .tpl-pitch-deck .grid.g3,
  .tpl-pitch-deck .grid.g4 {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  /* ---- 封面页 ---- */
  .tpl-pitch-deck .cover-inner { padding: 28px 18px !important; }
  .tpl-pitch-deck .cover-h1 { font-size: 32px !important; line-height: 1.1 !important; }
  .tpl-pitch-deck .cover-sub { font-size: 13px !important; }
  .tpl-pitch-deck .cover-kicker { font-size: 11px !important; }
  .tpl-pitch-deck .cover-brand { font-size: 11px; white-space: nowrap; }
  .tpl-pitch-deck .cover-brand-dot { font-size: 8px; }
  .tpl-pitch-deck .cover-footer { font-size: 10px; flex-wrap: wrap; gap: 6px; }
  .tpl-pitch-deck .cover-footer-tag { font-size: 10px; white-space: nowrap; }
  .tpl-pitch-deck .cover-line { max-width: 40px !important; }

  /* ---- 视频舞台 ---- */
  .tpl-pitch-deck .video-stage { padding: 20px !important; }

  /* ---- Chain diagram: 5 nodes 横排 → 3列网格竖排 ---- */
  .tpl-pitch-deck .chain {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 8px !important;
  }
  .tpl-pitch-deck .chain-node { padding: 10px 4px !important; }
  .tpl-pitch-deck .chain-icon { font-size: 18px; }
  .tpl-pitch-deck .chain-label { font-size: 11px; }
  .tpl-pitch-deck .chain-sub { font-size: 10px; }
  .tpl-pitch-deck .chain-arrow { display: none !important; }

  /* ---- Agenda cards ---- */
  .tpl-pitch-deck .agenda-card { padding: 16px 18px !important; }
  .tpl-pitch-deck .agenda-num { font-size: 22px !important; margin-bottom: 6px !important; }
  .tpl-pitch-deck .agenda-light h4 { font-size: 16px !important; }
  .tpl-pitch-deck .agenda-light p { font-size: 12px !important; }

  /* ---- 消费本质 funnel ---- */
  .tpl-pitch-deck .funnel-row { padding: 12px 14px !important; gap: 12px !important; }
  .tpl-pitch-deck .funnel-idx { font-size: 20px !important; min-width: 32px !important; }
  .tpl-pitch-deck .funnel-body h4 { font-size: 14px !important; }
  .tpl-pitch-deck .funnel-body p  { font-size: 12px !important; line-height: 1.5 !important; }
  .tpl-pitch-deck .funnel-tag { font-size: 10px !important; }
  .tpl-pitch-deck .footnote-line { padding: 8px 12px !important; gap: 10px !important; }
  .tpl-pitch-deck .fn-num { font-size: 20px !important; }
  .tpl-pitch-deck .fn-text { font-size: 11px !important; line-height: 1.4 !important; }

  /* ---- 广告本质 ads triangle ---- */
  .tpl-pitch-deck .ads-triangle {
    flex-direction: column !important;
    gap: 8px !important;
  }
  .tpl-pitch-deck .ads-plus { padding: 2px 0 !important; font-size: 18px !important; }
  .tpl-pitch-deck .ads-node { padding: 12px 14px !important; }
  .tpl-pitch-deck .ads-node-hd { font-size: 14px !important; }
  .tpl-pitch-deck .ads-node-body p { font-size: 12px !important; line-height: 1.4 !important; }
  .tpl-pitch-deck .ads-node-body .ads-note { font-size: 11px !important; }

  /* ---- Adsolutely AI 4 卡片 ---- */
  .tpl-pitch-deck .card { padding: 14px 16px !important; }
  .tpl-pitch-deck .card h4 { font-size: 15px !important; }
  .tpl-pitch-deck .card .dim { font-size: 12px !important; }
  .tpl-pitch-deck .icon-circle { width: 32px !important; height: 32px !important; font-size: 16px !important; }

  /* ---- Case① Process + Result ---- */
  .tpl-pitch-deck .process-step { gap: 12px !important; }
  .tpl-pitch-deck .step-dot { width: 26px !important; height: 26px !important; font-size: 12px !important; }
  .tpl-pitch-deck .process-line { height: 12px !important; margin-left: 12px !important; }
  .tpl-pitch-deck .result-n { font-size: 24px !important; }
  .tpl-pitch-deck .result-l { font-size: 12px !important; }
  .tpl-pitch-deck .result-insight { font-size: 12px !important; }

  /* ---- Case② scrollable 幻灯片 ---- */
  .tpl-pitch-deck .slide-scroll-host { padding: 0 !important; }
  .tpl-pitch-deck .scroll-section {
    padding: 24px 16px !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 100%;
  }
  .tpl-pitch-deck .scroll-sec-a { gap: 20px !important; }
  .tpl-pitch-deck .scroll-sec-a .sec-left,
  .tpl-pitch-deck .scroll-sec-a .sec-right { flex: none !important; width: 100% !important; }
  .tpl-pitch-deck .sec-right { align-items: center !important; }
  /* iPhone mockup 缩到 200px 宽 */
  .tpl-pitch-deck .iphone-17-frame { width: 200px !important; height: 420px !important; }
  .tpl-pitch-deck .iphone-17-di { width: 74px !important; height: 24px !important; top: 8px !important; }
  .tpl-pitch-deck .ios-status { padding: 0 16px !important; font-size: 10px !important; top: 10px !important; }
  .tpl-pitch-deck .amz-pdp-topbar { padding: 40px 8px 6px !important; }
  .tpl-pitch-deck .amz-search-bar { font-size: 9px !important; padding: 4px 6px !important; height: auto !important; }
  .tpl-pitch-deck .amz-pdp-loc { font-size: 9px !important; padding: 4px 10px !important; }
  .tpl-pitch-deck .amz-pdp-crumb { font-size: 9px !important; padding: 4px 10px !important; }
  .tpl-pitch-deck .insight-block { padding: 12px !important; }
  .tpl-pitch-deck .insight-tag { font-size: 11px !important; padding: 3px 8px !important; }
  .tpl-pitch-deck .insight-row p { font-size: 12px !important; }
  .tpl-pitch-deck .insight-arrow { font-size: 11px !important; }
  .tpl-pitch-deck .scroll-hint-down,
  .tpl-pitch-deck .scroll-hint-up,
  .tpl-pitch-deck .mobile-scroll-hint,
  .tpl-pitch-deck .nav-hint-right { font-size: 11px !important; }
  .tpl-pitch-deck .scroll-hint-up { top: 12px !important; right: 16px !important; }
  .tpl-pitch-deck .web-section-label { flex-direction: column !important; align-items: flex-start !important; gap: 4px !important; margin-bottom: 12px !important; }
  .tpl-pitch-deck .wsl-tag { font-size: 10px !important; }
  .tpl-pitch-deck .wsl-hint { font-size: 11px !important; }
  .tpl-pitch-deck .scroll-sec-b { padding: 24px 12px !important; }
  .tpl-pitch-deck .aplus-desktop-inline { max-width: 100% !important; border-radius: 6px !important; }
  .tpl-pitch-deck .scroll-dots { right: 8px !important; }

  /* ---- 平台推流机制 transition ---- */
  .tpl-pitch-deck .transition-block { gap: 12px !important; }
  .tpl-pitch-deck .transition-item { gap: 10px !important; }
  .tpl-pitch-deck .transition-item strong { font-size: 14px !important; }
  .tpl-pitch-deck .transition-item p { font-size: 12px !important; }
  .tpl-pitch-deck .gate-box { padding: 14px !important; }
  .tpl-pitch-deck .gate-icon { font-size: 24px !important; }
  .tpl-pitch-deck .gate-text strong { font-size: 14px !important; }
  .tpl-pitch-deck .gate-text p { font-size: 12px !important; }
  .tpl-pitch-deck .t-icon { font-size: 22px !important; }

  /* ---- Molly 是谁 (molly-intro) ---- */
  .tpl-pitch-deck .molly-intro {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    margin-top: 20px !important;
  }
  .tpl-pitch-deck .molly-hero-card { padding: 22px 20px !important; }
  .tpl-pitch-deck .molly-hero-avatar { width: 56px !important; height: 56px !important; font-size: 28px !important; border-radius: 14px !important; }
  .tpl-pitch-deck .molly-hero-card h3 { font-size: 26px !important; }
  .tpl-pitch-deck .molly-role { font-size: 13px !important; }
  .tpl-pitch-deck .molly-ability-item { padding: 12px 14px !important; gap: 12px !important; }
  .tpl-pitch-deck .molly-ability-item h4 { font-size: 14px !important; }
  .tpl-pitch-deck .molly-ability-item p { font-size: 12px !important; }
  .tpl-pitch-deck .molly-ability-item .ma-num { font-size: 16px !important; min-width: 28px !important; }

  /* ---- Molly 怎么做 collab-2col ---- */
  .tpl-pitch-deck .collab-2col {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    margin-top: 20px !important;
  }
  .tpl-pitch-deck .collab-col { padding: 18px 20px !important; gap: 14px !important; }
  .tpl-pitch-deck .collab-col-hd { padding-bottom: 12px !important; }
  .tpl-pitch-deck .collab-col-ic { width: 40px !important; height: 40px !important; font-size: 22px !important; }
  .tpl-pitch-deck .collab-col-hd h3 { font-size: 16px !important; }
  .tpl-pitch-deck .collab-col-sub { font-size: 11px !important; }
  .tpl-pitch-deck .collab-big-list li { font-size: 13px !important; padding-left: 16px !important; }
  .tpl-pitch-deck .collab-big-list li::before { top: 8px !important; width: 6px !important; height: 6px !important; }

  /* ---- Molly 内核 stack ---- */
  .tpl-pitch-deck .molly-stack {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    margin-top: 20px !important;
  }
  .tpl-pitch-deck .stack-kernel { padding: 18px 20px !important; }
  .tpl-pitch-deck .stack-kernel-hd { font-size: 11px !important; padding-bottom: 10px !important; }
  .tpl-pitch-deck .stack-kernel-ic { width: 32px !important; height: 32px !important; font-size: 18px !important; }
  .tpl-pitch-deck .stack-k-item strong { font-size: 14px !important; }
  .tpl-pitch-deck .stack-k-item span { font-size: 12px !important; }
  .tpl-pitch-deck .skill-grid { grid-template-columns: 1fr !important; gap: 8px !important; }
  .tpl-pitch-deck .skill-chip { padding: 10px 12px !important; }
  .tpl-pitch-deck .skill-chip .sk-ic { width: 30px !important; height: 30px !important; font-size: 16px !important; }
  .tpl-pitch-deck .skill-chip h5 { font-size: 12px !important; }
  .tpl-pitch-deck .skill-chip p { font-size: 11px !important; }
  .tpl-pitch-deck .skill-label { font-size: 10px !important; }

  /* ---- 75字符 slide ---- */
  .tpl-pitch-deck .char-demo { padding: 8px 0 !important; }
  .tpl-pitch-deck .char-bar { height: 22px !important; }
  .tpl-pitch-deck .char-labels { font-size: 10px !important; }
  .tpl-pitch-deck .feature-item { font-size: 12px !important; padding: 8px 10px !important; }
  .tpl-pitch-deck .feature-icon { font-size: 14px !important; }

  /* ---- 团队 slide ---- */
  .tpl-pitch-deck .team-layout {
    flex-direction: column !important;
    gap: 20px !important;
    margin-top: 20px !important;
  }
  .tpl-pitch-deck .team-section-label,
  .tpl-pitch-deck .team-ai-label { font-size: 10px !important; margin-bottom: 10px !important; }
  .tpl-pitch-deck .human-card,
  .tpl-pitch-deck .agent-card { padding: 10px 14px !important; gap: 12px !important; }
  .tpl-pitch-deck .human-avatar { width: 36px !important; height: 36px !important; font-size: 14px !important; }
  .tpl-pitch-deck .agent-icon-wrap { width: 32px !important; height: 32px !important; font-size: 16px !important; }
  .tpl-pitch-deck .human-card h4,
  .tpl-pitch-deck .agent-card h4 { font-size: 14px !important; }
  .tpl-pitch-deck .human-card .dim,
  .tpl-pitch-deck .agent-card .dim { font-size: 11px !important; }

  /* ---- 你想解决什么 options-3 ---- */
  .tpl-pitch-deck .options-3 {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .tpl-pitch-deck .opt-card { padding: 16px 18px !important; }
  .tpl-pitch-deck .opt-tag { width: 32px !important; height: 32px !important; font-size: 14px !important; }
  .tpl-pitch-deck .opt-card h3 { font-size: 16px !important; }
  .tpl-pitch-deck .opt-card p { font-size: 12px !important; line-height: 1.5 !important; }
  .tpl-pitch-deck .opt-audience { font-size: 11px !important; }

  /* ---- 彩蛋 slide ---- */
  .tpl-pitch-deck .easter-layout {
    flex-direction: column !important;
    padding: 32px 20px !important;
    gap: 20px !important;
    height: auto !important;
  }
  .tpl-pitch-deck .easter-left { flex: none !important; width: 100% !important; }
  .tpl-pitch-deck .easter-right { flex: none !important; width: 100% !important; }
  .tpl-pitch-deck .easter-left .cover-h1 { font-size: 26px !important; }
  .tpl-pitch-deck .dr-listing-name .dr-icon { font-size: 24px !important; }
  .tpl-pitch-deck .dr-listing-name .dr-text { font-size: 20px !important; }
  .tpl-pitch-deck .dr-desc-list li { font-size: 13px !important; gap: 6px !important; }
  .tpl-pitch-deck .dr-url-chip { font-size: 12px !important; padding: 6px 14px !important; }
  .tpl-pitch-deck .qr-frame { padding: 14px !important; }
  .tpl-pitch-deck .qr-frame img { width: 160px !important; height: 160px !important; }
  .tpl-pitch-deck .qr-label { font-size: 11px !important; }

  /* ---- highlight-box ---- */
  .tpl-pitch-deck .highlight-box { padding: 12px 14px !important; gap: 10px !important; }
  .tpl-pitch-deck .highlight-box p { font-size: 12px !important; line-height: 1.5 !important; }
  .tpl-pitch-deck .highlight-icon { font-size: 20px !important; }

  /* ---- 隐藏 runtime.js 底部页码/进度条时视场不足的情况下太挤 ---- */
  .tpl-pitch-deck .deck-progress { height: 2px !important; }
  .tpl-pitch-deck .deck-footer { font-size: 10px !important; padding: 4px 12px !important; }
}

/* iPhone 13 mini portrait 更小屏 */
@media (max-width: 400px) {
  .tpl-pitch-deck .h2 { font-size: 22px !important; }
  .tpl-pitch-deck .cover-h1 { font-size: 30px !important; }
  .tpl-pitch-deck .slide,
  .tpl-pitch-deck .slide-dark,
  .tpl-pitch-deck .slide-dark-soft { padding: 24px 16px !important; }
}

/* Landscape (812×375) — 高度小，需要更紧凑 */
@media (max-height: 500px) and (max-width: 900px) {
  .tpl-pitch-deck .slide,
  .tpl-pitch-deck .slide-dark,
  .tpl-pitch-deck .slide-dark-soft { padding: 16px 24px !important; }
  .tpl-pitch-deck .h2 { font-size: 22px !important; }
  .tpl-pitch-deck .cover-h1 { font-size: 26px !important; }
  .tpl-pitch-deck .lede { font-size: 12px !important; margin-top: 6px !important; }
  .tpl-pitch-deck .mt-l { margin-top: 12px !important; }
  .tpl-pitch-deck .mt-xl { margin-top: 16px !important; }
}

/* ================================================================
   角度B · 短期抢单 flywheel
   ================================================================ */
.flywheel {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.fw-step {
  display: flex;
  align-items: stretch;
  gap: 18px;
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 14px 20px;
  transition: border-color .2s, transform .2s;
}
.fw-step:hover { border-color: var(--accent); transform: translateX(4px); }
.fw-step-hot {
  background: linear-gradient(135deg, rgba(232,112,58,.15), rgba(255,179,71,.08));
  border-color: var(--accent);
}
.fw-num {
  font-size: 30px;
  font-weight: 900;
  color: var(--accent);
  min-width: 46px;
  letter-spacing: -.03em;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fw-body h4 {
  font-size: 17px;
  margin: 0 0 4px;
  color: var(--light-text-1);
  font-weight: 800;
}
.fw-body p {
  font-size: 13px;
  color: var(--light-text-2);
  margin: 0;
  line-height: 1.55;
}
.fw-arrow {
  text-align: center;
  color: var(--accent);
  font-size: 14px;
  padding: 2px 0;
  opacity: .6;
}

/* ================================================================
   角度B · Adsolutely AI 方法论 · 3 阶段
   ================================================================ */
.phase-3 {
  display: flex;
  gap: 12px;
  align-items: stretch;
}
.phase-card {
  flex: 1;
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: border-color .2s;
}
.phase-card:hover { border-color: var(--accent); }
.phase-card-mid { background: rgba(232,112,58,.06); border-color: rgba(232,112,58,.28); }
.phase-card-hero { background: linear-gradient(160deg, rgba(232,112,58,.18), rgba(255,179,71,.08)); border-color: var(--accent); }
.phase-hd {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.phase-num {
  font-size: 24px;
  font-weight: 900;
  color: var(--accent);
  letter-spacing: -.02em;
}
.phase-tag {
  font-size: 10px;
  letter-spacing: .12em;
  font-weight: 700;
  color: var(--light-text-3);
  padding: 3px 8px;
  border: 1px solid var(--border);
  border-radius: 999px;
}
.phase-card h3 {
  font-size: 22px;
  margin: 0;
  color: var(--light-text-1);
  font-weight: 800;
}
.phase-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}
.phase-list li {
  font-size: 13px;
  color: var(--light-text-2);
  line-height: 1.5;
  padding-left: 14px;
  position: relative;
}
.phase-list li::before {
  content: '·';
  position: absolute;
  left: 0;
  color: var(--accent);
  font-weight: 900;
}
.phase-note {
  font-size: 12px;
  color: var(--accent);
  font-weight: 600;
  padding-top: 10px;
  border-top: 1px dashed var(--border);
  margin-top: auto;
}
.phase-arr {
  align-self: center;
  color: var(--accent);
  font-size: 22px;
  font-weight: 700;
  padding: 0 2px;
}

/* ================================================================
   角度B · 执行三大环节
   ================================================================ */
.exec-3col {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.exec-card {
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: border-color .2s;
}
.exec-card:hover { border-color: var(--accent); }
.exec-num {
  display: inline-block;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .1em;
  color: var(--accent);
  background: var(--accent-soft);
  padding: 4px 10px;
  border-radius: 999px;
  width: fit-content;
}
.exec-card h4 {
  font-size: 18px;
  margin: 0;
  color: var(--light-text-1);
  font-weight: 800;
}
.exec-flow {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}
.ef-step {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 8px 10px;
  border-radius: 10px;
  background: var(--light-surface2);
  border: 1px solid var(--border);
}
.ef-step-ai { background: rgba(88,140,220,.10); border-color: rgba(88,140,220,.22); }
.ef-step-human { background: rgba(232,112,58,.10); border-color: rgba(232,112,58,.28); }
.ef-step-loop { background: rgba(255,179,71,.14); border-color: rgba(255,179,71,.32); }
.ef-step-final { background: linear-gradient(135deg, rgba(232,112,58,.18), rgba(255,179,71,.10)); border-color: var(--accent); }
.ef-ic {
  font-size: 18px;
  width: 26px; height: 26px;
  border-radius: 8px;
  background: #fff;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 1px 3px rgba(0,0,0,.05);
}
.ef-step strong {
  font-size: 13px;
  color: var(--light-text-1);
  font-weight: 800;
  display: block;
  margin-bottom: 2px;
}
.ef-step p {
  font-size: 11px;
  color: var(--light-text-2);
  margin: 0;
  line-height: 1.45;
}
.ef-arr {
  text-align: center;
  color: var(--accent);
  font-size: 12px;
  opacity: .6;
  line-height: 1;
}

/* ================================================================
   角度B · WorkBuddy 对比 & 改造
   ================================================================ */
.wb-2col {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 24px;
  align-items: stretch;
}
.wb-compare {
  display: flex;
  align-items: stretch;
  gap: 10px;
}
.wb-side {
  flex: 1;
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 18px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.wb-default { background: var(--light-surface2); }
.wb-tuned { background: linear-gradient(160deg, rgba(232,112,58,.14), rgba(255,179,71,.06)); border-color: var(--accent); }
.wb-side-hd { display: flex; flex-direction: column; gap: 6px; }
.wb-tag {
  font-size: 10px;
  letter-spacing: .14em;
  font-weight: 800;
  color: var(--light-text-3);
  padding: 3px 8px;
  background: rgba(0,0,0,.05);
  border-radius: 999px;
  width: fit-content;
}
.wb-tag-hot {
  background: var(--grad);
  color: #fff;
}
.wb-side h4 {
  font-size: 15px;
  margin: 0;
  color: var(--light-text-1);
  font-weight: 800;
}
.wb-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}
.wb-list li {
  font-size: 13px;
  color: var(--light-text-2);
  padding-left: 14px;
  position: relative;
  line-height: 1.5;
}
.wb-list li::before {
  content: '·';
  position: absolute;
  left: 0;
  color: var(--accent);
  font-weight: 900;
}
.wb-arrow {
  align-self: center;
  color: var(--accent);
  font-size: 22px;
  font-weight: 700;
}

.wb-steps {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.wb-steps-label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  color: var(--accent);
  text-transform: uppercase;
  margin: 0 0 4px;
}
.wb-step {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 12px 16px;
  transition: border-color .2s;
}
.wb-step:hover { border-color: var(--accent); }
.wb-step-hero { background: rgba(232,112,58,.10); border-color: var(--accent); }
.wb-step-num {
  font-size: 18px;
  font-weight: 900;
  color: var(--accent);
  min-width: 32px;
  padding-top: 2px;
}
.wb-step h5 {
  font-size: 14px;
  margin: 0 0 3px;
  color: var(--light-text-1);
  font-weight: 800;
}
.wb-step p {
  font-size: 12px;
  color: var(--light-text-2);
  margin: 0;
  line-height: 1.45;
}

/* ================================================================
   角度B · MOBILE (media query overrides for new components)
   ================================================================ */
@media (max-width: 900px) {
  .flywheel { gap: 6px !important; }
  .fw-step { padding: 10px 14px !important; gap: 12px !important; }
  .fw-num { font-size: 20px !important; min-width: 30px !important; }
  .fw-body h4 { font-size: 14px !important; }
  .fw-body p { font-size: 12px !important; }
  .fw-arrow { font-size: 12px !important; }

  .phase-3 {
    flex-direction: column !important;
    gap: 10px !important;
  }
  .phase-arr { padding: 2px 0 !important; font-size: 18px !important; }
  .phase-card { padding: 14px 16px !important; }
  .phase-card h3 { font-size: 16px !important; }
  .phase-list li { font-size: 12px !important; }
  .phase-note { font-size: 11px !important; padding-top: 8px !important; }
  .phase-num { font-size: 18px !important; }

  .exec-3col {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .exec-card { padding: 14px 16px !important; }
  .exec-card h4 { font-size: 15px !important; }
  .ef-step { padding: 6px 8px !important; }
  .ef-ic { width: 22px !important; height: 22px !important; font-size: 14px !important; }
  .ef-step strong { font-size: 12px !important; }
  .ef-step p { font-size: 10px !important; }

  .wb-2col {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  .wb-compare {
    flex-direction: column !important;
    gap: 8px !important;
  }
  .wb-arrow { transform: rotate(90deg); align-self: center !important; }
  .wb-side { padding: 12px 14px !important; }
  .wb-side h4 { font-size: 13px !important; }
  .wb-list li { font-size: 12px !important; }
  .wb-step { padding: 10px 12px !important; gap: 10px !important; }
  .wb-step-num { font-size: 15px !important; min-width: 24px !important; }
  .wb-step h5 { font-size: 13px !important; }
  .wb-step p { font-size: 11px !important; }
}

/* ================================================================
   B v2 · 今天做亚马逊的困境 · 四座大山
   ================================================================ */
.pain-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 28px;
}
.pain-card {
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 16px;
  padding: 22px 26px;
  display: flex; flex-direction: column; gap: 14px;
  transition: border-color .2s, transform .2s;
}
.pain-card:hover { border-color: var(--accent); transform: translateY(-3px); }
.pain-card-hero {
  background: linear-gradient(160deg, rgba(232,112,58,.16), rgba(255,179,71,.06));
  border-color: var(--accent);
}
.pain-hd {
  display: flex; align-items: center; gap: 14px;
}
.pain-ic {
  font-size: 26px;
  width: 48px; height: 48px;
  border-radius: 12px;
  background: var(--accent-soft);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.pain-title {
  font-size: 24px;
  font-weight: 900;
  color: var(--light-text-1);
  letter-spacing: -.01em;
}
.pain-card p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--light-text-2);
  margin: 0;
}
.pain-card p strong { color: var(--accent); font-weight: 800; }

/* mobile */
@media (max-width: 900px) {
  .pain-grid { grid-template-columns: 1fr !important; gap: 10px !important; margin-top: 18px !important; }
  .pain-card { padding: 14px 16px !important; gap: 10px !important; }
  .pain-ic { width: 36px !important; height: 36px !important; font-size: 20px !important; border-radius: 10px !important; }
  .pain-title { font-size: 18px !important; }
  .pain-card p { font-size: 12px !important; }
}

/* ================================================================
   B v2 · CVR 经济账 · 15% vs 25% 对比
   ================================================================ */
.cvr-assume {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin-top: 20px;
  padding: 12px 18px;
  background: var(--light-surface2);
  border: 1px dashed var(--border);
  border-radius: 10px;
  font-size: 13px;
  color: var(--light-text-2);
}
.cvr-assume-label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  color: var(--accent);
  text-transform: uppercase;
  padding-right: 8px;
  border-right: 1px solid var(--border);
}
.cvr-assume strong {
  color: var(--light-text-1);
  font-weight: 800;
  font-variant-numeric: tabular-nums;
}
.cvr-assume-sep {
  color: var(--light-text-3);
  opacity: .5;
}
.cvr-assume-note {
  color: var(--light-text-3);
  font-size: 11px;
  font-weight: 400;
}
.cvr-metric-formula {
  font-size: 10px;
  font-family: 'SF Mono', Consolas, monospace;
  color: var(--light-text-3);
  font-weight: 400;
  letter-spacing: 0;
  margin-left: 4px;
}

.cvr-compare {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 20px;
  align-items: stretch;
  margin-top: 24px;
}
.cvr-col {
  border-radius: 16px;
  padding: 22px 26px;
  display: flex; flex-direction: column; gap: 14px;
  transition: transform .2s;
}
.cvr-col:hover { transform: translateY(-3px); }
.cvr-col-cold {
  background: var(--light-surface2);
  border: 1px solid var(--border);
}
.cvr-col-hot {
  background: linear-gradient(160deg, rgba(232,112,58,.16), rgba(255,179,71,.06));
  border: 1px solid var(--accent);
  box-shadow: 0 8px 24px rgba(232,112,58,.15);
}
.cvr-col-hd { padding-bottom: 12px; border-bottom: 1px dashed rgba(0,0,0,.10); }
.cvr-badge {
  display: inline-block;
  padding: 6px 16px;
  background: rgba(0,0,0,.08);
  border-radius: 999px;
  font-size: 22px; font-weight: 900;
  color: var(--light-text-1);
  letter-spacing: -.02em;
}
.cvr-badge-hot {
  background: var(--grad);
  color: #fff;
  box-shadow: 0 4px 12px rgba(232,112,58,.35);
}
.cvr-desc { font-size: 12px; color: var(--light-text-3); margin-top: 8px; }

.cvr-metric { display: flex; flex-direction: column; }
.cvr-metric-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 10px 0;
  border-bottom: 1px dashed rgba(0,0,0,.08);
}
.cvr-metric-row:last-child { border-bottom: none; }
.cvr-metric-label { font-size: 13px; color: var(--light-text-2); }
.cvr-metric-value {
  font-size: 22px; font-weight: 800;
  color: var(--light-text-1); letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
.cvr-metric-value-hot { color: var(--accent); }
.cvr-metric-hero { padding-top: 14px; margin-top: 4px; border-top: 2px solid rgba(0,0,0,.08); }
.cvr-metric-hero .cvr-metric-value { font-size: 30px; font-weight: 900; }

.cvr-vs {
  align-self: center;
  color: var(--accent);
  font-size: 32px;
  font-weight: 900;
  padding: 0 2px;
}

/* Delta summary — dark strip */
.cvr-delta {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  gap: 20px; align-items: center;
  padding: 22px 28px;
  background: linear-gradient(135deg, #152640 0%, #1C3158 100%);
  color: #fff;
  border-radius: 16px;
  border: 1px solid rgba(232,112,58,.28);
}
.delta-item { text-align: center; }
.delta-n {
  font-size: 30px; font-weight: 900;
  letter-spacing: -.02em; color: var(--accent);
  line-height: 1.05;
  font-variant-numeric: tabular-nums;
}
.delta-n-hero {
  color: #FFB347;
  font-size: 40px;
}
.delta-l {
  font-size: 12px; color: rgba(255,255,255,.7);
  margin-top: 8px; line-height: 1.45;
}
.delta-op {
  font-size: 22px; color: rgba(232,112,58,.7);
  font-weight: 700;
}

/* mobile */
@media (max-width: 900px) {
  .cvr-assume { font-size: 11px !important; padding: 8px 12px !important; gap: 6px 10px !important; }
  .cvr-assume-label { font-size: 10px !important; padding-right: 6px !important; border-right: 0 !important; }
  .cvr-assume-note { font-size: 10px !important; }
  .cvr-assume-sep { display: none !important; }
  .cvr-metric-formula { display: block !important; margin-top: 2px !important; margin-left: 0 !important; font-size: 9px !important; }

  .cvr-compare {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .cvr-vs { transform: rotate(90deg); font-size: 22px !important; padding: 4px 0 !important; }
  .cvr-col { padding: 14px 16px !important; gap: 10px !important; }
  .cvr-badge { font-size: 16px !important; padding: 4px 12px !important; }
  .cvr-desc { font-size: 11px !important; }
  .cvr-metric-value { font-size: 17px !important; }
  .cvr-metric-hero .cvr-metric-value { font-size: 22px !important; }
  .cvr-metric-label { font-size: 12px !important; }

  .cvr-delta {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    padding: 14px 16px !important;
  }
  .delta-op { display: none !important; }
  .delta-n { font-size: 22px !important; }
  .delta-n-hero { font-size: 26px !important; }
  .delta-l { font-size: 11px !important; margin-top: 4px !important; }
}

/* ================================================================
   B v2 · SBV 解释页（SERP mockup + 特点）
   ================================================================ */
.sbv-explain {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 32px;
  align-items: stretch;
}
.serp-mock {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.10);
  overflow: hidden;
  border: 1px solid #E5DDD4;
  display: flex; flex-direction: column;
}
.serp-topbar {
  background: #131A22;
  padding: 10px 14px;
  display: flex; align-items: center; gap: 10px;
}
.serp-amazon { color: #FF9900; font-size: 16px; font-weight: 900; letter-spacing: -.02em; }
.serp-search {
  flex: 1;
  background: #fff;
  border-radius: 4px;
  padding: 6px 10px;
  font-size: 12px;
  color: #333;
  display: flex; align-items: center; gap: 8px;
  overflow: hidden; white-space: nowrap;
}
.serp-search-ic { opacity: .5; }
.serp-cart { color: #fff; }
.serp-filters {
  background: #EAEDED;
  padding: 5px 14px;
  font-size: 11px;
  color: #4B5D71;
  border-bottom: 1px solid #DDD;
}
.serp-sbv {
  margin: 12px;
  border: 2px solid var(--accent);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(232,112,58,.18);
}
.serp-sbv-badge {
  background: var(--accent);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .1em;
  padding: 4px 10px;
  text-transform: uppercase;
}
.serp-sbv-body {
  display: flex;
  gap: 10px;
  padding: 10px;
  background: linear-gradient(135deg, #1a2840 0%, #2a3f5e 100%);
}
.serp-sbv-video {
  flex: 1.4;
  aspect-ratio: 16 / 9;
  background: linear-gradient(135deg, #444, #222);
  border-radius: 4px;
  position: relative;
  display: flex; align-items: center; justify-content: center;
  min-height: 90px;
}
.serp-sbv-play {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: rgba(255,255,255,.9);
  color: #222;
  font-size: 14px;
  display: flex; align-items: center; justify-content: center;
  padding-left: 3px;
}
.serp-sbv-time {
  position: absolute; bottom: 4px; right: 6px;
  color: #fff; font-size: 9px;
  background: rgba(0,0,0,.6);
  padding: 1px 5px; border-radius: 3px;
}
.serp-sbv-side { flex: 1; display: flex; flex-direction: column; gap: 6px; justify-content: center; }
.serp-sbv-brand { font-size: 11px; font-weight: 800; color: #fff; }
.serp-sbv-tag { font-size: 10px; color: rgba(255,255,255,.75); }
.serp-sbv-thumbs {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin-top: 4px;
}
.serp-thumb {
  aspect-ratio: 1;
  background: rgba(255,255,255,.15);
  border-radius: 3px;
}
.serp-organic-label {
  font-size: 10px; color: #8A9EB8;
  padding: 4px 14px 8px;
}
.serp-organic-row {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
  padding: 0 12px 12px;
}
.serp-org-card {
  aspect-ratio: 1;
  background: #F5F5F5;
  border-radius: 6px;
  border: 1px solid #E5DDD4;
}

.sbv-points { display: flex; flex-direction: column; gap: 12px; justify-content: center; }
.sbv-point {
  display: flex; gap: 16px; align-items: center;
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px 18px;
  transition: border-color .2s;
}
.sbv-point:hover { border-color: var(--accent); }
.sbv-point-hero {
  background: linear-gradient(135deg, rgba(232,112,58,.14), rgba(255,179,71,.06));
  border-color: var(--accent);
}
.sbv-p-num {
  font-size: 26px; font-weight: 900; color: var(--accent);
  min-width: 40px; letter-spacing: -.03em;
}
.sbv-point h4 { margin: 0 0 3px; font-size: 16px; color: var(--light-text-1); font-weight: 800; }
.sbv-point p  { margin: 0; font-size: 13px; color: var(--light-text-2); line-height: 1.5; }

/* ================================================================
   B v2 · SBV 目的对比 + 数据条
   ================================================================ */
.sbv-vs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.sbv-col {
  border-radius: 14px;
  padding: 20px 22px;
  display: flex; flex-direction: column; gap: 14px;
}
.sbv-col-yes {
  background: linear-gradient(160deg, rgba(26,175,108,.10), rgba(26,175,108,.02));
  border: 1px solid rgba(26,175,108,.28);
}
.sbv-col-no {
  background: linear-gradient(160deg, rgba(224,68,90,.08), rgba(224,68,90,.02));
  border: 1px solid rgba(224,68,90,.28);
}
.sbv-col-hd {
  display: flex; align-items: center; gap: 10px;
  padding-bottom: 10px;
  border-bottom: 1px dashed rgba(0,0,0,.10);
}
.sbv-col-ic { font-size: 22px; }
.sbv-col h3 { margin: 0; font-size: 18px; font-weight: 800; color: var(--light-text-1); }
.sbv-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.sbv-list li {
  font-size: 14px; line-height: 1.55;
  color: var(--light-text-2);
  padding-left: 14px; position: relative;
}
.sbv-list li::before {
  content: '·'; position: absolute; left: 0; color: var(--accent);
  font-weight: 900; font-size: 16px;
}
.sbv-list li strong { color: var(--light-text-1); font-weight: 700; }

.sbv-data-strip {
  background: linear-gradient(135deg, #152640, #1C3158);
  border-radius: 14px;
  padding: 18px 22px;
  color: #fff;
  border: 1px solid rgba(240,234,224,.14);
}
.sbv-data-hd { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.sbv-data-ic { font-size: 22px; }
.sbv-data-title { font-size: 15px; font-weight: 800; color: #fff; }
.sbv-data-sub { font-size: 12px; color: rgba(255,255,255,.6); margin-top: 2px; }
.sbv-data-nums {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px;
}
.sd-num {
  display: flex; flex-direction: column; gap: 2px;
  padding-left: 12px; border-left: 2px solid rgba(232,112,58,.5);
}
.sd-n { font-size: 22px; font-weight: 900; color: var(--accent); letter-spacing: -.02em; }
.sd-l { font-size: 11px; color: rgba(255,255,255,.7); }
.sd-num-hot .sd-n { color: #FFB347; }
.sd-num-hot { border-left-color: #FFB347; }

/* ================================================================
   B v2 · Soft-plug 行（轻点自家产品）
   ================================================================ */
.soft-plug {
  font-size: 14px;
  color: var(--text-2);
  padding: 10px 14px;
  border-left: 3px solid var(--accent);
  background: rgba(232,112,58,.06);
  border-radius: 0 8px 8px 0;
  line-height: 1.55;
}
.soft-plug-name {
  color: var(--accent);
  font-weight: 800;
}

/* ================================================================
   B v2 · 价格管理 · 划线价（拍照带走）
   ================================================================ */
.price-formula {
  background: linear-gradient(135deg, #152640, #1C3158);
  color: #fff;
  border-radius: 16px;
  padding: 26px 32px;
  margin-top: 24px;
  position: relative;
  border: 1px solid rgba(232,112,58,.28);
}
.pf-label {
  font-size: 11px; font-weight: 800; letter-spacing: .16em;
  color: var(--accent); text-transform: uppercase;
  margin-bottom: 12px;
}
.pf-body {
  font-size: 22px; line-height: 1.5; font-weight: 400;
  color: #fff;
}
.pf-body strong { color: var(--accent); font-weight: 800; }
.pf-condition {
  font-size: 14px; color: rgba(255,255,255,.75);
  margin-top: 14px; padding-top: 14px;
  border-top: 1px dashed rgba(255,255,255,.14);
}
.pf-condition strong { color: #FFB347; font-weight: 700; }

.price-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.price-actions, .price-pits {
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 18px 20px;
  display: flex; flex-direction: column; gap: 12px;
}
.price-pits { background: rgba(224,68,90,.04); border-color: rgba(224,68,90,.20); }
.price-col-label {
  font-size: 12px; font-weight: 800; letter-spacing: .1em;
  color: var(--good, #1aaf6c); margin: 0 0 4px;
}
.price-col-label-bad { color: var(--bad, #e0445a); }
.pa-step, .pp-item {
  display: flex; gap: 12px; align-items: flex-start;
  padding: 10px 12px;
  background: var(--light-surface2);
  border-radius: 10px;
}
.pa-n {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--good, #1aaf6c);
  color: #fff;
  font-size: 13px; font-weight: 900;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.pp-ic { font-size: 18px; padding-top: 1px; }
.pa-step strong, .pp-item strong {
  font-size: 14px; color: var(--light-text-1); font-weight: 800;
  display: block; margin-bottom: 2px;
}
.pa-step p, .pp-item p {
  font-size: 12px; color: var(--light-text-2); margin: 0; line-height: 1.4;
}

/* ================================================================
   B v2 · 批量上架 flow
   ================================================================ */
.upload-flow {
  display: flex;
  align-items: stretch;
  gap: 8px;
}
.uf-step {
  flex: 1;
  background: var(--light-surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 16px 14px;
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: 8px;
}
.uf-step-final {
  background: linear-gradient(135deg, rgba(232,112,58,.14), rgba(255,179,71,.06));
  border-color: var(--accent);
}
.uf-ic { font-size: 26px; }
.uf-title {
  font-size: 13px; font-weight: 800; color: var(--accent);
  letter-spacing: .04em;
}
.uf-body p { font-size: 12px; color: var(--light-text-2); margin: 4px 0 0; line-height: 1.5; }
.uf-arr {
  align-self: center; color: var(--accent);
  font-size: 20px; font-weight: 700; padding: 0 2px;
}
.upload-metric {
  display: flex; align-items: center; justify-content: center;
  gap: 12px;
  padding: 14px 18px;
  background: var(--light-surface2);
  border-radius: 12px;
  border: 1px dashed var(--border);
}
.um-box { text-align: center; padding: 4px 12px; }
.um-box-hero .um-n { color: var(--accent); }
.um-n { display: block; font-size: 24px; font-weight: 900; letter-spacing: -.02em; color: var(--light-text-1); }
.um-l { display: block; font-size: 11px; color: var(--light-text-3); margin-top: 2px; }
.um-arr { color: var(--accent); font-size: 18px; font-weight: 700; }

/* ================================================================
   B v2 · Claw School 解决方案（暗色页 · 4 卡）
   ================================================================ */
.cs-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
.cs-card {
  display: flex; gap: 16px; align-items: center;
  background: rgba(240,234,224,.05);
  border: 1px solid rgba(240,234,224,.14);
  border-radius: 12px;
  padding: 16px 18px;
  transition: border-color .2s, background .2s;
}
.cs-card:hover { border-color: var(--accent); background: rgba(232,112,58,.10); }
.cs-card-hero {
  background: linear-gradient(135deg, rgba(232,112,58,.18), rgba(255,179,71,.06));
  border-color: var(--accent);
}
.cs-ic {
  font-size: 26px;
  width: 46px; height: 46px;
  border-radius: 12px;
  background: rgba(232,112,58,.18);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.cs-body h4 { margin: 0 0 3px; font-size: 16px; color: var(--dark-text-1); font-weight: 800; }
.cs-body p  { margin: 0; font-size: 13px; color: var(--dark-text-2); line-height: 1.5; }
.cs-url {
  display: inline-block;
  padding: 8px 20px;
  background: var(--grad);
  color: #fff;
  border-radius: 999px;
  font-size: 15px; font-weight: 700; letter-spacing: .04em;
  margin-top: 20px;
}

/* ================================================================
   B v2 · MOBILE overrides for new components
   ================================================================ */
@media (max-width: 900px) {
  .sbv-explain { grid-template-columns: 1fr !important; gap: 16px !important; }
  .serp-sbv-body { flex-direction: column !important; }
  .serp-organic-row { grid-template-columns: repeat(3, 1fr) !important; }
  .sbv-p-num { font-size: 20px !important; min-width: 30px !important; }
  .sbv-point { padding: 12px 14px !important; }
  .sbv-point h4 { font-size: 14px !important; }
  .sbv-point p { font-size: 12px !important; }

  .sbv-vs { grid-template-columns: 1fr !important; }
  .sbv-col { padding: 14px 16px !important; }
  .sbv-col h3 { font-size: 15px !important; }
  .sbv-list li { font-size: 13px !important; }
  .sbv-data-nums { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  .sd-n { font-size: 18px !important; }
  .sd-l { font-size: 10px !important; }

  .soft-plug { font-size: 12px !important; padding: 8px 12px !important; }

  .pf-body { font-size: 15px !important; }
  .pf-condition { font-size: 12px !important; }
  .price-2col { grid-template-columns: 1fr !important; gap: 12px !important; }
  .price-actions, .price-pits { padding: 12px 14px !important; }
  .pa-step, .pp-item { padding: 8px 10px !important; }
  .pa-step strong, .pp-item strong { font-size: 13px !important; }
  .pa-step p, .pp-item p { font-size: 11px !important; }

  .upload-flow { flex-direction: column !important; }
  .uf-arr { transform: rotate(90deg); }
  .uf-step { padding: 12px 14px !important; }
  .upload-metric { flex-direction: column !important; padding: 10px 12px !important; gap: 6px !important; }
  .um-arr { transform: rotate(90deg); }

  .cs-grid { grid-template-columns: 1fr !important; }
  .cs-card { padding: 12px 14px !important; gap: 12px !important; }
  .cs-ic { width: 36px !important; height: 36px !important; font-size: 20px !important; }
  .cs-body h4 { font-size: 14px !important; }
  .cs-body p { font-size: 12px !important; }
  .cs-url { font-size: 13px !important; padding: 6px 16px !important; }
}