/* ==========================================================================
   branch2026-pages.css — 分站页面级样式（PC）
   用法：各分站页面模板在 /css/branch2026.css（通用组件）之后引入本文件。
   分区：一、首页 / 二、列表页 / 三、文章页。
   约定：Banner 城市定制一律挂 .branch-hero--{city} 变体类（HTML 中
   <section class="banner branch-hero branch-hero--{city}">），新增城市时
   复制对应变体段、改类名并替换背景图与强调色即可，勿改通用组件。
   ========================================================================== */


/* ==========================================================================
   一、首页（index.html）
   ========================================================================== */

/* ---------- 核心业务：6 项圆形线性图标 ---------- */
.biz-list { display: flex; justify-content: space-between; }
.biz-list li { width: 176px; text-align: center; }
.biz-list li a { display: block; }
.biz-list li a:hover .biz-icon { border-color: var(--red); background-color: var(--red-light); }
.biz-list h3 { font-size: var(--fs-card); font-weight: 500; line-height: 1.4; color: var(--black); margin-top: 16px; }
.biz-list li a:hover h3 { color: var(--red); }

/* ---------- 政策动态：杂志式（左焦点大卡约 40% + 右 5 条横向行） ---------- */
.policy-wrap { display: flex; gap: var(--card-gap); align-items: stretch; }

/* 左侧焦点大卡 */
.policy-focus { width: 40%; position: relative; display: flex; flex-direction: column; transition: border-color .2s ease; }
.policy-focus:hover { border-color: var(--red); }
.policy-focus .focus-tag {
  position: absolute; top: 0; left: 24px;
  background-color: var(--red); color: #FFFFFF;
  font-size: var(--fs-aux); line-height: 28px; padding: 0 12px;
  border-radius: 0 0 var(--radius) var(--radius);
}
.policy-focus h3 { font-size: var(--fs-card); font-weight: 500; line-height: 1.4; margin-top: 20px; }
.policy-focus h3 a { color: var(--black); }
.policy-focus h3 a:hover { color: var(--red); }
.policy-focus .summary { font-size: var(--fs-body); line-height: 1.8; color: var(--gray); margin-top: 12px; flex: 1; }
.clamp-3 {
  display: -webkit-box; -webkit-box-orient: vertical;
  -webkit-line-clamp: 3; overflow: hidden;
}
.policy-focus .card-foot {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--border);
}

/* 右侧 5 条横向行：红色描边日期方块 + 标题一行 + 摘要一行，行间 1px 分隔线 */
.policy-rows { flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
.policy-row { display: flex; align-items: center; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--border); }
.policy-row:first-child { padding-top: 0; }
.policy-row:last-child { border-bottom: 0; padding-bottom: 0; }
.policy-row .day {
  flex: none; width: 56px; height: 56px;
  border: 1px solid var(--red); border-radius: var(--radius);
  color: var(--red); text-align: center;
  font-family: Roboto, "DIN Alternate", sans-serif;
  display: flex; flex-direction: column; justify-content: center; line-height: 1.3;
}
.policy-row .day b { font-size: var(--fs-article); font-weight: bold; }
.policy-row .day span { font-size: var(--fs-aux); }
.policy-row .txt { flex: 1; min-width: 0; }
.policy-row .txt h3 { font-size: var(--fs-article); font-weight: 500; line-height: 1.4; }
.policy-row .txt h3 a { color: var(--black); }
.policy-row .txt h3 a:hover { color: var(--red); }
.policy-row .txt p { font-size: var(--fs-aux); line-height: 1.5; color: var(--gray-light); margin-top: 4px; }

