/* ==================================================================
   OpenGovDev · NOIR LUXE 设计系统（全站统一）
   来源：融媒业务版页面沉淀，抽取为共享层，供 平台能力 / 政务场景 /
   常见问题 / 合作计划 等页面复用，保证全站字体字号、间距、按钮、
   卡片、CTA 与版权区完全一致。
   引入顺序：shared-nav.css → og-system.css → og-noir.css → 页面局部
   ================================================================== */

:root {
  --bg: #0a0908;
  --bg2: #0e0d0b;
  --bg3: #131210;
  --surf: #141311;
  --surface: rgba(255,255,255,0.025);
  --surface-h: rgba(255,255,255,0.045);

  --gold: #e2bd55;
  --gold-l: #f5d77a;
  --gold-b: #ffd95e;
  --gold-hi: #ffe9a0;
  --gold-dim: rgba(226,189,85,0.08);
  --gold-glow: rgba(226,189,85,0.12);

  --line: rgba(255,255,255,0.07);
  --line-g: rgba(226,189,85,0.10);
  --line-gh: rgba(226,189,85,0.22);

  --text: #f6f1e7;
  --text-h: #fffaf0;
  --muted: #b8b1a4;
  --muted2: #8a8278;

  /* 辅色：全部低饱和，与香槟金同一明度带，绝不抢金色 */
  --celadon: #86a89b;   /* 青瓷 · 信息与中性叙述 */
  --clay:    #c08a6a;   /* 陶土 · 提醒与人 */
  --ink:     #7d93a8;   /* 墨青 · 数据与技术 */
  --moss:    #8fa36d;   /* 苔绿 · 完成与结果 */
  --rose:    #bf8080;   /* 干玫瑰 · 风险与差异 */
  /* 兼容旧变量名 */
  --green: var(--moss);
  --blue: var(--ink);
  --orange: var(--clay);
  --red: var(--rose);
  --violet: var(--celadon);

  --max: 1180px;

  /* ---- 动效标尺（全站只用这三档 + 两条曲线）----
     改前全站散着 11 个不同时长（.16/.18/.2/.22/.25/.28/.3/.32/.35/.4/.45），
     这正是"没有设计语言"的直接体现——同一个 hover 在不同板块快慢不一。 */
  --m1: .18s;   /* 状态：颜色 / 边框 / 透明度 */
  --m2: .32s;   /* 位移：hover 抬升、缩放 */
  --m3: .62s;   /* 进场：滚动揭示 */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);      /* 收尾极缓，用于位移与进场 */
  --ease-out: cubic-bezier(0.33, 1, 0.68, 1); /* 匀速偏出，用于状态切换 */
  --lift: -3px; /* 统一的 hover 抬升量 */
}

/* ---------- 基础 ---------- */
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
html, body.og-noir { background: var(--bg); }

/* ==================================================================
   基底与点缀（去 AI 感第一步）
   诊断：全站用纯 #000 + 单一金色 + 大量外发光 + 渐变填充标题，
   这几样正是"AI 生成感"的典型signature。这里做三件事：
   1) 纯黑 → 暖炭黑：#000 是屏幕上不存在的颜色，换成带微暖的 #0a0908，
      黑金立刻从"合成"变"印刷/实物"；层级用 bg / bg2 / surf 三阶。
   2) 引入一个低饱和辅色（青瓷 celadon），只承担"信息 / 中性叙述"，
      金色回归只表达"钱与转化"——两色分工，不再满屏金。
   3) 外发光收敛为"内边高光 + 染色投影"，更像真实材质的边缘折射。
   ================================================================== */

body.og-noir {
  color: var(--text);
  font-family: Aptos, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.85;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* clip 而非 hidden：hidden 会创建滚动容器，废掉后代的 position:sticky */
  overflow-x: clip;
}
body.og-noir ::selection { background: rgba(226,189,85,0.25); color: var(--text-h); }
body.og-noir a { color: inherit; text-decoration: none; }
body.og-noir img, body.og-noir svg { display: block; }
body.og-noir main, body.og-noir section, body.og-noir footer { position: relative; z-index: 1; }
.og-noir .wrap { width: min(var(--max), calc(100% - 48px)); margin: 0 auto; }

/* 全站微纹理 + 环境光（极低强度，只做质感） */
body.og-noir::before {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23C9A84C' fill-opacity='0.018'%3E%3Ccircle cx='30' cy='30' r='1'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
body.og-noir::after {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 80% 50% at 20% 10%, rgba(226,189,85,0.035), transparent 60%),
    radial-gradient(ellipse 62% 42% at 82% 78%, rgba(134,168,155,0.022), transparent 56%);
}

/* ---------- 版块节奏 ---------- */
.og-noir .nsec { padding: clamp(104px, 10.5vw, 156px) 0; }
.og-noir .nsec.alt { background: var(--bg2); }
.og-noir .nsec.tight { padding: clamp(76px, 7.5vw, 108px) 0; }

/* ---------- 标题体系 ---------- */
.og-noir .eyebrow {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 16px;
  position: relative;
  padding-left: 32px;
}
.og-noir .eyebrow::before {
  content: ""; position: absolute; left: 0; top: 50%;
  width: 22px; height: 1px;
  background: linear-gradient(90deg, var(--gold), transparent);
}
.og-noir .nhead.center .eyebrow { padding-left: 0; }
.og-noir .nhead.center .eyebrow::before { display: none; }

