/* ==========================================================================
   GEOER · 长文静态页公共排版
   服务页面：about.html / terms.html / privacy.html

   这三个页面沿用 article/detail.html 的骨架（css/article/detail.css 里的
   .detail-head + .detail-body，同一条 760px 阅读轴），本文件只补长文需要的
   部分：小标题、列表、行内链接、更新日期、返回链接。

   为什么放在 global/ 而不是各建一个 about.css / terms.css / privacy.css：
   三页零页面级差异，拆成三份等于把同一段 CSS 复制三遍。将来某一页出现
   独有样式，再单独建同名文件即可。
   ========================================================================== */

/* 正文列间距比文章页略紧（文章页 28px 是为图文混排留的） */
.detail-body--prose .detail-body__col {
  gap: 18px;
}

/* ------------------------------------------------------------ 小标题 */

/* 法务页的小标题比文章页（24px）收一档，避免一节套一节时层级过重 */
.detail-body--prose h2 {
  font-size: 22px;
  line-height: 1.5;
  font-weight: 700;
  color: var(--text-primary);
  margin-top: 18px;
}

.detail-body--prose h2:first-of-type {
  margin-top: 0;
}

.detail-body--prose h3 {
  font-size: 17px;
  line-height: 1.6;
  font-weight: 700;
  color: var(--text-primary);
}

/* -------------------------------------------------------------- 段落 */

.detail-body--prose p {
  line-height: 30px;
}

.detail-body--prose strong {
  font-weight: 700;
  color: var(--text-primary);
}

/* 行内链接：只给正文里的链接加下划线，避免误伤返回链 / 卡片 */
.detail-body--prose p a,
.detail-body--prose li a {
  color: var(--brand);
  border-bottom: 1px solid var(--brand-soft);
  transition: border-color var(--dur-fast) var(--ease-out);
}

.detail-body--prose p a:hover,
.detail-body--prose li a:hover {
  border-bottom-color: var(--brand);
}

/* -------------------------------------------------------------- 列表 */

.detail-body--prose ul,
.detail-body--prose ol {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-left: 22px;
}

.detail-body--prose ul li {
  list-style: disc;
}

.detail-body--prose ol li {
  list-style: decimal;
}

.detail-body--prose li {
  font-size: 16px;
  line-height: 30px;
  color: var(--text-body);
}

/* 列表里再嵌一层（如「一、我们收集的信息」下的必填 / 选填） */
.detail-body--prose li ul,
.detail-body--prose li ol {
  margin-top: 8px;
  gap: 4px;
}

/* -------------------------------------------------- 定义型信息行（关于页） */

.prose-rows {
  display: flex;
  flex-direction: column;
}

.prose-row {
  display: flex;
  gap: 20px;
  padding-block: 14px;
  font-size: 15px;
  line-height: 28px;
}

.prose-row + .prose-row {
  border-top: 1px solid var(--border-base);
}

.prose-row__k {
  flex: none;
  width: 84px;
  font-weight: 500;
  color: var(--text-primary);
}

.prose-row__v {
  color: var(--text-body);
}

/* -------------------------------------------------- 重点提示条（法务页） */

.prose-callout {
  padding: 18px 22px;
  background: var(--bg-inset);
  border-radius: var(--radius-inset);
  font-size: 15px;
  line-height: 28px;
  color: var(--text-body);
}

.prose-callout strong {
  color: var(--text-primary);
}

/* -------------------------------------------------------- 更新日期 / 返回 */

.prose-meta {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 500;
  color: var(--text-muted);
  margin-top: 6px;
}

.prose-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 14px;
  font-size: 14px;
  font-weight: 500;
  color: var(--brand);
  transition: color var(--dur-fast) var(--ease-out);
}

.prose-back:hover {
  color: var(--brand-hover);
}

/* -------------------------------------------------------------- 断点 */

@media (max-width: 899px) {
  .detail-body--prose h2 {
    font-size: 19px;
  }

  .detail-body--prose h3 {
    font-size: 16px;
  }
}

@media (max-width: 639px) {
  .detail-body--prose h2 {
    font-size: 18px;
  }

  .detail-body--prose p,
  .detail-body--prose li {
    font-size: 15px;
    line-height: 28px;
  }

  /* 定义型信息行改上下堆叠，窄屏不再挤压值列 */
  .prose-row {
    flex-direction: column;
    gap: 2px;
  }

  .prose-row__k {
    width: auto;
  }

  .prose-callout {
    padding: 16px 18px;
    font-size: 14px;
    line-height: 26px;
  }
}
