/**
 * news.css — 新闻详情页样式（经典案例 jingdiananli + 新闻资讯 news）
 * 恪理律师事务所 (kelilaw) — 主题 kelilaw
 * 仅作用于 news/show.html（经典案例 catid=18 与 新闻资讯 共用此模板）。
 * 选择器全部以 .news-detail-banner / .article-* 限定，不会污染其它页面。
 * ============================================================ */

/* ----------------------------------------------------------------
 * 1. 详情页 banner 图片自适应
 * 根因：app.css 中 .p-banner .item-pic img 的 cover 规则只写在
 *   @media (max-width:1024px) 内，桌面宽度下缺该规则，图片按原始
 *   宽高比渲染（例：2880x840 在 1280 宽仅 373px 高），与 ::before
 *   撑出的比例盒之间留下底部空隙。这里用 .news-detail-banner 限定
 *   作用域，全宽度段补 cover，仅影响新闻详情页，不波及其它 .p-banner。
 * ---------------------------------------------------------------- */
.news-detail-banner .item-pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
}

/* 移动端（≤768px）：取消固定比例盒，图片按自身比例整幅展示，
   避免 3.43:1 的宽幅缩略图被裁切成近方形（原 padding-top:80%）。 */
@media (max-width: 768px) {
    .news-detail-banner .item-pic::before {
        display: none;
    }
    .news-detail-banner .item-pic img {
        position: static;
        height: auto;
        display: block;
    }
}

/* ----------------------------------------------------------------
 * 2. 文章正文与标题
 * 标题自 banner 叠加层(.item-cont.abs-center)移出，置于正文上方，
 * 与 .article-body 同为 1000px 居中宽度，保持左对齐一致。
 * ---------------------------------------------------------------- */
.article-body {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}
.article-body img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 24px auto;
}
.article-body p {
    text-align: justify;
}

.article-head {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 28px;
    padding-bottom: 18px;
    border-bottom: 1px solid #ececec;
}
.article-head-title {
    font-size: 28px;
    font-weight: 700;
    line-height: 1.6;
    color: #000;
}
.article-head-meta {
    margin-top: 6px;
    font-size: 14px;
    color: #8d8d8d;
}
.article-head-meta .article-date {
    color: #c13734;
}