/* ==========================================================================
   8FO GLOBAL BUSINESS NETWORK — 对外门户站设计系统
   独立命名空间 gbn-*，与 CRM（style.css / portal.css）完全隔离，互不污染。
   沿用品牌 tokens：深海蓝 #060d1e + 主蓝 #4d9bff + 青 #5ad1ff
   ========================================================================== */

:root{
  --bg:#060d1e;
  --bg-2:#081126;
  --bg-3:#0b1730;
  --primary:#4d9bff;
  --primary-d:#1b6bd6;
  --teal:#5ad1ff;
  --gold:#f6c552;
  --text:#e9effb;
  --text-2:#c3d2e8;
  --muted:#93a6c4;
  --dim:#6b7f9e;
  --line:rgba(140,190,255,.16);
  --line-2:rgba(140,190,255,.10);
  --card:rgba(255,255,255,.045);
  --card-2:rgba(255,255,255,.028);
  --glass:linear-gradient(160deg,rgba(19,32,60,.92),rgba(9,17,38,.96));
  --green:#4ade80;
  --red:#ff8080;
  --orange:#fbbf24;
  --radius:14px;
  --radius-s:10px;
  --shadow:0 18px 50px rgba(0,0,0,.38);
  --maxw:1180px;
  --nav-h:62px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:15px;line-height:1.72;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(900px 520px at 12% -8%,rgba(77,155,255,.16),transparent 62%),
    radial-gradient(760px 460px at 92% 4%,rgba(90,209,255,.10),transparent 60%),
    radial-gradient(1100px 700px at 50% 108%,rgba(27,107,214,.12),transparent 65%);
}
img{max-width:100%;height:auto;display:block}
a{color:var(--primary);text-decoration:none}
a:hover{color:var(--teal)}
h1,h2,h3,h4{margin:0;font-weight:700;line-height:1.28;letter-spacing:-.01em}
p{margin:0 0 1em}
ul,ol{margin:0 0 1em;padding-inline-start:1.25em}
li{margin:.3em 0}
strong,b{color:#fff;font-weight:650}
code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em;
  background:rgba(77,155,255,.12);color:#bcd8ff;padding:.12em .42em;border-radius:5px}
hr{border:0;border-top:1px solid var(--line);margin:34px 0}

.gbn-wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px;position:relative;z-index:1}
.gbn-narrow{max-width:880px}

/* ===== 顶栏 ===== */
.gbn-top{
  position:sticky;top:0;z-index:60;height:var(--nav-h);
  background:rgba(6,13,30,.82);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line-2);
}
.gbn-top-in{max-width:var(--maxw);margin:0 auto;padding:0 22px;height:100%;
  display:flex;align-items:center;gap:18px}
.gbn-brand{display:flex;align-items:center;gap:10px;flex:0 0 auto;color:var(--text)}
.gbn-brand:hover{color:var(--text)}
/* 品牌标识：8FO 字标（反白版，白色 + 橙点，专为深色底准备）
   白色字标对头部底色 #060d1e 对比度 17.1:1；原色藏青版仅 1.1:1，故此处不可用原色版。 */
.gbn-logo{height:30px;width:auto;display:block;flex:0 0 auto}
.gbn-brand-txt{display:flex;flex-direction:column;line-height:1.14}
.gbn-brand-txt b{font-size:14px;letter-spacing:.01em}
.gbn-brand-txt em{font-style:normal;font-size:9.5px;color:var(--dim);letter-spacing:.14em;text-transform:uppercase}

