@charset "utf-8";
/* ===========================================================================
   文章正文排版 + 相关内容模块   v1.2
   文件位置：/website/cus/css/article.css        （新增文件）
   挂载方式：BNY/library/platform/cus/view/body.html 的 </head> 前加一行 link
   作用范围：① .Cenbsonw  —— 文章正文容器内部的标签级排版
             ② .art-rel   —— 相关内容模块（位于正文容器之外、正文栏之内）
   ---------------------------------------------------------------------------
   为什么不会影响历史文章：
     站内历史文章正文只使用 <p> / <span> / <img> 三种标签；
     本文件新增的 h2 / h3 / table / ul / ol / li / strong / figure 规则
     只有在这些标签出现时才生效，所以对老文章无影响。
     唯一会波及全站的是第 1 条“段落间距 +0.16rem”，属正向调整（已确认保留）。
   ---------------------------------------------------------------------------
   尺寸基准：沿用站点既有 rem 体系
     桌面（>1023px）1rem = 视口宽 / 19.2     1920px 下 1rem = 100px
     移动（<=1023px）1rem = 视口宽 / 7.5      375px 下 1rem = 50px
   与站点既有值对齐（style.css）：
     .Cenbsonw  桌面 0.18rem/0.25rem · 移动 0.24rem/0.40rem
     .right_Xenter 桌面宽 10.7rem     · 移动 100%
   =========================================================================== */

/* ---------- 1. 段落间距（唯一会波及历史文章的一条） ---------- */
.Cenbsonw p { margin: 0 0 0.16rem; }

/* 站内历史文章习惯用 <p><br/></p> 充当空行；若与上面的段落间距叠加会显得过疏，
   这里把「只含一个 <br>」的空行段落外边距归零，恢复原有观感。
   :has() 不被支持时本条会被整条忽略，自动回退为上面的统一间距，不存在兼容风险。 */
.Cenbsonw p:has(> br:only-child) { margin-bottom: 0; }

/* ---------- 2. 二级标题：品牌红左边线 ---------- */
.Cenbsonw h2 {
    font-size: 0.24rem;
    line-height: 0.36rem;
    font-weight: bold;
    color: #1a1a1a;
    margin: 0.46rem 0 0.18rem;
    padding: 0.02rem 0 0.02rem 0.16rem;
    border-left: 0.06rem solid #d40003;
}
.Cenbsonw h2:first-child { margin-top: 0.08rem; }

/* ---------- 3. 三级标题：虚线下分隔 ---------- */
.Cenbsonw h3 {
    font-size: 0.19rem;
    line-height: 0.30rem;
    font-weight: bold;
    color: #1a1a1a;
    margin: 0.32rem 0 0.12rem;
    padding-bottom: 0.08rem;
    border-bottom: 1px dashed #e0e0e0;
}

