/* ================================================================
   【页面】新闻列表页 / 新闻详情页
   【模块】文件头部
   【用途】那拉泉主题文章模块样式，生态绿体系（#2f9e6e / #1b6b46 / #0f7256），横幅沿用内页风格
   【关键属性】全站设计语言统一
   ================================================================ */

/* ================================================================
   【页面】新闻列表页 / 新闻详情页
   【模块】1. 内页横幅
   【用途】与「关于我们/产品中心」同语言的左对齐大字横幅 + 淡入上浮入场特效
   【关键属性】height:372px（原620px的60%）；background:cover；渐变遮罩层；标题46px白字；副标题18px
   【交互】面包屑/标题/副标题依次延时淡入上浮（naRevealUp 动画）
   ================================================================ */
.na-banner {
    position: relative;
    height: 372px;               /* 原 620px 的 60% */
    display: flex;
    align-items: center;
    background: url(../images/bg_news.png) center / cover no-repeat #173e2d;
}
.na-banner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(6, 32, 22, .72) 0%, rgba(6, 32, 22, .40) 46%, rgba(6, 32, 22, .06) 100%);
    pointer-events: none;
}
.na-banner .nl-container { z-index: 1; width: 100%; }
.na-banner__crumb {
    margin: 0 0 26px 0;
    font-size: 15px;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, .72);
}
.na-banner__crumb a { color: inherit; }
.na-banner__crumb a:hover { color: #fff; }
.na-banner__crumb i { font-style: normal; margin: 0 10px; color: rgba(255, 255, 255, .42); }
.na-banner__title {
    margin: 0;
    font-size: 46px;
    font-weight: 700;
    color: #fff;
    letter-spacing: 3px;
    line-height: 1.2;
}
.na-banner__sub {
    margin: 12px 0 0 0;
    font-size: 18px;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, .85);
}
/* 入场特效：淡入上浮（与 about.nl-reveal 同调，独立命名防冲突） */
.na-rv { opacity: 0; animation: naRevealUp .9s ease-out forwards; }
.na-banner__crumb.na-rv { animation-delay: .15s; }
.na-banner__title.na-rv { animation-delay: .35s; }
.na-banner__sub.na-rv  { animation-delay: .75s; }
@keyframes naRevealUp {
    from { opacity: 0; transform: translateY(30px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ================================================================
   【页面】新闻列表页
   【模块】2. 列表页
   【用途】文章列表容器，白色背景，内边距56px 0 30px
   ================================================================ */
.na-list { padding: 56px 0 30px; background: #fff; }

/* ================================================================
   【页面】新闻列表页
   【模块】2.1 栏目 Tab + 文章总数
   【用途】分类切换胶囊按钮（公司动态/媒体资讯等）+ 右侧文章总数统计
   【关键属性】flex 两端对齐；tab 圆角全胶囊 border 1.5px；选中态深绿填充+阴影
   【交互】hover 边框变绿+浅绿背景；选中态深绿反白+阴影
   ================================================================ */
.na-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 34px;
}
.na-tabs { display: flex; flex-wrap: wrap; gap: 12px; }
.na-tab {
    display: inline-flex;
    align-items: center;
    padding: 10px 34px;
    border: 1.5px solid rgba(47, 158, 110, .55);
    border-radius: 999px;
    font-size: 16px;
    font-weight: 600;
    color: #1b6b46;
    transition: all .3s ease;
}
.na-tab:hover { border-color: #2f9e6e; background: #eef8f2; color: #0f7256; }
.na-tab.is-on {
    background: #2f9e6e;
    border-color: #2f9e6e;
    color: #fff;
    box-shadow: 0 10px 22px rgba(47, 158, 110, .30);
}
.na-total { font-size: 14px; color: #8a9a92; letter-spacing: .5px; }
.na-total b { color: #2f9e6e; font-weight: 700; margin: 0 2px; }

/* 文章行列表：左封面 + 右信息（浅底分隔，hover 轻浮起） */
.na-list__items { min-height: 260px; }
.na-item {
    display: flex;
    align-items: center;
    gap: 36px;
    padding: 30px 6px;
    border-bottom: 1px solid #eef2ef;
}
.na-item:first-child { padding-top: 8px; }
.na-item:hover { background: linear-gradient(90deg, rgba(47, 158, 110, .05), transparent 60%); }
.na-item__cover {
    flex: 0 0 380px;
    width: 380px;
    height: 252px;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient(135deg, #d8efe1 0%, #a9d6bd 100%);
    position: relative;
}
.na-item__cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.01);
    transition: transform .7s cubic-bezier(.22, .68, .35, 1);
}
.na-item:hover .na-item__cover img { transform: scale(1.07); }
/* 无图兜底：水波纹氛围 + 中央水滴标记 */
.na-item__cover--none::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 74px;
    height: 74px;
    transform: translate(-50%, -50%);
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='rgba(255,255,255,.85)'%3E%3Cpath d='M12 2.5c3.4 4 6.2 7.4 6.2 10.6a6.2 6.2 0 0 1-12.4 0C5.8 9.9 8.6 6.5 12 2.5z'/%3E%3C/svg%3E") center / contain no-repeat;
    opacity: .5;
}
.na-item__cover--none::after {
    content: "图片整理中";
    position: absolute;
    left: 50%;
    bottom: 18px;
    transform: translateX(-50%);
    font-size: 13px;
    letter-spacing: 2px;
    color: rgba(15, 114, 86, .55);
    white-space: nowrap;
}
.na-item__info { flex: 1; min-width: 0; }
.na-item__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 13px;
    color: #8a9a92;
    letter-spacing: .5px;
}
.na-item__tag {
    padding: 2px 12px;
    border-radius: 999px;
    background: #e9f6ef;
    color: #0f7256;
    font-size: 13px;
    font-weight: 600;
}
.na-item__meta i { font-style: normal; color: #d3ded8; }
.na-item__title {
    margin: 12px 0 10px 0;
    font-size: 24px;
    font-weight: 700;
    color: #22332b;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    transition: color .3s ease;
}
.na-item:hover .na-item__title { color: #0f7256; }
.na-item__title a { color: inherit; }
.na-item__brief {
    margin: 0;
    font-size: 15px;
    color: #5c6f66;
    line-height: 1.85;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}
.na-item__more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    font-size: 14px;
    font-weight: 600;
    color: #2f9e6e;
    transition: gap .3s ease, color .3s ease;
}
.na-item__more svg { width: 15px; height: 15px; transition: transform .3s ease; }
.na-item:hover .na-item__more { color: #0f7256; gap: 10px; }

/* 空栏目状态 */
.na-empty {
    padding: 90px 20px 110px;
    text-align: center;
    color: #9aaba2;
}
.na-empty b { display: block; font-size: 22px; font-weight: 600; color: #55665e; margin-bottom: 10px; }
.na-empty p { font-size: 15px; color: #93a39b; }
.na-empty__back {
    display: inline-block;
    margin-top: 24px;
    padding: 10px 30px;
    border: 1.5px solid #2f9e6e;
    border-radius: 999px;
    color: #1b6b46;
    font-size: 14px;
    font-weight: 600;
    transition: all .3s ease;
}
.na-empty__back:hover { background: #2f9e6e; color: #fff; }

/* ================================================================
   【页面】新闻列表页
   【模块】2.4 分页
   【用途】页码导航，胶囊数字按钮，支持上一页/下一页/省略号
   【关键属性】inline-flex 数字按钮44px高；圆角10px；选中态深绿填充反白
   【交互】hover 边框变绿+文字变绿；选中态不可点击；禁用态半透明
   ================================================================ */
.na-page { margin: 46px 0 34px; text-align: center; }
.na-page ul { display: inline-flex; flex-wrap: wrap; gap: 8px; }
.na-page a, .na-page span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    height: 44px;
    padding: 0 6px;
    border: 1px solid #e3ece6;
    border-radius: 10px;
    font-size: 15px;
    color: #55665e;
    background: #fff;
    transition: all .3s ease;
}
.na-page a:hover { border-color: #2f9e6e; color: #0f7256; }
.na-page span.is-on {
    background: #2f9e6e;
    border-color: #2f9e6e;
    color: #fff;
    cursor: default;
}
.na-page span.is-disabled { opacity: .35; cursor: not-allowed; }

/* ---------- 3. 详情页（商务编辑版式：深绿刊头 + 白卡正文 + 黏性侧栏） ---------- */

/* 刊头：深绿渐变（可叠栏目 banner 图，::before 压暗保证可读） */
.nd-head {
    position: relative;
    overflow: hidden;
    padding: 38px 0 40px;
    background: linear-gradient(118deg, #0b3121 0%, #11523a 52%, #1d7c57 100%);
    background-size: cover;
    background-position: center;
}
.nd-head::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(4, 22, 15, .70) 0%, rgba(4, 22, 15, .38) 55%, rgba(4, 22, 15, .10) 100%);
    pointer-events: none;
}
.nd-head .nl-container { z-index: 1; }
.nd-head__crumb {
    margin: 0 0 24px 0;
    font-size: 14px;
    letter-spacing: 2px;
    color: rgba(255, 255, 255, .68);
}
.nd-head__crumb a { color: inherit; }
.nd-head__crumb a:hover { color: #fff; }
.nd-head__crumb i { font-style: normal; margin: 0 10px; color: rgba(255, 255, 255, .35); }
.nd-head__cate {
    margin: 0;
    font-size: 30px;
    font-weight: 700;
    color: #fff;
    line-height: 1.4;
    letter-spacing: 3px;
    text-shadow: 0 2px 14px rgba(0, 0, 0, .15);
}

/* 正文区：浅灰绿底衬托白卡，正文 + 侧栏 */
.nd-main { background: #f4f8f5; padding: 52px 0 78px; }
.nd-main__layout { display: flex; align-items: flex-start; gap: 42px; }
.nd-card {
    flex: 1;
    min-width: 0;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 16px 44px rgba(14, 59, 40, .08);
    padding: 46px 56px 42px;
    box-sizing: border-box;
}
/* ================================================================
   【页面】新闻详情页
   【模块】3.2 文章卡片（标题 + 元信息 + 导语 + 正文 + 关键词 + 上下篇导航）
   【用途】白色内容卡片，含文章标题/日期/来源/浏览量/导语/正文/关键词标签/前后篇导航
   【关键属性】标题32px粗体；元信息flex row+底部分隔线；导语绿左边框背景；正文16px商务墨绿；关键词胶囊
   【交互】关键词标签hover深绿填充；上下篇导航hover边框+上浮
   ================================================================ */
.nd-card__title {
    margin: 0;
    font-size: 32px;
    font-weight: 700;
    color: #1c2c25;
    line-height: 1.55;
    letter-spacing: .5px;
}
.nd-card__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 22px;
    margin-top: 18px;
    padding-bottom: 22px;
    border-bottom: 1px solid #eef2ef;
    color: #97a79f;
    font-size: 14px;
    letter-spacing: .5px;
}
.nd-card__meta-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.nd-card__meta-item svg { width: 15px; height: 15px; opacity: .85; }
.nd-card__lead {
    margin: 22px 0 0 0;
    padding: 14px 22px;
    background: #f2faf6;
    border-left: 3px solid #2f9e6e;
    border-radius: 0 10px 10px 0;
    font-size: 16px;
    line-height: 1.9;
    color: #38584a;
}
.nd-card__figure { margin: 24px 0 0 0; }
.nd-card__figure img {
    width: 100%;
    max-height: 520px;
    object-fit: cover;
    border-radius: 12px;
    display: block;
}
/* 正文排版：编辑感字号行距，颜色偏商务墨绿 */
.nd-card__body { font-size: 16px; color: #3e5048; line-height: 2.05; word-break: break-word; }
.nd-card__body p { margin: 0 0 20px 0; text-align: justify; }
.nd-card__body h2, .nd-card__body h3 {
    margin: 32px 0 16px;
    font-size: 22px;
    font-weight: 700;
    color: #14563f;
    line-height: 1.5;
}
.nd-card__body h4 {
    margin: 26px 0 12px;
    font-size: 18px;
    font-weight: 700;
    color: #14563f;
}
.nd-card__body img { max-width: 100%; height: auto; border-radius: 10px; margin: 20px auto; }
.nd-card__body strong { color: #163a2c; font-weight: 700; }
.nd-card__body blockquote {
    margin: 24px 0;
    padding: 14px 22px;
    background: #f3faf6;
    border-left: 3px solid #2f9e6e;
    border-radius: 0 10px 10px 0;
    color: #4d6257;
    font-size: 15px;
    line-height: 1.9;
}
.nd-card__body ul, .nd-card__body ol { margin: 0 0 20px 0; padding-left: 1.4em; }
.nd-card__body ul li { list-style: disc; margin-bottom: 6px; }
.nd-card__body ol li { list-style: decimal; margin-bottom: 6px; }

/* 关键词 */
.nd-card__tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 36px;
    padding-top: 24px;
    border-top: 1px dashed #dce7e1;
}
.nd-card__tags-label { font-size: 13px; color: #9aaba2; letter-spacing: 2px; margin-right: 4px; }
.nd-card__tag {
    padding: 4px 15px;
    background: #eef6f1;
    color: #1b6b46;
    border-radius: 999px;
    font-size: 13px;
    transition: all .3s ease;
}
.nd-card__tag:hover { background: #2f9e6e; color: #fff; }

/* 上一篇 / 下一篇（卡片化） */
.nd-card__nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 32px;
}
.nd-card__nav-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 9px;
    min-width: 0;
    padding: 17px 20px;
    border: 1px solid #e6eeea;
    border-radius: 12px;
    background: #fbfdfc;
    transition: border-color .3s ease, background .3s ease, transform .3s ease;
}
.nd-card__nav-item--next { align-items: flex-end; text-align: right; }
.nd-card__nav-item:hover { border-color: #b7dbc8; background: #f4faf6; transform: translateY(-2px); }
.nd-card__nav-label {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 2px;
    color: #a0b0a8;
}
.nd-card__nav-item a {
    font-size: 15px;
    font-weight: 600;
    color: #2c4238;
    line-height: 1.55;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: color .3s ease;
}
.nd-card__nav-item a:hover { color: #0f7256; }
.nd-card__nav-item em { font-style: normal; font-size: 14px; color: #c3cdc8; }
.nd-card__back { text-align: center; margin-top: 26px; }
.nd-card__back a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1px;
    color: #1b6b46;
    transition: color .3s ease, gap .3s ease;
}
.nd-card__back a:hover { color: #0f7256; gap: 12px; }
.nd-card__back svg { width: 16px; height: 16px; }

/* ================================================================
   【页面】新闻详情页
   【模块】3.3 侧栏（黏性 + 栏目推荐 + 联系卡片CTA）
   【用途】右侧固定336px黏性侧栏，含栏目推荐列表（带序号+标题+日期）和生态绿渐变CTA卡片
   【关键属性】position:sticky top:24px；侧栏块白底圆角16px+阴影；推荐项虚线分隔+序号编号；CTA渐变背景+装饰圆+电话按钮
   【交互】推荐项hover序号变绿+标题变绿；CTA按钮hover反白
   ================================================================ */
.nd-side {
    flex: 0 0 336px;
    width: 336px;
    position: sticky;
    top: 24px;
    display: flex;
    flex-direction: column;
    gap: 26px;
}
.nd-side__block {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 14px 40px rgba(14, 59, 40, .07);
    padding: 26px 24px 16px;
}
.nd-side__title {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 8px 0;
    font-size: 18px;
    font-weight: 700;
    color: #14563f;
    letter-spacing: 1px;
}
.nd-side__title::before {
    content: "";
    width: 4px;
    height: 18px;
    border-radius: 2px;
    background: linear-gradient(180deg, #2f9e6e, #14563f);
}
.nd-side__item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 14px 0;
    border-bottom: 1px dashed #e8efea;
}
.nd-side__item:last-child { border-bottom: 0; padding-bottom: 10px; }
.nd-side__no {
    flex: 0 0 26px;
    font-size: 16px;
    font-weight: 700;
    font-style: italic;
    color: #c6d4cc;
    line-height: 1.5;
    transition: color .3s ease;
}
.nd-side__item:hover .nd-side__no { color: #2f9e6e; }
.nd-side__txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.nd-side__txt b {
    font-size: 15px;
    font-weight: 600;
    color: #33463c;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    transition: color .3s ease;
}
.nd-side__item:hover .nd-side__txt b { color: #0f7256; }
.nd-side__txt time { font-size: 12px; color: #9aa9a1; letter-spacing: .5px; }

/* 联系卡片：生态绿渐变 CTA */
.nd-side__cta {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
    padding: 28px 26px;
    color: #fff;
    background: linear-gradient(135deg, #0e5b3f 0%, #23855f 100%);
    box-shadow: 0 18px 44px rgba(15, 114, 86, .24);
}
.nd-side__cta::after {
    content: "";
    position: absolute;
    right: -46px;
    bottom: -56px;
    width: 168px;
    height: 168px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    pointer-events: none;
}
.nd-side__cta h3 { margin: 0 0 8px 0; font-size: 22px; font-weight: 700; letter-spacing: 1px; }
.nd-side__cta p { margin: 0 0 18px 0; font-size: 13px; color: rgba(255, 255, 255, .82); }
.nd-side__cta-phone {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}
.nd-side__cta-phone svg { width: 20px; height: 20px; opacity: .9; }
.nd-side__cta-phone b { font-size: 22px; font-weight: 700; letter-spacing: 1px; }
.nd-side__cta-btn {
    position: relative;
    z-index: 1;
    display: inline-flex;
    padding: 9px 28px;
    border: 1.5px solid rgba(255, 255, 255, .78);
    border-radius: 999px;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    transition: all .3s ease;
}
.nd-side__cta-btn:hover { background: #fff; color: #0f7256; }


/* ---------- 响应式（PC 优先，辅以窄屏收敛） ---------- */
@media (max-width: 1280px) {
    .na-banner { height: 336px; }
    .na-item { gap: 28px; }
    .na-item__cover { flex-basis: 330px; width: 330px; height: 222px; }
    .nd-main__layout { gap: 30px; }
    .nd-card { padding: 40px 40px 36px; }
    .nd-side { flex-basis: 300px; width: 300px; }
}
@media (max-width: 1024px) {
    .na-banner { height: 288px; }
    .na-banner__title { font-size: 36px; }
    .na-item { flex-direction: column; align-items: flex-start; gap: 18px; }
    .na-item__cover { flex: none; width: 100%; height: auto; aspect-ratio: 16 / 9; }
    .nd-head { padding: 32px 0 34px; }
    .nd-head__cate { font-size: 26px; }
    .nd-card__title { font-size: 26px; }
    .nd-main__layout { flex-direction: column; gap: 26px; }
    .nd-card { padding: 30px 22px 28px; }
    .nd-card__nav { grid-template-columns: 1fr; gap: 12px; }
    .nd-card__nav-item--next { align-items: flex-start; text-align: left; }
    .nd-side { position: static; flex: none; width: 100%; }
}


/* ================================================================
   【页面】新闻列表页
   【模块】列表页精细化（保持v1行式结构 + 细节打磨）
   【用途】在原有列表样式基础上增强：封面阴影、标签边框、胶囊阅读全文按钮（hover深绿反白+箭头滑出）
   【关键属性】封面box-shadow；标签 border+背景；胶囊按钮 padding 8px 18px
   【交互】hover 胶囊按钮深绿填充+阴影+箭头右移3px
   ================================================================ */
.na-list { padding: 50px 0 8px; }
.na-item { gap: 40px; padding: 32px 10px; }
.na-item:first-child { padding-top: 10px; }
.na-item:hover { background: linear-gradient(90deg, rgba(47, 158, 110, .045), transparent 55%); }
.na-item__cover {
    border-radius: 14px;
    box-shadow: 0 12px 26px rgba(20, 60, 40, .10);
}
.na-item__cover img { transition: transform .8s cubic-bezier(.22, .68, .35, 1); }
.na-item:hover .na-item__cover img { transform: scale(1.06); }
.na-item__meta { color: #8b9b93; font-size: 13.5px; gap: 14px; }
.na-item__tag {
    padding: 3px 13px;
    background: #eef7f1;
    border: 1px solid rgba(47, 158, 110, .28);
    color: #0f7256;
    font-size: 13px;
    font-weight: 600;
}
.na-item__title { margin: 13px 0 9px; color: #20322a; }
.na-item__brief { color: #64786e; }
/* 阅读全文 → 胶囊按钮（hover 深绿反白 + 箭头滑出） */
.na-item__more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    padding: 8px 18px;
    border: 1px solid #d3e7da;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    color: #14563f;
    background: #fff;
    text-decoration: none;
    transition: all .35s ease;
}
.na-item:hover .na-item__more {
    background: #0f7256;
    border-color: #0f7256;
    color: #fff;
    box-shadow: 0 8px 20px rgba(15, 114, 86, .30);
}
.na-item__more svg { width: 13px; height: 13px; transition: transform .35s ease; }
.na-item:hover .na-item__more svg { transform: translateX(3px); }

/* 空态与分页在精简后的间距 */
.na-empty { padding: 90px 20px 110px; }

/* ================================================================
   【页面】新闻列表页
   【模块】底部 CTA 带
   【用途】生态绿渐变转化引导条，含标题/副标题/电话/产品中心/联系我们按钮
   【关键属性】flex 两端对齐；渐变背景118deg；装饰半透明圆；圆角18px；按钮--solid 白色/--ghost 透明边框
   【交互】hover 按钮颜色变化
   ================================================================ */
.nl-cta { padding: 46px 0 80px; background: #fff; }
.nl-cta__box {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 30px 40px;
    padding: 40px 48px 40px 52px;
    border-radius: 18px;
    color: #fff;
    background: linear-gradient(118deg, #0b3121 0%, #11523a 55%, #1d7c57 100%);
    box-shadow: 0 22px 54px rgba(14, 59, 40, .20);
}
.nl-cta__box::before {
    content: "";
    position: absolute;
    right: -70px;
    top: -90px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .06);
}
.nl-cta__box::after {
    content: "";
    position: absolute;
    right: 120px;
    bottom: -130px;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: rgba(47, 158, 110, .35);
}
.nl-cta__info { position: relative; z-index: 1; flex: 1; min-width: 300px; }
.nl-cta__title { margin: 0 0 10px 0; font-size: 27px; font-weight: 700; letter-spacing: 1px; }
.nl-cta__sub { margin: 0; font-size: 14px; line-height: 1.9; color: rgba(255, 255, 255, .82); max-width: 560px; }
.nl-cta__actions { position: relative; z-index: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 26px; }
.nl-cta__phone {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
}
.nl-cta__phone svg { width: 34px; height: 34px; opacity: .95; }
.nl-cta__phone span { display: flex; flex-direction: column; line-height: 1.35; }
.nl-cta__phone em { font-style: normal; font-size: 12px; letter-spacing: 2px; color: rgba(255, 255, 255, .72); }
.nl-cta__phone b { font-size: 24px; font-weight: 700; letter-spacing: 1px; }
.nl-cta__btns { display: flex; gap: 14px; }
.nl-cta__btn {
    display: inline-flex;
    align-items: center;
    padding: 12px 30px;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: 1px;
    transition: all .3s ease;
}
.nl-cta__btn--solid { background: #fff; color: #0f7256; box-shadow: 0 10px 24px rgba(0, 0, 0, .12); }
.nl-cta__btn--solid:hover { background: #e9f6ef; color: #0b5b42; }
.nl-cta__btn--ghost { border: 1.5px solid rgba(255, 255, 255, .72); color: #fff; }
.nl-cta__btn--ghost:hover { background: rgba(255, 255, 255, .12); }

@media (max-width: 1280px) {
    .nl-cta__box { padding: 34px 36px; }
    .nl-cta__title { font-size: 24px; }
}
@media (max-width: 1024px) {
    .nl-cta__box { flex-direction: column; align-items: flex-start; padding: 30px 26px; }
    .nl-cta__actions { width: 100%; justify-content: space-between; }
}

/* ========== 新闻横幅统一（2026-09-02）：高度 300px ==========
   背景图 = 设置中心→导航位置→「新闻媒体」的 导航Banner图 banner_image；
   右侧装饰图 = 同一导航项的 缩略图 image（空则不显示） */
.na-banner, .nd-head { height: 300px; padding: 0; }
.na-banner .nl-container,
.nd-head .nl-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    width: 100%;
    height: 100%;
    z-index: 1;
}
.na-banner__text,
.nd-head__text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    max-width: 64%;
    padding-right: 10px;
}
.na-banner__title { margin: 0 0 10px 0; font-size: 40px; }
.na-banner__sub { margin: 0; font-size: 17px; }
.nd-head__cate { margin: 0; font-size: 34px; }
.nd-head__sub { margin: 12px 0 0 0; font-size: 17px; color: rgba(255, 255, 255, .85); letter-spacing: 1px; }
/* 右侧装饰图（缩略图字段 · 垂直居中，略晚入场） */
.na-banner__deco,
.nd-head__deco {
    flex: 0 0 auto;
    height: 180px;
    width: auto;
    max-width: 40%;
    object-fit: contain;
}
.na-banner__deco.na-rv,
.nd-head__deco.na-rv { animation-delay: .85s; }

@media (max-width: 1280px) {
    .na-banner__deco, .nd-head__deco { height: 150px; }
}
@media (max-width: 1024px) {
    .na-banner__deco, .nd-head__deco { display: none; }
    .na-banner__title { font-size: 32px; }
    .nd-head__cate { font-size: 28px; }
    .na-banner__text, .nd-head__text { max-width: 100%; }
}

/* 手机端（≤640px）：新闻横幅整图完整显示（与关于页一致，图源 1920×300 = 15.625%）
   原固定 300px 高会 cover 裁掉横幅左右 3/4 → 改由 section padding-top 撑出同比例高度零裁切；
   标题/副标 absolute 叠图上垂直居中，字号缩小 */
@media (max-width: 640px) {
    .na-banner, .nd-head {
        height: auto; padding-top: 15.625%;
        background-position: center;
    }
    .na-banner::after {
        background: linear-gradient(90deg, rgba(6, 32, 22, .62) 0%, rgba(6, 32, 22, .28) 50%, rgba(6, 32, 22, .10) 100%);
    }
    .na-banner .nl-container,
    .nd-head .nl-container {
        position: absolute; inset: 0;
        height: auto; align-items: center; justify-content: flex-start; gap: 0;
    }
    .na-banner__text, .nd-head__text { max-width: 100%; padding-right: 0; }
    .na-banner__title { font-size: 24px; margin: 0 0 3px; }
    .nd-head__cate { font-size: 24px; margin: 0 0 3px; }
    .na-banner__sub, .nd-head__sub { font-size: 13px; line-height: 1.5; }
}