.og-noir .nh2 {
  font-size: clamp(27px, 3.1vw, 38px);
  line-height: 1.28;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: var(--text);
}
.og-noir .nh3 {
  font-size: 17px;
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--text);
}
.og-noir .g {
  background: linear-gradient(120deg, var(--gold-hi), var(--gold-b) 50%, var(--gold));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.og-noir .nhead { max-width: 760px; margin-bottom: clamp(56px, 5.5vw, 76px); }
.og-noir .nhead.center { text-align: center; margin-left: auto; margin-right: auto; max-width: 820px; }
.og-noir .nhead .lede { margin-top: 22px; font-size: 15px; line-height: 1.95; color: var(--muted); }
.og-noir .lede, .og-noir .nbody { text-wrap: pretty; }
.og-noir .nbody { font-size: 13.5px; line-height: 1.85; color: var(--muted); }
.og-noir .nmicro { font-size: 12px; line-height: 1.7; color: var(--muted2); }

/* ---------- 按钮 ---------- */
.og-noir .btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 50px; padding: 0 28px; border-radius: 8px;
  font-size: 13.5px; font-weight: 700; letter-spacing: 0.03em;
  font-family: inherit;
  border: 1px solid transparent; cursor: pointer; white-space: nowrap;
  transition: transform var(--m2) var(--ease), box-shadow var(--m2) var(--ease), border-color var(--m1) var(--ease-out), color var(--m1) var(--ease-out);
  position: relative; overflow: hidden;
}
.og-noir .btn-gold {
  background: linear-gradient(135deg, var(--gold-hi) 0%, var(--gold-b) 40%, var(--gold) 100%);
  color: #1a1408;
  box-shadow: 0 1px 0 0 rgba(255,255,255,0.15) inset, 0 8px 24px -8px rgba(226,189,85,0.35);
}
.og-noir .btn-gold:hover {
  transform: translateY(-2px);
  box-shadow: 0 1px 0 0 rgba(255,255,255,0.2) inset, 0 14px 36px -10px rgba(226,189,85,0.45);
}
.og-noir .btn-gold::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.15), transparent 50%);
  opacity: 0; transition: opacity 280ms;
}
.og-noir .btn-gold:hover::after { opacity: 1; }
.og-noir .btn-line {
  background: var(--surface); border-color: var(--line); color: var(--text);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.og-noir .btn-line:hover {
  border-color: var(--line-gh); color: var(--gold-l);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px -12px rgba(226,189,85,0.15);
}
.og-noir .btn svg { width: 16px; height: 16px; stroke-width: 2; }

/* ---------- 玻璃卡片 ---------- */
.og-noir .glass {
  background: linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.012));
  -webkit-backdrop-filter: blur(24px) saturate(1.2);
  backdrop-filter: blur(24px) saturate(1.2);
  border: 1px solid var(--line-g);
  border-radius: 14px;
  box-shadow: 0 1px 0 0 rgba(255,255,255,0.03) inset, 0 8px 32px -16px rgba(0,0,0,0.5);
}
.og-noir .hoverable { transition: transform var(--m2) var(--ease), border-color var(--m1) var(--ease-out), box-shadow var(--m2) var(--ease); }
.og-noir .hoverable:hover {
  transform: translateY(var(--lift)); border-color: var(--line-gh);
  box-shadow: 0 1px 0 0 rgba(255,255,255,0.04) inset, 0 16px 48px -20px rgba(226,189,85,0.12);
}

/* ---------- 图标徽章 ---------- */
.og-noir .badge {
  width: 42px; height: 42px; flex: none;
  display: flex; align-items: center; justify-content: center;
  border-radius: 11px;
  background: var(--gold-dim); color: var(--gold);
  border: 1px solid rgba(226,189,85,0.08);
}
.og-noir .badge svg { width: 20px; height: 20px; stroke-width: 1.8; }
.og-noir .badge.c-green  { background: rgba(143,163,109,0.12); color: var(--moss);   border-color: rgba(143,163,109,0.16); }
.og-noir .badge.c-blue   { background: rgba(125,147,168,0.12); color: var(--ink);    border-color: rgba(125,147,168,0.16); }
.og-noir .badge.c-orange { background: rgba(192,138,106,0.12); color: var(--clay);   border-color: rgba(192,138,106,0.16); }
.og-noir .badge.c-red    { background: rgba(191,128,128,0.12); color: var(--rose);   border-color: rgba(191,128,128,0.16); }
.og-noir .badge.c-violet { background: rgba(134,168,155,0.12); color: var(--celadon); border-color: rgba(134,168,155,0.16); }
.og-noir .badge.c-solid {
  background: linear-gradient(135deg, var(--gold-b), var(--gold));
  color: #1a1408;
  border-color: rgba(255,255,255,0.1);
  box-shadow: 0 1px 0 0 rgba(255,255,255,0.15) inset;
}
/* 圆形香槟金徽章：用于「重点三件事」一类的强调列表 */
.og-noir .badge.round {
  border-radius: 50%;
  background: radial-gradient(circle at 50% 32%, rgba(226,189,85,.20), rgba(226,189,85,.05) 62%, transparent 78%);
  border: 1px solid rgba(226,189,85,.22);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.035),
    inset 0 6px 12px -8px rgba(255,233,160,.5),
    0 6px 18px -12px rgba(226,189,85,.55);
  color: var(--gold-l);
}
.og-noir .badge.round svg { stroke-width: 1.6; }

