/* ============================================================
   AI池子 · 工作流 → Codex → AI池子安装 升级链路公共组件 v1
   视觉：白底 + 浅蓝 + 深蓝 + 圆角卡片；"下一步/进阶"产品成长表达。
   命名空间：cxb-（codex bridge），避免与站点既有样式冲突。
   ============================================================ */

/* ---------- 1. 顶部 CTA 小字（详情页首屏） ---------- */
.cxb-mini {
  margin: 10px 0 0;
  font-size: 12.5px;
  line-height: 1.7;
  color: #5b6b7b;
}
.cxb-mini a {
  color: #0d5e80;
  text-decoration: none;
  border-bottom: 1px dashed #9cc6db;
}
.cxb-mini a:hover { color: #08344b; }

/* ---------- 2. 详情页中部"下一步"卡片 ---------- */
.cxb-block { padding-top: 0; }
.cxb-card {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #f5fbfe 0%, #ffffff 100%);
  border: 1px solid #d7e9f4;
  border-radius: 20px;
  box-shadow: 0 1px 2px rgba(4,38,59,.04), 0 16px 40px rgba(4,38,59,.07);
  padding: 32px 36px 30px;
}
.cxb-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #17A5CC, #0A3B55);
}
.cxb-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 14px;
  padding: 5px 12px;
  border-radius: 999px;
  background: #e6f4fb;
  color: #0d5e80;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .03em;
}
.cxb-tag::before {
  content: "";
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #17A5CC;
}
.cxb-card h3 {
  margin: 0 0 10px;
  font-size: 22px;
  line-height: 1.35;
  color: #04263B;
  font-weight: 800;
}
.cxb-card p {
  margin: 0 0 8px;
  font-size: 14.5px;
  line-height: 1.8;
  color: #3d5566;
}
.cxb-card p:last-of-type { margin-bottom: 0; }
.cxb-ctas {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 20px;
}
.cxb-btn { min-height: 46px; padding: 0 22px; border-radius: 12px; font-weight: 800; }
.cxb-link {
  font-size: 14px;
  font-weight: 600;
  color: #0d5e80;
  text-decoration: none;
}
.cxb-link:hover { color: #08344b; text-decoration: underline; }

/* ---------- 3. 首页成长路径 ---------- */
.cxb-path {
  display: flex;
  align-items: stretch;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 auto 30px;
  max-width: 780px;
}
.cxb-path-step {
  flex: 1 1 150px;
  min-width: 140px;
  background: #fff;
  border: 1px solid #d7e9f4;
  border-radius: 16px;
  padding: 16px 14px 14px;
  text-align: center;
  box-shadow: 0 1px 2px rgba(4,38,59,.04);
}
.cxb-path-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px; height: 30px;
  border-radius: 50%;
  background: #e6f4fb;
  color: #0d5e80;
  font-size: 14px;
  font-weight: 800;
  margin-bottom: 6px;
}
.cxb-path-step p { margin: 0; font-size: 14px; font-weight: 600; color: #0f2a3f; }
.cxb-path-arrow {
  align-self: center;
  font-size: 18px;
  font-weight: 700;
  color: #17A5CC;
  padding: 0 2px;
}
.cxb-home h2 { font-size: 30px; color: #04263B; margin: 0 0 10px; line-height: 1.3; }

/* ---------- 4. 领取/下载成功页升级卡 ---------- */
.cxb-upsell {
  margin-top: 20px;
  text-align: left;
}
.cxb-dl-upsell {
  width: 100%;
  max-width: 460px;
  margin: 18px auto 0;
  background: #fff;
  border: 1px solid #d7e9f4;
  border-top: 3px solid #17A5CC;
  border-radius: 18px;
  box-shadow: 0 14px 40px rgba(4,38,59,.08);
  padding: 22px 24px;
  text-align: center;
}
.cxb-dl-upsell .cxb-tag { margin-bottom: 10px; }
.cxb-dl-upsell h3 { margin: 0 0 8px; font-size: 18px; line-height: 1.4; color: #04263B; font-weight: 800; }
.cxb-dl-upsell p { margin: 0 0 6px; font-size: 13.5px; line-height: 1.7; color: #4a6172; }
.cxb-dl-upsell .cxb-ctas { justify-content: center; margin-top: 14px; }
.cxb-dl-upsell .cxb-btn { min-height: 42px; padding: 0 18px; font-size: 14px; }

/* ---------- 分类页 codex-cta 升级 ---------- */
.codex-cta { border-radius: 16px; }
.codex-cta .cxb-ctas { margin-top: 14px; }

/* ---------- 移动端 ---------- */
@media (max-width: 859px) {
  .cxb-card { padding: 26px 22px 24px; }
  .cxb-card h3 { font-size: 19px; }
  .cxb-path { max-width: 420px; }
  .cxb-path-arrow { display: none; }
  .cxb-path-step { flex: 1 1 40%; min-width: 120px; }
  .cxb-home h2 { font-size: 24px; }
}
@media (max-width: 480px) {
  .cxb-card h3 { font-size: 17.5px; }
  .cxb-ctas .btn { width: 100%; }
  .cxb-link { text-align: center; width: 100%; }
}
