/* ============================================================================
   沛杰集团官网 · 内页（二级页）统一布局样式   sub.v2.css
   ----------------------------------------------------------------------------
   作用：把 about / education / peijie / article 这些二级页统一到首页（home-v2）
        那套设计语言 —— 同一套 token、同一个内容容器、同一种深墨标题带、
        同一个深色页脚。

   加载位置（各页已插到 </head> 之前）：
       必须排在 bootstrap.min.css / common.css / main.css / responsive.css
       之后。靠「后加载」压过旧声明，不靠 !important。

   写法约定：
     1. 凡是覆盖旧页面类的规则，一律用 body 打头 —— 特异性 (0,1,1)，
        高于各页内联 <style> 的 (0,1,0)，于是既不用逐页删旧规则，
        也不会上 !important。全文件只有「小屏标题字号」一条用 !important，
        因为要压 responsive.css 里那条自带 !important 的 16px 规则。
     2. 只覆盖视觉（颜色 / 字体 / 圆角 / 阴影 / 间距 / 容器宽），
        不重排各页自己的网格结构，避免把内容挤坏。
     3. 这里同时补上首页那套 --pad，让内页头部（header.v2.css 的 --hd-pad
        取的就是 var(--pad)）与首页在每一个断点上都左右对齐。
   ============================================================================ */

/* ---------------------------------------------------------------- 1. token */
/* 与 沛杰集团/home-v2/style.css 的 :root 一一对应，只加 pj- 前缀防止撞名 */
:root{
  --pj-ink:#14161A;
  --pj-ink-2:#454B54;
  --pj-ink-3:#5F656C;
  --pj-line:#E7E9EC;
  --pj-line-2:#DCE0E5;
  --pj-red:#E11D25;
  --pj-red-d:#C1121A;
  --pj-red-t:#FDEEF0;
  --pj-gn:#004C3C;
  --pj-gn-2:#0A6151;
  --pj-gn-t:#E8F1EE;
  --pj-bl:#1F5EA8;
  --pj-bl-2:#2E74C4;         /* 蓝色卡图标渐变的亮端（原先写死在规则里，2026-09-29 提为令牌） */
  --pj-bl-t:#EEF4FB;
  --pj-am:#9C570F;
  --pj-am-2:#B86A12;         /* 暖橙渐变的亮端；2026-09-30 顶替原 --pj-bl-2 的位置 */
  --pj-am-t:#FDF7EE;
  --pj-paper:#FFFFFF;
  --pj-paper-2:#F6F7F8;
  --pj-paper-3:#EFF1F3;
  --pj-band:#1A1514;         /* 2026-09-30 VI 转红：原 #14161A 是偏冷的黑（B>R），改暖墨 */
  --pj-maxw:1360px;          /* 与首页 .wrap 同宽 */
  --pj-narrow:900px;         /* 纯文字页的阅读栏宽 */
  --pj-ff:"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Source Han Sans SC","Noto Sans SC",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --pj-r:14px;
  --pj-r-s:8px;
  --pj-r-pill:999px;
  --pj-sh-1:0 1px 2px rgba(20,22,26,.06);
  --pj-sh-2:0 6px 22px rgba(20,22,26,.08);
}

/* 与首页共用同一套左右留白（首页 home-v2/style.css 里也定义了这三档） */
:root{ --pad:40px }
@media screen and (max-width:1280px){ :root{ --pad:32px } }
@media screen and (max-width:768px){ :root{ --pad:20px } }