/* ---------- 行业资讯 / 财务知识：左头条卡 + 右列表 ---------- */
.info-feature { border: 1px solid var(--border); border-radius: var(--radius); padding: var(--card-gap); background: #fff; }
.info-feature h3 { font-size: var(--fs-card); font-weight: 500; line-height: 1.4; }
.info-feature h3 a { color: var(--black); }
.info-feature h3 a:hover { color: var(--red); }
.info-feature .summary { font-size: var(--fs-body); line-height: 1.8; margin: 10px 0 14px; }

.info-list { display: flex; flex-direction: column; justify-content: space-between; }
.info-list li {
  display: flex; justify-content: space-between; align-items: baseline; gap: 16px;
  padding: 14px 0; border-bottom: 1px solid var(--border);
}
.info-list li:first-child { padding-top: 0; }
.info-list li:last-child { border-bottom: 0; }
.info-list li a { font-size: var(--fs-body); color: var(--gray); flex: 1; }
.info-list li a:hover { color: var(--red); }

/* ---------- 友情链接（页脚上方，低调处理） ---------- */
.friend-links { border-top: 1px solid var(--border); padding: 24px 0; }
.friend-links h2 { font-size: var(--fs-aux); font-weight: normal; line-height: 1.5; color: var(--gray-light); margin-bottom: 8px; }
.friend-links p { display: flex; flex-wrap: wrap; gap: 12px 24px; }
.friend-links a { font-size: var(--fs-aux); color: var(--gray-light); }
.friend-links a:hover { color: var(--red); }

/* ---------- 常见问题：问/答 ---------- */
.faq-card .q { display: flex; align-items: flex-start; gap: 10px; font-size: var(--fs-article); color: var(--black); font-weight: 500; line-height: 1.6; }
.faq-card .a { display: flex; align-items: flex-start; gap: 10px; font-size: var(--fs-body); color: var(--gray); line-height: 1.8; margin-top: 14px; }
.faq-badge {
  flex: none; width: 24px; height: 24px; border-radius: var(--radius);
  font-size: var(--fs-aux); line-height: 24px; text-align: center; font-style: normal;
}
.faq-badge--q { background-color: var(--red); color: #fff; }
.faq-badge--a { background-color: var(--red-light); color: var(--red); }

/* ---------- 合作客户：logo 统一 40px 高、灰度、hover 彩色 ---------- */
.client-tabs { display: flex; justify-content: center; gap: 12px; margin-bottom: 40px; }
.client-tabs span {
  font-size: var(--fs-body); line-height: 36px; padding: 0 24px;
  border: 1px solid var(--border); border-radius: var(--radius); color: var(--gray); cursor: default;
}
.client-tabs .on { background-color: var(--red); border-color: var(--red); color: #fff; }

.client-grid { display: flex; flex-wrap: wrap; gap: var(--card-gap); }
.client-grid .client {
  width: calc((100% - 96px) / 5); height: 88px;
  border: 1px solid var(--border); border-radius: var(--radius);
  display: flex; align-items: center; justify-content: center; background: #fff;
}
.client-grid img {
  height: 40px; width: auto; max-width: 80%;
  filter: grayscale(100%); opacity: .75;
  transition: filter .2s ease, opacity .2s ease;
}
.client-grid .client:hover img { filter: grayscale(0); opacity: 1; }

/* ---------- Banner 城市定制：长沙（.branch-hero--changsha） ----------
   城市相关值（换城市时只需改这两处）：
   - 背景图：/images/branch/branch-banners/changsha-hero.png
   - 强调色：#FFB07D（banner-kicker 文字、banner-trust 数字） */
.branch-hero--changsha { background-image:url("/images/branch/branch-banners/changsha-hero.png"); background-position:center 48%; background-color:#10233b; }
.branch-hero--changsha::after { background:rgba(3,12,24,.12); }
.branch-hero--changsha .container { min-height:420px; }
.branch-hero--changsha .banner-text { width:760px; text-shadow:0 2px 16px rgba(0,0,0,.25); }
.branch-hero--changsha .banner-kicker { display:inline-flex; align-items:center; min-height:32px; padding:0 14px; margin:0 0 10px; border:1px solid rgba(255,255,255,.38); border-radius:18px; color:#FFB07D; font-size:14px; letter-spacing:1px; background-color:rgba(4,14,27,.28); }
.branch-hero--changsha .banner-text h1 { max-width:760px; margin:0 0 12px; font-size:44px; letter-spacing:1px; }
.branch-hero--changsha .banner-text .banner-sub { font-size:20px; line-height:1.7; opacity:1; }
.branch-hero--changsha .banner-services { display:flex; align-items:center; flex-wrap:wrap; gap:0; margin-top:22px; color:#fff; font-size:15px; }
.branch-hero--changsha .banner-services span { padding:0 14px; line-height:18px; border-left:1px solid rgba(255,255,255,.45); }
.branch-hero--changsha .banner-services span:first-child { padding-left:0; border-left:0; }
.branch-hero--changsha .banner-trust { display:flex; align-items:center; gap:9px; margin-top:28px; color:rgba(255,255,255,.9); font-size:14px; }
.branch-hero--changsha .banner-trust strong { color:#FFB07D; font-size:18px; }
.branch-hero--changsha .banner-trust i { width:1px; height:16px; margin:0 4px; background-color:rgba(255,255,255,.35); }
.branch-hero--changsha .banner-qr { background-color:rgba(255,255,255,.96); box-shadow:0 20px 52px rgba(0,0,0,.24); }

/* ---------- Banner 城市定制：东莞（.branch-hero--dongguan） ----------
   - 背景图：/images/branch/branch-banners/dongguan-hero.png
   - 强调色：#A8D2FF */
.branch-hero--dongguan { background-image:url("/images/branch/branch-banners/dongguan-hero.png"); background-position:center 48%; background-color:#10233b; }
.branch-hero--dongguan::after { background:rgba(3,12,24,.12); }
.branch-hero--dongguan .container { min-height:420px; }
.branch-hero--dongguan .banner-text { width:760px; text-shadow:0 2px 16px rgba(0,0,0,.25); }
.branch-hero--dongguan .banner-kicker { display:inline-flex; align-items:center; min-height:32px; padding:0 14px; margin:0 0 10px; border:1px solid rgba(255,255,255,.38); border-radius:18px; color:#A8D2FF; font-size:14px; letter-spacing:1px; background-color:rgba(4,14,27,.28); }
.branch-hero--dongguan .banner-text h1 { max-width:760px; margin:0 0 12px; font-size:44px; letter-spacing:1px; }
.branch-hero--dongguan .banner-text .banner-sub { font-size:20px; line-height:1.7; opacity:1; }
.branch-hero--dongguan .banner-services { display:flex; align-items:center; flex-wrap:wrap; gap:0; margin-top:22px; color:#fff; font-size:15px; }
.branch-hero--dongguan .banner-services span { padding:0 14px; line-height:18px; border-left:1px solid rgba(255,255,255,.45); }
.branch-hero--dongguan .banner-services span:first-child { padding-left:0; border-left:0; }
.branch-hero--dongguan .banner-trust { display:flex; align-items:center; gap:9px; margin-top:28px; color:rgba(255,255,255,.9); font-size:14px; }
.branch-hero--dongguan .banner-trust strong { color:#A8D2FF; font-size:18px; }
.branch-hero--dongguan .banner-trust i { width:1px; height:16px; margin:0 4px; background-color:rgba(255,255,255,.35); }
.branch-hero--dongguan .banner-qr { background-color:rgba(255,255,255,.96); box-shadow:0 20px 52px rgba(0,0,0,.24); }

/* ---------- Banner 城市定制：佛山（.branch-hero--foshan） ----------
   - 背景图：/images/branch/branch-banners/foshan-hero.png
   - 强调色：#F2C477 */
.branch-hero--foshan { background-image:url("/images/branch/branch-banners/foshan-hero.png"); background-position:center 48%; background-color:#10233b; }
.branch-hero--foshan::after { background:rgba(3,12,24,.12); }
.branch-hero--foshan .container { min-height:420px; }
.branch-hero--foshan .banner-text { width:760px; text-shadow:0 2px 16px rgba(0,0,0,.25); }
.branch-hero--foshan .banner-kicker { display:inline-flex; align-items:center; min-height:32px; padding:0 14px; margin:0 0 10px; border:1px solid rgba(255,255,255,.38); border-radius:18px; color:#F2C477; font-size:14px; letter-spacing:1px; background-color:rgba(4,14,27,.28); }
.branch-hero--foshan .banner-text h1 { max-width:760px; margin:0 0 12px; font-size:44px; letter-spacing:1px; }
.branch-hero--foshan .banner-text .banner-sub { font-size:20px; line-height:1.7; opacity:1; }
.branch-hero--foshan .banner-services { display:flex; align-items:center; flex-wrap:wrap; gap:0; margin-top:22px; color:#fff; font-size:15px; }
.branch-hero--foshan .banner-services span { padding:0 14px; line-height:18px; border-left:1px solid rgba(255,255,255,.45); }
.branch-hero--foshan .banner-services span:first-child { padding-left:0; border-left:0; }
.branch-hero--foshan .banner-trust { display:flex; align-items:center; gap:9px; margin-top:28px; color:rgba(255,255,255,.9); font-size:14px; }
.branch-hero--foshan .banner-trust strong { color:#F2C477; font-size:18px; }
.branch-hero--foshan .banner-trust i { width:1px; height:16px; margin:0 4px; background-color:rgba(255,255,255,.35); }
.branch-hero--foshan .banner-qr { background-color:rgba(255,255,255,.96); box-shadow:0 20px 52px rgba(0,0,0,.24); }

/* ---------- Banner 城市定制：杭州（.branch-hero--hangzhou） ----------
   - 背景图：/images/branch/branch-banners/hangzhou-hero.png
   - 强调色：#9DE5DA */
.branch-hero--hangzhou { background-image:url("/images/branch/branch-banners/hangzhou-hero.png"); background-position:center 48%; background-color:#10233b; }
.branch-hero--hangzhou::after { background:rgba(3,12,24,.12); }
.branch-hero--hangzhou .container { min-height:420px; }
.branch-hero--hangzhou .banner-text { width:760px; text-shadow:0 2px 16px rgba(0,0,0,.25); }
.branch-hero--hangzhou .banner-kicker { display:inline-flex; align-items:center; min-height:32px; padding:0 14px; margin:0 0 10px; border:1px solid rgba(255,255,255,.38); border-radius:18px; color:#9DE5DA; font-size:14px; letter-spacing:1px; background-color:rgba(4,14,27,.28); }
.branch-hero--hangzhou .banner-text h1 { max-width:760px; margin:0 0 12px; font-size:44px; letter-spacing:1px; }
.branch-hero--hangzhou .banner-text .banner-sub { font-size:20px; line-height:1.7; opacity:1; }
.branch-hero--hangzhou .banner-services { display:flex; align-items:center; flex-wrap:wrap; gap:0; margin-top:22px; color:#fff; font-size:15px; }
.branch-hero--hangzhou .banner-services span { padding:0 14px; line-height:18px; border-left:1px solid rgba(255,255,255,.45); }
.branch-hero--hangzhou .banner-services span:first-child { padding-left:0; border-left:0; }
.branch-hero--hangzhou .banner-trust { display:flex; align-items:center; gap:9px; margin-top:28px; color:rgba(255,255,255,.9); font-size:14px; }
.branch-hero--hangzhou .banner-trust strong { color:#9DE5DA; font-size:18px; }
.branch-hero--hangzhou .banner-trust i { width:1px; height:16px; margin:0 4px; background-color:rgba(255,255,255,.35); }
.branch-hero--hangzhou .banner-qr { background-color:rgba(255,255,255,.96); box-shadow:0 20px 52px rgba(0,0,0,.24); }


/* ==========================================================================
   二、列表页（list_cscwzs.html）
   ========================================================================== */

/* ---------- 页头 Banner：左侧标题，右侧面包屑（分类胶囊已移至右侧栏） ---------- */
.page-banner .container {
  display: flex; align-items: center; justify-content: space-between; gap: 40px;
}
.page-banner .crumbs { flex: none; }

/* ---------- 分栏布局：左主栏（约 2/3）+ 右侧栏（约 1/3） ---------- */
.news-layout { display: flex; gap: 40px; align-items: flex-start; }
.news-main { flex: 1 1 auto; min-width: 0; }
.news-side { flex: none; width: 360px; }

/* 左主栏：纵向文章行，行间 1px 分隔线 */
.news-item { padding: 28px 0; border-bottom: 1px solid var(--border); }
.news-item:first-child { padding-top: 0; }
.news-item h3 { font-size: var(--fs-card); font-weight: 500; line-height: 1.4; }
.news-item h3 a { color: var(--black); }
.news-item h3 a:hover { color: var(--red); }
.news-item .summary {
  font-size: var(--fs-body); line-height: 1.8; color: var(--gray);
  margin-top: 12px;
}
.news-item .item-foot {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 12px;
}
/* 文章行缩略图（有配图时显示） */
.news-item.has-img { display: flex; gap: 24px; }
.news-item .thumb { flex: none; width: 220px; }
.news-item .thumb img { width: 100%; border-radius: var(--radius); }
.news-item .txt { flex: 1; min-width: 0; }
.no-data { padding: 40px 0; text-align: center; color: var(--gray-light); font-size: var(--fs-body); }

/* ---------- 右侧栏卡片：标题复用共享类 .side-title ---------- */
.side-card { margin-bottom: 24px; }
.side-card:last-child { margin-bottom: 0; }
.side-card .side-title { margin-bottom: 16px; }

/* 热门分类：红色描边胶囊，当前项实心红白字 */
.cat-tags { display: flex; flex-wrap: wrap; gap: 12px; }
.cat-tags a {
  font-size: var(--fs-body); line-height: 36px; padding: 0 20px;
  border: 1px solid var(--red); border-radius: 18px; color: var(--red);
}
.cat-tags a:hover { background-color: var(--red-light); color: var(--red); }
.cat-tags a.on { background-color: var(--red); color: #FFFFFF; }

/* 最新文章：13px 单行截断列表 */
.side-list li { padding: 10px 0; border-bottom: 1px dashed var(--border); }
.side-list li:last-child { padding-bottom: 0; border-bottom: none; }
.side-list a {
  display: block; font-size: var(--fs-aux); line-height: 1.5; color: var(--gray);
}
.side-list a:hover { color: var(--red); }

/* 微信咨询二维码卡片 */
.qr-card { text-align: center; }
.qr-card img { width: 180px; height: 180px; display: block; margin: 0 auto; }
.qr-card p { font-size: var(--fs-aux); line-height: 1.5; color: var(--gray); margin-top: 12px; }
.qr-card .tel {
  font-family: Roboto, "DIN Alternate", sans-serif;
  font-size: var(--fs-card); font-weight: 500; color: var(--red); margin-top: 8px;
}

/* ---------- 分页器：当前页实心红（位于左主栏底部） ---------- */
.pager { display: flex; justify-content: center; gap: 8px; margin-top: 40px; }
.pager a, .pager span {
  min-width: 36px; height: 36px; line-height: 34px; padding: 0 12px;
  text-align: center; font-size: var(--fs-aux);
  border: 1px solid var(--border); border-radius: var(--radius);
  color: var(--gray); background-color: #FFFFFF;
}
.pager a:hover { border-color: var(--red); color: var(--red); }
.pager .on { background-color: var(--red); border-color: var(--red); color: #FFFFFF; }


/* ==========================================================================
   三、文章页（msg_cscwzs.html）
   ========================================================================== */

/* ---------- 主体：左正文（最大 760px）+ 右侧栏 ---------- */
.article-wrap { display: flex; justify-content: space-between; align-items: flex-start; }
.article-main { width: 760px; }
/* 右栏整体下移：顶部对齐左栏信息行之后、正文开始的位置（约等于标题+信息行高度），
   align-self: stretch 撑满左栏高度，保证末尾微信卡片 sticky 吸顶有足够滚动空间 */
.article-side { width: 400px; margin-top: 128px; align-self: stretch; }

/* ---------- 面包屑：使用公共类 .crumbs（/css/branch2026.css），仅补本页下边距 ---------- */
.article-main .crumbs { margin-bottom: 32px; }

/* ---------- 文章标题与信息行 ---------- */
.article-title {
  font-size: var(--fs-section); font-weight: bold; line-height: 1.3; color: var(--black);
}
.article-meta {
  display: flex; gap: 32px;
  font-size: var(--fs-aux); line-height: 1.5; color: var(--gray-light);
  margin-top: 16px; padding-bottom: 24px; border-bottom: 1px solid var(--border);
}
.article-meta i { font-style: normal; font-family: Roboto, "DIN Alternate", sans-serif; }

/* ---------- 正文：16px / 行高 1.9 / 段距 20px（规范 4.3 重点） ---------- */
.article-body { margin-top: 32px; font-size: var(--fs-article); line-height: 1.9; color: var(--gray); }
.article-body p { margin-bottom: 20px; }
.article-body a { color: var(--red); text-decoration: underline; }
.article-body a:hover { color: var(--red-dark); }

/* 正文内小节标题（一、二、三……） */
.art-h {
  font-size: var(--fs-card); font-weight: 500; line-height: 1.4; color: var(--black);
  margin: 36px 0 16px;
}
/* 正文内小论点（从……来看 / 常见问题问句） */
.art-q { font-weight: 500; color: var(--black); }

/* ---------- 文末推广条：浅红底 + 左红竖条（替代旧站红框） ---------- */
.promo-box {
  background-color: var(--red-light); border-left: 4px solid var(--red);
  border-radius: var(--radius); padding: 20px 24px;
  font-size: var(--fs-body); line-height: 1.8; color: var(--gray);
  margin: 36px 0 0;
}
.promo-box strong { color: var(--red); font-weight: 500; }

/* ---------- 上一篇 / 下一篇 ---------- */
.prev-next { margin-top: 48px; border-top: 1px solid var(--border); }
.prev-next p { padding: 16px 0; border-bottom: 1px solid var(--border); font-size: var(--fs-body); line-height: 1.8; }
.prev-next .label { color: var(--gray-light); margin-right: 12px; }
.prev-next a:hover { color: var(--red); }

/* ---------- 相关阅读：标签 + 标题左对齐，日期右对齐 ---------- */
.related-list li {
  display: flex; align-items: baseline; gap: 12px;
  padding: 14px 0; border-bottom: 1px solid var(--border);
}
.related-list .tag {
  flex: none; font-size: var(--fs-aux); line-height: 22px; padding: 0 8px;
  background-color: var(--red-light); color: var(--red); border-radius: var(--radius);
}
.related-list a { flex: 1; font-size: var(--fs-body); color: var(--gray); }
.related-list a:hover { color: var(--red); }

/* ---------- 右侧栏：三块卡片 ---------- */
.side-block { margin-bottom: 40px; }

/* 微信咨询：吸顶浮框（右栏最后一个，滚动经过后吸顶；右栏已 align-self: stretch 撑满） */
.side-block--sticky { position: sticky; top: 24px; margin-bottom: 0; }

/* 热门推荐：序号榜单 */
.hot-list li { display: flex; align-items: baseline; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.hot-list .rank {
  flex: none; width: 22px; height: 22px; border-radius: var(--radius);
  font-size: var(--fs-aux); line-height: 22px; text-align: center;
  background-color: var(--bg-gray); color: var(--gray-light);
  font-family: Roboto, "DIN Alternate", sans-serif; align-self: center;
}
.hot-list li:nth-child(-n+3) .rank { background-color: var(--red); color: #fff; }
.hot-list a { flex: 1; font-size: var(--fs-body); line-height: 1.6; color: var(--gray); }
.hot-list a:hover { color: var(--red); }

/* 猜你喜欢：标题 + 浏览量 */
.like-list li { padding: 14px 0; border-bottom: 1px solid var(--border); }
.like-list a { display: block; font-size: var(--fs-body); line-height: 1.6; color: var(--gray); }
.like-list a:hover { color: var(--red); }
.like-list .views { font-size: var(--fs-aux); line-height: 1.5; color: var(--gray-light); margin-top: 4px; }
.like-list .views i { font-style: normal; font-family: Roboto, "DIN Alternate", sans-serif; }

/* 正文内图片（后台编辑器上传的配图） */
.article-body .article-image { text-align: center; margin: 24px 0; }
.article-body img { max-width: 100%; height: auto; border-radius: 2px; }