/* ---------- 4. 强调 ---------- */
.Cenbsonw strong, .Cenbsonw b { font-weight: bold; color: #111; }

/* ---------- 5. 列表（reset.css 清掉了项目符号，此处恢复） ---------- */
.Cenbsonw ul, .Cenbsonw ol { margin: 0.12rem 0 0.24rem; padding-left: 0.30rem; }
.Cenbsonw ul > li { list-style: disc outside; margin: 0.06rem 0; padding-left: 0.06rem; }
.Cenbsonw ol > li { list-style: decimal outside; margin: 0.06rem 0; padding-left: 0.06rem; }
.Cenbsonw li > p { margin: 0; }

/* ---------- 6. 数据表格（reset.css 清掉了边框，此处重建） ---------- */
.Cenbsonw table {
    width: 100%;
    border-collapse: collapse;
    margin: 0.20rem 0 0.28rem;
    font-size: 0.15rem;
    line-height: 0.24rem;
}
.Cenbsonw table th {
    background: #f5f6f7;
    color: #111;
    font-weight: bold;
    border: 1px solid #dcdcdc;
    padding: 0.12rem 0.10rem;
    text-align: left;
    word-break: break-word;
}
.Cenbsonw table td {
    border: 1px solid #dcdcdc;
    padding: 0.12rem 0.10rem;
    color: #333;
    word-break: break-word;
}
.Cenbsonw table tbody tr:nth-child(even) td { background: #fafafa; }

/* ---------- 7. 图片自适应 ---------- */
.Cenbsonw img { max-width: 100%; height: auto; }

/* ---------- 8. 配图区块：figure + 图注（利于生成式引擎抽取图片语义） ---------- */
.Cenbsonw figure { margin: 0.28rem auto 0.32rem; text-align: center; }
.Cenbsonw figure img {
    display: block;
    width: 100%;
    max-width: 8rem;
    height: auto;
    margin: 0 auto;
    border: 1px solid #ececec;
}
.Cenbsonw figcaption {
    max-width: 8rem;
    margin: 0.10rem auto 0;
    font-size: 0.13rem;
    line-height: 0.20rem;
    color: #999999;
    text-align: center;
}

/* ===========================================================================
   9. 相关内容模块
   位置：正文容器 .Cenbsonw 之后、上一篇/下一篇 .Taqonew 之前
   数据：控制器 $data->relate —— 同栏目、排除自身、仅已发布，
         排序 hot DESC, ords DESC, times DESC，取 8 条
   结构：section > h2.rel-head + ul.rel-list > li > a
         li.no-pic 表示该条无缩略图（以品牌红细线补齐视觉重量）
   =========================================================================== */
.art-rel {
    margin-top: 0.60rem;
    padding-top: 0.40rem;
    border-top: 1px solid #e6e6e6;
}
.art-rel .rel-head {
    font-size: 0.24rem;
    line-height: 0.36rem;
    font-weight: bold;
    color: #1a1a1a;
    margin: 0 0 0.28rem;
    padding: 0.02rem 0 0.02rem 0.16rem;
    border-left: 0.06rem solid #d40003;
}
.art-rel .rel-list {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    list-style: none;
}
.art-rel .rel-list > li {
    width: 50%;
    box-sizing: border-box;
    margin: 0 0 0.30rem;
}
.art-rel .rel-list > li:nth-child(odd)  { padding-right: 0.20rem; }
.art-rel .rel-list > li:nth-child(even) { padding-left: 0.20rem; }
.art-rel .rel-list > li > a {
    display: flex;
    align-items: flex-start;
    color: inherit;
    text-decoration: none;
}
.art-rel .rel-pic {
    flex: 0 0 1.50rem;
    width: 1.50rem;
    height: 1.14rem;
    margin-right: 0.18rem;
    overflow: hidden;
    background: #f2f3f4;
}
.art-rel .rel-pic img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.art-rel .rel-txt { flex: 1; min-width: 0; }
.art-rel .rel-t {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-style: normal;
    font-size: 0.17rem;
    line-height: 0.26rem;
    color: #1a1a1a;
}
.art-rel .rel-dg {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 0.06rem;
    font-size: 0.13rem;
    line-height: 0.20rem;
    color: #888888;
}
.art-rel .rel-d {
    display: block;
    margin-top: 0.06rem;
    font-size: 0.12rem;
    line-height: 0.18rem;
    color: #b0b0b0;
}
.art-rel .rel-list > li > a:hover .rel-t { color: #d40003; }
/* 无缩略图：左侧品牌红细线，与有图条目保持视觉重量一致 */
.art-rel .rel-list > li.no-pic .rel-txt {
    border-left: 0.04rem solid #d40003;
    padding-left: 0.18rem;
}

/* ===========================================================================
   移动端（<=1023px）：1rem = 视口宽 / 7.5
   =========================================================================== */
@media screen and (max-width: 1023px) {

    .Cenbsonw p { margin: 0 0 0.24rem; }

    .Cenbsonw h2 {
        font-size: 0.34rem;
        line-height: 0.50rem;
        margin: 0.60rem 0 0.26rem;
        padding-left: 0.20rem;
        border-left-width: 0.08rem;
    }
    .Cenbsonw h2:first-child { margin-top: 0.10rem; }

    .Cenbsonw h3 {
        font-size: 0.28rem;
        line-height: 0.44rem;
        margin: 0.44rem 0 0.18rem;
        padding-bottom: 0.12rem;
    }

    .Cenbsonw ul, .Cenbsonw ol { padding-left: 0.44rem; }
    .Cenbsonw ul > li, .Cenbsonw ol > li { margin: 0.10rem 0; }

    /* ---- 表格：缩字号 + 收窄水平内边距，避免 4 列表格频繁换行 ---- */
    .Cenbsonw table { font-size: 0.20rem; line-height: 0.30rem; margin: 0.30rem 0 0.40rem; }
    .Cenbsonw table th, .Cenbsonw table td { padding: 0.12rem 0.06rem; }

    .Cenbsonw figure { margin: 0.30rem auto 0.36rem; }
    .Cenbsonw figure img { max-width: 100%; }
    .Cenbsonw figcaption { font-size: 0.20rem; line-height: 0.32rem; margin-top: 0.14rem; }

    /* ---- 相关内容：改单列，缩略图放大 ---- */
    .art-rel { margin-top: 0.50rem; padding-top: 0.32rem; }
    .art-rel .rel-head {
        font-size: 0.34rem;
        line-height: 0.50rem;
        margin: 0 0 0.30rem;
        padding-left: 0.20rem;
        border-left-width: 0.08rem;
    }
    .art-rel .rel-list > li { width: 100%; padding: 0 !important; margin-bottom: 0.34rem; }
    .art-rel .rel-pic { flex: 0 0 2.00rem; width: 2.00rem; height: 1.42rem; margin-right: 0.22rem; }
    .art-rel .rel-t { font-size: 0.28rem; line-height: 0.42rem; }
    .art-rel .rel-dg { font-size: 0.22rem; line-height: 0.34rem; margin-top: 0.08rem; }
    .art-rel .rel-d { font-size: 0.20rem; line-height: 0.30rem; margin-top: 0.08rem; }
    .art-rel .rel-list > li.no-pic .rel-txt { padding-left: 0.24rem; }
}