/* ---------------------------------------------------------------- 2. 页面骨架 */
body{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
/* 全站内页（含游而思研学页）统一到首页的纸张底色与字体 ——
   2026-09-29：yours.php 已并入首页骨架，原先 body:not(.pj-yours) 的排除取消。 */
body{
  background:var(--pj-paper);
  color:var(--pj-ink);
  font-family:var(--pj-ff);
  -webkit-font-smoothing:antialiased;
}

/* ---- 退役 Bootstrap 3 的补偿（2026-09-29，审计 P2-9） --------------------------
   14 个内页原先加载 jQuery 1.10.1 + Bootstrap 3，每页 241 KB。实测：没有一页用到
   Bootstrap 的栅格/组件类，也没有任何 jQuery 调用，故整包移除（global.php 另去了
   无人使用的 swiper.min.css）。但 Bootstrap 的「基础层」一直在生效，去掉后会变观感，
   这里按移除前的实测 computed 值补回：
     · body{font-size:14px;line-height:1.42857143} —— 页脚、跳过链接等没显式写字号
       的元素都继承它（移除后 footer 由 14px 变 16px、行高由 20px 变 normal）；
     · .label 与站内自有的 .label（统计块 / 联系卡的文字标签）撞名，被当成 Bootstrap
       的徽章套上了内边距与圆角。
   ⚠️ 下面 .label 这条是历史撞名的产物。建议后续把站内的 .label 改名（如 .pj-label）
   并删掉本补丁；在改名之前保留原值，以保证「移除 Bootstrap」在视觉上是零变化。 */
body{ font-size:14px; line-height:1.42857143 }
body .label{
  display:inline;padding:.2em .6em .3em;text-align:center;
  white-space:nowrap;vertical-align:baseline;border-radius:.25em;
}
body .label:empty{ display:none }
/* Bootstrap 的 h1~h6 基础规则还带 line-height:1.1。正文标题（.page-content 内）
   都有显式行高，不受影响；但 .cta / .cta-section 的标题在 .page-content 之外，
   去掉 Bootstrap 后行高落到 normal，CTA 块凭空高 9px —— 按原位补回。 */
body h1,body h2,body h3,body h4,body h5,body h6{ line-height:1.1 }
/* 弹性列：内容短时把页脚压到视口底部；
   直接子元素一律 flex:none，否则像 about/news 那样给 html/body 写死 height:100%
   的页面会把标题带当作 flex 项压成 0 高（旧版红色标题带就是这么消失的） */
#pjhd,
#pjft,
body .page-banner,
body > section{ flex:none }

/* ---------------------------------------------------------------- 3. 标题带 */
/* 原来 13 个页面各有一套（红 / 深蓝 / 紫 / 墨，200~400px 高，还各挂一张 banner_*.jpg）。
   2026-09-29 先统一成深墨色带（上沿品牌红线 + 白字大标题 + 灰副标 + 标题下短红线）。
   2026-09-30 critique：这条 303px 的空带子里只有一遍导航已经写过的栏目名，首屏最贵的
   地皮被浪费（正文区块要等到 y=440 才开始）。于是改成「面包屑 + 左对齐大标题 + 灰副标
   （+ 可选数据条）」的页眉 masthead —— 左对齐与首页 .sec-head / .wf-head 的
   「大标题 + 灰副标」同一套语言，容器宽也取 --pj-maxw，与正文左缘严格对齐。
   实测高度 303 → 约 186，内容区块随之上移，本栏目自己的数字自然落进首屏。 */
body .page-banner{
  position:relative;
  width:100%;
  height:auto;
  min-height:0;
  margin:0;
  /* 左右不加内边距 —— 水平缩进交给内层 .pb-in（与 #pjhd .header-in 同一套写法：
     容器 max-width 居中 + 容器内 padding）。若在这里加 var(--pad)，宽屏下
     容器居中后标题会比正文左缘少 40px（1920 实测 280 vs 320）。 */
  padding:clamp(20px,2.2vw,32px) 0 clamp(22px,2.4vw,34px);
  display:block;
  text-align:left;
  background:var(--pj-band);
  background-image:linear-gradient(118deg,#1A1514 0%,#241D1B 52%,#2F2624 100%);
  border-top:3px solid var(--pj-red);
  box-sizing:border-box;
  overflow:hidden;
}
/* 干掉旧页面挂在标题带上的背景照片 */
body .page-banner::before{ content:none; display:none; background:none }
/* 居中短红线退役：首页区块标题没有任何装饰线（2026-09-29 已定口径），
   品牌红改由「上沿 3px 红线 + 数据条分隔线」继续承担。 */
body .page-banner::after{ content:none; display:none }

/* 页眉内层：左文右数据两列。没有数据条的页面右列宽 0 自动退化，不必写 :has()。 */
body .page-banner > div,
body .page-banner .pb-in{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:clamp(20px,3.4vw,64px);
  width:100%;
  max-width:var(--pj-maxw);
  margin:0 auto;
  padding:0 var(--pad);
  box-sizing:border-box;
}
body .page-banner .pb-main{
  display:flex;flex-direction:column;align-items:flex-start;
  min-width:0;
}
/* 面包屑 —— critique 启发式 #1：二级页原先没有面包屑，访客不知道自己处在哪一层 */
body .page-banner .pb-crumb{
  display:flex;align-items:center;gap:8px;
  margin:0 0 clamp(8px,1vw,12px);
  font-size:12.5px;line-height:1;
  color:rgba(255,255,255,.5);
}
body .page-banner .pb-crumb a{
  color:rgba(255,255,255,.66);text-decoration:none;
  transition:color .16s;
}
body .page-banner .pb-crumb a:hover,
body .page-banner .pb-crumb a:focus-visible{ color:#fff }
body .page-banner .pb-crumb i{ font-style:normal;color:rgba(255,255,255,.26) }
body .page-banner .pb-crumb em{ font-style:normal;color:rgba(255,255,255,.86) }
/* 数据条（可选）：只放「本栏目自己的真实数据」，且只在该数字不在首屏可见区时才摆，
   避免同一屏里与正文的 .stats-row 重复。取不到真实数据的页面不输出这个元素。 */
body .page-banner .pb-stats{
  display:flex;align-items:center;
  gap:clamp(18px,2.2vw,34px);
  margin:0;padding:0;list-style:none;
}
body .page-banner .pb-stats li{
  display:flex;flex-direction:column;gap:5px;
  padding-left:clamp(18px,2.2vw,34px);
  border-left:1px solid rgba(255,255,255,.16);
}
body .page-banner .pb-stats li:first-child{ padding-left:0;border-left:0 }
body .page-banner .pb-stats b{
  font-size:clamp(21px,1.9vw,28px);font-weight:800;
  color:#fff;line-height:1;letter-spacing:-.6px;
}
body .page-banner .pb-stats span{
  font-size:12px;color:rgba(255,255,255,.54);line-height:1.3;white-space:nowrap;
}
body .page-banner h1,
body .page-banner h2{
  color:#fff;
  font-family:var(--pj-ff);
  font-size:clamp(23px,2.6vw,34px);
  font-weight:800;
  line-height:1.26;
  letter-spacing:-.3px;
  margin:0;padding:0;
  text-align:left;
  text-shadow:none;
  position:static;
  z-index:auto;
}
body .page-banner p{
  color:rgba(255,255,255,.62);
  font-size:clamp(13px,1.05vw,15px);
  font-weight:400;
  line-height:1.65;
  margin:10px 0 0;
  max-width:62ch;
  text-align:left;
  position:static;
  z-index:auto;
}

/* ---------------------------------------------------------------- 4. 正文容器 */
/* scroll-margin-top：头部是 position:sticky（72px），跳过链接跳到 #pjMain 时
   浏览器会把目标滚到视口顶 —— 不留出这段高度，正文第一行会被头部盖住。 */
main.page-content{ scroll-margin-top:84px }
body .page-content{
  flex:1 0 auto;
  width:100%;
  max-width:var(--pj-maxw);
  margin:0 auto;
  padding:clamp(40px,4.4vw,68px) var(--pad) clamp(56px,5vw,88px);
  box-sizing:border-box;
  font-family:var(--pj-ff);
  color:var(--pj-ink-2);
  font-size:16px;
  line-height:1.85;
}
/* 纯文字页（联系我们 / 招聘与培训 / 数字人力 / 文章详情）：收窄到阅读栏宽 */
body .page-content.narrow{ max-width:var(--pj-narrow) }

/* 正文文字层级 */
body .page-content h2,
body .page-content .section-title{
  font-family:var(--pj-ff);
  font-size:clamp(22px,2.2vw,30px);
  font-weight:800;
  line-height:1.32;
  letter-spacing:-.3px;
  color:var(--pj-ink);
  margin:0 0 14px;
  padding:0;
  border:0;
  text-align:inherit;
}
body .page-content h3{
  font-size:19px;font-weight:700;line-height:1.4;
  color:var(--pj-ink);margin:30px 0 12px;padding-left:0;border-left:0;
}
body .page-content h4,
body .page-content h5{
  font-size:16.5px;font-weight:700;line-height:1.45;
  color:var(--pj-ink);margin:0 0 8px;
}
body .page-content p{
  font-size:15.5px;
  line-height:1.95;
  color:var(--pj-ink-2);
  margin:0 0 14px;
}
body .page-content .section-subtitle{
  font-size:clamp(13.5px,1.05vw,15.5px);
  color:var(--pj-ink-3);
  line-height:1.75;
  margin:-4px 0 40px;
  text-align:inherit;
}
body .page-content strong{ color:var(--pj-ink);font-weight:700 }
body .page-content a{ color:var(--pj-red);text-decoration:none }
body .page-content a:hover{ color:var(--pj-red-d) }
body .page-content img{ max-width:100%;height:auto }

/* 标题带里的 h1 由 §3 接管，这里只是防漏 */
body .page-content > h2:first-child{ margin-top:0 }

/* ---------------------------------------------------------------- 5. 分隔与区块 */
body .page-content .section-block{ margin:0 0 clamp(36px,4vw,60px) }
body .page-content .section-block:last-child{ margin-bottom:0 }
/* 章标题（.section-block h2）不再单列一档字号（2026-09-30 /polish）。
   原本这里写了 clamp(20px,2vw,27px)，而下面 §正文文字层级的
   `body .page-content h2, body .page-content .section-title` 是
   clamp(22px,2.2vw,30px) —— 同一角色在 1440 实测渲染成两种字号：
   .section-title（31 处，配界/教育/东南亚各页）是 30px，
   .section-block h2（16 处，集团简介/公益/海外/游而思）是 27px。
   内页「章标题」不该因为外层容器叫不叫 .section-block 而差 3px，
   这里让 .section-block h2 直接继承上面那条共用值，只留 margin 的差异。 */
/* 章标题不再加「左侧品牌红竖条」（2026-09-29）：首页各区块标题是「大标题 + 灰副标题」、
   没有任何竖条装饰，内页那条红条是内页独有的装饰 → 与首页不统一，去掉。
   章标题的「一、二、三」编号保留 —— 那是文本页的章节层级信息，不是装饰。 */

/* 正文列表（只在正文区与文字块里生效，不碰 col-card 里那套自绘 ✓ 列表） */
body .page-content > ul,
body .page-content .content-block ul,
body .page-content .content-box ul,
body .page-content .highlight-box ul{
  padding-left:22px;margin:0 0 18px;list-style:disc;
}
body .page-content > ul > li,
body .page-content .content-block li,
body .page-content .content-box li,
body .page-content .highlight-box li{
  font-size:15.5px;line-height:1.95;color:var(--pj-ink-2);margin:0 0 7px;
}
body .page-content .content-block li:last-child,
body .page-content .content-box li:last-child{ margin-bottom:0 }

/* 卡片式底：文字块 / 高亮块 / 内容盒 */
body .page-content .content-block,
body .page-content .content-box,
body .page-content .highlight-box,
body .page-content .vision-box,
body .page-content .case-box,
body .page-content .address-box{
  background:var(--pj-paper);
  border:1px solid var(--pj-line);
  border-radius:var(--pj-r);
  box-shadow:var(--pj-sh-1);
  padding:clamp(22px,2.4vw,34px);
  margin:0 0 24px;
}
body .page-content .highlight-box{
  background:var(--pj-paper-2);
  /* 左侧 4px 红条是刻意的「高亮块」设计语言，不是遗留的粗边框。
     设计检测器（impeccable detect）的 side-tab / border-accent-on-rounded
     会对它报 warning —— 已核实为有意为之，保留（2026-09-29）。 */
  border-left:4px solid var(--pj-red);
}
body .page-content .highlight-box p:last-child,
body .page-content .content-box p:last-child,
body .page-content .content-block p:last-child{ margin-bottom:0 }
body .page-content .content-block h3,
body .page-content .content-box h3{ margin-top:0 }

/* ---------------------------------------------------------------- 6. 卡片 */
/* 统一「白底 + 细边 + 大圆角 + 极轻投影」，替掉旧版各自的重投影 */
body .page-content .card,
body .page-content .cap-card,
body .page-content .biz-card,
body .page-content .service-card,
body .page-content .adv-card,
body .page-content .col-card,
body .page-content .country-card,
body .page-content .feature-card,
body .page-content .feature-item,
body .page-content .stat-item,
body .page-content .article-item,
body .page-content .contact-card,
body .page-content .case-item,
body .page-content .course-item,
body .page-content .adv-item,
body .page-content .client-logo{
  background:var(--pj-paper);
  border:1px solid var(--pj-line);
  border-radius:var(--pj-r);
  box-shadow:var(--pj-sh-1);
}
body .page-content .card:hover,
body .page-content .biz-card:hover,
body .page-content .service-card:hover,
body .page-content .feature-card:hover,
body .page-content .article-item:hover{
  box-shadow:var(--pj-sh-2);
  border-color:var(--pj-line-2);
}
/* 旧的 translateY(-8px) 悬浮偏重，收成轻微位移 */
body .page-content .card,
body .page-content .card:hover{ transform:none }

/* 卡片里的小标题与说明字统一。
   P2-5(2026-09-29)：内页历史遗留把 h4/h5 当「字号档位」用，造成 h2→h4 / h2→h5 标题跳级
   （WCAG 1.3.1）。现改为按语义排层级：章 h2 → 小节 h3 → 卡片标题 h4。
   字号不再由标签级别决定 —— 同一容器下 h3/h4/h5 必须同档，改标签才不改视觉。 */
body .page-content .card-body h3,
body .page-content .card-body h4,
body .page-content .cap-card h3,
body .page-content .cap-card h4,
body .page-content .biz-card h3,
body .page-content .biz-card h4,
body .page-content .service-card h3,
body .page-content .service-card h4,
body .page-content .adv-content h3,
body .page-content .adv-content h4,
body .page-content .country-card h3,
body .page-content .country-card h4,
body .page-content .feature-card h3,
body .page-content .feature-card h4,
body .page-content .feature-item h3,
body .page-content .feature-item h4,
body .page-content .feature-item h5,
body .page-content .case-item h3,
body .page-content .case-item h4,
body .page-content .step h3,
body .page-content .step-item h3,
body .page-content .course-item h3,
body .page-content .adv-item h3{
  font-size:16.5px;font-weight:700;color:var(--pj-ink);line-height:1.45;margin:0 0 8px;
}
body .page-content .card-body p,
body .page-content .cap-card p,
body .page-content .biz-card p,
body .page-content .service-card p,
body .page-content .adv-content p,
body .page-content .country-card p,
body .page-content .feature-card p,
body .page-content .feature-item p,
body .page-content .case-item p{
  font-size:14px;line-height:1.75;color:var(--pj-ink-2);margin:0;
}
body .page-content .card-body{ padding:clamp(18px,1.9vw,26px) }

/* 卡片顶部色块 / 圆形图标：统一到品牌红系 */
body .page-content .card-icon{
  font-size:44px;font-weight:700;height:auto;min-height:132px;
  color:#fff;
  background:var(--pj-red);
  background-image:linear-gradient(135deg,var(--pj-red),var(--pj-red-d));
}
/* 同一组卡片的色块按「红 / 墨绿 / 暖橙」循环 —— 用的就是首页业务卡那套暖色族。
   2026-09-30 VI 转红：第三色原是品牌蓝（--pj-bl → --pj-bl-2），蓝色是老板
   点名要去掉的那个色相，顶替成暖橙（--pj-am → --pj-am-2）。
   ⚠️ --pj-bl / --pj-bl-2 / --pj-bl-t 三个令牌保留但已无引用，留给日后需要时用。 */
body .page-content .card:nth-child(3n+2) .card-icon{
  background:var(--pj-gn);
  background-image:linear-gradient(135deg,var(--pj-gn),var(--pj-gn-2));
}
body .page-content .card:nth-child(3n+3) .card-icon{
  background:var(--pj-am);
  background-image:linear-gradient(135deg,var(--pj-am),var(--pj-am-2));
}
body .page-content .feature-icon,
body .page-content .adv-icon{
  background:var(--pj-red-t);
  color:var(--pj-red);
  box-shadow:none;
  font-weight:800;
}
body .page-content .feature-item .icon{
  width:52px;height:52px;margin:0 auto 12px;
  border-radius:var(--pj-r-s);
  background:var(--pj-red-t);color:var(--pj-red);
  display:flex;align-items:center;justify-content:center;
  font-size:22px;font-weight:800;line-height:1;
}
body .page-content .cl-more,
body .page-content .more-link{ color:var(--pj-red) }

/* 联系方式区块（联系我们 / 游而思研学）—— 两页共用同一套排版。
   ⚠️ 为什么单独写这一节：上面那组「卡片底」只给了 .contact-card
   白底 / 细边 / 圆角 / 投影，卡里的 padding 与 label·value 字号历来是
   各页内联 <style> 自带的 —— 游而思页并轨后没有这层，卡里就既没内边距、
   字也退回浏览器默认大小（12px 白字）。这里收成唯一出处，两页自动一致。
   小屏（≤768）另有 responsive.css 里带 !important 的一套压字号/内边距。 */
body .page-content .contact-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(16px,1.8vw,26px);
  margin:0 0 clamp(20px,2.4vw,34px);
}
body .page-content .contact-card{
  padding:clamp(24px,2.6vw,34px) 20px;
  text-align:center;
  /* 卡片右上角的复制按钮 .copy-ico 是绝对定位，依赖这一条当定位上下文。 */
  position:relative;
}
/* 可点击的联系卡（邮箱）：critique 指出联系页 4 张卡全是纯文本、一个能点的联系方式都没有。
   2026-09-30 只把两张邮箱卡改成 <a mailto:> —— 电话那两张按用户口径「不用拨号、号码不要动」
   保持纯文本。这里把 <a> 的默认下划线/配色归零，让两种卡外观完全一致；
   hover/focus 才给出「这张能点」的差别。
   ⚠️ 不要用 display:flex/block 之外的值，卡内是 label + value 两个块级 div。 */
body .page-content a.contact-card{
  display:block;
  color:inherit;text-decoration:none;
  transition:border-color .18s,box-shadow .18s,transform .18s;
}
body .page-content a.contact-card:hover{
  border-color:var(--pj-line-2);box-shadow:var(--pj-sh-2);
}
/* 按下反馈（2026-09-30 /polish 补） */
body .page-content a.contact-card:active{ transform:translateY(1px) }
body .page-content a.contact-card:focus-visible{
  outline:2px solid var(--pj-red);outline-offset:2px;
}
body .page-content .contact-card .label{
  font-size:14px;font-weight:400;line-height:1.5;
  color:var(--pj-ink-3);margin:0 0 8px;
}
body .page-content .contact-card .value{
  font-size:clamp(17px,1.5vw,20px);font-weight:700;line-height:1.4;
  color:var(--pj-ink);word-break:break-word;
}
/* 卡与地址块同宽：卡里只有一行电话/邮箱，两列铺满 1280 会拉成两张空长条；
   地址块再单独铺满就会与卡片的右缘对不齐。统一收在 820px
   （≈ 纯文字页 .narrow 的 900 减去左右各 40 留白），于是不论承载页是
   「阅读栏宽」（联系我们）还是「满宽」（游而思），这一节都是同一个尺寸。
   故意不居中 —— 与上方 h2 左对齐才顺。 */
body .page-content .contact-grid,
body .page-content .address-box{ max-width:820px }

/* 地址块统一居中 + 统一字色。
   ⚠️ color 必须显式写：about/contact.php 的内联 .address-box 带了 color:#444，
      而 sub.v2.css 原来只管背景/边框/内边距 → 那个 #444 会漏出来，
      与游而思页（继承 --pj-ink-2）不一致。这里定住，两页同色。 */
body .page-content .address-box{ text-align:center;color:var(--pj-ink-2) }

/* 卡片右上角的复制按钮（2026-09-30 用户口径第二次变更）。
   前一版是卡内居中的「一键复制」文字按钮；用户明确「**不需要写一键复制，直接卡片右上角放
   复制按钮**」，且电话 / 微信 / 国内邮箱 / 海外邮箱**四张卡都要**，于是改成图标-only 的
   角标按钮：常态低调（灰图标 + 浅底 + 细边），hover/focus 才转红，复制成功切对勾 + 墨绿底。
   ⚠️ 按钮是卡片的**第一个子节点**且绝对定位，与居中的 label/value 是错开的 ——
      按钮占卡片顶部 12~46px、贴右缘；label 虽同在高位，但水平居中且只有 2~4 字
      （≤768 时字号 13px），实测两者矩形不相交。若日后把 label 加长到 8 字以上，
      或把卡片右内边距压到 12px 以下，需回头复测重叠。
   ⚠️ 依赖 `.contact-card{position:relative}`（见上面那条规则）。
   ⚠️ 按钮里**没有文字节点**：可读名走 aria-label，由 copy-mail.js 按 <html lang> 维护 ——
      i18n_v5.js 不管 aria-*，而往 body 写文本又会被它的 MutationObserver 还原，
      所以这里一个文本节点都不放。 */
body .page-content .contact-card .value a,
body .page-content a.value{ color:inherit;text-decoration:none;transition:color .16s }
/* ⚠️ 必须显式 display:block。
   本项目 sub.v2.css 第 88 行有条 `body .label{display:inline}`（当年为复原 Bootstrap
   基础层的撞名样式而留），所以联系卡里的 .label 是**行内**的 —— 原先靠 `.value` 是
   块级 <div> 撑着才自然分行。把地址换成 <a>（行内）后，label/value 会挤成一行
   （海外邮箱卡因为超长换行反而看不出问题，国内邮箱卡立刻露馅）。
   钉成块级即恢复原几何：label 一行 → 地址一行。 */
body .page-content .contact-card a.value{ display:block }
body .page-content a.value:hover{ color:var(--pj-red-d) }
body .page-content a.value:focus-visible{
  outline:2px solid var(--pj-red);outline-offset:3px;border-radius:3px;
}
body .page-content .copy-ico{
  position:absolute;top:12px;right:12px;
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;padding:0;margin:0;
  color:var(--pj-ink-3);background:var(--pj-paper-2);
  border:1px solid var(--pj-line-2);border-radius:var(--pj-r-s);
  cursor:pointer;-webkit-appearance:none;appearance:none;
  transition:color .18s,background .18s,border-color .18s,transform .18s;
}
body .page-content .copy-ico:hover{
  color:var(--pj-red-d);background:var(--pj-paper);border-color:var(--pj-red);
}
/* 按下反馈（2026-09-30 /polish 补） */
body .page-content .copy-ico:active{ transform:translateY(1px) }
body .page-content .copy-ico:focus-visible{
  outline:2px solid var(--pj-red);outline-offset:2px;
}
body .page-content .copy-ico .ci{
  width:16px;height:16px;flex:none;fill:none;stroke:currentColor;
  stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
}
body .page-content .copy-ico .ci-ok{ display:none }
/* 复制成功：整颗按钮切墨绿（站点三色里的「已完成」语义）。只切类，名字由 aria-label 管。 */
body .page-content .copy-ico.is-done{
  color:#fff;background:var(--pj-gn);border-color:var(--pj-gn);
}
body .page-content .copy-ico.is-done .ci-copy{ display:none }
body .page-content .copy-ico.is-done .ci-ok{ display:block }
/* 复制失败：只变红边框，图标仍是复制图标（不冒充已成功）。 */
body .page-content .copy-ico.is-fail{
  color:var(--pj-red-d);border-color:var(--pj-red);
}

/* 视觉隐藏、保留给读屏。本站此前没有这类工具类（.hd-skip 是「聚焦才现身」的跳转链接，
   语义不同），复制结果需要一个 role=status 的播报点，顺手把这枚通用件补上。 */
body .pj-sr{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}

/* ---------------------------------------------------------------- 7. 数字与标签 */
body .page-content .stats-row{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:clamp(12px,1.4vw,22px);
  margin:0 0 clamp(30px,3.4vw,48px);
}
body .page-content .stat-item{
  padding:clamp(18px,2vw,28px) 16px;
  text-align:center;
}
body .page-content .stat-item .num,
body .page-content .biz-card .num,
body .page-content .step .num,
body .page-content .step-item .num{
  font-family:var(--pj-ff);
  font-size:clamp(24px,2.6vw,34px);
  font-weight:800;
  color:var(--pj-red);
  line-height:1.15;
  letter-spacing:-.5px;
  margin:0 0 6px;
  width:auto;height:auto;border-radius:0;background:none;
}
body .page-content .step .num,
body .page-content .step-item .num{
  width:44px;height:44px;border-radius:50%;
  background:var(--pj-red);color:#fff;
  font-size:18px;
  display:flex;align-items:center;justify-content:center;
  margin:0 auto 14px;
}
body .page-content .stat-item .label{
  font-size:13.5px;font-weight:600;color:var(--pj-ink-3);line-height:1.6;margin:0;
}
body .page-content .case-tag,
body .page-content .article-tag{
  display:inline-block;
  background:var(--pj-red-t);color:var(--pj-red-d);
  border-radius:var(--pj-pill);
  padding:4px 12px;font-size:12.5px;font-weight:700;
  border:0;margin:0 8px 8px 0;
}

/* ---------------------------------------------------------------- 8. 按钮 */
body .page-content .back-btn,
body .page-content .cta-btn{
  display:inline-flex;align-items:center;gap:8px;
  height:46px;padding:0 24px;
  background:var(--pj-red);color:#fff;
  border:0;border-radius:var(--pj-r-pill);
  font-size:15px;font-weight:600;
  text-decoration:none;cursor:pointer;
  box-shadow:none;
  transition:background .18s,transform .18s;
}
body .page-content .back-btn:hover,
body .page-content .cta-btn:hover{ background:var(--pj-red-d);color:#fff }
/* 按下反馈（2026-09-30 /polish 补）：原来 hover 与 active 完全同值（都是 --pj-red-d），
   点下去没有额外信号。1px 下沉与全站其它控件同一套按下语言。 */
body .page-content .back-btn:active,
body .page-content .cta-btn:active{ background:var(--pj-red-d);transform:translateY(1px) }

/* ---------------------------------------------------------------- 9. 表格 */
body .page-content .compare-table{
  width:100%;border-collapse:collapse;
  border:1px solid var(--pj-line);border-radius:var(--pj-r);
  overflow:hidden;margin:0 0 28px;background:var(--pj-paper);
}
body .page-content .compare-table th,
body .page-content .compare-table td{
  padding:13px 16px;text-align:center;
  border:0;border-bottom:1px solid var(--pj-line);
  font-size:14px;color:var(--pj-ink-2);line-height:1.7;
}
body .page-content .compare-table th{
  background:var(--pj-paper-2);color:var(--pj-ink);font-weight:700;
}
body .page-content .compare-table tr:last-child td{ border-bottom:0 }
body .page-content .compare-table .highlight{
  background:var(--pj-red-t);color:var(--pj-red-d);font-weight:700;
}

/* ---------------------------------------------------------------- 10. 步骤条 */
body .page-content .steps{ gap:clamp(12px,1.5vw,20px) }
body .page-content .step p,
body .page-content .case-step p{ font-size:13.5px;color:var(--pj-ink-3) }
body .page-content .case-arrow{ color:var(--pj-line-2) }

/* ---------------------------------------------------------------- 11. 选项卡 */
body .page-content .lang-tabs{
  display:flex;justify-content:center;gap:8px;
  border-bottom:1px solid var(--pj-line);
  margin:0 0 34px;padding:0;
}
body .page-content .lang-tab{
  padding:12px 26px;margin:0;
  font-size:16px;font-weight:700;color:var(--pj-ink-3);
  border:0;border-bottom:3px solid transparent;
  border-radius:0;cursor:pointer;background:none;
  transition:color .18s,border-color .18s,transform .18s;
}
body .page-content .lang-tab.active,
body .page-content .lang-tab:hover{
  color:var(--pj-red);border-bottom-color:var(--pj-red);
}
/* 按下反馈（2026-09-30 /polish 补） */
body .page-content .lang-tab:active{ transform:translateY(1px) }
body .page-content .region-tabs{
  display:flex;justify-content:center;gap:10px;
  margin:0 0 26px !important;
}
body .page-content .region-tab{
  height:40px;padding:0 24px;
  background:var(--pj-paper);color:var(--pj-ink-2);
  border:1px solid var(--pj-line-2);border-radius:var(--pj-r-pill);
  font-size:14.5px;font-weight:600;cursor:pointer;
  transition:background .18s,color .18s,border-color .18s,transform .18s;
}
body .page-content .region-tab:hover{ border-color:var(--pj-red);color:var(--pj-red) }
body .page-content .region-tab:active{ transform:translateY(1px) }
body .page-content .region-tab.active{
  background:var(--pj-red);border-color:var(--pj-red);color:#fff;
}
/* 选中项的 hover 本来是**死规则**：这条 (0,3,1) 与上面 :hover 同档，却排在它
   之后 → 选中时 hover 前后一模一样（实测「无 hover 反馈」）。补一档更深的红，
   与 .btn-red:hover / .showline:hover / .ctab 选中态同一套语言。 */
body .page-content .region-tab.active:hover{
  background:var(--pj-red-d);border-color:var(--pj-red-d);
}

/* ---------------------------------------------------------------- 12. 分页 */
body .page-content .list-pagination,
body .page-content .pagination{
  display:flex;justify-content:center;align-items:center;
  gap:6px;margin-top:36px;flex-wrap:wrap;
}
body .page-content .list-pagination a.pg,
body .page-content .pagination a{
  display:inline-block;min-width:36px;height:36px;line-height:34px;
  padding:0 11px;text-align:center;
  background:var(--pj-paper);color:var(--pj-ink-2);
  border:1px solid var(--pj-line-2);border-radius:var(--pj-r-s);
  font-size:14px;text-decoration:none;transition:all .16s;
}
body .page-content .list-pagination a.pg:hover,
body .page-content .pagination a:hover{ border-color:var(--pj-red);color:var(--pj-red) }
/* 按下反馈（2026-09-30 /polish 补）。排除 .current（当前页，点了也只是刷新）
   与 .disabled（本来 pointer-events:none，这里写明是为了意图清楚）。
   transition 已是 all .16s，transform 已在覆盖范围内。 */
body .page-content .list-pagination a.pg:not(.current):not(.disabled):active,
body .page-content .pagination a:not(.active):active{ transform:translateY(1px) }
body .page-content .list-pagination a.pg.current,
body .page-content .pagination a.active{
  background:var(--pj-red);border-color:var(--pj-red);color:#fff;font-weight:700;
}
body .page-content .list-pagination a.pg.disabled{ opacity:.4;pointer-events:none }
body .page-content .list-pagination .pg-info{ font-size:13px;color:var(--pj-ink-3);margin-left:8px }
/* 分页里为了能逐词翻译而加的包裹元素，别让它变成斜体 */
body .page-content .list-pagination .pg-ar{ font-style:normal }

/* ---------------------------------------------------------------- 13. 列表 */
body .page-content .article-list{
  display:grid;grid-template-columns:1fr;   /* 一行一个，不要两栏 */
  gap:16px;
}
/* margin 归零：党建页的 item 自带 margin-bottom:18px，会与 grid 的 gap 叠加成双倍间距 */
body .page-content .article-item{ padding:22px 24px; margin:0 }
/* 列表页卡片标题直接挂在 h1 下 → 语义上是 h2（原来写 h3，1→3 跳级） */
body .page-content .article-item h2,
body .page-content .article-item h3{
  font-size:17px;font-weight:700;color:var(--pj-ink);
  line-height:1.5;margin:0 0 8px;border:0;padding:0;
}
body .page-content .article-date .day,
body .page-content .article-date{
  color:var(--pj-red);font-weight:800;
}
body .page-content .article-date .month-year{ color:var(--pj-ink-3);font-weight:600 }
body .page-content .article-info h2,
body .page-content .article-info h3{ font-size:17px;font-weight:700;color:var(--pj-ink);margin:0 0 8px }
body .page-content .article-info p{ font-size:14px;color:var(--pj-ink-2);margin:0 }
body .page-content .loading,
body .page-content .empty{
  grid-column:1/-1;text-align:center;padding:56px 20px;
  color:var(--pj-ink-3);font-size:14.5px;
}
/* 封面缩略图（2026-09-30 用户口径）：封面字段从「详情页」挪到列表卡。
   详情页已按要求不再显示封面（见 article.php），此后 cover 若还没人消费就等于后台白传 ——
   这里让它成为列表卡右端的缩略图，字段才真正生效。
   ⚠️ 三条约束：
     ① **不写 height**：本文件上面那条 `body .page-content img{max-width:100%;height:auto}`
        （0,2,1）会压掉页内给图写的高度；改走 aspect-ratio —— 在 height:auto 下按比例算高，
        两者不打架。（详情页旧封面「框底露一条灰带」就是这个覆盖造成的。）
     ② 卡片是 [日期块 | 标题] 两段 flex，标题原本没有 flex-grow → 缩略图贴不到右端。
        这里只给列表标题补 flex:1；党建页的标题在 .article-info 里（不是 flex 项），不受影响。
     ③ 模板是「有封面才输出 <img>」，所以没有封面时布局与旧版一致。 */
body .page-content .article-item h2{ flex:1 1 auto;min-width:0 }
body .page-content .article-thumb{
  flex:0 0 auto;margin-left:18px;
  width:clamp(88px,13vw,160px);
  aspect-ratio:16/9;object-fit:cover;
  display:block;border-radius:8px;
  background:var(--pj-paper-3);
}
@media (max-width:768px){
  body .page-content .article-thumb{ width:84px;margin-left:12px;border-radius:6px }
}

/* ---------------------------------------------------------------- 14. 文章详情 */
/* 封面图 2026-09-30 起不在详情页显示（只作列表缩略图，见 article.php），
   原先的 `body .page-content .article-cover{border-radius…}` 已成死规则，删除。 */
body .page-content .article-meta{
  text-align:center;margin:0 0 30px;padding:0 0 24px;
  border-bottom:1px solid var(--pj-line);
}
body .page-content .article-title{
  font-size:clamp(21px,2.2vw,28px);font-weight:800;line-height:1.45;
  color:var(--pj-ink);margin:0 0 12px;
}
body .page-content .article-date{ font-size:13.5px;color:var(--pj-ink-3);font-weight:600 }
body .page-content .article-body{ font-size:16px;line-height:2;color:var(--pj-ink-2) }
body .page-content .article-body p{ margin:0 0 18px;text-align:justify }
/* 文章正文里的元素（2026-09-30 补）。原先正文只定了字号行高与段距 ——
   图片、小标题、引用、列表、表格全靠浏览器默认样式：图片紧贴文字、h2 比正文还大。
   这里是后台「一键排版」产出的落点（admin/edit.php 的 .editor 用同一套值做预览）。
   ⚠️ 必须挂在 .article-body 下：只写 .article-body h2 特异性 (0,2,1) 压不过上面的
   `body .page-content h2`（(0,2,1) 同分但它在前），正文小标题会拿到章标题那档 22–30px。 */
body .page-content .article-body img{
  display:block;margin:24px auto;border-radius:8px;
}
body .page-content .article-body h2{
  font-size:19px;font-weight:700;line-height:1.5;
  color:var(--pj-ink);margin:32px 0 12px;letter-spacing:0;
}
body .page-content .article-body h3{
  font-size:17px;font-weight:700;line-height:1.5;
  color:var(--pj-ink);margin:26px 0 10px;
}
body .page-content .article-body h4{
  font-size:16px;font-weight:700;line-height:1.5;
  color:var(--pj-ink);margin:22px 0 10px;
}
body .page-content .article-body blockquote{
  margin:20px 0;padding:12px 18px;border-left:3px solid var(--pj-red);
  background:var(--pj-paper-3);color:var(--pj-ink-2);
}
body .page-content .article-body ul,
body .page-content .article-body ol{ margin:0 0 18px;padding-left:24px;list-style:disc }
body .page-content .article-body ol{ list-style:decimal }
body .page-content .article-body li{ margin-bottom:8px;font-size:16px;line-height:1.95;color:var(--pj-ink-2) }
body .page-content .article-body table{
  width:100%;border-collapse:collapse;margin:20px 0;font-size:15px;
}
body .page-content .article-body td,
body .page-content .article-body th{
  border:1px solid var(--pj-line);padding:8px 12px;text-align:left;
}
body .page-content .article-body iframe{ display:block;max-width:100%;margin:20px auto;border:0 }
/* 正文视频（2026-10-12 加）。宽高比由容器说了算，里面的播放器铺满 —— 播放器自己
   带不了「自适应」这件属性，它只认盒子给多大。老文章里那批 iframe 把尺寸写死在标签上
   （510×720 的竖版），窄屏下上面的 max-width:100% 只压得住宽度、高度还是 720，
   画面会被拉长；所以这里改成容器定框、播放器绝对定位填满。 */
/* 不设 max-width：正文有多宽就多宽（.article-body 自己已经限过宽了）。
   2026-10-12 实测正文可用 836px，硬写 820 会把播放器缩窄 16px、和上下段落对不齐。 */
body .page-content .article-body .pj-video{
  position:relative;width:100%;margin:26px auto;
  background:#000;border-radius:10px;overflow:hidden;aspect-ratio:16/9;
}
/* 竖版短视频（YouTube Shorts、手机拍的）：限宽居中，别铺成一条窄长条 */
body .page-content .article-body .pj-video.is-portrait{ aspect-ratio:3/4;max-width:420px }
body .page-content .article-body .pj-video>iframe,
body .page-content .article-body .pj-video>video{
  position:absolute;top:0;left:0;width:100%;height:100%;margin:0;display:block;border:0;
}
/* 正文里的链接带下划线：颜色不能是唯一的区分手段（WCAG 1.4.1） */
body .page-content .article-body a{ text-decoration:underline }
body .page-content .back-link{
  display:inline-block;margin-top:36px;color:var(--pj-red);
  font-size:15px;font-weight:700;text-decoration:none;
}
body .page-content .back-link:hover{ text-decoration:underline }

/* ---------------------------------------------------------------- 15. CTA 块 */
/* 旧版 CTA 一律用「负左右外边距」顶到容器外（margin:0 -20px / 60px -20px 0），
   新版的左右留白由 --pad 控制，负边距会直接把页面顶出横向滚动，这里一律归零。
   注意两处都要管：education 系列把 .cta 写在 .page-content 里，
   而 peijie/global.php 的 .cta-section 写在 .page-content 外面（是 body 的兄弟），
   只写后代选择器会漏掉后者（实测就是这样多出固定 20px 横向溢出）。 */
body .cta,
body .cta-section,
body .client-section{
  margin:0;
  border-radius:var(--pj-r);
  padding:clamp(36px,4vw,58px) clamp(22px,3vw,40px);
  text-align:center;color:#fff;
  background:var(--pj-band);
  background-image:linear-gradient(118deg,#1A1514 0%,#241D1B 52%,#2F2624 100%);
  border:0;
  box-sizing:border-box;
}
body .client-section{
  background:var(--pj-paper-2);color:var(--pj-ink);
  border:1px solid var(--pj-line);
}
/* 写在 .page-content 外面的那种：按正文容器同宽居中，别再满屏铺开 */
body > .cta,
body > .cta-section,
body > .client-section{
  width:100%;
  max-width:var(--pj-maxw);
  margin:0 auto clamp(40px,4vw,68px);
  padding-left:var(--pad);
  padding-right:var(--pad);
}
body .client-logos{ max-width:100%;padding:0 }
body .cta h3,
body .cta-section h3{
  font-size:clamp(21px,2.2vw,28px);font-weight:800;color:#fff;margin:0 0 12px;
}
body .cta p,
body .cta-section p{
  font-size:15.5px;color:rgba(255,255,255,.7);margin:0 0 22px;
}
/* ⚠️ 2026-09-30：这里原来还有 `body .cta span` / `body .cta-section span` ——
   把 CTA 区块里**所有** span 整片染成红色胶囊按钮。全站 CTA 区块里唯一的 span
   就是「咨询热线：13368228333」，而按用户口径它不跳转、不拨号，长得像按钮却点不动。
   现已改成纯文本信息条（规则见 header.v2.css 的 .hotline-note），这两条选择器
   连带删掉，否则 (0,1,1) 会盖住 (0,1,0) 的 .hotline-note。
   真链接（a）仍保留按钮外观 —— 那些确实是能点的。 */
body .cta a,
body .cta-section a{
  display:inline-flex;align-items:center;justify-content:center;
  height:46px;padding:0 26px;
  background:var(--pj-red);color:#fff;
  border-radius:var(--pj-r-pill);
  font-size:15px;font-weight:600;text-decoration:none;
  border:0;
}
body .cta a:hover,
body .cta-section a:hover{ background:var(--pj-red-d);color:#fff }

/* ---------------------------------------------------------------- 16. 页脚 */
/* 与首页 index.php 的页脚同一套结构与数值，全站首尾一致 */
body #pjft{
  margin-top:0;
  padding:clamp(44px,4.6vw,72px) 0 clamp(22px,2.2vw,30px);
  background:#130F0E;        /* 2026-09-30 VI 转红：原 #0E1418 冷蓝黑 → 暖墨 */
  color:rgba(255,255,255,.72);
  font-family:var(--pj-ff);
}
body #pjft .wrap{
  max-width:var(--pj-maxw);
  margin:0 auto;
  padding:0 var(--pad);
  box-sizing:border-box;
}
body #pjft .ft-in{
  display:grid;
  grid-template-columns:minmax(0,26%) 1fr;
  gap:clamp(24px,3vw,56px);
}
/* 白字镂空版 logo 自带透明底，原先那个「白底 + 圆角 + 内边距」的贴牌框要拆掉
   （2026-09-30 老板要求「logo 镂空、字改成白色」）。
   display:block 是为了消掉 inline img 的基线留白，让 logo 左缘与下方标语严格对齐。 */
body #pjft .ft-brand img{
  display:block;height:44px;width:auto;
}
body #pjft .ft-brand p{
  margin:14px 0 0;font-size:13px;color:rgba(255,255,255,.6);line-height:1.7;
}
body #pjft .ft-nav{
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(18px,2vw,34px);
}
body #pjft .ft-nav > div{ display:flex;flex-direction:column;gap:9px;min-width:0 }
body #pjft .ft-nav b{
  color:#fff;font-size:14px;font-weight:800;margin-bottom:3px;
}
body #pjft .ft-nav a,
body #pjft .ft-nav span{
  font-size:13px;color:rgba(255,255,255,.66);
  line-height:1.6;text-decoration:none;transition:color .16s;
  word-break:break-word;
}
/* 页脚链接的触控高度：13px × 1.6 只有 20.8px，低于 WCAG 2.2 AA 的
   2.5.8 Target Size (Minimum) 下限 24×24（2026-09-29 实测 350×21）。
   补 2px 上下内边距抬到 24.8px；列间距仍由 gap 控制，视觉几乎无变化。 */