/* ==================================================================
   统一首屏（政务场景 / 平台能力 / 合作计划 / 常见问题 四页共用）
   左文案 + 右侧克制金色光流 + 四张能力卡 + 一条提示带
   ================================================================== */
.og-noir .nhero {
  position: relative;
  /* 四页首屏的顶部起点必须一致，否则 kicker / 标题的基线会各页不同 */
  --hero-pad-top: clamp(52px, 5vw, 72px);
  /* 顶部收紧：原来 78–108px 让整屏视觉重心偏低 */
  padding: var(--hero-pad-top) 0 clamp(48px, 5vw, 68px);
  overflow: hidden;
}
.og-noir .nhero::before, .og-noir .nhero::after { content: none !important; }
.og-noir .nhero .wrap { position: relative; z-index: 1; }
.og-noir .nhero-art {
  position: absolute; z-index: 0; pointer-events: none;
  /* 右缘与 .wrap 右缘对齐，上下也留呼吸——图是内容的一部分，不出血到屏幕边 */
  --gutter: max(24px, calc((100% - 1180px) / 2));
  top: clamp(56px, 7vh, 88px);
  right: var(--gutter);
  bottom: clamp(56px, 7vh, 88px);
  width: min(46%, 600px);
  /* 首屏高度各页不同，若不封顶，页面越长图越大，会从「点缀」变成「大图」。
     统一压成右上角一条等高的带子，四页视觉份量才一致。 */
  max-height: min(56vh, 520px);
  /* 每个页面通过 --hero-art 指定各自的视觉素材 */
  background-image: var(--hero-art, none);
  background-repeat: no-repeat;
  background-position: var(--hero-art-pos, 78% 46%);
  background-size: var(--hero-art-size, cover);
  opacity: var(--hero-art-op, .55);
  /* 左侧与上下都在文案、卡片之前熄灭：始终是背景，不抢主标题 */
  /* 四边都要熄灭，右缘尤其不能硬切——原来右边只降到 .55 就截断，
     看上去像一张贴纸贴在页面上。现在收到全透明，但只占最后 14%，不吃掉画面主体。 */
  -webkit-mask-image:
    linear-gradient(90deg, transparent 0%, rgba(0,0,0,.34) 10%, #000 32%, #000 86%, rgba(0,0,0,.58) 94%, transparent 100%),
    linear-gradient(180deg, transparent 0%, #000 14%, #000 84%, transparent 100%);
  mask-image:
    linear-gradient(90deg, transparent 0%, rgba(0,0,0,.34) 10%, #000 32%, #000 86%, rgba(0,0,0,.58) 94%, transparent 100%),
    linear-gradient(180deg, transparent 0%, #000 14%, #000 84%, transparent 100%);
  -webkit-mask-composite: source-in; mask-composite: intersect;
}
.og-noir .nhero-inner { max-width: 600px; }
.og-noir .nkicker {
  display: inline-flex; align-items: center; gap: 11px; margin-bottom: 24px;
  font-size: 11.5px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
  color: rgba(229,196,119,.92);
}
.og-noir .nkicker::before {
  content: ""; width: 28px; height: 1px; flex: none;
  background: linear-gradient(90deg, rgba(229,196,119,0), rgba(229,196,119,.7));
}
.og-noir .nhero h1 {
  /* 全站首屏主标题唯一尺寸——四页必须完全一致 */
  margin: 0; font-size: clamp(30px, 3.7vw, 48px); line-height: 1.26;
  font-weight: 800; letter-spacing: -.035em; color: var(--text); text-align: left;
}
.og-noir .nhero .nlede {
  margin: 24px 0 0; max-width: 560px;
  font-size: 15px; line-height: 1.95; color: var(--muted); text-wrap: pretty;
}
.og-noir .nhero-cta { display: flex; gap: 13px; flex-wrap: wrap; margin-top: 30px; }

/* 四张能力卡 */
.og-noir .nfeats {
  display: grid; grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 16px; margin-top: clamp(44px, 4.6vw, 62px);
}
.og-noir .nfeat {
  padding: 28px 24px 26px; border-radius: 14px;
  border: 1px solid rgba(255,255,255,.075);
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,0) 34%), var(--surf);
  box-shadow: 0 1px 0 0 rgba(255,255,255,.03) inset, 0 8px 32px -16px rgba(0,0,0,.5);
  transition: transform var(--m2) var(--ease), border-color var(--m1) var(--ease-out), box-shadow var(--m2) var(--ease);
}
.og-noir .nfeat:hover {
  transform: translateY(var(--lift)); border-color: var(--line-gh);
  box-shadow: 0 1px 0 0 rgba(255,255,255,.04) inset, 0 16px 48px -20px rgba(226,189,85,.12);
}
.og-noir .nfic {
  width: 44px; height: 44px; border-radius: 50%;
  display: grid; place-items: center; margin-bottom: 18px;
  color: var(--gold-l);
  background:
    radial-gradient(circle at 50% 30%, rgba(226,189,85,.22), rgba(226,189,85,.05) 60%, transparent 78%);
  border: 1px solid rgba(226,189,85,.24);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.04),
    inset 0 7px 14px -9px rgba(255,233,160,.55),
    0 8px 20px -14px rgba(226,189,85,.6);
  transition: border-color var(--m1) var(--ease-out), box-shadow var(--m2) var(--ease), color var(--m1) var(--ease-out);
}
.og-noir .nfic svg { width: 19px; height: 19px; stroke-width: 1.6; }
.og-noir .nfeat:hover .nfic {
  color: var(--gold-hi);
  border-color: rgba(226,189,85,.44);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.06),
    inset 0 7px 14px -9px rgba(255,233,160,.8),
    0 12px 28px -14px rgba(226,189,85,.8);
}
.og-noir .nfeat > b { display: block; font-size: 15px; font-weight: 700; line-height: 1.45; letter-spacing: -.01em; color: var(--text); margin-bottom: 9px; }
.og-noir .nfeat > span { display: block; font-size: 12.5px; line-height: 1.8; color: var(--muted); text-wrap: pretty; }

