/* =============================================================
   One0 AI · 业务线详情页共用（/ai-app/ 与 /video-workflow/）
   场景区块 / 报价卡 / 集成方式 / 交付物 / 对照表
   ============================================================= */

/* ============ 场景区块 ============ */
.scene-card { display: flex; flex-direction: column; gap: 0; }
.scene-card .scene-no {
  font-size: 13px; font-weight: 900; letter-spacing: 0.1em;
  color: rgba(232, 145, 72, 0.85); margin-bottom: 8px;
}
.scene-card h3 { font-size: 18px; font-weight: 800; margin-bottom: 9px; }
.scene-card p { font-size: 14px; color: var(--text-sub); line-height: 1.7; }
.scene-card .tag-row { margin-top: 14px; }

/* ============ 报价 / 周期卡 ============ */
.price-card { text-align: left; display: flex; flex-direction: column; }
.price-card .price-tier { font-size: 13px; font-weight: 800; color: var(--brand); letter-spacing: 0.06em; margin-bottom: 8px; }
.price-card h3 { font-size: 19px; font-weight: 900; margin-bottom: 4px; }
.price-card .price-from {
  font-size: 26px; font-weight: 900; margin: 12px 0 2px;
  background: linear-gradient(135deg, #fbbf24, #fb923c 55%, #e89148);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.price-card .price-unit { font-size: 12.5px; color: var(--text-muted); }
.price-card ul { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.price-card li { font-size: 13.5px; color: var(--text-sub); padding-left: 17px; position: relative; line-height: 1.6; }
.price-card li::before {
  content: ''; position: absolute; left: 0; top: 8px; width: 6px; height: 6px;
  border-radius: 50%; background: rgba(232, 145, 72, 0.65);
}
.price-card.is-featured { border-color: rgba(232, 145, 72, 0.5); background: linear-gradient(160deg, rgba(232, 145, 72, 0.14), rgba(255, 255, 255, 0.05)); }
.price-footnote { margin-top: 22px; font-size: 13px; color: var(--text-muted); text-align: center; line-height: 1.7; }

/* ============ 集成方式（三种接入形态并排） ============ */
.mode-card { display: flex; flex-direction: column; }
.mode-card .mode-badge {
  align-self: flex-start; font-size: 11.5px; font-weight: 800; letter-spacing: 0.06em;
  padding: 3px 10px; border-radius: 999px; margin-bottom: 12px;
  color: var(--brand-light); background: rgba(232, 145, 72, 0.12); border: 1px solid rgba(232, 145, 72, 0.24);
}
.mode-card h3 { font-size: 18px; font-weight: 900; margin-bottom: 8px; }
.mode-card p { font-size: 14px; color: var(--text-sub); line-height: 1.7; }
.mode-card .spec-list { margin-top: auto; padding-top: 16px; }

/* ============ 规格对照表 ============ */
.spec-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.spec-table th, .spec-table td { padding: 13px 16px; text-align: left; border-bottom: 1px solid rgba(255, 255, 255, 0.07); }
.spec-table thead th {
  font-size: 13px; font-weight: 800; color: var(--brand-light);
  border-bottom: 1px solid rgba(232, 145, 72, 0.3); white-space: nowrap;
}
.spec-table tbody th { font-weight: 700; color: var(--text); width: 30%; }
.spec-table td { color: var(--text-sub); }
.spec-table-wrap {
  border-radius: var(--radius); overflow: hidden auto;
  border: 1px solid var(--border); background: var(--card);
}

/* ============ 工作流管线（横向阶段条） ============ */
.pipeline { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; }
.pipeline .stage {
  flex: 1 1 150px; padding: 18px 16px; border-radius: 14px; position: relative;
  background: var(--surface); border: 1px solid var(--surface-border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.pipeline .stage .stage-no { font-size: 11.5px; font-weight: 800; color: rgba(232, 145, 72, 0.9); letter-spacing: 0.08em; }
.pipeline .stage h4 { font-size: 15px; font-weight: 800; margin: 5px 0 4px; }
.pipeline .stage p { font-size: 12.5px; color: var(--text-muted); line-height: 1.6; }

/* ============ 页内锚点导航（长服务页） ============ */
.page-toc {
  display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 34px;
}
.page-toc a {
  font-size: 13.5px; color: var(--text-sub); padding: 6px 14px; border-radius: 999px;
  background: rgba(255, 255, 255, 0.05); border: 1px solid var(--border);
  transition: color 0.2s, border-color 0.2s;
}
.page-toc a:hover { color: var(--brand-light); border-color: rgba(232, 145, 72, 0.45); }

/* ============ 两栏图文（能力详解） ============ */
.split {
  display: grid; gap: 28px; align-items: center;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}
.split .split-media {
  aspect-ratio: 4 / 3; border-radius: var(--radius); overflow: hidden;
  border: 1px solid var(--border); background: var(--card);
}
.split .split-media img { width: 100%; height: 100%; object-fit: cover; }
.split h3 { font-size: 22px; font-weight: 900; margin-bottom: 12px; }
.split p { font-size: 14.5px; color: var(--text-sub); line-height: 1.8; }
.split ul { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.split li { font-size: 14px; color: var(--text-sub); padding-left: 17px; position: relative; line-height: 1.65; }
.split li::before {
  content: ''; position: absolute; left: 0; top: 9px; width: 6px; height: 6px;
  border-radius: 50%; background: rgba(232, 145, 72, 0.65);
}

@media (max-width: 760px) {
  .spec-table th, .spec-table td { padding: 11px 12px; }
  .spec-table tbody th { width: 40%; }
}
