/* ==========================================================================
   VPNDN — deepdoc.css
   深度指南页(handbook.html)专属:文档列宽、章节装饰层、文末收束块。
   仅补充 components.css 未覆盖的结构,不重复定义共享组件样式。
   ========================================================================== */

/* ---------------------------------------------------------- 1. 文档流
   作为 .toc-tabs 的直接父元素,必须覆盖全部章节,sticky 才有滚动行程 */
.doc-flow{position:relative;min-width:0}

/* ---------------------------------------------------------- 2. 正文列
   比版心更窄,控制单行阅读长度;左右留白来自外层 .wrap */
.doc-col{max-width:820px;margin-inline:auto;min-width:0}
.doc-lede{font-size:16.5px;line-height:1.85;color:var(--muted)}
.doc-lede strong{color:var(--ink);font-weight:600}

/* ---------------------------------------------------------- 3. 表格与图注 */
.doc-col .table-scroll{margin:0 0 22px}
.doc-note{margin:-10px 0 24px;font-size:12.5px;line-height:1.7;color:var(--muted-2)}

/* ---------------------------------------------------------- 4. 章节装饰层
   纯装饰,aria-hidden,由 motion.js 的视差配方驱动 */
.doc-band > :not(.doc-halo){position:relative;z-index:1}
.doc-halo{
  position:absolute;right:-140px;top:-70px;width:420px;height:420px;
  border-radius:50%;pointer-events:none;z-index:0;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 11%,transparent) 0%,transparent 68%);
}

/* ---------------------------------------------------------- 5. 文末收束块 */
.doc-close{max-width:820px;margin-inline:auto}
.doc-close-t{margin-top:10px;font:800 clamp(19px,2.4vw,25px)/1.35 var(--font-display);letter-spacing:-.02em}
.doc-close-p{margin-top:10px;max-width:62ch;font-size:14px;line-height:1.75;color:var(--muted)}
.doc-close-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.doc-close-row .btn{flex-shrink:0;white-space:nowrap}
.doc-close-links{
  display:flex;flex-wrap:wrap;gap:10px 24px;
  margin-top:20px;padding-top:16px;border-top:1px solid var(--border);
}

/* ---------------------------------------------------------- 6. 断点 */
@media (max-width:768px){
  .doc-halo{display:none}
}
@media (max-width:640px){
  .doc-lede{font-size:15.5px}
  .doc-close-links{gap:8px 18px}
}
@media (prefers-reduced-motion:reduce){
  .doc-halo{transform:none}
}