@charset "UTF-8"; /* ============================================================================ 沛杰集团官网 · 新版头部（home-v2 版式） ---------------------------------------------------------------------------- 用途 把内页的导航栏统一成新版首页（home-v2）那一套： logo 38px + 品牌标语 + 右对齐主导航 + 中/EN 两段式开关 + 汉堡抽屉。 加载 页面 head 里放在所有旧样式表之后（common.css / main.css / responsive.css / bootstrap.min.css），靠后加载才压得住。 ---------------------------------------------------------------------------- 为什么所有规则都以 #pjhd 打头 ---------------------------------------------------------------------------- 内页沿用站点的 .header / .menu / .logo / .search / .mobile-menu-btn 类名， 好让三套现成机制一行不改就能用： site-nav.js 导航从 data/settings.json 渲染（改文案不用动 HTML） mobile.js ≤768 汉堡开合，挂 .mobile-menu-btn 与 .header .menu i18n_v5.js 中英切换，认 .lang-select a[data-lang] 代价是 common.css 与 responsive.css 对 .header 有大量声明（width:1200px、 height:70px、.logo 浮动、.menu ul 的 60px column-gap、li 的 68px 行高…）， 还有 html[lang="ru"] / [lang="my"] / [lang="id"] 这类属性选择器覆盖， 阈值一直抬到 (0,3,3)。 逐条去覆盖既容易漏、又会随着旧样式表改动而失效。改给头部根元素一个 id， 用 (1,0,0) 起跳的选择器，一次性压过全部旧规则，全程不写一个 !important。 （唯一例外是末尾的减动效块，那是全站审计的硬指标，见 §7。） ---------------------------------------------------------------------------- 索引 §1 Token §2 容器 §3 品牌 §4 主导航与下拉 §5 右侧与语言开关 §6 汉堡与移动抽屉 §7 响应式与减动效 ============================================================================ */ /* ============================================================================ §1 Token ---------------------------------------------------------------------------- 全部带 hd- 前缀：站点里已有 --brand / --ink-900 / --line 等一套变量， 不复用、不改名，避免和旧样式表的取值互相污染。 取值与 home-v2/style.css 的 §1 一致，两处要一起改。 ============================================================================ */ #pjhd{ --hd-ink:#14161A; --hd-ink-2:#454B54; --hd-ink-3:#5F656C; --hd-line:#E9EBEE; --hd-line-2:#D8DCE1; /* 品牌红三档**不在这里**：横切规则（§4 末尾的全局键盘焦点环）要在正文区用， 而自定义属性只在声明它的子树里可见 —— 详见下方 :root 的说明。 */ --hd-maxw:1360px; /* 左右内边距优先跟随页面自己的 --pad（首页 = home-v2/style.css 的 40px / ≤768 的 32px）， 这样 logo 与正文内容的左右边缘严格对齐；页面没有 --pad 时（如 about/news.php） 回退到 clamp()。站点现有样式表里没有任何一处定义 --pad，不会误接。 */ --hd-pad:var(--pad,clamp(20px,4vw,40px)); --hd-r:8px; --hd-sans:"IBM Plex Sans SC","IBM Plex Sans","PingFang SC","Microsoft YaHei", "Hiragino Sans GB",system-ui,sans-serif; --hd-fn:"IBM Plex Sans","Helvetica Neue",Arial,sans-serif; } /* z-index 语义层级：全站的唯一来源，任何地方都不许再写裸数字。 必须挂在 :root 上 —— 遮罩(.mobile-overlay)、灯箱、视频弹窗都是 #pjhd 的 兄弟节点或更外层，挂在 #pjhd 上它们的 var() 会解析失败、z-index 退回 auto。 全局 5 档（base < dropdown < header < overlay/modal < toast）+ 负层 + 局部步进： · 全局档跨容器比大小，决定整页层叠； · --z-base / --z-raised / --z-top 只在同一个容器内部比较，用于把内容 压在同容器的照片/装饰之上，不参与全局排序（同值不同层时才靠 DOM 顺序）。 */ :root{ /* 品牌红三档必须挂在 :root 上 —— 与下面的 z-index 同理，而且是实测踩出来的： §4 末尾那条「全局键盘焦点环」要作用于正文区的 a / button / input…， 它们都在 #pjhd 之外。自定义属性只在声明它的子树内可见，挂 #pjhd 的话 正文里 var(--hd-red) 解析失败，而 CSS 规范对「computed-value 阶段失效」的 处理是**整条简写回落到初始值**（outline-style:none）—— 焦点环不是退回浏览器默认环，而是彻底消失，比不写这条规则更糟。 实测指纹（/index.html 的 a.btn / a.mcard / button.ctab）： ost=none、ow=3px(medium)、oc=currentColor，三个值全等于 initial。 */ --hd-red:#E11D25; --hd-red-d:#C1121A; --hd-red-t:rgba(225,29,37,.07); --z-under:-1; /* 负层：装饰，压在自身容器的背景之下 */ --z-base:1; /* 局部基准层：内容压在同容器照片/装饰之上 */ --z-raised:2; /* 局部上浮一层 */ --z-top:3; /* 局部上浮两层 */ --z-overlay:990; /* 遮罩：抽屉/弹窗背后那层薄纱 */ --z-header:1000; /* 站点头部（sticky）与其内部按钮 */ --z-dropdown:1010; /* 头部下拉面板 */ --z-modal:1100; /* 浮层：图片灯箱等覆盖整屏的面板 */ --z-toast:1110; /* 最高层：视频弹窗与全局提示 */ } /* ============================================================================ §2 容器 ---------------------------------------------------------------------------- 清掉 common.css 给 .header 定死的 width:1200px / height:70px / margin:1px auto， 以及那条用伪元素向左右延伸的白色背景（::before）——新版头部自己是通栏的， 再留伪元素会多出一层偏移的白块。 ============================================================================ */ #pjhd{ width:auto;height:auto;margin:0;padding:0; position:sticky;top:0; z-index:var(--z-header); /* 高于遮罩(--z-overlay)，汉堡才不会被遮罩盖住 */ background:rgba(255,255,255,.94); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border-bottom:1px solid var(--hd-line); overflow:visible; /* 压掉 responsive.css 在 ≤768 写的 overflow-x:clip */ box-sizing:border-box; font-family:var(--hd-sans); text-align:left; } #pjhd::before{content:none;display:none} #pjhd *,#pjhd *::before,#pjhd *::after{box-sizing:border-box} #pjhd .header-in{ max-width:var(--hd-maxw);margin:0 auto;padding:0 var(--hd-pad); /* 右侧内边距单独收窄（左 40px 不动，保持与正文 .wrap 的左缘对齐）： 宽屏下容器居中后右边留白很大（1920 时地球图标＋中/EN 距屏幕边 320px）， 用户要求「语言按钮再往右移一些」—— 收窄后整组右移 16~24px。 顺带把腾出的宽度让给 .menu，英文模式末项与地球图标之间的间隙一起变大 （1920 实测 10px → 50px，用户报的「挨着了」）。 */ padding-right:clamp(16px,1.4vw,24px); height:72px;display:flex;align-items:center;gap:clamp(16px,1.6vw,26px); } /* 跳过链接：键盘用户第一个 Tab 就能跳过整条导航 */ #pjhd .hd-skip{ position:absolute;left:-9999px;top:0;z-index:var(--z-base); padding:10px 16px;background:var(--hd-ink);color:#fff;font-size:14px;border-radius:0 0 6px 0; } #pjhd .hd-skip:focus{left:0} /* 焦点环显式给品牌红：内页会拿到 bootstrap 的 auto 5px、首页拿到 UA 的 auto 1px， 两页不一，而且颜色随系统走。这里统一。 */ #pjhd .hd-skip:focus-visible{outline:2px solid var(--hd-red);outline-offset:-2px} /* 联系 CTA（2026-09-30 critique 启发式 #6） critique 指出：「联系我们」只在页脚，政企访客读完说服内容想联系时， 导航里没有一个可发现入口。做成右上角一枚红药丸，放在 .menu 与 .search 之间 —— 它是 flex 兄弟而不是第 7 个导航项，所以 ① 用户按「间距再大一些」调好的 6 项等间距（gap 16~38px）完全不受影响； ② 切语言时导航左缘对齐也不受影响（.menu 是 flex:1，本按钮定宽 flex:none）。 余量实测（末项右缘 → 本按钮左缘）：1440 中文 284 → 约 158px、1920 英文 169 → 约 43px。 改宽度前先跑 _tmp_nav_measure.py，别让英文模式在 1920 顶到。 */ #pjhd .hd-cta{ flex:none; /* 与导航末项拉开距离：.menu 是 flex:1 且 justify-content:flex-start， 导航项从左边起排、位置不受影响，缩掉的只是 .menu 右侧的空白， 于是这段 margin 直接变成「末项 ↔ CTA」的净间距。 不加它时 1920 英文只有 12px，夹在 38px 的导航节奏里显得挤。 */ margin-left:clamp(6px,0.9vw,18px); padding:8px 16px; font-size:13.5px;font-weight:700;line-height:1; color:#fff;background:var(--hd-red); border-radius:999px;text-decoration:none;white-space:nowrap; /* transform 也进过渡：:active 的「按下 1px」要跟 hover 的换色同一节奏 */ transition:background .18s,transform .18s; } #pjhd .hd-cta:hover{background:var(--hd-red-d)} /* 按下反馈。此前 hover 与 active 完全相同（都是 --hd-red-d），按下去没有任何 额外信号；这里用 1px 下沉表示「按到了」，与全站 .btn / .copy-ico / .pg 一致。 */ #pjhd .hd-cta:active{background:var(--hd-red-d);transform:translateY(1px)} #pjhd .hd-cta:focus-visible{outline:2px solid var(--hd-red);outline-offset:2px} @media (max-width:1120px){ #pjhd .hd-cta{padding:7px 13px;font-size:12.5px} } @media (max-width:768px){ #pjhd .hd-cta{padding:7px 11px;font-size:12px} } /* ============================================================================ §3 品牌 ---------------------------------------------------------------------------- logo 38px（旧头部 47px 的位图，缩一档才和 72px 的条高相称）。 标语在 ≤1280 与英文模式下隐藏 —— 与 home-v2 一致：窄屏先把标语让出去， 给导航腾位置；英文模式下 nav 文案本来就长，且标语自带英文行，留着是重复。 ============================================================================ */ #pjhd .logo{ flex:none;float:none;width:auto;min-width:0;padding:0;margin:0; position:static;line-height:0; } /* color:inherit —— 收口全站最后两处非令牌色（$0 #333）。 common.css:48 有条全局 `a{color:#333}`，logo 的 会继承它（里面是 ， 颜色本不显形，但审计按计算值抓得到）。本站铁律：不改旧表，一律用 #pjhd 前置覆盖。 */ #pjhd .logo a{display:block;line-height:0;color:inherit} #pjhd .logo img{ display:block;height:38px;width:auto;max-width:none; vertical-align:middle; } #pjhd .hd-tag{ /* 固定宽度 —— 这是「切语言时导航左缘不跳」的根：标语块占位中英完全相同， 后面的导航就永远从同一个 x 起排。右侧自然随文字长短变宽，不管。 260px 的来历（1440/1366 实测，box-sizing:border-box，含 14.4px padding + 1px 边线， 可用内容宽 244.6px）： · 中文行 181px → 单行放得下 · 中文模式里那行 7.5px 英文小字 237~238px → 单行放得下（留 6px 余量） · 英文模式 10px 主行单行要 299px → 在这里正好折成两排（用户要的效果） ⚠️ 不能比 254px 更窄：252px 那版把中文模式的小字挤折成两行（差 1.4px）。 改这个值前先量 `#pjhd .hd-tag` 与导航首项左缘，别凭眼睛。 white-space 必须是 normal：nowrap 会被 em 继承，英文就折不起来了。 */ flex:none;display:flex;flex-direction:column;white-space:normal; width:260px;margin-right:16px; font-size:12px;font-weight:700;line-height:1.35;letter-spacing:.2px; color:var(--hd-ink); padding-left:clamp(10px,1vw,16px); border-left:1px solid var(--hd-line-2); } #pjhd .hd-tag em{ font-style:normal;font-family:var(--hd-fn); font-size:7.5px;font-weight:600;letter-spacing:.3px;color:var(--hd-ink-3); } /* 英文标语的两行断点由这两个 span 定死 —— 用户指定第一行到「TECHNOLOGY ·」为止。 中文模式下它们是 inline，拼回整行 7.5px 小字；英文模式下转 block，各占一行。 ⚠️ 不能改用
：中文模式那行小字必须保持单行，
会把它一起断开， 而 .hd-tag 又只有 260px 宽，断了两行会顶高整条头部。 */ #pjhd .hd-tag em .tg-l1, #pjhd .hd-tag em .tg-l2{display:inline} html[lang="en"] #pjhd .hd-tag em .tg-l1, html[lang="en"] #pjhd .hd-tag em .tg-l2{display:block} /* 英文模式：中文标语是「裸文本节点」，没有元素可以隐藏，所以用 font-size:0 把它压掉， 再让 里的英文标语升为主行。 （这里原来写的是 display:none，导致切到英文后 logo 右侧整块空白 —— 2026-09-28 用户报的 bug。） 别改回 display:none；窄屏隐藏标语的是 §7 @media 里另外那两条。 英文标语单行要 299px，靠上面 .hd-tag 的固定宽度 252px 折成两排显示 （2026-09-28 用户指定：占位固定、导航左缘不位移，允许右边变宽）。 ⚠️ 这里**不再**单独调英文导航的 gap —— 用户要求中英两种模式项间距一致， 所以导航间距统一由 §4 `#pjhd .menu > ul` 的 gap 决定，两版同值。 */ html[lang="en"] #pjhd .hd-tag{font-size:0} html[lang="en"] #pjhd .hd-tag em{ font-size:10px;font-weight:700;letter-spacing:.25px;color:var(--hd-ink); line-height:1.4; } /* ============================================================================ §4 主导航与下拉 ---------------------------------------------------------------------------- 纵向用 align-self:stretch + a 撑满，当前项的红短线才能精确落在头部下缘， 不必写死 padding（旧头部是靠 li 的 line-height:68px 凑高度）。 ============================================================================ */ #pjhd .menu{ flex:1;min-width:0;width:auto;float:none;position:static;top:auto;margin:0; align-self:stretch;display:flex;align-items:center; /* 原 justify-content:flex-end 把导航推到最右贴住搜索区，标语和第一项之间 空出 224px（1440 实测，2026-09-28 用户反馈「中间那么大的空隙」）。 改为紧跟标语起排，剩余空间自然留给右侧搜索区。 */ justify-content:flex-start;padding-left:clamp(24px,2.5vw,40px); z-index:auto; } #pjhd .menu > ul{ display:flex;flex-wrap:nowrap;align-items:stretch;height:100%; justify-content:flex-start; /* 间距：2026-09-30 用户要求「间隔再大一些」——此时顶层已是 6 项 （党建并入集团动态、研学平台并入各平台入口），宽屏余量充足， 上限从 22px 放到 38px（1440 实测 34.6px）。中英两版共用这一个值 —— 用户要求两种语言下标签间隔一致。 ⚠️ 上限仍受「英文模式末项 vs 地球图标」约束（EN 标签更长），改大后 必须在 1920 / 1600 / 1440 / 1360 四档英文模式实测余量（用 _tmp_nav_measure.py）。 */ gap:clamp(16px,2.4vw,38px); column-gap:clamp(16px,2.4vw,38px); /* 压掉旧样式的 column-gap:60px */ margin:0;padding:0;list-style:none;font-size:15px; } /* flex:0 0 auto 是必须的。 responsive.css 的 @media (min-width:769px) 块里给这一项写过 flex:1 —— 旧头部 的意图是「各项等宽、文字居中」，靠等宽把间距撑匀。新版是内容宽 + 统一 gap， 两者不能混：留着 flex:1，每项会被拉成 48.9px 的等宽盒子，而里头的 a 不跟着长， 于是「文字宽 32 的首页」和「文字宽 62 的集团动态」之间只剩 8px，视觉上间距 一会儿宽一会儿窄。我这条规则只改了 text-align 没改 flex，才会露出来。 */ #pjhd .menu > ul > li{ display:flex;align-items:stretch;position:relative; flex:0 0 auto; /* 压掉 responsive.css 的 flex:1 */ float:none;min-width:0;width:auto;margin:0;padding:0;border:0; text-align:left;line-height:normal;font-size:15px;font-weight:600; background:none; } #pjhd .menu > ul > li > a{ display:flex;align-items:center;position:relative; padding:0 1px;margin:0; font-size:15px;font-weight:600;line-height:1.4; color:var(--hd-ink);white-space:nowrap;text-decoration:none; border:0;border-bottom:0; transition:color .16s; } #pjhd .menu > ul > li > a:hover{color:var(--hd-red)} /* 按下反馈（2026-09-30 /polish 补）：原来 hover 与 active 都没有区别， 点下去全靠浏览器自己的跳转来「回应」。 */ #pjhd .menu > ul > li > a:active{color:var(--hd-red-d)} #pjhd .menu > ul > li > a.showline{color:var(--hd-red);border-bottom:0} /* 当前栏目本身已经是品牌红，上面那条 :hover 对它就等于没写 —— 实测 hover 前后 color 一模一样（.showline 的基色 = hover 目标色）。 它仍然是一个可点的链接，补一档更深的红作为 hover / active。 */ #pjhd .menu > ul > li > a.showline:hover, #pjhd .menu > ul > li > a.showline:active{color:var(--hd-red-d)} #pjhd .menu > ul > li > a.showline::after{ content:"";position:absolute;left:0;right:0;bottom:0; height:2px;border-radius:2px;background:var(--hd-red); } /* 带子项的一级项不画小箭头：与 home-v2 一致。旧样式表给 .dropdown-toggle 挂过 ::after 三角，这里显式清掉。 */ #pjhd .menu > ul > li > a.dropdown-toggle::after{content:none;display:none} /* ---------- 全局键盘焦点环（2026-09-30 /polish 收口） ---------- common.css 第 20-29 行已经把「鼠标触发的焦点」的 outline 清掉、只保留键盘的 :focus-visible，并在注释里写明「再由各组件（header.v2.css 的 #pjhd 规则等） 按自己的品牌色加强」。但那条承诺此前**只在 #pjhd 头部落地** —— 正文区一律 落回浏览器默认环。1440 逐实例实测（不是抽样）： 品牌红 2px solid × 62 个实例 —— 全部在头部，加上 .ctab / .copy-ico 浏览器默认 auto 1px #101010 × 26 个实例 —— .btn 系列(6) / .pg 分页(5) / .mcard(5) / .wfcard(3) / button.arrow / .region-tab / .wf-more / .btn-ghost 同一站点两套焦点语言：键盘用户从头部 Tab 进正文时，焦点环会「换一套长相」； 而这两套里没有一套来自本站调色板。header.v2.css 是 16 个前台页唯一都加载的 样式表（首页 home-v2 → header.v2；内页 common/main/responsive → header.v2 → sub.v2），所以这条横切规则放这里。 ⚠️ 不写裸 `:focus-visible` —— 那会把 #pjMain（tabindex="-1" 的跳转落点）也环住。 但 `[tabindex="0"]` **必须收**：`#pjCertPanel`（证书墙的 role="tabpanel" 容器） 是**真实 Tab 落点** —— 它里面只有图片、没有可聚焦元素，所以按 ARIA tabs 模式 带 tabindex="0" 让自己可聚焦（见 index.php 的注释）。WCAG 2.4.7 要求任何键盘 焦点都可见，留它一个用浏览器默认黑环，等于「全站一套焦点语言」漏了一处 （实测首页 Tab 走查 8 个落点里就这一个 `ost:auto 1px rgb(16,16,16)`）。 用 `[tabindex="0"]` 精确匹配，tabindex="-1" 的 #pjMain 不受影响；全站 tabindex="0" 的元素实测只有它和证书墙那 4 个 .ctab 页签（后者已被 [role=tab] 覆盖）。 特异性：各条与组件自己的 :focus-visible 同档 (0,2,0) 或更低，靠**源码顺序** （header.v2.css 在 16 页都排在最后）与既有环取得一致；outline 会跟着元素自己的 border-radius 走（Chrome 94+），所以药丸 / 圆角卡不用额外写 border-radius。 */ a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible, [role="button"]:focus-visible, [role="tab"]:focus-visible, [tabindex="0"]:focus-visible{ outline:2px solid var(--hd-red); outline-offset:2px; } /* ---------- 键盘焦点环（2026-09-29 补） ---------- 内页加载了 common.css（第 16 行 a,input,button{outline:none}）与 bootstrap.min.css（.dropdown-toggle:focus{outline:0px}），两条叠起来把导航的 焦点指示整个抹掉了 —— 首页不加载那两个文件所以一直正常，14 个内页则完全看不到 光标停在哪（实测：首页 outline=auto 1px，内页 none 0px）。 这里用 #pjhd 前缀（特异性 (1,2,1) 起）补回来，不需要 !important。 outline-offset 用负值：.menu 与面板都带 overflow 裁剪，外扩的环会被切掉。 */ #pjhd .logo a:focus-visible, #pjhd .menu > ul > li > a:focus-visible, #pjhd .menu .dropdown-menu a:focus-visible, #pjhd .mobile-menu-btn:focus-visible{ outline:2px solid var(--hd-red); outline-offset:-2px; border-radius:4px; } /* ---------- 下拉面板 ---------- display 必须显式写 block：bootstrap.min.css 给 .dropdown-menu 定了 display:none（配 .open>.dropdown-menu{display:block}），不覆盖的话面板 永远不出现。这里改成 opacity/visibility 控显隐，display 恒定 block。 */ #pjhd .menu .dropdown-menu{ position:absolute;left:0;top:100%; float:none;display:block;width:auto;min-width:190px; margin:0;padding:8px; background:#fff;border:1px solid var(--hd-line);border-radius:var(--hd-r); box-shadow:0 18px 40px rgba(12,18,28,.10),0 2px 8px rgba(12,18,28,.05); font-size:14px;text-align:left;list-style:none; /* 英文长子项（如 Service Solutions for Overseas Chinese-funded Enterprises）nowrap 时把面板撑到 ~380px，再按标题文字中心居中， 两边各伸出 140px+，看起来「歪得太远」。限宽让长项折两行， 面板宽回到与中文一致的 190~320 档。 */ max-width:320px; opacity:0;visibility:hidden;z-index:var(--z-dropdown); transform:none; transition:opacity .18s,visibility 0s linear .18s; } /* 入场位移只给内层。外壳一旦带 translateY，收起动画期间整块会向上移， 把鼠标重新纳进命中区，于是「命中→展开→脱离→收起→上移→再命中」自激。 */ #pjhd .menu .dropdown-menu .childNavBox{ float:none;width:auto;padding:0;margin:0; opacity:0;transform:translateY(6px); transition:opacity .2s,transform .2s; } #pjhd .menu .dropdown-menu .childNav01, #pjhd .menu .dropdown-menu .left{ float:none;width:auto;padding:0;margin:0;border:0;display:block; /* background / overflow 必须显式写掉：common.css 给 .childNav01 .left 配了 background:#f9f9f9 + padding 30px 上下（旧下拉是「灰底大留白」那一版）， 不写 background 的话面板里会浮出一块灰，桌面白底上几乎看不出， 移动抽屉的白底上就很明显。 */ background:transparent;overflow:visible; } #pjhd .menu .dropdown-menu .right{display:none} #pjhd .menu .dropdown-menu .left dl{float:none;width:auto;margin:0;padding:0} #pjhd .menu .dropdown-menu .left dt{display:none} #pjhd .menu .dropdown-menu .left dd{ float:none;width:auto;height:auto;margin:0;padding:0; line-height:normal;text-align:left;background:none; border:0;border-left:0; } /* 子项之间的浅线挂在 dd 上而不是 a 上，hover 的底色才不会盖掉它 */ #pjhd .menu .dropdown-menu .left dd + dd{border-top:1px solid var(--hd-line)} #pjhd .menu .dropdown-menu .left dd a{ display:block;padding:12px 14px;border-radius:6px; font-size:14px;line-height:1.5;color:var(--hd-ink-2); white-space:normal;text-align:left;text-decoration:none;border:0; transition:background .16s,color .16s; } #pjhd .menu .dropdown-menu .left dd a:hover{ background:var(--hd-red-t);color:var(--hd-red); } /* 子项文字居中：沿用旧站 common.css 的 `.childNav01 .left dl dd{text-align:center}`。 2026-09-28 用户反馈「导航栏文字没有居中」——我统一头部时按现代菜单的习惯 改成了 left，但那不是原样，用户要的是照旧。 只作用于桌面：下拉在桌面是悬浮卡片，文字居中才像菜单；移动端（§7 ≤768） 把面板铺成静态全展开列表，靠 14px 缩进表达层级，必须保持左对齐， 所以这里用媒体查询划开，别改成无条件规则。 */ @media (min-width:769px){ #pjhd .menu .dropdown-menu .left dd, #pjhd .menu .dropdown-menu .left dd a{text-align:center} } /* 展开态：.open 桌面与移动通用（移动端 mobile.js 切，桌面端 Bootstrap 点击切）； hover / focus 只在桌面启用，两套状态不混。 transition-delay 归零是为了「展开即时、收起才等 .18s 再隐藏」—— 收盘留一点时间，鼠标斜着滑向面板时才不会半路断掉。 */ #pjhd .menu .dropdown-menu.open, #pjhd .menu > ul > li.open > .dropdown-menu{ opacity:1;visibility:visible;transition-delay:0s; } #pjhd .menu .dropdown-menu.open .childNavBox, #pjhd .menu > ul > li.open > .dropdown-menu .childNavBox{opacity:1;transform:none} @media (min-width:769px){ #pjhd .menu > ul > li:hover > .dropdown-menu, #pjhd .menu > ul > li:focus-within > .dropdown-menu{ opacity:1;visibility:visible;transition-delay:0s; } #pjhd .menu > ul > li:hover > .dropdown-menu .childNavBox, #pjhd .menu > ul > li:focus-within > .dropdown-menu .childNavBox{ opacity:1;transform:none; } } /* ============================================================================ §5 右侧与语言开关 ---------------------------------------------------------------------------- 语言开关 = 中 / EN 两段式，不做下拉栏。 .lang-select 与 a[data-lang] 是 i18n_v5.js 认的钩子（点击即 setLang + apply）， 所以直接复用这两个名字；当前语言的高亮不交给脚本切类，用 html[lang] 选， 少一处需要同步的状态。 页面上原来那个 .lang-curr（弹五语浮层的入口）已随旧头部一并删除 —— 留着的话 i18n_v5.js 会走浮层分支，和这里的直接切换打架。 ============================================================================ */ #pjhd .search{ flex:none;position:static;float:none;display:flex;align-items:center; width:auto;margin:0;padding:0;right:auto;top:auto;background:none; } /* 地球图标：原站头部在语言控件前有一个内联 SVG 地球 （common.css 的 .header .search .icon 给过 width/height:2em + fill:currentColor）。 换头部时整个漏掉了，2026-09-28 按原样补回；尺寸与颜色改由这里定， 不让它跟着 2em 随字号漂。 */ #pjhd .search .icon{ flex:none;width:18px;height:18px;margin-right:7px; fill:var(--hd-ink-3); } /* 这条必须带 !important —— 全文件仅有的两处之一（另一处是末尾的减动效块）。 common.css 第 230 行给 .header .search .lang-select 写过 display:none !important（旧头部把语言控件改成了点击切换，顺手把这个下拉藏掉）。 !important 声明压不过普通声明，无论选择器多具体，所以只能同样用 !important 顶掉。 想避免它，也可以把这个开关挪到 .search 之外（那条选择器就命中不到）， 但那样会偏离站点既有的头部结构，不值得。 */ #pjhd .search .lang-seg.lang-select{display:flex!important} #pjhd .lang-seg{ /* 旧样式表把 .lang-select 写成了 position:absolute + width:80px + padding:0 20px + box-sizing:content-box（给五语浮层当定位锚用的）。不逐条还原的话，开关会脱 出文档流，.search 塌成 0 宽、头部长出一条横向溢出。 */ position:static;width:auto;min-width:0;z-index:auto; display:flex;align-items:center;gap:0; padding:0;margin:0;background:none;box-shadow:none; border:0;border-radius:0;list-style:none;text-align:left; font-size:14px;font-weight:700;line-height:1; } /* 语言开关的一项。2026-09-29 由 改成