/* 提示带 */
.og-noir .nhint {
  display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 14px; align-items: center;
  margin-top: clamp(24px, 2.4vw, 30px); padding: 18px 22px; border-radius: 14px;
  border: 1px solid rgba(226,189,85,.16);
  background: linear-gradient(100deg, rgba(226,189,85,.07), rgba(255,255,255,.01) 58%, transparent), var(--surf);
}
.og-noir .nhint-ic {
  width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center;
  background: rgba(226,189,85,.1); color: var(--gold); border: 1px solid rgba(226,189,85,.12);
}
.og-noir .nhint-ic svg { width: 18px; height: 18px; stroke-width: 1.8; }
.og-noir .nhint p { margin: 0; font-size: 13px; line-height: 1.8; color: var(--muted); text-wrap: pretty; }
.og-noir .nhint p b { color: var(--text); font-weight: 700; }

@media (max-width: 1080px) {
  .og-noir .nhero-art { left: var(--gutter); width: auto; opacity: .3; }
  .og-noir .nhero-inner { max-width: 680px; }
  .og-noir .nfeats { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .og-noir .nfeats { grid-template-columns: 1fr; }
  .og-noir .nhint { grid-template-columns: 1fr; gap: 12px; }
  .og-noir .nhero-cta { display: grid; }
  .og-noir .nhero-cta .btn { width: 100%; }
}

/* ---------- 进场动画 ---------- */
.og-noir .rv {
  opacity: 0; transform: translateY(18px);
  transition: opacity var(--m3) var(--ease), transform var(--m3) var(--ease);
}
.og-noir .rv.in { opacity: 1; transform: none; }


@media (prefers-reduced-motion: reduce) {
  .og-noir .rv { opacity: 1; transform: none; transition: none; }
}

/* ==================================================================
   统一 CTA（参照首页）
   ================================================================== */
.og-noir .closing { background: var(--bg); }
/* CTA 与正文之间原来隔了 280px+（末节 bottom padding 150 + CTA top padding 81），
   收到 ~170px：先削末节的下留白，再削 CTA 的上留白 */
.og-noir main > section:last-of-type { padding-bottom: clamp(62px, 6.2vw, 94px); }
.og-noir .final {
  padding: clamp(40px, 4.4vh, 58px) 0 42px;
  position: relative; z-index: 2; overflow: visible; text-align: center;
  background: transparent;
}
.og-noir .final::before, .og-noir .final::after { display: none !important; content: none !important; }
.og-noir .final-center { max-width: 800px; margin: 0 auto; text-align: center; }
.og-noir .final-rule {
  display: block; width: 52px; height: 2px; margin: 0 auto 24px; border-radius: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
}
.og-noir .final h2 {
  font-size: clamp(30px, 3.6vw, 44px);
  line-height: 1.25; font-weight: 800; letter-spacing: -0.025em;
  color: var(--text);
}
.og-noir .final-sub {
  margin: 15px auto 0; font-size: 14.5px; line-height: 1.85; color: var(--muted);
}
.og-noir .final-cta {
  display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-top: 28px;
}
.og-noir .final .btn-gold { color: #1a1408 !important; }

/* CTA 客户滚动：克制的胶囊轨道，两端深溶入 */
.og-noir .mq {
  margin: clamp(24px, 2.6vw, 32px) auto 0;
  width: min(1000px, 100%);
  position: relative; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 16%, #000 84%, transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 16%, #000 84%, transparent 100%);
}
.og-noir .mq-track { display: flex; width: max-content; gap: 12px; animation: ogMqScroll 64s linear infinite; }
.og-noir .mq:hover .mq-track { animation-play-state: paused; }
.og-noir .mq-track span {
  display: inline-flex; align-items: center;
  height: 52px; padding: 0 26px;
  border: 1px solid rgba(255,255,255,0.075);
  border-radius: 13px;
  background: rgba(255,255,255,0.022);
  color: #cfc9be;
  font-size: 14.5px; font-weight: 500; letter-spacing: .01em;
  white-space: nowrap;
  transition: border-color var(--m1) var(--ease-out), color var(--m1) var(--ease-out), background var(--m1) var(--ease-out);
}
.og-noir .mq-track span:hover {
  border-color: var(--line-gh); color: var(--text); background: rgba(255,255,255,0.04);
}
@keyframes ogMqScroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .og-noir .mq-track { animation: none; } }

/* ==================================================================
   统一版权区（参照首页）：隐去三列链接，只留居中版权行
   ================================================================== */
.og-noir .og-shared-foot { border-top: 1px solid rgba(255,255,255,.06); background: #000 !important; }
.og-noir .og-shared-foot::before { display: none !important; }
.og-noir .og-shared-foot .foot-top { display: none !important; }
.og-noir .og-shared-foot .foot-legal {
  align-items: center; text-align: center; padding: 22px 0 26px !important;
}
.og-noir .og-shared-foot .row1 { justify-content: center; }
.og-noir .og-shared-foot .row2 { justify-content: center; }
.og-noir .og-shared-foot .row2 .foot-legal-link { font-size: 10px !important; color: #5c574f !important; }
.og-noir .og-shared-foot .row2 .foot-legal-link:hover { color: #c9b477 !important; }
.og-noir .og-shared-foot .row2 .sig { margin-left: 0; opacity: .7; }
@media (max-width: 640px) {
  .og-noir .og-shared-foot .row2 { flex-direction: column; gap: 6px; }
  .og-noir .og-shared-foot .row2 .sep { display: none; }
  .og-noir .og-shared-foot .row2 .sig { margin-top: 4px; }
}

/* ---------- 响应式 ---------- */
@media (max-width: 760px) {
  .og-noir .wrap { width: min(var(--max), calc(100% - 32px)); }
  .og-noir .nsec { padding: 76px 0; }
  .og-noir .final-cta { display: grid; }
  .og-noir .final-cta .btn { width: 100%; }
  .og-noir .mq-track span { height: 46px; padding: 0 20px; font-size: 13px; }
}

/* ==================================================================
   级联揭示（放在文件末尾）
   必须最后声明：卡片自己的 `transition` 简写会把 transition-delay 归零，
   同特异度下后写的规则才赢。这是上一版延迟失效的原因。
   ================================================================== */
.og-noir .stagger > * {
  opacity: 0; transform: translateY(14px);
  transition-property: opacity, transform;
  transition-duration: var(--m3);
  transition-timing-function: var(--ease);
}
.og-noir .stagger.in > *, .og-noir .rv.in .stagger > * { opacity: 1; transform: none; }
.og-noir .stagger > *:nth-child(1){transition-delay:.04s}
.og-noir .stagger > *:nth-child(2){transition-delay:.11s}
.og-noir .stagger > *:nth-child(3){transition-delay:.18s}
.og-noir .stagger > *:nth-child(4){transition-delay:.25s}
.og-noir .stagger > *:nth-child(5){transition-delay:.32s}
.og-noir .stagger > *:nth-child(6){transition-delay:.39s}
.og-noir .stagger > *:nth-child(7){transition-delay:.46s}
.og-noir .stagger > *:nth-child(8){transition-delay:.53s}
.og-noir .stagger > *:nth-child(n+9){transition-delay:.6s}
@media (prefers-reduced-motion: reduce) {
  .og-noir .stagger > * { opacity: 1; transform: none; transition: none; }
}

/* ==================================================================
   图标光学统一层（放在末尾，压过各页局部声明）
   现状：全站图标描边散着 1.6 / 1.7 / 1.8 / 1.9 / 2 / 2.2 / 2.4 / 2.6 八种粗细，
   端点有的方有的圆——同一屏里并排就是"东拼西凑"的观感，也是 AI 感的来源之一。
   这里把所有线性图标统一到一套光学规范：
     · 描边 1.6px（细而不虚，与 Aptos 的字重匹配）
     · 圆角端点与圆角拐角，笔画收尾柔和
     · 尺寸按容器分档，不再逐处硬写
   徽章里的实心图标（.badge.c-solid）与品牌 logo 不受影响。
   ================================================================== */
.og-noir svg:not(.og-sig-icon):not([data-keep-stroke]) {
  stroke-linecap: round;
  stroke-linejoin: round;
}
.og-noir .badge svg,
.og-noir .nfic svg,
.og-noir .bi svg,
.og-noir .qt-ic svg,
.og-noir .cp-hook svg,
.og-noir .cp-badge svg,
.og-noir .nhint-ic svg,
.og-noir .fq-gh .ic svg,
.og-noir .cp-panel h3 svg,
.og-noir .group-icon svg,
.og-noir .cs-fic svg,
.og-noir .cp-safe svg { stroke-width: 1.6; }

/* 尺寸分档：徽章 / 行内 / 微标，三档到底 */
.og-noir .badge svg, .og-noir .nfic svg { width: 19px; height: 19px; }
.og-noir .nhint-ic svg, .og-noir .fq-gh .ic svg { width: 18px; height: 18px; }
.og-noir .group-icon svg { width: 17px; height: 17px; }
.og-noir .bi svg, .og-noir .qt-ic svg { width: 15px; height: 15px; }
.og-noir .cp-hook svg, .og-noir .cp-badge svg, .og-noir .cp-safe svg,
.og-noir .cp-panel h3 svg { width: 13px; height: 13px; }

/* 自绘图标：统一 1.6，无论落在哪个容器里 */
body.og-noir svg.og-icon { stroke-width: 1.6; }

/* 按钮内图标略粗一档，因为面积小、且要压得住金底 */
body.og-noir .btn svg { stroke-width: 1.9; width: 15px; height: 15px; }

/* ==================================================================
   留资弹窗（全站统一）
   原来这套视觉只写在首页、且用 body[data-page="home"] 限定，
   其他页面打开的是 og-system 的默认灰白样式——同一个转化入口，
   在不同页面长得不一样。这里抽到共享层，六页一致。
   后续接管理后台时，表单字段名保持不变：
   name / contact / organization / topic / stage / province / city
   ================================================================== */
.og-modal { background: rgba(6,6,5,.74) !important; -webkit-backdrop-filter: blur(12px) !important; backdrop-filter: blur(12px) !important; }
.og-modal__card {
  background: linear-gradient(168deg, #16150f, #0d0c0a 58%, var(--bg,#0a0908)) !important;
  border: 1px solid rgba(226,189,85,.22) !important;
  border-top-color: rgba(226,189,85,.5) !important;
  border-radius: 20px !important;
  box-shadow: 0 48px 120px -40px rgba(0,0,0,.92), inset 0 1px 0 rgba(255,255,255,.06) !important;
  animation: ogLeadIn .5s cubic-bezier(.19,1,.22,1) both;
}
@keyframes ogLeadIn { from { opacity:0; transform: translate3d(0,24px,0) scale(.97) } to { opacity:1; transform:none } }
.og-modal__card::before {
  /* 原来是 right:-80px;width:430px，超出卡片右边界 → 产生横向可滚动区。收回边界内。 */
  right: 0 !important; width: min(360px, 78%) !important; top: -120px !important; height: 280px !important;
  background: radial-gradient(circle, rgba(226,189,85,.13), transparent 68%) !important;
}

.og-modal__close {
  border-color: rgba(255,255,255,.1) !important; background: rgba(255,255,255,.02) !important;
  color: #c9c5bc !important;
  transition: border-color var(--m1) var(--ease-out), color var(--m1) var(--ease-out), transform var(--m2) var(--ease);
}
.og-modal__close:hover { border-color: rgba(226,189,85,.4) !important; color: #fff !important; transform: rotate(90deg); }

.og-modal__heading .og-eyebrow { color: var(--gold) !important; }
.og-modal__heading h2 {
  font-size: clamp(23px,2.5vw,30px) !important; font-weight: 800 !important;
  letter-spacing: -.02em !important; color: var(--text,#f6f1e7) !important;
}
.og-modal__heading > p:last-child { color: var(--muted,#b8b1a4) !important; font-size: 13.5px !important; line-height: 1.85 !important; }

.og-modal__form { border-color: rgba(226,189,85,.14) !important; background: rgba(255,255,255,.018) !important; }
.og-modal__field input, .og-modal__field select {
  background: rgba(0,0,0,.32) !important; border-color: rgba(255,255,255,.09) !important;
  color: var(--text,#f6f1e7) !important;
  transition: border-color var(--m1) var(--ease-out), box-shadow var(--m1) var(--ease-out);
}
.og-modal__field input:focus, .og-modal__field select:focus {
  border-color: rgba(226,189,85,.5) !important; box-shadow: 0 0 0 3px rgba(226,189,85,.08) !important;
}
.og-modal__field > span i { color: var(--gold) !important; font-style: normal; }

.og-modal__submit {
  background: linear-gradient(135deg, var(--gold-hi,#ffe9a0), var(--gold-b,#ffd95e) 46%, var(--gold,#e2bd55)) !important;
  color: #20180a !important; border: 0 !important; position: relative; overflow: hidden;
  transition: transform var(--m2) var(--ease), box-shadow var(--m2) var(--ease);
}
.og-modal__submit:hover { transform: translateY(-2px); box-shadow: 0 16px 40px -14px rgba(255,217,94,.5); }
.og-modal__submit::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 42%, rgba(255,255,255,.42) 50%, transparent 58%);
  transform: translateX(-140%); animation: ogSubmitSheen 4.6s cubic-bezier(.4,0,.2,1) 1.2s infinite;
}
@keyframes ogSubmitSheen { 0%{transform:translateX(-140%)} 26%,100%{transform:translateX(140%)} }

/* 三条承诺：把"留资顾虑"直接写在按钮下面 */
.og-modal__promise { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 7px; }
.og-modal__promise li {
  position: relative; padding-left: 20px;
  font-size: 12px; line-height: 1.7; color: #8e877d;
}
.og-modal__promise li::before {
  content: ""; position: absolute; left: 2px; top: 7px;
  width: 9px; height: 5px; border-left: 1.4px solid var(--gold); border-bottom: 1.4px solid var(--gold);
  transform: rotate(-45deg);
}
.og-modal__hint { margin-top: 12px !important; color: #6f6a62 !important; font-size: 11px !important; }
.og-modal__hint a { color: var(--gold2, #f5d77a) !important; }

.og-modal__qr {
  border-color: rgba(226,189,85,.16) !important;
  background: linear-gradient(180deg, rgba(226,189,85,.055), rgba(255,255,255,.01)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}
.og-modal__qr h3 { color: var(--text,#f6f1e7) !important; }
.og-modal__qr p { font-size: 12px !important; line-height: 1.8 !important; color: #8e877d !important; }
.og-modal__qr p b { color: var(--gold-l,#f5d77a); font-weight: 700; }
.og-modal__qr img { border-radius: 10px; box-shadow: 0 12px 30px -14px rgba(0,0,0,.7) !important; }

/* ================================================================
   留资弹窗 v4 · 表单放大，右栏二维码分主次
   ================================================================ */
.og-modal__card {
  width: min(880px, 100%) !important;
  padding: clamp(28px, 3.2vw, 40px) !important;
  /* 卡片右上角那圈装饰光晕是绝对定位、超出右边界的，
     overflow:auto 会把它算成可滚动内容 → 弹窗能左右拖。只保留纵向滚动。 */
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
.og-modal__heading h2 {
  font-size: clamp(25px, 2.7vw, 33px) !important;
  letter-spacing: -.045em !important;
  margin-bottom: 10px !important;
}
.og-modal__heading > p:last-child {
  font-size: 13px !important; line-height: 1.8 !important; max-width: 520px !important;
}
.og-modal__body {
  grid-template-columns: minmax(0, 1fr) 210px !important;
  gap: 26px !important;
  margin-top: 24px !important;
  align-items: start !important;
}
/* ---- 表单：整体放大一档 ---- */
.og-modal__form { padding: 22px !important; gap: 16px !important; }
.og-modal__field { gap: 9px !important; }
.og-modal__field > span { font-size: 12.5px !important; }
.og-modal__field small { font-size: 10.5px !important; }
.og-modal__field input, .og-modal__field select {
  height: 46px !important; font-size: 13.5px !important; padding: 0 13px !important;
  border-radius: 9px !important;
}
.og-field-error { color: #cf8d7f !important; font-size: 11px !important; line-height: 1.5; }
.og-modal__submit { margin-top: 6px !important; }
.og-modal__hint { margin-top: 2px !important; font-size: 11px !important; }

/* ---- 右栏：一列到底，居中对齐，不用 figure/figcaption 免得基线打架 ---- */
.og-modal__qr {
  align-self: start;
  min-height: 0 !important;
  padding: 20px 16px !important;
  border-radius: 12px;
  text-align: center;
  display: block !important;
}
.og-modal__qr > * { margin-left: auto; margin-right: auto; }
.og-qr-tag {
  display: inline-block; margin: 0 0 14px !important;
  padding: 5px 13px 4px; border: 1px solid rgba(226,189,85,.3); border-radius: 999px;
  background: rgba(226,189,85,.07);
  font-size: 10.5px !important; font-weight: 600; letter-spacing: .12em;
  color: var(--gold-l, #f5d77a) !important; white-space: nowrap;
}
.og-qr-img {
  display: block; width: 150px; height: auto;
  padding: 7px; border-radius: 8px; background: #fff;
  box-shadow: 0 12px 28px -16px rgba(0,0,0,.8) !important;
}
.og-qr-img--sub { width: 112px; opacity: .94; }
.og-qr-desc {
  margin: 14px 0 0 !important;
  font-size: 12.5px !important; line-height: 1.7 !important;
  font-weight: 700; color: var(--text-h, #fffaf0) !important;
}
.og-qr-desc em {
  display: inline-block; margin-top: 4px;
  font-style: normal; font-weight: 400; font-size: 11px; color: #857f76;
}
.og-qr-rule {
  height: 1px; margin: 20px 0 !important;
  background: linear-gradient(90deg, transparent, rgba(226,189,85,.22), transparent);
}
.og-qr-note {
  margin: 0 0 12px !important;
  font-size: 11.5px !important; line-height: 1.6 !important; color: #8e877d !important;
}

/* ================================================================
   提交成功确认弹窗
   ================================================================ */
.og-done {
  position: fixed; inset: 0; z-index: 6300; display: none; place-items: center; padding: 24px;
  background: rgba(6,6,5,.78);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.og-done.is-open { display: grid; }
.og-done__card {
  width: min(400px, 100%); padding: 34px 30px 28px; text-align: center;
  border: 1px solid rgba(226,189,85,.28); border-radius: 16px;
  background: linear-gradient(160deg, rgba(24,22,19,.99), rgba(12,11,10,.995));
  box-shadow: 0 36px 100px -40px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.055);
  animation: ogDoneIn .4s cubic-bezier(.16,1,.3,1) both;
}
@keyframes ogDoneIn { from { opacity:0; transform: translate3d(0,14px,0) scale(.97);} to { opacity:1; transform:none; } }
.og-done__mark { display: block; width: 46px; height: 46px; margin: 0 auto 18px; color: var(--gold-l, #f5d77a); }
.og-done__mark svg { width: 46px; height: 46px; }
.og-done__card h3 {
  margin: 0 0 10px; font-size: 19px; font-weight: 750; letter-spacing: -.02em; color: var(--text-h, #fffaf0);
}
.og-done__card p { margin: 0 0 22px; font-size: 13px; line-height: 1.95; color: var(--muted, #b8b1a4); }
.og-done__card p b { color: var(--gold-l, #f5d77a); font-weight: 700; }
.og-done__ok { width: 100%; justify-content: center; }

@media (max-width: 760px) {
  .og-modal__body { grid-template-columns: 1fr !important; }
  .og-modal__qr { padding: 22px 16px !important; }
  .og-qr-img { width: 168px; }
  .og-qr-img--sub { width: 124px; }
}

@media (prefers-reduced-motion: reduce) {
  .og-modal__card, .og-modal__submit::after, .og-done__card { animation: none !important; }
}

/* ==================================================================
   首屏两种规格
   .nhero.full  —— 满屏（平台能力）：整屏建立气场，卡片压在底部
   .nhero.slim  —— 收敛（合作计划）：招商页要尽快见到价格，不占满屏
   两者共用同一套 kicker / h1 / lede / 卡片 / 提示带，只改节奏。
   ================================================================== */
.og-noir .nhero.full {
  min-height: calc(100svh - 78px);
  display: flex; flex-direction: column; justify-content: flex-start;
  padding-bottom: clamp(40px, 4vw, 60px);
}
.og-noir .nhero.full .nhero-inner { max-width: 660px; }

.og-noir .nhero.full .nlede { max-width: 600px; }
.og-noir .nhero.full .nhero-art { --hero-art-op: .5; width: min(48%, 640px); }
/* 满屏时把四张卡压到视口底部，形成"下面还有内容"的暗示 */
.og-noir .nhero.full .nfeats { margin-top: auto; padding-top: clamp(44px, 5vw, 70px); }
.og-noir .nhero.full .nhint { margin-top: clamp(18px, 1.8vw, 24px); }
/* 底部滚动提示 */
.og-noir .nhero-cue {
  position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%);
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  font-size: 10.5px; letter-spacing: .2em; color: var(--muted2); z-index: 2;
  background: none; border: 0; cursor: pointer; font-family: inherit;
  transition: color var(--m1) var(--ease-out);
}
.og-noir .nhero-cue:hover { color: var(--gold-l); }
.og-noir .nhero-cue i {
  display: block; width: 1px; height: 22px;
  background: linear-gradient(180deg, transparent, var(--gold));
  animation: nCue 2.4s ease-in-out infinite;
}
@keyframes nCue { 0%,100%{opacity:.35;transform:scaleY(.7)} 50%{opacity:1;transform:scaleY(1)} }
@media (prefers-reduced-motion: reduce) { .og-noir .nhero-cue i { animation: none; } }

.og-noir .nhero.slim { padding-bottom: clamp(38px, 4vw, 54px); }

.og-noir .nhero.slim .nfeats { margin-top: clamp(30px, 3.2vw, 42px); }
.og-noir .nhero.slim .nhero-art { --hero-art-op: .44; width: min(42%, 540px); }

@media (max-width: 900px) {
  .og-noir .nhero.full { min-height: 0; padding-bottom: 56px; }
  .og-noir .nhero.full .nfeats { margin-top: 40px; }
  .og-noir .nhero-cue { display: none; }
}

/* ==================================================================
   首屏能力卡的标记（.nmark）· 第二版
   上一版加了网格底板 + 角上金点，方向反了：装饰越多越显廉价。
   奢侈品与高端刊物的做法恰恰相反——去掉容器、放大留白、把笔画做细，
   让图形本身成为唯一的东西。这一版：
     · 去掉方形底板与角点，图形直接落在卡面上
     · 尺寸放大到 40px，描边收细到 1.2，香槟金
     · 下方一道 22px 的极短金线作为唯一结构，hover 时向右延展
   ================================================================== */
.og-noir .nmark {
  width: 40px; height: 40px; flex: none;
  margin-bottom: 26px; position: relative;
  background: none; border: 0; border-radius: 0; box-shadow: none; overflow: visible;
}
.og-noir .nmark::before { content: none; }
.og-noir .nmark svg {
  position: static; width: 40px; height: 40px;
  stroke-width: 1.2; color: var(--gold-l);
  transition: color var(--m1) var(--ease-out), transform var(--m2) var(--ease);
}
/* 唯一的结构：图形下方一道短金线 */
.og-noir .nmark::after {
  content: ""; position: absolute; left: 0; bottom: -13px;
  width: 22px; height: 1px; border-radius: 1px;
  background: linear-gradient(90deg, var(--gold), rgba(226,189,85,0));
  transform-origin: left center;
  transition: width var(--m2) var(--ease), background var(--m1) var(--ease-out);
}
.og-noir .nfeat:hover .nmark svg { color: var(--gold-hi); transform: translateY(-1px); }
.og-noir .nfeat:hover .nmark::after { width: 40px; }
/* 辅色变体：只换笔画与短线的颜色 */
.og-noir .nmark.b  svg { color: #93a7ba; }
.og-noir .nmark.b::after  { background: linear-gradient(90deg, var(--ink), rgba(125,147,168,0)); }
.og-noir .nmark.o  svg { color: #cf9c7d; }
.og-noir .nmark.o::after  { background: linear-gradient(90deg, var(--clay), rgba(192,138,106,0)); }
.og-noir .nmark.gr svg { color: #9fb27e; }
.og-noir .nmark.gr::after { background: linear-gradient(90deg, var(--moss), rgba(143,163,109,0)); }
@media (prefers-reduced-motion: reduce) {
  .og-noir .nmark svg, .og-noir .nmark::after { transition: none; }
}

/* ==================================================================
   Hero 背景的极缓呼吸
   静态图在暗底上久看会"死"。给一个 22s 的超慢漂移 + 亮度微起伏，
   位移只有 6px、亮度只差 6%——察觉不到在动，但画面不再是死的。
   ================================================================== */
@keyframes nArtDrift {
  0%,100% { transform: translate3d(0,0,0) scale(1);      opacity: var(--hero-art-op, .5); }
  50%     { transform: translate3d(-6px,-4px,0) scale(1.012); opacity: calc(var(--hero-art-op, .5) * 1.06); }
}
.og-noir .nhero-art { animation: nArtDrift 22s cubic-bezier(.45,0,.55,1) infinite; will-change: transform, opacity; }
@media (prefers-reduced-motion: reduce) { .og-noir .nhero-art { animation: none; } }