/* ============================================================================
   智海国际 · 业务集群页样式（pages.css）
   用途：/cross-border/ /hk/ /cn/ /ecom/ /sg/ /ru/ /locations/ /answers/ 全部集群页
   生成：2026-09-20　基于效果图 mock.css 生产化（剥离屏幕框/标注等展示外壳）

   设计规范（去 AI 味，与全站令牌同源）：
     主色 var(--primary) #0a2d5e｜圆角 4px｜无阴影（1px 细边框）
     渐变仅 Hero｜区块标题左对齐 + 下边框｜表格 + 编号列表 + 线性列表
     禁用 emoji（图标走 /css/icons-deai.css 线性 SVG）
   自包含：本文件不依赖 style.css，集群页只需引 pages.css + icons-deai.css
   ============================================================================ */

/* ===== 0. 令牌与基础 ===== */
:root{
  --primary:#0a2d5e;
  --primary-light:#1a4d8c;
  --primary-lighter:#2a6dbf;
  --accent:#c89b3c;
  --ink:#1f2937;
  --body:#4b5563;
  --muted:#6b7280;
  --faint:#8a94a0;
  --line:#dde3ea;
  --line-2:#edf1f5;
  --bg-soft:#f7f9fb;
  --radius:4px;
  --radius-sm:3px;
  --cw:1200px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:#fff;color:var(--ink);
  font:15px/1.7 "PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,-apple-system,BlinkMacSystemFont,sans-serif;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--primary-light);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}
b,strong{font-weight:600;color:var(--ink)}
.cw{max-width:var(--cw);margin:0 auto;padding:0 22px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
:focus-visible{outline:2px solid var(--primary-lighter);outline-offset:2px}

/* ===== 1. 工具条（34px） ===== */
.g-bar{background:var(--bg-soft);border-bottom:1px solid var(--line);height:34px;display:flex;align-items:center;gap:14px;padding:0 22px;font-size:11.5px;color:var(--muted)}
.g-bar .lb{color:var(--faint);white-space:nowrap}
.g-bar .city{display:flex;gap:10px;flex-wrap:wrap;min-width:0}
.g-bar .city a{color:var(--body);text-decoration:none;white-space:nowrap}
.g-bar .city a:hover{color:var(--primary)}
.g-bar .sp{flex:1}
.g-bar .rgt{display:flex;align-items:center;gap:12px;white-space:nowrap}
.g-bar .rgt a{color:var(--body);text-decoration:none}
.g-bar .rgt a:hover{color:var(--primary)}
.g-bar .lang{border:1px solid #c3cdd8;border-radius:var(--radius-sm);padding:1px 7px;color:var(--primary-light);font-weight:600}
.g-bar .lang.off{color:var(--faint);border-color:#dbe2e9;cursor:default}

/* ===== 2. 主导航（64px，sticky） ===== */
.g-main{background:#fff;border-bottom:1px solid var(--line);height:64px;display:flex;align-items:center;padding:0 22px;position:relative;z-index:60}
.g-main.stuck{position:sticky;top:0;border-bottom-color:#c9d3dd}
.g-logo{display:flex;align-items:center;gap:9px;margin-right:22px;text-decoration:none;flex:0 0 auto}
.g-logo .mk{width:28px;height:28px;background:var(--primary);border-radius:var(--radius);position:relative;flex:0 0 28px}
.g-logo .mk::after{content:"";position:absolute;left:7px;top:7px;width:12px;height:12px;border:1.5px solid #fff;border-radius:2px}
.g-logo .tt b{display:block;font-size:16px;font-weight:700;color:var(--primary);letter-spacing:.5px;line-height:1.2}
.g-logo .tt em{display:block;font-size:9.5px;font-style:normal;color:var(--faint);letter-spacing:.2px;line-height:1.3}
.g-menu{display:flex;align-items:center}
.g-item{position:relative}
.g-item>a{display:flex;align-items:center;gap:0;padding:0 15px;height:64px;font-size:14px;color:var(--ink);text-decoration:none;white-space:nowrap}
.g-item>a .cv{display:inline-block;width:0;height:0;border-left:3.5px solid transparent;border-right:3.5px solid transparent;border-top:4px solid #9aa5b1;margin-left:6px}
.g-item:hover>a,.g-item.on>a,.g-item:focus-within>a{color:var(--primary);font-weight:600;text-decoration:none}
.g-item.on>a::after{content:"";position:absolute;left:15px;right:15px;bottom:0;height:2px;background:var(--primary)}
.g-sp{flex:1}
.g-tel{font-size:13.5px;color:var(--primary);font-weight:600;text-decoration:none;margin-right:14px;white-space:nowrap;font-variant-numeric:tabular-nums}
.g-cta{background:var(--primary);color:#fff;border-radius:var(--radius);padding:9px 18px;font-size:13.5px;font-weight:600;text-decoration:none;white-space:nowrap}
.g-cta:hover{background:var(--primary-light);text-decoration:none}

/* ===== 3. 分组面板（悬停 / 键盘展开） ===== */
.g-mega{position:absolute;left:0;right:0;top:64px;background:#fff;border-bottom:1px solid var(--line);padding:20px 22px 0;display:none;z-index:70}
.g-item:hover .g-mega,.g-item:focus-within .g-mega{display:block}
.g-cols{display:flex;gap:26px;padding-bottom:18px;max-width:var(--cw);margin:0 auto}
.g-col{flex:1;min-width:0}
.g-col .ch{font-size:13px;font-weight:700;color:var(--primary);padding-bottom:7px;border-bottom:1px solid #e3e9ef;margin-bottom:9px}
.g-col .ch em{font-style:normal;font-size:10.5px;font-weight:400;color:var(--faint);margin-left:5px}
.g-col ul{list-style:none}
.g-col li a{display:block;font-size:12.5px;color:var(--body);text-decoration:none;padding:4.5px 0;line-height:1.5}
.g-col li a:hover{color:var(--primary);text-decoration:underline}
.g-col li a.pillar{color:var(--primary);font-weight:600}
.g-col li a.pillar::before{content:"";display:inline-block;width:5px;height:5px;background:var(--primary);margin-right:7px;vertical-align:middle}
.g-col li a .kw{font-size:9.5px;border:1px solid #a9c4e0;background:#eaf2fb;color:var(--primary-light);border-radius:2px;padding:0 4px;margin-left:6px;font-weight:400;white-space:nowrap}
.g-feat{border-top:1px solid #e3e9ef;padding:12px 0 14px;display:flex;align-items:center;gap:20px;font-size:12.5px;color:var(--body);flex-wrap:wrap;max-width:var(--cw);margin:0 auto}
.g-feat b{color:var(--primary)}
.g-feat .sp{flex:1}
.g-feat .lb2{color:var(--faint);font-size:11.5px}
.g-feat .go{border:1px solid #a9c4e0;background:#eaf2fb;color:var(--primary-light);border-radius:var(--radius);padding:6px 14px;font-size:12.5px;font-weight:600;text-decoration:none;white-space:nowrap}

/* ===== 4. 移动端导航 ===== */
.mb-bar{display:none}
@media(max-width:900px){
  .g-bar{display:none}
  .g-main{display:none}
  .mb-bar{background:#fff;border-bottom:1px solid var(--line);height:54px;display:flex;align-items:center;padding:0 14px;gap:11px;position:sticky;top:0;z-index:60}
  .mb-burger{width:24px;height:15px;position:relative;flex:0 0 24px;background:none;border:none;cursor:pointer;padding:0}
  .mb-burger span{position:absolute;left:0;right:0;height:2px;background:var(--primary);display:block}
  .mb-burger span:nth-child(1){top:0}
  .mb-burger span:nth-child(2){top:6.5px}
  .mb-burger span:nth-child(3){top:13px}
  .mb-bar .tt{font-size:15px;font-weight:700;color:var(--primary);letter-spacing:.4px}
  .mb-bar .sp{flex:1}
  .mb-bar .call{border:1px solid #a9c4e0;background:#eaf2fb;color:var(--primary-light);border-radius:var(--radius);padding:5px 11px;font-size:12.5px;font-weight:600;white-space:nowrap;text-decoration:none}
}
.mb-panel{display:none;background:#fff;border-bottom:1px solid var(--line)}
.mb-panel.open{display:block}
.mb-item{border-bottom:1px solid var(--line-2)}
.mb-item>a{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;font-size:14.5px;color:var(--ink);text-decoration:none}
.mb-item.open>a{color:var(--primary);font-weight:600;background:var(--bg-soft)}
.mb-sub{background:var(--bg-soft);border-top:1px solid var(--line-2);padding:4px 0;display:none}
.mb-item.open .mb-sub{display:block}
.mb-sub a{display:block;padding:9px 16px 9px 28px;font-size:13px;color:var(--body);text-decoration:none;border-bottom:1px solid var(--line-2)}
.mb-sub a:last-child{border-bottom:none}
.mb-sub a.on{color:var(--primary);font-weight:600}
.mb-cta{background:var(--primary);color:#fff;text-align:center;padding:13px;font-size:14.5px;font-weight:600;display:block}
.mb-utils{padding:11px 16px;font-size:12px;color:var(--muted);line-height:1.9;background:#fff;border-top:1px solid var(--line-2)}
.mb-utils a{color:var(--body)}

/* ===== 5. 面包屑 ===== */
.crumb-bar{border-bottom:1px solid var(--line);background:#fff}
.crumb{font-size:12px;color:var(--muted);padding:11px 0}
.crumb a{color:var(--body);text-decoration:none}
.crumb a:hover{color:var(--primary);text-decoration:underline}
.crumb .sep{color:#c3cdd8;margin:0 7px}
.crumb .cur{color:var(--primary);font-weight:600}

/* ===== 6. Hero（全站唯一渐变处） ===== */
.hero{background:linear-gradient(135deg,#062a57,#0a2d5e 55%,#15497f);color:#fff;padding:34px 0 30px}
.hero h1{font-size:25px;font-weight:700;line-height:1.45;max-width:820px}
.hero .lead{font-size:14.5px;color:rgba(255,255,255,.87);max-width:800px;margin-top:12px;line-height:1.85}
.hero .facts{margin-top:20px;display:flex;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.16);padding-top:15px}
.hero .facts div{padding-right:24px;margin-right:24px;border-right:1px solid rgba(255,255,255,.16)}
.hero .facts div:last-child{border-right:none;margin-right:0;padding-right:0}
.hero .facts b{display:block;font-size:15.5px;font-weight:700;color:#fff;line-height:1.5}
.hero .facts span{font-size:11.5px;color:rgba(255,255,255,.6)}
.hero .acts{margin-top:20px;display:flex;gap:10px;flex-wrap:wrap}
.hero .acts a{display:inline-block;border-radius:var(--radius);padding:9px 22px;font-size:13.5px;font-weight:600;text-decoration:none}
.hero .acts .b1{background:#fff;color:var(--primary)}
.hero .acts .b2{border:1px solid rgba(255,255,255,.42);color:#fff}

/* ===== 7. 两栏骨架（左模块导航 + 右正文） =====
   注意：布局必须走类名而非内联样式 —— 内联 display:flex 优先级高于媒体查询，
   会让移动端无法切回单列（曾导致 390px 下正文被挤成竖排、页高 19000px+） */
.ly>.cw{display:flex;align-items:flex-start}
.ly .side{width:222px;flex:0 0 222px;border-right:1px solid var(--line);padding:22px 18px 40px 0;position:sticky;top:64px;align-self:flex-start}
.ly .side .st{font-size:13px;font-weight:700;color:var(--primary);padding-bottom:8px;border-bottom:2px solid var(--primary);margin-bottom:10px}
.ly .side ul{list-style:none}
.ly .side li a{display:block;font-size:12.5px;color:var(--body);text-decoration:none;padding:6.5px 9px;border-left:2px solid transparent;line-height:1.5}
.ly .side li a:hover{color:var(--primary);background:#fafcfe}
.ly .side li a.on{color:var(--primary);font-weight:600;background:#f2f7fc;border-left-color:var(--primary)}
.ly .side .box{border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px;margin-top:14px;font-size:11.5px;color:var(--body);line-height:1.7;background:#fafcfe}
.ly .side .box b{color:var(--primary);display:block;margin-bottom:3px}
.ly .main{flex:1;min-width:0;padding:0}
@media(max-width:900px){
  .ly>.cw{display:block}
  .ly .side{width:auto;flex:none;border-right:none;border-bottom:1px solid var(--line);padding:14px 0 14px;position:static}
  .ly .side ul{display:flex;flex-wrap:wrap;gap:6px}
  .ly .side li a{border:1px solid var(--line);border-left-width:1px;border-radius:var(--radius-sm);padding:5px 10px;background:#fff}
  .ly .side li a.on{background:var(--primary);color:#fff;border-color:var(--primary)}
  .ly .side .box{display:none}
}

/* ===== 8. 区块与标题（左对齐 + 下边框，无英文 kicker） ===== */
.sec{padding:26px 0 22px;border-bottom:1px solid var(--line-2)}
.sec:last-child{border-bottom:none}
.sec.alt{background:var(--bg-soft)}
.sec.alt>.cw{padding-top:0}
.sec>h2,.sh{font-size:17.5px;font-weight:700;color:var(--primary);border-bottom:2px solid var(--primary);padding-bottom:7px;margin-bottom:15px;display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.sh em{font-style:normal;font-size:12.5px;font-weight:400;color:var(--muted)}
.h3{font-size:14.5px;font-weight:700;margin:18px 0 8px;padding-left:9px;border-left:3px solid var(--primary-lighter);color:var(--ink)}
.h3:first-child{margin-top:0}

/* ===== 9. 表格（AI 引用率最高） ===== */
table.t{width:100%;border-collapse:collapse;font-size:13px;border:1px solid var(--line)}
table.t th{background:var(--bg-soft);text-align:left;padding:9px 11px;font-weight:600;color:var(--primary);border-bottom:1px solid var(--line);font-size:12.5px;white-space:nowrap}
table.t td{padding:9px 11px;border-bottom:1px solid var(--line-2);vertical-align:top;color:var(--body);line-height:1.68}
table.t tr:last-child td{border-bottom:none}
table.t td.k{color:var(--ink);font-weight:600}
table.t td.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
table.t td.mono{font-family:ui-monospace,Consolas,"Courier New",monospace;font-size:11.5px;color:var(--primary-light)}
.tw{overflow-x:auto}
/* 列宽适配：问句式表格首列需容纳完整问句，费用表首列只需容纳费用项名 */
table.t.wq th:first-child,table.t.wq td:first-child{width:34%}
table.t.wf th:first-child,table.t.wf td:first-child{width:24%}
/* 速查表首列均为短标签，禁断行；窄屏尤其明显（曾出现「办理机/构」） */
table.t.tk th:first-child,table.t.tk td:first-child{white-space:nowrap}

/* ===== 10. 编号列表 / 线性列表 ===== */
ol.nm{list-style:none;counter-reset:nm}
ol.nm>li{counter-increment:nm;position:relative;padding:9px 0 9px 36px;border-bottom:1px solid var(--line-2);font-size:13px;color:var(--body);line-height:1.74}
ol.nm>li:last-child{border-bottom:none}
ol.nm>li::before{content:"0" counter(nm);position:absolute;left:0;top:10px;font-family:ui-monospace,Consolas,"Courier New",monospace;font-size:12px;font-weight:700;color:var(--primary)}
ol.nm>li b{color:var(--ink);font-weight:600}
ul.ls{list-style:none}
ul.ls>li{position:relative;padding:9px 0 9px 15px;border-bottom:1px solid var(--line-2);font-size:13px;color:var(--body);line-height:1.74}
ul.ls>li:last-child{border-bottom:none}
ul.ls>li::before{content:"";position:absolute;left:0;top:17px;width:6px;height:1px;background:var(--primary)}
ul.ls>li b{color:var(--ink);font-weight:600}

/* ===== 11. 问答块（AEO / FAQ schema 配套） ===== */
.qa{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.qa .q{background:var(--bg-soft);border-bottom:1px solid var(--line);padding:10px 13px;font-size:13.5px;font-weight:600;color:var(--primary)}
.qa .a{padding:11px 13px;font-size:13px;color:var(--body);border-bottom:1px solid var(--line-2);line-height:1.86}
.qa .a:last-child{border-bottom:none}
.qa .a b{color:var(--ink)}

/* ===== 12. 提示块 ===== */
.note{border:1px solid var(--line);border-left:3px solid var(--primary-lighter);background:#fafcfe;border-radius:var(--radius);padding:11px 14px;font-size:12.5px;color:var(--body);line-height:1.82}
.note.w{border-left-color:#c08a00;background:#fffbf2}
.note.b{border-left-color:#b03a3a;background:#fff7f7}
.note.g{border-left-color:#1f6b45;background:#f5fbf7}
.note b{color:var(--ink)}
.note+.note{margin-top:8px}
.mini{font-size:12px;color:var(--muted);line-height:1.8}

/* ===== 13. 内链区（页面底部相关服务） ===== */
.rel{border:1px solid var(--line);border-radius:var(--radius)}
.rel li a{display:block;padding:10px 14px;font-size:13px;color:var(--primary-light);border-bottom:1px solid var(--line-2);text-decoration:none}
.rel li:last-child a{border-bottom:none}
.rel li a:hover{background:var(--bg-soft);text-decoration:none;color:var(--primary)}
.rel li{list-style:none}

/* ===== 14. CTA 带 ===== */
.cta{background:var(--primary);color:#fff;padding:26px 0}
.cta .in{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.cta h3{font-size:17.5px;font-weight:700;color:#fff}
.cta p{font-size:12.5px;color:rgba(255,255,255,.74);margin-top:5px;max-width:720px;line-height:1.75}
.cta .b{background:#fff;color:var(--primary);border-radius:var(--radius);padding:10px 24px;font-size:13.5px;font-weight:600;white-space:nowrap;text-decoration:none}

/* ===== 15. 页脚 ===== */
.foot{background:#062a57;color:rgba(255,255,255,.62);padding:24px 0 30px;font-size:12px;line-height:1.9}
.foot a{color:rgba(255,255,255,.72);text-decoration:none}
.foot a:hover{color:#fff;text-decoration:underline}
.foot b{color:#fff;font-size:12.5px}
.foot .cols{display:flex;gap:34px;flex-wrap:wrap;margin-top:10px}
.foot .cols div{min-width:132px}
.foot .cols a{display:block}
.foot .legal{margin-top:14px;padding-top:12px;border-top:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.45);font-size:11.5px}

/* ===== 16. 首页模块总览（枢纽页用） ===== */
.mods{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.mods a{display:flex;align-items:baseline;gap:10px;padding:12px 15px;border-bottom:1px solid var(--line-2);text-decoration:none}
.mods a:last-child{border-bottom:none}
.mods a:hover{background:var(--bg-soft);text-decoration:none}
.mods .n2{font-size:14px;font-weight:700;color:var(--primary);white-space:nowrap;flex:0 0 auto}
.mods .ds{font-size:12.5px;color:var(--body);line-height:1.65}
.mods .ct{font-size:11.5px;color:var(--muted);white-space:nowrap;margin-left:auto;padding-left:10px}

/* ===== 17. 响应式收口 ===== */
@media(max-width:900px){
  table.t{font-size:12.5px}
  table.t.wq th:first-child,table.t.wq td:first-child{width:42%}
  .cw{padding:0 16px}
  .hero{padding:26px 0 24px}
  .hero h1{font-size:20.5px}
  .hero .lead{font-size:13.5px}
  .hero .facts div{padding-right:16px;margin-right:16px}
  .sec{padding:20px 0 18px}
  .sh{font-size:16px}
  .cta .in{display:block}
  .cta .b{display:inline-block;margin-top:14px}
  .mods a{flex-wrap:wrap}
  .mods .ct{margin-left:0}
}
@media print{
  .g-bar,.g-main,.mb-bar,.mb-panel,.crumb-bar,.cta,.ly .side{display:none}
  .hero{background:#fff;color:#000}
  .hero h1,.hero .lead,.hero .facts b,.hero .facts span{color:#000}
}


/* ===== 修正（2026-09-20）：一级菜单分组面板未铺满导航宽度 =====
   现象：鼠标移上一级菜单时，面板被压成约 98px 宽、1800+px 高的窄条，文字逐字竖排并压住正文。
   根因：上方 .g-item{position:relative} 使 .g-mega{position:absolute;left:0;right:0} 的定位
         参照物由「整条导航 .g-main（宽 100%）」变成「单个菜单项（宽约 98px）」。
   修法：① .g-item 回到 static，参照物恢复为 .g-main，面板即按整条导航铺满；
         ② 同时给 .g-item>a 建立定位上下文，使「当前栏目」下划线 .g-item.on>a::after
            （left:15px / right:15px / bottom:0）仍以菜单项自身为参照，
            避免 .g-item 改 static 后被拉到整条导航两端。
   范围：仅 .g-menu 内的一级菜单项；移动端 .g-main 整体隐藏（max-width:900px），不受影响。 */
.g-menu .g-item{position:static}
.g-menu .g-item>a{position:relative}