.gbn-nav{display:flex;align-items:center;gap:2px;margin-inline-start:auto;flex-wrap:nowrap}
.gbn-nav a{
  color:var(--text-2);font-size:13px;padding:7px 10px;border-radius:8px;white-space:nowrap;
  transition:background .16s,color .16s;
}
.gbn-nav a:hover{color:#fff;background:rgba(255,255,255,.06)}
.gbn-nav a[aria-current="page"]{color:#fff;background:rgba(77,155,255,.16);box-shadow:inset 0 0 0 1px rgba(77,155,255,.3)}
.gbn-top-cta{
  margin-inline-start:10px;flex:0 0 auto;
  background:linear-gradient(140deg,var(--primary),var(--primary-d));
  color:#fff !important;font-size:13px;font-weight:600;padding:8px 15px;border-radius:9px;
  box-shadow:0 6px 18px rgba(77,155,255,.32);white-space:nowrap;
}
.gbn-top-cta:hover{filter:brightness(1.1)}
.gbn-burger{
  display:none;margin-inline-start:auto;width:38px;height:34px;border:1px solid var(--line);
  background:rgba(255,255,255,.04);border-radius:9px;cursor:pointer;padding:0;flex:0 0 auto;
}
.gbn-burger span{display:block;width:16px;height:1.7px;background:var(--text-2);margin:3.4px auto;border-radius:2px}
.gbn-cta-mobile{display:none}

/* 语言切换：五语下拉（<details>，零 JS）。
   折叠态刻意只显示**语言短码**（中文 / EN / RU / ES / AR）而不是语言全名
   （Русский / Español 的字宽是 RU / ES 的 2–3 倍）—— 这样折叠态的宽度与原先
   那个单语言胶囊基本一致。顶栏固有宽度是实测过的硬约束（1141–1280px 是历史溢出区），
   加语言不该把它撑开。展开面板 position:absolute 不参与布局，同理。
   仍然必须 flex:0 0 auto —— 它永远是顶栏溢出的新增风险点。
  ⚠️ 间距已从 10px/11px 收到 8px/10px：折叠态的**中文**是两个汉字，实测比 EN/RU/ES/AR
  宽约 10px，于是**只有中文**（恰好是默认语种）把顶栏顶出 2px（1440–1600px 实测
  scrollWidth 1182 > clientWidth 1180，CTA 右缘越过容器 2px；其余四语为 0）。
  这 2px 落在居中留白里、不裁切也不产生横向滚动，所以只查「越出视口」的检查抓不到它 ——
  是逐档量 `scrollWidth-clientWidth` 才量出来的。收回 4px 后五语一律为 0。 */
.gbn-lang{margin-inline-start:8px;flex:0 0 auto;position:relative}
.gbn-lang>summary{
  display:flex;align-items:center;gap:6px;cursor:pointer;list-style:none;
  font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--muted);
  border:1px solid var(--line);border-radius:999px;padding:6px 10px;white-space:nowrap;
  transition:color .16s,border-color .16s;
}
.gbn-lang>summary::-webkit-details-marker{display:none}
.gbn-lang>summary::after{
  content:"";width:5px;height:5px;border-inline-end:1.4px solid currentColor;
  border-bottom:1.4px solid currentColor;transform:translateY(-2px) rotate(45deg);
}
.gbn-lang>summary:hover{color:#fff;border-color:rgba(140,190,255,.4)}
.gbn-lang[open]>summary{color:#fff;border-color:rgba(140,190,255,.4)}
.gbn-lang-pop{
  position:absolute;top:calc(100% + 9px);inset-inline-end:0;z-index:70;min-width:176px;
  display:flex;flex-direction:column;gap:2px;padding:6px;border-radius:12px;
  background:#0a1428;border:1px solid var(--line);box-shadow:0 20px 48px rgba(0,0,0,.55);
}
.gbn-lang-pop a{color:var(--text-2);font-size:13px;padding:8px 10px;border-radius:8px;white-space:nowrap}
.gbn-lang-pop a:hover{color:#fff;background:rgba(255,255,255,.06)}
.gbn-lang-pop a[aria-current="true"]{color:#fff;background:rgba(77,155,255,.16)}
/* 抽屉里那个语言入口在桌面态必须隐藏 —— 否则 >1140px 时它与顶栏那个**同时可见**，
   顶栏上会出现两个一模一样的语言按钮（实测 1440px：x=1127 与 x=1195 并排）。
   这是生成器同时输出两份（一份给抽屉、一份给顶栏）带来的必然副作用。 */
.gbn-nav .gbn-lang{display:none}

/* ===== 页头 ===== */
.gbn-hero{padding:74px 0 40px}
.gbn-hero-h1{font-size:clamp(28px,4.6vw,46px);letter-spacing:-.02em;margin-bottom:16px}
.gbn-hero-h1 .accent{
  background:linear-gradient(100deg,var(--teal),var(--primary) 55%,#8fb8ff);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.gbn-eyebrow{
  display:inline-flex;align-items:center;gap:8px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--teal);background:rgba(90,209,255,.09);border:1px solid rgba(90,209,255,.24);
  padding:5px 12px;border-radius:99px;margin-bottom:20px;font-weight:600;
}
.gbn-eyebrow i{width:5px;height:5px;border-radius:50%;background:var(--teal);box-shadow:0 0 8px var(--teal);font-style:normal}
.gbn-lead{font-size:clamp(15px,1.7vw,17.5px);color:var(--text-2);max-width:760px}
.gbn-lead b{color:#fff}

/* 页头（内页） */
.gbn-head{padding:52px 0 8px;border-bottom:1px solid var(--line-2)}
.gbn-head h1{font-size:clamp(24px,3.6vw,36px);margin-bottom:12px}
.gbn-head .gbn-lead{font-size:15.5px}
.gbn-crumb{font-size:12px;color:var(--dim);margin-bottom:16px}
.gbn-crumb a{color:var(--muted)}

/* ===== 区块 ===== */
.gbn-sec{padding:52px 0}
.gbn-sec.tight{padding:34px 0}
.gbn-sec-head{margin-bottom:28px;max-width:820px}
.gbn-sec-head h2{font-size:clamp(20px,2.7vw,27px);margin-bottom:10px}
.gbn-sec-head p{color:var(--muted);margin:0}
.gbn-kicker{
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--primary);
  font-weight:700;margin-bottom:9px;display:block;
}

/* ===== 卡片与网格 ===== */
.gbn-grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(238px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(196px,1fr))}
.g5{grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}

.gbn-card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 20px 18px;position:relative;transition:border-color .18s,transform .18s,background .18s;
}
.gbn-card:hover{border-color:rgba(140,190,255,.3);background:rgba(255,255,255,.062);transform:translateY(-2px)}
.gbn-card h3{font-size:16px;margin-bottom:8px}
.gbn-card h4{font-size:14.5px;margin-bottom:6px;color:#fff}
.gbn-card p{color:var(--muted);font-size:13.5px;margin:0}
.gbn-card p+p{margin-top:8px}
.gbn-card .num{
  font-size:11px;font-weight:800;color:var(--primary);letter-spacing:.1em;
  display:block;margin-bottom:10px;
}

/* 玻璃卡（强调） */
.gbn-card.glass{
  background:var(--glass);border-color:rgba(140,190,255,.22);box-shadow:var(--shadow);
}

/* ===== 数字条 ===== */
.gbn-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;
  background:var(--line-2);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.gbn-stat{background:var(--bg-2);padding:20px 16px;text-align:center}
.gbn-stat b{display:block;font-size:clamp(22px,3vw,30px);color:#fff;line-height:1.1;
  background:linear-gradient(160deg,#fff,var(--teal));-webkit-background-clip:text;background-clip:text;color:transparent}
.gbn-stat span{display:block;font-size:11.5px;color:var(--muted);margin-top:6px;letter-spacing:.02em}

/* ===== 闭环链路 ===== */
.gbn-flow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:6px 0 0}
.gbn-node{
  font-size:12.5px;color:var(--text-2);background:rgba(255,255,255,.05);
  border:1px solid var(--line);border-radius:8px;padding:7px 12px;white-space:nowrap;
}
.gbn-node.key{background:rgba(77,155,255,.16);border-color:rgba(77,155,255,.42);color:#fff;font-weight:600}
.gbn-arw{color:var(--dim);font-size:12px;flex:0 0 auto}

/* 闭环（长链：内容宽于容器时，平板及以上换行、手机横滑） */
.gbn-flow-scroll{overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch}
/* ≥821px（平板/笔记本/桌面）：换行铺满，闭环一眼看全。
   实测 1440px 下若沿用 nowrap 会溢出 294px，把「订单→回款→交付→佣金」这几环
   藏在滚动区外，是真实可读性缺陷。
   断点取 821px 是与「手机布局」断点（≤820px：--nav-h 56px、split 单栏）对齐，
   避免在 900/901px 处出现"换行↔突增 574px 横滑"的突变。 */
@media (min-width:821px){
  .gbn-flow-scroll{overflow-x:visible;padding-bottom:0}
  .gbn-flow-scroll .gbn-flow{flex-wrap:wrap;min-width:0}
}
/* ≤820px：保持单行横滑（触屏滑动是自然手势；换行会碎成 4–5 行且箭头悬尾） */
@media (max-width:820px){
  .gbn-flow-scroll .gbn-flow{flex-wrap:nowrap;min-width:max-content}
}

/* ===== 阶梯（六级 Partner） ===== */
.gbn-ladder{display:grid;gap:11px}
.gbn-rung{
  display:grid;grid-template-columns:74px 1fr;gap:16px;align-items:start;
  background:var(--card-2);border:1px solid var(--line);border-inline-start:3px solid var(--primary);
  border-radius:var(--radius-s);padding:15px 18px;
}
.gbn-rung .lv{font-size:17px;font-weight:800;color:var(--primary);letter-spacing:.02em;line-height:1.2}
.gbn-rung .lv em{display:block;font-style:normal;font-size:10px;color:var(--dim);letter-spacing:.1em;margin-top:2px}
.gbn-rung h4{margin-bottom:4px}
.gbn-rung p{margin:0;color:var(--muted);font-size:13.5px}
.gbn-rung:nth-child(3){border-inline-start-color:#3f8ae0}
.gbn-rung:nth-child(4){border-inline-start-color:var(--teal)}
.gbn-rung:nth-child(5){border-inline-start-color:#7bd6a8}
.gbn-rung:nth-child(6){border-inline-start-color:var(--gold)}

/* ===== 步骤条 ===== */
.gbn-steps{counter-reset:s;display:grid;gap:0;margin:0;padding:0;list-style:none}
.gbn-steps li{
  counter-increment:s;position:relative;padding:0 0 22px 44px;margin:0;
  border-inline-start:1px solid var(--line);margin-inline-start:13px;
}
.gbn-steps li:last-child{border-inline-start-color:transparent;padding-bottom:0}
.gbn-steps li::before{
  content:counter(s);position:absolute;inset-inline-start:-13px;top:-2px;width:26px;height:26px;
  border-radius:50%;background:var(--bg-3);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
  font-size:11.5px;font-weight:800;color:var(--primary);
}
.gbn-steps b{display:block;font-size:15px;color:#fff;margin-bottom:4px}
.gbn-steps span{color:var(--muted);font-size:13.5px}

/* ===== 表格 ===== */
.gbn-table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--card-2)}
table.gbn-t{width:100%;border-collapse:collapse;font-size:13.5px;min-width:520px}
table.gbn-t th{
  background:rgba(77,155,255,.09);color:#fff;font-weight:650;text-align:start;
  padding:12px 14px;border-bottom:1px solid var(--line);font-size:12.5px;letter-spacing:.02em;white-space:nowrap;
}
table.gbn-t td{padding:11px 14px;border-bottom:1px solid var(--line-2);color:var(--text-2);vertical-align:top}
table.gbn-t tr:last-child td{border-bottom:0}
table.gbn-t tr:hover td{background:rgba(255,255,255,.022)}
table.gbn-t td b{color:#fff}
table.gbn-t .price{color:#fff;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
table.gbn-t .num-c{text-align:end;font-variant-numeric:tabular-nums;white-space:nowrap}

/* ===== 标签 ===== */
.gbn-tag{display:inline-block;font-size:11.5px;padding:2px 9px;border-radius:6px;
  background:rgba(77,155,255,.14);color:#a9cdff;border:1px solid rgba(77,155,255,.28);white-space:nowrap}
.gbn-tag.teal{background:rgba(90,209,255,.13);color:#a5e8ff;border-color:rgba(90,209,255,.3)}
.gbn-tag.gold{background:rgba(246,197,82,.13);color:#ffdd8f;border-color:rgba(246,197,82,.3)}
.gbn-tag.green{background:rgba(74,222,128,.13);color:#9bf0bb;border-color:rgba(74,222,128,.3)}
.gbn-tag.red{background:rgba(255,128,128,.13);color:#ffb0b0;border-color:rgba(255,128,128,.3)}
.gbn-tag.gray{background:rgba(141,152,165,.13);color:#c2cbd6;border-color:rgba(141,152,165,.28)}

/* ===== 公式块 ===== */
.gbn-formula{
  background:linear-gradient(160deg,rgba(13,25,50,.9),rgba(8,15,32,.95));
  border:1px solid rgba(77,155,255,.24);border-radius:var(--radius);
  padding:18px 20px;margin:0 0 14px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:13.5px;line-height:2;color:#cfe2ff;overflow-x:auto;
}
.gbn-formula .k{color:var(--teal)}
.gbn-formula .o{color:var(--dim)}
.gbn-formula .v{color:var(--gold);font-weight:700}
.gbn-formula .hi{color:#fff;font-weight:700;background:rgba(77,155,255,.16);padding:1px 7px;border-radius:5px}

/* ===== 状态机 ===== */
.gbn-states{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 4px}
.gbn-state{
  font-size:12.5px;padding:8px 14px;border-radius:8px;font-weight:600;
  background:rgba(77,155,255,.12);border:1px solid rgba(77,155,255,.3);color:#bcd8ff;
}
.gbn-state.end{background:rgba(74,222,128,.13);border-color:rgba(74,222,128,.35);color:#9bf0bb}

/* ===== 提示条 ===== */
.gbn-note{
  border-inline-start:3px solid var(--primary);background:rgba(77,155,255,.07);
  border-radius:0 var(--radius-s) var(--radius-s) 0;padding:15px 18px;margin:0 0 16px;
}
.gbn-note.warn{border-inline-start-color:var(--orange);background:rgba(251,191,36,.07)}
.gbn-note.red{border-inline-start-color:var(--red);background:rgba(255,128,128,.07)}
.gbn-note.green{border-inline-start-color:var(--green);background:rgba(74,222,128,.07)}
.gbn-note b{color:#fff}
.gbn-note p:last-child{margin-bottom:0}
.gbn-note p{color:var(--text-2);font-size:13.5px}

/* 引用 */
.gbn-quote{
  border-inline-start:3px solid var(--teal);padding:14px 20px;margin:0 0 18px;
  background:rgba(90,209,255,.055);border-radius:0 var(--radius-s) var(--radius-s) 0;
  font-size:15.5px;color:#e2eeff;font-weight:600;
}

/* ===== 列表（勾选/叉） ===== */
.gbn-list{list-style:none;padding:0;margin:0 0 14px}
.gbn-list li{position:relative;padding-inline-start:24px;margin:.42em 0;color:var(--text-2);font-size:13.5px}
.gbn-list li::before{
  content:"";position:absolute;inset-inline-start:4px;top:.66em;width:8px;height:8px;border-radius:2px;
  background:var(--primary);box-shadow:0 0 0 3px rgba(77,155,255,.14);
}
.gbn-list.ok li::before{background:var(--green);box-shadow:0 0 0 3px rgba(74,222,128,.14)}
.gbn-list.no li::before{background:var(--red);box-shadow:0 0 0 3px rgba(255,128,128,.14)}
.gbn-list.num{counter-reset:n}
.gbn-list.num li::before{
  counter-increment:n;content:counter(n);background:none;box-shadow:none;
  color:var(--primary);font-size:11.5px;font-weight:800;top:.35em;inset-inline-start:0;width:auto;height:auto;
  font-variant-numeric:tabular-nums;
}

/* ===== CTA 区 ===== */
.gbn-cta{
  background:linear-gradient(150deg,rgba(27,107,214,.22),rgba(9,17,38,.9) 62%);
  border:1px solid rgba(77,155,255,.3);border-radius:18px;
  padding:38px 34px;text-align:center;position:relative;overflow:hidden;
}
.gbn-cta::before{
  content:"";position:absolute;inset:-40% -10% auto;height:220px;
  background:radial-gradient(closest-side,rgba(77,155,255,.3),transparent);pointer-events:none;
}
.gbn-cta h2{font-size:clamp(20px,2.8vw,28px);margin-bottom:12px;position:relative}
.gbn-cta p{color:var(--text-2);max-width:620px;margin:0 auto 24px;position:relative}
.gbn-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;position:relative}
.gbn-btn{
  display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;
  padding:11px 24px;border-radius:10px;transition:filter .16s,transform .16s;
}
.gbn-btn.primary{background:linear-gradient(140deg,var(--primary),var(--primary-d));color:#fff;
  box-shadow:0 10px 26px rgba(77,155,255,.34)}
.gbn-btn.ghost{border:1px solid var(--line);color:var(--text-2);background:rgba(255,255,255,.03)}
.gbn-btn:hover{filter:brightness(1.12);transform:translateY(-1px)}
.gbn-btn.ghost:hover{color:#fff;border-color:rgba(140,190,255,.4)}

/* ===== 分栏 ===== */
.gbn-split{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px}
.gbn-split.wide{align-items:start}

/* 页内锚点导航 */
.gbn-anchors{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0}
.gbn-anchors a{font-size:12.5px;color:var(--muted);border:1px solid var(--line);
  padding:5px 12px;border-radius:99px;background:rgba(255,255,255,.03)}
.gbn-anchors a:hover{color:#fff;border-color:rgba(140,190,255,.4)}

/* ===== 页脚 ===== */
.gbn-foot{margin-top:64px;border-top:1px solid var(--line-2);background:rgba(4,9,22,.6);padding:44px 0 30px}
.gbn-foot-grid{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:28px;margin-bottom:32px}
.gbn-foot h4{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin-bottom:12px}
.gbn-foot a{display:block;font-size:13px;color:var(--muted);padding:3.5px 0}
.gbn-foot a:hover{color:var(--teal)}
.gbn-foot-brand p{font-size:13px;color:var(--dim);margin:0;max-width:340px;line-height:1.7}
.gbn-foot-brand .gbn-brand{margin-bottom:12px}
.gbn-foot-brand .gbn-logo{height:32px}
.gbn-foot-bot{
  border-top:1px solid var(--line-2);padding-top:20px;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
  font-size:12px;color:var(--dim);
}
.gbn-foot-bot span{line-height:1.7}

/* ===== 响应式 ===== */
/* 分栏内的表格：解除 520px 最小宽度。该下限本是为「手机端全宽表格宁可横滑、
   也不挤成碎片」而设；但它与 .gbn-split 的分栏冲突——1024px 时每栏仅 478px，
   表格被硬撑出 42px 横滑。>820px 时 split 才会出现多栏（≤820px 已强制单栏），
   故此区间内让分栏里的表格贴合栏宽换行；≤820px 保持原行为不变。 */
@media (min-width:821px){
  .gbn-split table.gbn-t{min-width:0}
}
/* 顶栏内联导航的固有宽度：导航改名（全球网络/全球伙伴/… 9 项）+ 新增语言切换后实测约
   1230px（logo 74 + 品牌字块 209 + 9 项导航 675 + EN 43 + 登录 ~95 + 间距）。视口小于它
   时整条会溢出，而 body{overflow-x:hidden} 把溢出**裁掉而不给滚动条**，于是登录入口被切
   一半甚至整块消失（实测 1200px 右切、1141px 溢出 77px）。
   故设 1280px 专属档位：只收窄间距与字号，把内联导航的可用下限压到 1141px 以上；
   再向下才折叠——宁可折叠，也不要把入口藏掉。 */
@media (max-width:1280px){
  .gbn-top-in{gap:12px}
  .gbn-nav a{padding:7px 8px;font-size:12.5px}
  .gbn-lang{margin-inline-start:6px}
  .gbn-lang>summary{padding:6px 9px}
  .gbn-top-cta{margin-inline-start:6px;padding:8px 12px}
}
@media (max-width:1080px){
  .gbn-brand-txt em{display:none}
}
/* 1140px 以下折叠为汉堡抽屉。 */
@media (max-width:1140px){
  .gbn-burger{display:block}
  .gbn-top-cta{display:none}
  /* 语言切换挪进抽屉：顶栏在窄屏只剩「品牌 + 汉堡」，不给溢出留任何机会。
     此处 display:block 是覆盖上面那条桌面态隐藏规则（同特异性、位置更后）。
     抽屉里**不再嵌套一层下拉**：<summary> 隐藏，五个语言直接铺成两行网格 ——
     手机上一次点开抽屉就能看到全部语言，比「再点一次才展开」少一步。 */
  .gbn-top-in>.gbn-lang{display:none}
  .gbn-nav .gbn-lang{display:block;margin:8px 0 0}
  .gbn-nav .gbn-lang>summary{display:none}
  .gbn-nav .gbn-lang-pop{
    position:static;min-width:0;padding:0;background:none;border:0;box-shadow:none;
    display:grid;grid-template-columns:repeat(3,1fr);gap:6px;
  }
  .gbn-nav .gbn-lang-pop a{
    text-align:center;border:1px solid var(--line);padding:11px 6px;font-size:13.5px;
  }
  .gbn-cta-mobile{display:block;margin:10px 0 0;text-align:center;color:#fff !important}
  .gbn-nav{
    position:fixed;top:var(--nav-h);inset-inline-start:0;inset-inline-end:0;bottom:auto;
    flex-direction:column;align-items:stretch;gap:0;margin:0;
    background:rgba(6,13,30,.985);backdrop-filter:blur(18px);
    border-bottom:1px solid var(--line);padding:8px 12px 14px;
    max-height:calc(100vh - var(--nav-h));overflow-y:auto;
    display:none;
  }
  .gbn-nav.open{display:flex}
  .gbn-nav a{padding:12px 10px;font-size:15px;border-radius:9px}
}
@media (max-width:900px){
  .gbn-foot-grid{grid-template-columns:1fr 1fr;gap:24px}
}
@media (max-width:820px){
  :root{--nav-h:56px}
  .gbn-hero{padding:48px 0 28px}
  .gbn-sec{padding:38px 0}
  .gbn-brand-txt b{font-size:12.5px;letter-spacing:0}
  .gbn-logo{height:26px}
  .gbn-foot-brand .gbn-logo{height:28px}
  .gbn-top-in{gap:10px}
  .gbn-ladder .gbn-rung{grid-template-columns:1fr;gap:6px}
  .gbn-cta{padding:28px 20px}
  .gbn-split{grid-template-columns:1fr}
  .gbn-split>*{min-width:0}
  .gbn-grid>*{min-width:0}
}
@media (max-width:560px){
  .gbn-wrap{padding:0 16px}
  .gbn-top-in{padding:0 16px}
  .gbn-foot-grid{grid-template-columns:1fr;gap:20px}
  .gbn-stat b{font-size:22px}
  .gbn-card{padding:17px 16px}
  table.gbn-t{font-size:12.5px}
  .gbn-brand-txt b{font-size:11.5px}
  .gbn-logo{height:24px}
  .gbn-brand-txt em{display:none}
  .gbn-flow{gap:6px}
  .gbn-node{font-size:12px;padding:6px 10px}
}

/* 打印 */
@media print{
  body::before{display:none}
  .gbn-top,.gbn-cta,.gbn-burger{display:none !important}
  body{background:#fff;color:#111}
  .gbn-card,.gbn-table-wrap,.gbn-formula{border-color:#ccc;background:#fff}
}

/* ============================================================================
   阿拉伯语（RTL）适配
   ============================================================================
   镜像工作的大头已经由**逻辑属性**承担了：本文件里所有方向性声明在前文一律写作
   margin-inline-start / padding-inline-* / border-inline-* / inset-inline-* /
   text-align:start|end（见 i18n/logicalize-css.py，LTR 下计算值与物理属性完全等价）。
   因此下面只写「逻辑属性管不了」的四件事：

   1. 字体栈
      中文回退链（"PingFang SC" / "Microsoft YaHei"）不含阿拉伯字形，
      命中失败后回退到系统默认字体，字重与行高都会失准。给 ar 单独一条链。
      不引外部 webfont：站点在多个网络环境下要能离线正确渲染，不新增外部依赖。

   2. letter-spacing 一律归零 —— **这是正确性问题，不是审美问题**
      阿拉伯字母靠连写（contextual joining）成型，加字距会把连写拆开，
      渲染成一串互不相连的孤立字形，看起来像乱码。
      本文件有 20+ 处 letter-spacing（大写标签、eyebrow、数字条、页脚栏目名），
      全部落在这条规则下。不做例外：品牌锁排那处只有 .01em（14px 上约 0.14px），
      视觉上不可察，为它开一个 !important 例外不值得。

   3. 箭头字形
      "→" 是方向性符号，RTL 下应指左。它写在 HTML 文本里，CSS 改不了单个字符 ——
      生成器已把 RTL 页面的每个 "→" 包进 <span class="gbn-arw">，这里镜像它。
      闭环链路（.gbn-flow）另需显式 direction:rtl，否则 flex 顺序在某些浏览器里
      仍按 LTR 排列，与箭头方向打架。

   4. 语言下拉的展开方向与折叠箭头
      面板用 inset-inline-end:0 已自动贴到另一边；折叠箭头是 border 画的，
      需要单独反旋一次。
   ============================================================================ */
[dir="rtl"]{
  --font-ar:"Noto Naskh Arabic","Geeza Pro","Segoe UI",Tahoma,"Arial",sans-serif;
}
[dir="rtl"] body{font-family:var(--font-ar)}
[dir="rtl"] *{letter-spacing:normal !important}
[dir="rtl"] .gbn-arw{display:inline-block;transform:scaleX(-1)}
[dir="rtl"] .gbn-flow{direction:rtl}
[dir="rtl"] .gbn-lang>summary::after{transform:translateY(-2px) rotate(-45deg)}
/* 中阿混排时的数字与代码片段：保持 LTR 走向并保留等宽，否则 "9:00–18:00 GMT+8"
   会被 bidi 算法重排成 "GMT+8 18:00–9:00"。 */
[dir="rtl"] code,[dir="rtl"] kbd,[dir="rtl"] .gbn-num,[dir="rtl"] .gbn-t .num-c{
  direction:ltr;unicode-bidi:embed;
}