body #pjft .ft-nav a{ display:inline-block;padding:2px 0;min-height:24px }
body #pjft .ft-nav a:hover{ color:#fff }
body #pjft .ft-bottom{
  margin-top:clamp(28px,3vw,46px);
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,.10);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  font-size:12px;color:rgba(255,255,255,.5);
}
/* 兜底：页面里若还留着旧 .footer / .other_info 结构，一律隐藏，避免与新版页脚重叠 */
body .footer,
body .foot_nav{ display:none }

/* ---------------------------------------------------------------- 17. 响应式 */
@media screen and (max-width:1280px){
  body .page-content .feature-grid{ grid-template-columns:repeat(3,minmax(0,1fr)) }
  body .page-content .grid-4,
  body .page-content .grid-5{ grid-template-columns:repeat(3,minmax(0,1fr)) }
}
@media screen and (max-width:1024px){
  body .page-content .article-list{ grid-template-columns:1fr }
  body .page-content .stats-row{ grid-template-columns:repeat(2,minmax(0,1fr)) }
}
@media screen and (max-width:900px){
  body .page-content .feature-grid,
  body .page-content .grid-3,
  body .page-content .grid-4,
  body .page-content .grid-5,
  body .page-content .advantage-grid,
  body .page-content .service-grid,
  body .page-content .capability-grid,
  body .page-content .course-grid,
  body .page-content .three-col,
  body .page-content .country-grid,
  body .page-content .biz-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media screen and (max-width:768px){
  body #pjft .ft-in{ grid-template-columns:1fr;gap:30px }
  body #pjft .ft-nav{ grid-template-columns:1fr;gap:24px }
  body #pjft .ft-bottom{ flex-direction:column;gap:8px }

  body .page-banner{ padding:20px 0 22px }
  body .page-banner > div,
  body .page-banner .pb-in{ grid-template-columns:minmax(0,1fr) }
  body .page-banner .pb-crumb{ font-size:11.5px;margin-bottom:8px }
  body .page-banner h1,
  body .page-banner h2{ font-size:22px }
  body .page-banner p{ font-size:13px;margin-top:8px }
  /* 数据条在窄屏收起：同样几个数字在正文里紧接着就能看到，摆两遍只会把首屏拉长 */
  body .page-banner .pb-stats{ display:none }

  /* responsive.css 在 ≤768 有一条带 !important 的「所有标题 16px」规则，
     二级页的章标题用 16px 太碎，这里必须同样带 !important 并提高特异性才能压过。
     2026-09-30 /polish：原写法把 h2 / h3 / h4 / h5 一口气全设成 19px ——
     结果是手机上「章标题 = 小节标题 = 卡片标题」三者完全同级、只剩字重差别
     （390 实测 h2 与 h3 都是 19px，而 banner 里的页标题才 22px）。
     现在按三级还原，并且与桌面端的相对关系一致：
       章标题 20（桌面 30） / 小节标题 18（桌面 19） / 卡片标题 16.5（与桌面同值）
     顶端不再抬高到 24 —— 页面标题（banner h1）在这个断点是 22px，
     正文章标题超过它就会喧宾夺主。 */
  body .page-content h2{ font-size:20px !important }
  body .page-content h3{ font-size:18px !important }
  body .page-content h4,
  body .page-content h5{ font-size:16.5px !important }
  body .page-content .section-title{ font-size:20px !important }
  /* 列表行标题（新闻 / 党建）是「行标题」，不是章标题 —— 上面那条 20px 会命中它，
     这里拉回桌面端的 17px。特异性 (0,2,2) > (0,1,2)，同为 !important 时更高者胜。 */
  body .page-content .article-item h2,
  body .page-content .article-item h3,
  body .page-content .article-info h2,
  body .page-content .article-info h3{ font-size:17px !important }
  body .page-content p{ font-size:15px;line-height:1.85 }

  body .page-content .feature-grid,
  body .page-content .grid-3,
  body .page-content .grid-4,
  body .page-content .grid-5,
  body .page-content .advantage-grid,
  body .page-content .service-grid,
  body .page-content .capability-grid,
  body .page-content .course-grid,
  body .page-content .three-col,
  body .page-content .country-grid,
  body .page-content .biz-grid,
  body .page-content .article-list,
  body .page-content .contact-grid,
  body .page-content .stats-row{
    grid-template-columns:1fr;
  }
  body .page-content .content-block,
  body .page-content .content-box,
  body .page-content .highlight-box,
  body .page-content .vision-box,
  body .page-content .case-box{ padding:20px 18px }

  /* 只清旧结构里内层 div 的 padding。.pb-in 的左右 padding 是 var(--pad)，
     归前面那条管；这里若一并写 padding:0，窄屏标题会贴到屏幕边上。 */
  body .page-banner > div > div{ padding:0;max-width:100% }
}

/* 减动效偏好。审计（P3-6）指出原先的 transition:none!important 是一刀切 ——
   连 hover 的颜色过渡也一起砍掉。改为按属性关：
     · animation:none          —— 关键帧动画全关（位移/缩放类动效的根源）
     · transition-property 只留「不引起前庭不适」的属性（颜色/透明度/阴影），
       于是 transform / width / height / top 这些位移类过渡变成瞬时，
       而按钮 hover 的淡色变化保留下来。 */
@media (prefers-reduced-motion:reduce){
  body #pjft a,
  body .page-content *,
  body #pjft a *{
    animation:none !important;
    transition-property:color,background-color,border-color,outline-color,fill,stroke,opacity,box-shadow,text-decoration-color !important;
    transition-duration:.15s !important;
    transition-timing-function:ease !important;
    transition-delay:0s !important;
  }
}