/* ═══════════════════════════════════════════════════════════════════
   QIDIAN · 内页母版（第一版只挂 /about 一页）· 2026-09-03
   ───────────────────────────────────────────────────────────────────
   老叶 2026-09-03：「首页暂时凑合，但是整个主页还需要升级，还需要优化。」

   先查清楚再动手，两处一手事实纠正了我自己的第一印象：

   ① 内页暗带【已经是暖黑】 —— `--about-dark:#0a1118`，不是我以为的冷死黑。
      所以这里一个色都不换底，只补它缺的那一样。
   ② 内页用的是自己一套类（.about-section--dark / --warm），
      跟首页的 .qds-section / .qpb 零重叠 —— 首页那两张新表挂上来
      一条规则都不会命中。这张表是单独写的，不是复制粘贴。

   那内页到底差在哪：**暗带一点光都没有。**
   首页那几屏暗场现在有一盏光顺着页面往下走，内页的暗带是一整块平的暖黑，
   所以从首页点进来会觉得"掉了一档"。补的就是这一样。

   顺带两处细节：
   · 内页那套金是 #385d7d（发褐的哑金），比全站金 #537490 暗一大截。
     暗带上的强调色跟着全站走，米白带上的正文金保持原样（那儿要对比度）。
   · 分隔线 rgba(243,238,229,.15) 是一根等亮的灰线，换成中间亮两端淡的
     金发丝，跟首屏地平线同一个做法。

   🔴 三条抄自今早首页那轮的教训，别再犯一遍：
   ① 源表 `.about-section--dark` 用的是 `background: ... !important` 简写，
      简写会把 background-image 一并重置成 none。所以这里每条 background-*
      都必须带 !important，光才画得上去 —— 今早首页 13 段里 12 段没生效
      就是栽在这。上线前必须让浏览器把每段的 computed 值报一遍。
   ② 渐变必须盖噪点，配方抄本站 hero 那份（feTurbulence .82 / 3 / 180）。
   ③ 判「生效没有」不许只截一屏 —— 一屏正好是生效的那个会骗死人。
   ═══════════════════════════════════════════════════════════════════ */

/* ── 一、暗带补光：奇偶交替左右，光顺着页面往下走 ───────────────── */
html body[data-qidian-page="about"] .about-section--dark:nth-of-type(odd){
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/></filter><rect width='180' height='180' filter='url(%23n)' opacity='.05'/></svg>"),
    radial-gradient(ellipse 58% 62% at 86% 3%,
      rgba(226,192,121,.085) 0%, rgba(226,192,121,.020) 44%, transparent 74%)!important;
  background-repeat:repeat, no-repeat!important;
}
html body[data-qidian-page="about"] .about-section--dark:nth-of-type(even){
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/></filter><rect width='180' height='180' filter='url(%23n)' opacity='.05'/></svg>"),
    radial-gradient(ellipse 58% 62% at 14% 3%,
      rgba(226,192,121,.085) 0%, rgba(226,192,121,.020) 44%, transparent 74%)!important;
  background-repeat:repeat, no-repeat!important;
}

/* 结尾联系带：光收到正中，跟首页结尾同一个收法 */
html body[data-qidian-page="about"] .about-contact.about-section--dark{
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/></filter><rect width='180' height='180' filter='url(%23n)' opacity='.05'/></svg>"),
    radial-gradient(ellipse 62% 88% at 50% -6%,
      rgba(226,192,121,.095) 0%, rgba(226,192,121,.026) 40%, transparent 72%)!important;
  background-repeat:repeat, no-repeat!important;
}

/* ── 二、暗带上的金跟着全站走 ─────────────────────────────────────
   米白带上的 --about-gold #385d7d 不动：那是正文上的金，要留对比度。
   只把暗带上的强调色抬到全站金 #537490 那一档。 */
html body[data-qidian-page="about"] .about-section--dark .eyebrow{
  color:#537490!important;
  letter-spacing:.16em!important;
}
html body[data-qidian-page="about"] .about-section--dark em,
html body[data-qidian-page="about"] .about-section--dark strong.gold,
html body[data-qidian-page="about"] .about-section--dark .about-section__head h2 em{
  color:#c1d4e5!important;
  font-style:normal!important;
}

/* ── 三、分隔线：等亮灰线换成渐隐金发丝 ───────────────────────────
   90deg 在这里是结构角度（一根横线必须是横的）。 */
html body[data-qidian-page="about"] .about-section--dark li,
html body[data-qidian-page="about"] .about-section--dark .about-beliefs__row{
  border-color:transparent!important;
  background-image:linear-gradient(90deg,
    transparent 0%,
    rgba(226,192,121,.10) 8%,
    rgba(226,192,121,.28) 44%,
    rgba(226,192,121,.08) 80%,
    transparent 100%)!important;
  background-repeat:no-repeat!important;
  background-size:100% 1px!important;
  background-position:0 100%!important;
}

/* ── 一之二、按【真实底色】补漏的一条暗带 ─────────────────
   .about-facts 渲染出来是 #0a1118，跟别的暗带一模一样，但它
   身上没有 --dark 这个类。第一版选择器按类名写，漏了它；更糟的是
   我那条自检也按类名数，于是报「0 个暗带没光」—— 判据和被查对象
   犯了同一个错误，等于没查。
   判据已改成按浏览器量出来的亮度判，选择器这边把它显式补上。 */
html body[data-qidian-page="about"] .about-facts{
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='3' stitchTiles='stitch'/></filter><rect width='180' height='180' filter='url(%23n)' opacity='.05'/></svg>"),
    radial-gradient(ellipse 56% 60% at 50% -4%,
      rgba(226,192,121,.080) 0%, rgba(226,192,121,.020) 42%, transparent 72%)!important;
  background-repeat:repeat, no-repeat!important;
}

/* ── 四、facts 那屏拆盒子 ─────────────────────────────────────────
   四个数字原来一人一个格子（border-right + border-bottom 围一圈）。
   首页那批格子已经拆掉了，内页母版得带着同一套走，否则从首页点进来
   又回到卡片墙。只留一条横发丝线定位，让 58/18/6/1 这四个大字撑节奏。 */
html body[data-qidian-page="about"] .about-facts__grid{
  border-top-color:transparent!important;
  background-image:linear-gradient(90deg,transparent 0%,
    rgba(226,192,121,.10) 8%, rgba(226,192,121,.30) 44%,
    rgba(226,192,121,.08) 80%, transparent 100%)!important;
  background-repeat:no-repeat!important;
  background-size:100% 1px!important;
  background-position:0 0!important;
}
html body[data-qidian-page="about"] .about-fact{
  border-right:0!important;
  border-bottom-color:transparent!important;
  padding-right:clamp(1.1rem,2.4vw,2.4rem)!important;
  background-image:linear-gradient(90deg,transparent 0%,
    rgba(226,192,121,.09) 10%, rgba(226,192,121,.22) 46%,
    rgba(226,192,121,.07) 82%, transparent 100%)!important;
  background-repeat:no-repeat!important;
  background-size:100% 1px!important;
  background-position:0 100%!important;
}

/* 四格标题两行长短悬殊时会掉一个单字尾（「原则：证据先于宣/传」）。
   balance 让浏览器自己把两行匀开，字号一个不动。 */
html body[data-qidian-page="about"] .about-fact b{
  text-wrap:balance;
}