/* ============================================================
   驰骋控股集团官网 · 全站样式
   视觉令牌取自 MasterGo 设计稿（文件 202052772874868 / 首页 65:7729）
   留白与字号阶梯参照腾讯官网实测值作为响应式降级基准
   ============================================================ */

/* ---------------- 字体：本地托管，无外链 ---------------- */
@font-face{font-family:'D-DIN';font-style:normal;font-weight:400;font-display:swap;
  src:url('fonts/d-din-400.woff2') format('woff2')}
@font-face{font-family:'D-DIN';font-style:normal;font-weight:700;font-display:swap;
  src:url('fonts/d-din-700.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;
  src:url('fonts/inter-400.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;
  src:url('fonts/inter-500.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;
  src:url('fonts/inter-600.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;
  src:url('fonts/inter-700.woff2') format('woff2')}
/* 阿里妈妈数黑体（Alimama ShuHeiTi）：主视觉/大标题字族。
   官方永久免费正版商用（淘宝(中国)软件有限公司，公共授权），仅 1 个字重（Bold），
   故 400 / 700 两档均指向同一文件，保证标题处 font-weight:400 也能命中该字体。
   收录 GB2312 6767 汉字 + 英文 52 + 标点 206 = 7025 字符（简体，繁体有缺字） */
@font-face{font-family:'Alimama ShuHeiTi';font-style:normal;font-weight:400;font-display:swap;
  src:url('fonts/alimama-shuheiti-bold.woff2') format('woff2')}
@font-face{font-family:'Alimama ShuHeiTi';font-style:normal;font-weight:700;font-display:swap;
  src:url('fonts/alimama-shuheiti-bold.woff2') format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:300;font-display:swap;
  src:url('fonts/inter-tight-300.woff2') format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:400;font-display:swap;
  src:url('fonts/inter-tight-400.woff2') format('woff2')}
@font-face{font-family:'Inter Tight';font-style:normal;font-weight:700;font-display:swap;
  src:url('fonts/inter-tight-700.woff2') format('woff2')}

:root{
  /* 品牌色 —— 全部取自设计稿 */
  --brand:#0067FF;            /* 主蓝：品牌生态区块底 / 链接 / 强调 */
  --brand-num:#0A5CFF;        /* 数据数字蓝 */
  --brand-dk:#0052CC;
  --brand-top:#0A5CFF;        /* 品牌轮播中「驰骋通」文字色 */
  --brand-deep:#03234B;       /* 页尾深蓝 */
  --accent:#F24E00;           /* 生意红：加盟 CTA */
  --zlys:#E60012;             /* 左邻右舍红 */
  --shyz:#00AC3C;             /* 生活驿站绿 */
  --lbc:#FF6200;               /* 萝卜白菜橙 */
  --fg:#1D2540;                /* 主文字 */

  --ink:#000000;
  --ink-88:rgba(0,0,0,.88);
  --ink-2:#4A5578;
  --ink-3:#999999;
  --line:#DCE2EE;
  --line-soft:rgba(216,216,216,.42);
  --bg:#FFFFFF;
  --bg-soft:#F5F7FA;
  --bg-dark:#03234B;

  /* 字体族 —— D-DIN 数字 / DingTalk JinBuTi 标题 / Inter 正文 */
  --ff-body:'Inter','PingFang SC','Hiragino Sans GB','Microsoft YaHei',system-ui,sans-serif;
  --ff-num:'D-DIN','Inter','PingFang SC',sans-serif;
  --ff-title:'Alimama ShuHeiTi','PingFang SC','Hiragino Sans GB','Microsoft YaHei',sans-serif;
  --ff-tight:'Inter Tight','Inter','PingFang SC',sans-serif;

  --sp-xxl:120px;
  --sp-xl:96px;
  --sp-lg:64px;
  --sp-md:48px;
  --sp-sm:36px;
  --sp-xs:24px;

  --gutter:88px;
  --shell:1650px;      /* 设计稿内容区宽度（229 → 1691） */
  --header-h:76px;     /* 页头高度：阿凯看稿反馈 64 太挤、logo 太小 → 提到 76（阿里 64 与腾讯 106 之间），logo 同步放大到 52px 高 */
  --row-gutter:40px;

  --fs-h0:120px;
  --fs-h1:85px;
  --fs-h2:62px;
  --fs-h3:46px;
  --fs-h4:34px;
  --fs-h5:24px;
  --fs-lg:21px;
  --fs-body:16px;
  --fs-sm:14px;

  --radius:20px;       /* 小卡片圆角 */
  --radius-md:20px;    /* 小卡 / 二维码圆角 */
  --radius-lg:40px;     /* 大卡片与区块圆角 */
  --radius-sm:8px;     /* 表单与小元素 */
  --radius-pill:999px; /* 胶囊按钮 */
  --lh-tight:1.2;
  --lh-body:1.5;
  --ls:0.25px;
}
@media (max-width:1279px){
  :root{
    --sp-xxl:64px;--sp-xl:56px;--sp-lg:48px;
    --gutter:64px;--row-gutter:32px;
    --fs-h0:100px;--fs-h1:48px;--fs-h2:40px;--fs-h3:33px;--fs-h4:28px;--fs-h5:23px;
    --fs-lg:19px;--fs-body:16px;
    --header-h:72px;
  }
}
@media (max-width:639px){
  :root{
    --sp-xxl:48px;--sp-xl:40px;--sp-lg:36px;--sp-md:32px;
    --gutter:24px;--row-gutter:20px;
    --fs-h0:40px;--fs-h1:28px;--fs-h2:25px;--fs-h3:22px;--fs-h4:20px;--fs-h5:18px;
    --fs-lg:16px;--fs-body:14px;--fs-sm:12px;
    --header-h:64px;
    --radius:20px;--radius-md:16px;
  }
}

/* ---------------- 基础 ---------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  font-size:var(--fs-body);font-weight:400;line-height:var(--lh-body);
  letter-spacing:var(--ls);-webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;vertical-align:middle}
h1,h2,h3,h4,h5{margin:0;font-weight:600;line-height:var(--lh-tight);letter-spacing:var(--ls);color:var(--ink)}
h1{font-size:var(--fs-h1)}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-h3)}
h4{font-size:var(--fs-h4)}
h5{font-size:var(--fs-h5);line-height:var(--lh-body)}
p{margin:0}
a{color:inherit;text-decoration:none;transition:color .3s ease-out}
ul{margin:0;padding:0;list-style:none}
button{font:inherit;border:0;background:none;cursor:pointer}

.wrap{width:100%;padding-left:var(--gutter);padding-right:var(--gutter)}
.grid{display:grid;gap:var(--row-gutter)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
.g-2-1{grid-template-columns:1.35fr 1fr}
@media (max-width:1023px){
  .g-3,.g-4{grid-template-columns:repeat(2,1fr)}
  .g-2-1{grid-template-columns:1fr}
}
@media (max-width:639px){
  .g-2,.g-3,.g-4{grid-template-columns:1fr}
}

.section{padding-top:var(--sp-xxl);padding-bottom:var(--sp-xxl)}
.section--soft{background:var(--bg-soft)}
.section--tight{padding-top:var(--sp-lg);padding-bottom:var(--sp-lg)}
.headings{margin-bottom:var(--sp-xxl)}
.headings p{margin-top:var(--sp-xs);color:var(--ink-3);font-size:var(--fs-lg)}
.headings--row{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--sp-md)}
@media (max-width:1279px){.headings{margin-bottom:var(--sp-lg)}}
@media (max-width:639px){.headings--row{flex-direction:column;align-items:flex-start}}

/* ---------------- 入场动效（滚动触发淡入） ---------------- */
/* 起点是「半透明 + 轻微上移」，进入视口拿到 .show 后落到原位。
   与旧版的两处差别：
   ① 位移从 20%（相对元素自身高度）改成固定 px。百分比在大块上是 80 多 px、
      在小标题上只十几 px，同一屏里轻重不均；固定 px 才谈得上「轻微」。
   ② 时长 .3s → .62s，缓动换成 ease-out 三次曲线，收尾不顿。
   同组元素靠 --fd 错峰（JS 按兄弟顺序写进内联样式），才有一层层落位的感觉。 */
/* 后半串选择器是「补挂」的目标：合作商招募的标题与两张方向卡、资讯列表的
   筛选栏/网格/翻页。它们原本没有入场标记，靠 main.js 补 .fade-up 类；
   但 main.js 在 body 末尾才执行，首帧内容已经画出来了，补类那一刻会
   「先看见整块、再缩回去淡入」闪一下。所以这里直接写进选择器，
   首帧就是隐藏态，补类只负责让它进 IO 的观察名单。 */
.fade-up,.fade-left,.fade-right,
:is(.pr-dir__ttl,.pr-dir .pr-card,.nw .filters,.nw .nw-grid,.nw .nw-foot){
  opacity:0;visibility:hidden;
  /* 2026-10-29 阿凯反馈「全局入场还是有点快」：时长 .62s → .95s（+53%），
     位移 14px → 20px，缓动换成更软的三次曲线（起手快、收尾长），观感是「落位」而不是「弹上去」。
     分段间隔由 main.js 的 STG_STEP 控制（110ms），两者要一起调。 */
  transition:opacity 1.05s cubic-bezier(.16,.84,.28,1),transform 1.05s cubic-bezier(.16,.84,.28,1),visibility 1.05s;
  transition-delay:var(--fd,0ms);
  will-change:opacity,transform;
}
.fade-up{transform:translateY(28px)}
.fade-left{transform:translateX(30px)}
.fade-right{transform:translateX(-30px)}
:is(.pr-dir__ttl,.pr-dir .pr-card,.nw .filters,.nw .nw-grid,.nw .nw-foot){transform:translateY(28px)}
/* 上滑离开视口后，元素从「上方」退场/再入场时用负位移（main.js 按位置挂 .is-above）。
   必须写在 .show 之前：.show 同为双类选择器，靠后者优先，才能覆盖回 transform:none。 */
.fade-up.is-above{transform:translateY(-28px)}
.fade-up.show,.fade-left.show,.fade-right.show,
:is(.pr-dir__ttl.show,.pr-dir .pr-card.show,.nw .filters.show,.nw .nw-grid.show,.nw .nw-foot.show){opacity:1;visibility:visible;transform:none}

/* ---------------- 链接与按钮 ---------------- */
.link{display:inline-block;position:relative;font-weight:600;color:var(--brand)}
.link .t{position:relative;display:inline-block}
.link .t::after{
  content:'';position:absolute;left:0;bottom:-3px;width:100%;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:bottom right;
  transition:transform .25s ease-in-out;transition-delay:150ms;
}
.link:hover .t::after{transform:scaleX(1);transform-origin:bottom left}
.link:hover{color:var(--brand-dk)}
.link .arw{display:inline-block;margin-left:8px;transition:transform .3s ease-out}
.link:hover .arw{transform:translateX(4px)}
.link--light,.link--light:hover{color:#fff}

.btn{
  display:inline-flex;align-items:center;gap:12px;
  padding:18px 36px;border-radius:var(--radius-pill);
  font-size:var(--fs-body);font-weight:600;letter-spacing:var(--ls);
  transition:background .3s ease-out,color .3s ease-out,border-color .3s ease-out;
}
.btn--accent{background:var(--accent);color:#fff}
.btn--accent:hover{background:#D84300}
.btn--ghost{border:1px solid rgba(255,255,255,.4);color:#fff}
.btn--ghost:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn--brand{background:var(--brand);color:#fff}
.btn--brand:hover{background:var(--brand-dk)}

/* ---------------- 页头（设计稿 65:7517 · 90px）---------------- */
.header{
  position:fixed;top:0;left:0;width:100%;z-index:40;
  background:rgba(255,255,255,.8);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:0 1px 20px rgba(0,0,0,.04);
  transition:top .4s ease,box-shadow .4s ease,background .25s ease;
}
.header.is-scrolled{box-shadow:0 1px 20px rgba(0,0,0,.1)}

/* 实色态：离开首屏后（上拉露出时）页头切换为纯白实底 + 深色文字（2026-10-20 由深蓝改白）。
    注意：logo 是 CSS mask + currentColor，深色底上需反白、白底上需深色，随态切换。 */
.header.is-solid{
  background:#FFFFFF;
  -webkit-backdrop-filter:none;backdrop-filter:none;
  box-shadow:0 1px 20px rgba(0,0,0,.1);
}
.header.is-solid .brand{color:var(--brand)}
.header.is-solid .brand__cn{color:var(--brand-deep)}
.header.is-solid .brand__en{color:var(--ink-3)}
.header.is-solid .nav a{color:var(--ink)}
/* 当前页项在实色（纯白）态下若被 --ondark 的白覆盖，需按品牌蓝再盖回来（截图：白字压白底） */
.header.is-solid .nav a.is-current{color:var(--brand)}
.header.is-solid .nav a .t::after{background:var(--brand)}
.header.is-solid .burger::before,
.header.is-solid .burger::after{background:var(--ink)}

/* 深色 Hero 页的穿透态（index/about/careers×3/cooperation，HTML 加 header--ondark）：
   参照阿里官网实测 rgba(0,0,0,.2) 无模糊，压在深色 hero 上呈薄薄一层暗纱。
   只用于深 hero 页 —— business(#E7EDF7) 和 page-head 系(#F5F7FA) 浅底上黑纱白字不可读
   （实测亮度 234/247 vs 深 hero 113-170），那些页保持白毛玻璃。
   滚到实色态切纯白实底：.header.is-solid 是双类选择器，优先级高于单类 --ondark */
.header--ondark{
  background:rgba(0,0,0,.2);
  -webkit-backdrop-filter:none;backdrop-filter:none;
  box-shadow:none;
}
/* logo 是 CSS mask + currentColor，所以只要改 .brand 的 color 就能反白，无需逐个元素写 */
.header--ondark .brand{color:#fff}
.header--ondark .nav a{color:#fff}
.header--ondark .nav a:hover{color:rgba(255,255,255,.85)}
/* 当前页项：.nav a.is-current 的品牌蓝特异性同阶且靠后，会盖掉上面的白，需显式再盖一次 */
.header--ondark .nav a.is-current{color:#fff}
.header--ondark .nav a .t::after{background:#fff}
.header--ondark .burger::before,
.header--ondark .burger::after{background:#fff}
/* 黑纱态下描边：1px 渐变线，中间峰值 50% 白、向两侧缓慢淡出。
   中间不能用实心 #fff —— 阿凯看稿反馈「白太抢眼、反差太大、没有渐入感」。
   多打两个中间 stop（20%/80%）让淡入淡出更缓，而不是 0→100 的直线
   只给深 hero 穿透态加 —— 实色驰骋蓝态不加（阿里实色黄也是纯色无边） */
.header--ondark::after{
  content:'';position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.12) 20%,
    rgba(255,255,255,.5) 50%,
    rgba(255,255,255,.12) 80%,
    rgba(255,255,255,0) 100%);
  pointer-events:none;
}
/* 实色态时 --ondark 类仍在（双类共存），必须显式关掉描边，否则白线画在驰骋蓝上 */
.header.is-solid.header--ondark::after{content:none}
/* 注：原有一条 .header:has(.nav__item:hover){background:#fff}，两个问题：
   ① 选择器写的是 .nav__item，但 HTML 里导航项是 .nav 下的 <a>，没有这个类，规则从未生效；
   ② 它存在的理由（毛玻璃与 hover 下拉的纯白面板形成色差）在移除主菜单下拉后已不成立，
      且真生效会在深色 Hero 上造成 hover 闪白。故整段删除，不修选择器。 */
.header__inner{
  height:var(--header-h);
  max-width:1650px;margin:0 auto;
  padding-left:32px;padding-right:32px;
  display:flex;align-items:center;gap:128px;
}
.brand{display:flex;align-items:center;gap:10px;flex:none;color:var(--brand);transition:color .25s ease}
/* 驰骋股份 logo：官方原版 logo-cckg.svg，CSS mask + currentColor 控色（一份形状适配深浅场景）
   —— 不改造型，只定尺寸。尺寸依据腾讯实测反推：
   腾讯 logo 200.5×27 为纯字标，字高即框高；本 logo 为「左图形 + 右文字」，
   大字「驰骋股份」实测占 SVG 全高 34.7%（y47~79），故大字要到腾讯的 27px 需整体 78 高。
   取 64 高（1440 宽）：大字 22px、总宽 164px，块面与腾讯 200.5×27 视觉体量相当。 */
.brand__logo{
  display:block;flex:none;height:clamp(36px,2.708vw,52px);aspect-ratio:239.636/93.358;
  background-color:currentColor;
  -webkit-mask:url(logo-cckg.svg) center/contain no-repeat;
  mask:url(logo-cckg.svg) center/contain no-repeat;
}
.brand__cn{font-size:20px;font-weight:600;letter-spacing:2px;color:var(--brand-deep);transition:color .25s ease}
.brand__en{font-size:11px;font-weight:600;letter-spacing:1.5px;color:var(--ink-3);transition:color .25s ease}
/* 中英文切换：位置与样式参照腾讯官网实测（右上角、垂直居中、「简 EN 繁」三选一，
   当前项蓝色高亮、其余灰色轻字重 16px/300、字距 0.25px）。本站无繁体内容 → 「简 / EN」。
   EN 暂无英文站，href="#" 由 main.js 拦截，将来接英文站只改 href */
.lang{
  display:flex;align-items:center;gap:12px;flex:none;
  margin-left:36px;
  font-size:14px;font-weight:300;letter-spacing:.25px;
}
.lang__item{color:rgba(29,37,64,.45);text-decoration:none;transition:color .25s ease}
.lang__item.is-cur{color:var(--brand);font-weight:500}
.lang__item:not(.is-cur):hover{color:var(--brand)}
/* 深色 hero 穿透态与驰骋蓝实色态：灰白 + 纯白当前项（当前项用白加强对比） */
.header--ondark .lang__item{color:rgba(255,255,255,.72)}
.header--ondark .lang__item.is-cur{color:#fff;font-weight:500}
.header--ondark .lang__item:not(.is-cur):hover{color:#fff}
/* 实色态（纯白底）：语言切换恢复常规深灰 + 品牌蓝当前项 */
.header.is-solid .lang__item{color:rgba(29,37,64,.45)}
.header.is-solid .lang__item.is-cur{color:var(--brand);font-weight:500}
.header.is-solid .lang__item:not(.is-cur):hover{color:var(--brand)}
/* 移动端导航收进 burger 抽屉，语言切换暂不露出（将来进抽屉） */
@media (max-width:767px){.lang{display:none}}
.nav{display:flex;align-items:center;gap:var(--row-gutter);margin-left:auto}
.nav a{font-size:var(--fs-body);font-weight:500;white-space:nowrap;transition:color .25s ease}
.nav a .t{position:relative;display:inline-block}
.nav a .t::after{
  content:'';position:absolute;left:0;bottom:-6px;width:100%;height:2px;background:var(--brand);
  transform:scaleX(0);transform-origin:bottom right;
  transition:transform .25s ease-in-out,background .25s ease;transition-delay:150ms;
}
.nav a:hover{color:var(--brand)}
.nav a:hover .t::after{transform:scaleX(1);transform-origin:bottom left}
.nav a.is-current{color:var(--brand)}
.nav a.is-current .t::after{transform:scaleX(1);transform-origin:bottom left}

.burger{display:none;width:24px;height:16px;position:relative;flex:none;margin-left:auto}
.burger::before,.burger::after{content:'';position:absolute;left:0;width:100%;height:1.5px;background:var(--ink);transition:transform .3s,background .25s ease}
.burger::before{top:0}
.burger::after{bottom:0}
/* 移动端菜单：参照腾讯官网的整屏抽屉 —— 顶部「简 EN 繁 / 关闭 ×」栏 + 大字菜单项 + 逐项分隔线。
   drawer 放在 header 之外（body 直接子级）：header 用了 backdrop-filter，留在里面可能让
   position:fixed 产生包含块问题。滑入用 translateY + visibility，不用 display 切换（保留过渡）。 */
.drawer{
  position:fixed;inset:0;z-index:60;background:#fff;
  display:flex;flex-direction:column;overflow-y:auto;
  transform:translateY(-100%);visibility:hidden;
  transition:transform .42s cubic-bezier(.4,0,.2,1),visibility .42s;
}
.drawer.is-open{transform:none;visibility:visible}
.drawer__top{
  flex:none;display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px var(--gutter);border-bottom:1px solid var(--line);
}
.drawer__lang{display:flex;align-items:center;gap:20px;font-size:17px;font-weight:600;line-height:1}
.drawer__lang .is-cur{color:var(--brand)}
.drawer__lang a{color:var(--ink-3)}
.drawer__lang a:hover{color:var(--brand)}
.drawer__close{
  display:flex;align-items:center;gap:6px;border:0;background:none;cursor:pointer;
  color:var(--brand);font-family:inherit;font-size:17px;font-weight:600;line-height:1;padding:0;
}
.drawer__close svg{width:15px;height:15px;flex:none}
.drawer__nav{flex:1 0 auto;padding:0 var(--gutter)}
.drawer__nav a{
  display:flex;align-items:center;min-height:min(84px,21vw);
  border-bottom:1px solid var(--line);
  font-size:min(32px,8.4vw);font-weight:700;line-height:1.3;color:var(--ink);
}
.drawer__nav a.is-current{color:var(--brand)}
.drawer__nav a:active{background:var(--bg-soft)}
/* 注：抽屉只放一级菜单 —— 校园招聘/社会招聘等二级入口由页面内子导航 / Tab 承担，避免重复 */
/* 抽屉打开时锁住页面滚动 */
body.is-menu-open{overflow:hidden}
@media (max-width:1279px){
  .header__inner{gap:48px}
  .nav{gap:26px}
}
@media (max-width:1023px){
  .nav{display:none}
  .burger{display:block}
}
@media (max-width:639px){
  .header__inner{padding-left:20px;padding-right:20px}
  .brand__logo{height:32px}
  .ft2 .ft2__logo .brand__logo{height:44px}
  .brand__cn{font-size:16px;letter-spacing:1px}
  .brand__en{display:none}
}

/* ---------------- 素材占位（图片素材未到位时的显式占位，非设计稿视觉）---------------- */
.ph{position:relative;overflow:hidden;background:#E7EDF7}
.ph::before{
  content:'';position:absolute;inset:0;opacity:.5;
  background-image:
    linear-gradient(45deg,rgba(10,92,255,.06) 25%,transparent 25%,transparent 75%,rgba(10,92,255,.06) 75%),
    linear-gradient(45deg,rgba(10,92,255,.06) 25%,transparent 25%,transparent 75%,rgba(10,92,255,.06) 75%);
  background-size:18px 18px;background-position:0 0,9px 9px;
}
.ph--dark{background:#0B2E5C}
.ph--dark::before{
  background-image:
    linear-gradient(45deg,rgba(255,255,255,.05) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.05) 75%),
    linear-gradient(45deg,rgba(255,255,255,.05) 25%,transparent 25%,transparent 75%,rgba(255,255,255,.05) 75%);
}
.ph__tag{
  position:absolute;left:0;bottom:0;z-index:2;
  font-size:12px;line-height:1;letter-spacing:.5px;
  color:#5A6B85;background:rgba(255,255,255,.92);
  padding:7px 12px;border-top-right-radius:8px;white-space:nowrap;
}
.ph--dark .ph__tag{color:#A9BDD6;background:rgba(3,35,75,.78)}

/* ---------------- 首页 01 首屏（设计稿 65:7282 · 1002px） ---------------- */
.home-hero{
  position:relative;overflow:hidden;background:var(--brand-deep);
  /* 穿透式首屏：hero 从 y=0 铺起，半透明页头压在视频上（与加入我们三家同款，2026-09-30）
     高度同步 +header-h，保证页头下方可见区域与原设计稿 1002 一致 */
  height:min(1002px,100vh);
  display:flex;align-items:flex-start;justify-content:center;
}
.home-hero__media{position:absolute;inset:0;z-index:0}
.home-hero__media .ph{width:100%;height:100%}
.home-hero__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
/* 品牌宣传片完整版弹窗 */
.video-modal{position:fixed;inset:0;z-index:200;background:rgba(4,14,30,.86);display:flex;align-items:center;justify-content:center;padding:24px}
.video-modal[hidden]{display:none}
.video-modal__box{position:relative;width:min(1280px,100%)}
.video-modal__box video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000;border-radius:var(--radius-lg);overflow:hidden}
.video-modal__close{
  position:absolute;right:0;top:-52px;width:40px;height:40px;border:0;cursor:pointer;
  background:rgba(255,255,255,.12);border-radius:50%;color:#fff;font-size:26px;line-height:1;
  display:flex;align-items:center;justify-content:center;transition:background .25s;
}
.video-modal__close:hover{background:rgba(255,255,255,.28)}
.home-hero__scrim{
  position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(3,35,75,.42) 0%,rgba(3,35,75,.12) 42%,rgba(3,35,75,.5) 100%);
}
.home-hero__inner{
  position:relative;z-index:2;
  /* 文案定位：对齐阿里 banner-content 实测 top:450（1920 档 386+64=450）。
     旧值 434（标题 y=498）被阿凯看稿指出「整体文字有点偏下」，上移 48。
     2026-10-06 阿凯要求：首屏轮播文案与「左邻右舍/萝卜白菜/生活驿站」三屏一致改为**左对齐**
     （原先是居中），左边界走全站 --gutter，与品牌三屏的左下角排版同属一套对齐语言 */
  width:100%;margin:0;
  padding:calc(374px + var(--header-h)) min(119px,6.198vw) 0;   /* 左边界与品牌三屏的 x119 对齐 */
  display:flex;flex-direction:column;align-items:flex-start;
  text-align:left;
}
/* 首屏轮播文案（规格参照阿里 banner-content 实测：大 40px/800、小 24px/400、左对齐，
   fadeIn/fadeOut 约 6s 一轮）。grid 堆叠让容器自动取最高那段的高度，省掉写死高度 */
.hv-copy{display:grid;width:100%}
.hv-slide{
  grid-area:1/1;
  opacity:0;transform:translateY(8px);
  /* 淡出与淡入必须同时长、同 easing，且由 JS 在同一 tick 触发：
     两条 transition 进度 p 严格同步 → 旧段 1-ease(p)、新段 ease(p)，
     任意时刻两者最大值恒 ≥0.5，数学上排除「两段都很淡」的空窗。
     若改成错开触发（曾试过 setTimeout 延迟 400ms 挂新段），
     定时器抖动会把最低透明度压到 0.112（实测约 50ms 的近全透明空窗） */
  transition:opacity .5s ease,transform .5s ease;
  pointer-events:none;
}
.hv-slide.is-on{opacity:1;transform:none;pointer-events:auto}
.hv-slide__t{
  margin:0;color:#fff;
  font-family:var(--ff-title);
  font-size:56px;font-weight:800;line-height:1.29;letter-spacing:4px;
  text-shadow:0 2px 30px rgba(0,0,0,.35);
}
.hv-slide__s{
  margin:14px 0 0;
  font-size:24px;font-weight:400;line-height:1.29;color:rgba(255,255,255,.92);
  text-shadow:0 2px 20px rgba(0,0,0,.35);
}
/* 完整视频：药丸按钮（半透明黑底 + 细描边），文字在左、实心三角箭头在右，落在首屏右下角 */
.hv-play{
  position:absolute;right:var(--gutter);bottom:56px;z-index:3;
  display:inline-flex;align-items:center;gap:12px;
  padding:12px 24px;
  background:rgba(0,0,0,.4);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  color:#fff;font-size:16px;font-weight:400;letter-spacing:.5px;
  transition:background-color .25s ease,transform .25s ease;
}
.hv-play:hover{background:rgba(0,0,0,.58)}
.hv-play__icon{
  width:20px;height:20px;flex:none;display:block;
  fill:currentColor;
}
@media (max-width:1279px){
  .home-hero__inner{padding-top:calc(206px + var(--header-h))}
  .hv-slide__t{font-size:40px;letter-spacing:3px}
  .hv-slide__s{font-size:18px;margin-top:10px}
  .hv-play{bottom:40px}
}
@media (max-width:639px){
  .hv-slide__t{font-size:30px;letter-spacing:2px}
  .hv-slide__s{font-size:15px;margin-top:8px}
  .hv-play{bottom:28px;font-size:14px;padding:10px 18px}
  .hv-play__icon{width:28px;height:28px}
}
@media (max-width:639px){
  .home-hero__inner{padding-top:calc(102px + var(--header-h))}
  .play-btn{margin-top:36px;width:150px;height:48px;padding-left:24px;font-size:15px}
  .play-btn__icon{margin-left:14px}
}

/* ---------------- 首页 02 数据看板（设计稿 65:7306 · 782px） ---------------- */
.board{
  position:relative;overflow:hidden;
  background:#E6E9F4 url('img/board-bg.png') no-repeat center center / cover;
  padding-top:145px;padding-bottom:123px;
}
.board__inner{position:relative;z-index:1;max-width:var(--shell);margin:0 auto;padding:0 32px}
.board__title{
  margin:0;text-align:center;
  font-family:var(--ff-tight);
  font-size:60px;font-weight:700;line-height:1.25;letter-spacing:3px;color:#0A1220;
}
.board__row{
  margin-top:117px;
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:24px;align-items:start;
}
.board__row--auto{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
/* 项数增多时逐级缩小数字字号，避免窄列溢出（移动端由下方媒体查询覆盖为 2 列小字） */
.board__row--auto[data-count="5"] .board__num{font-size:64px}
.board__row--auto[data-count="6"] .board__num,
.board__row--auto[data-count="7"] .board__num,
.board__row--auto[data-count="8"] .board__num{font-size:56px}
.board__item{text-align:center}
.board__icon{margin:0 auto;display:flex;align-items:center;justify-content:center}
.board__icon img{display:block;height:64px;width:auto;filter:brightness(.25)}
.board__icon img.is-custom{filter:none;height:64px}
.board__num{
  margin-top:52px;
  display:flex;align-items:flex-start;justify-content:center;gap:2px;
  font-family:var(--ff-num);font-size:84px;font-weight:700;line-height:1;color:#0067FF;
}
.board__num i{font-style:normal;font-family:var(--ff-body);font-size:44px;font-weight:600;line-height:.78;margin-top:2px;color:#0067FF}
.board__label{margin-top:16px;font-size:20px;font-weight:500;line-height:1.2;color:rgba(10,18,32,.78)}
.board__source{
  margin-top:76px;text-align:right;
  font-size:18px;line-height:1.25;color:rgba(10,18,32,.6);
}
@media (max-width:1279px){
  .board{padding-top:88px;padding-bottom:72px}
  .board__title{font-size:40px;letter-spacing:2px}
  .board__row{margin-top:96px}
  .board__num{font-size:56px;margin-top:36px}
  .board__num i{font-size:30px}
  .board__label{margin-top:12px;font-size:17px}
  .board__source{margin-top:72px;font-size:15px}
}
@media (max-width:767px){
  .board__row{grid-template-columns:repeat(2,1fr);gap:48px 16px;margin-top:64px}
  .board__title{font-size:26px;letter-spacing:1px}
  .board__num{font-size:40px;margin-top:24px}
  .board__num i{font-size:22px}
  .board__label{font-size:15px}
  .board__icon img{height:44px}
  .board__icon img.is-custom{height:44px}
  .board__source{margin-top:48px;font-size:13px;text-align:center}
}

/* ---------------- 内页页头 ---------------- */
.page-head{padding-top:calc(var(--header-h) + var(--sp-xl));padding-bottom:var(--sp-lg);background:var(--bg-soft)}
.page-head--dark{background:var(--bg-dark);color:#fff}
.page-head--dark h1{color:#fff}
.page-head--dark .crumb,.page-head--dark .lede{color:rgba(255,255,255,.66)}
.crumb{display:flex;align-items:center;gap:10px;font-size:var(--fs-sm);color:rgba(255,255,255,.55);margin-bottom:var(--sp-xs)}
.crumb span{opacity:.5}
.lede{margin-top:var(--sp-xs);color:rgba(255,255,255,.55);font-size:var(--fs-lg);line-height:1.6;max-width:44em}

/* ---------------- 数据看板 ---------------- */
.stats{padding-top:var(--sp-xxl);padding-bottom:var(--sp-xxl)}
.stats .headings{margin-bottom:var(--sp-xl)}
.stats__row{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.stats__item{border-left:1px solid var(--line);padding-left:30px;padding-right:var(--row-gutter)}
.stats__item:first-child{border-left:0;padding-left:0}
.stats__num{font-size:var(--fs-h2);font-weight:600;line-height:1.1;letter-spacing:0;color:var(--brand)}
.stats__num em{font-style:normal;font-size:.42em;font-weight:600;margin-left:6px;color:var(--ink-2)}
.stats__label{margin-top:14px;font-size:var(--fs-body);color:var(--ink-2)}
@media (max-width:1279px){.stats__num{font-size:var(--fs-h3)}}
@media (max-width:1023px){
  .stats__row{grid-template-columns:repeat(2,1fr);gap:var(--sp-md) 0}
  .stats__item:nth-child(3){border-left:0;padding-left:0}
}
@media (max-width:639px){
  .stats__row{grid-template-columns:1fr;gap:0}
  .stats__item{border-left:0;border-top:1px solid var(--line);padding:20px 0 4px}
  .stats__item:first-child{border-top:0;padding-top:0}
}

/* ---------------- 卡片 ---------------- */
.card{
  display:block;border-radius:var(--radius);overflow:hidden;
  background:var(--bg-soft);padding:var(--sp-md);
  transition:transform .4s ease,background .4s ease;
}
.card:hover{transform:translateY(-6px);background:#E4EAF6}
.card__mark{
  width:56px;height:56px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:600;color:#fff;letter-spacing:1px;margin-bottom:var(--sp-md);
}
.card h4{margin-bottom:14px;font-size:var(--fs-h5);line-height:1.3}
.card p{color:var(--ink-2);font-size:var(--fs-body);line-height:1.7;margin-bottom:var(--sp-xs)}
.card .link{font-size:var(--fs-body)}
.mk-a{background:#3370FF}
.mk-b{background:#F24E00}
.mk-c{background:#00B42A}
.mk-d{background:#14C9C9}

/* 顶部细线卡片 */
.tile{border-top:1px solid var(--line);padding-top:var(--sp-sm);display:block}
.tile__idx{font-size:var(--fs-sm);font-weight:600;color:var(--brand);letter-spacing:2px}
.tile h4{margin:18px 0 14px;font-size:var(--fs-h5)}
.tile p{color:var(--ink-2);line-height:1.75}
.tile ul{margin-top:var(--sp-sm);display:flex;flex-wrap:wrap;gap:10px}
.tile li{font-size:var(--fs-sm);color:var(--ink-2);border:1px solid var(--line);border-radius:var(--radius-sm);padding:5px 12px;background:#F8FAFD}
.tile .link{margin-top:20px}

/* ---------------- 正文段落组 ---------------- */
.prose{max-width:56em}
.prose p{line-height:1.9;color:var(--ink-2)}
.prose p+p{margin-top:1.4em}
.prose h3{font-size:var(--fs-h4);margin-bottom:var(--sp-xs)}

/* ---------------- 发展历程 ---------------- */
.timeline{position:relative;padding-left:var(--sp-md)}
.timeline::before{content:'';position:absolute;left:5px;top:10px;bottom:10px;width:1px;background:var(--line)}
.tl-item{position:relative;padding-bottom:var(--sp-sm)}
.tl-item:last-child{padding-bottom:0}
.tl-item::before{
  content:'';position:absolute;left:calc(-1 * var(--sp-md) + 1px);top:7px;
  width:9px;height:9px;border-radius:50%;background:var(--brand);
}
.tl-year{font-size:var(--fs-h5);font-weight:600;color:var(--brand);letter-spacing:1px}
.tl-item h4{margin:8px 0 8px;font-size:var(--fs-h5);line-height:1.35}
.tl-item p{color:var(--ink-2);line-height:1.75}
@media (max-width:639px){.timeline{padding-left:var(--sp-xs)}.tl-item::before{left:calc(-1 * var(--sp-xs) + 1px)}}

/* ---------------- 清单 ---------------- */
.rules{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.rules div{background:#FFFFFF;padding:var(--sp-sm) var(--sp-md)}
.rules strong{display:block;font-size:var(--fs-h5);margin-bottom:10px}
.rules span{color:var(--ink-2);font-size:var(--fs-body);line-height:1.7}
@media (max-width:1023px){.rules{grid-template-columns:repeat(2,1fr)}}
@media (max-width:639px){.rules{grid-template-columns:1fr}}

/* ---------------- 步骤 ---------------- */
.steps{counter-reset:step;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-md)}
.step{counter-increment:step;border-top:1px solid var(--line);padding-top:var(--sp-xs)}
.step::before{
  content:counter(step,decimal-leading-zero);
  display:block;font-size:var(--fs-sm);font-weight:600;color:var(--brand);letter-spacing:2px;margin-bottom:12px;
}
.step h4{font-size:var(--fs-h5);margin-bottom:10px}
.step p{color:var(--ink-2);line-height:1.7}
@media (max-width:1023px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:639px){.steps{grid-template-columns:1fr}}

/* ---------------- 新闻 ---------------- */
.news-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:var(--sp-md)}
@media (max-width:1023px){.news-grid{grid-template-columns:1fr}}
.post{display:block}
.post__media{position:relative;border-radius:var(--radius);overflow:hidden;background:#DCE2EE;aspect-ratio:16/9}
.post__media::after{content:'';position:absolute;inset:0;background:rgba(29,37,64,.14);opacity:0;transition:opacity .4s ease}
.post__media svg{display:block;width:100%;height:100%}
.post:hover .post__media::after{opacity:1}
.post__meta{margin-top:20px;font-size:var(--fs-sm);color:var(--ink-3);display:flex;gap:16px;flex-wrap:wrap}
.post h4{margin-top:10px;line-height:1.45;transition:color .3s ease-out}
.post:hover h4{color:var(--brand)}
.post--lead h4{font-size:var(--fs-h4)}
.post p{margin-top:12px;color:var(--ink-2);line-height:1.7}
.post-list{display:flex;flex-direction:column;gap:var(--sp-sm)}
.post-list .post{display:flex;gap:20px;padding-bottom:var(--sp-sm);border-bottom:1px solid var(--line)}
.post-list .post:last-child{border-bottom:0;padding-bottom:0}
.post-list .post__thumb{flex:0 0 132px;height:88px;border-radius:var(--radius-sm);overflow:hidden;background:#DCE2EE}
.post-list .post__thumb svg{display:block;width:100%;height:100%}
.post-list .post h4{font-size:var(--fs-body);margin-top:0}
.post-list .post__meta{margin-top:8px}
@media (max-width:639px){
  .post-list .post__thumb{flex-basis:96px;height:66px}
}

/* 新闻列表页 */
.filters{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:var(--sp-lg)}
.filters button:not(.nw-pill){
  font-size:var(--fs-sm);font-weight:600;color:var(--ink-2);
  border:1px solid var(--line);border-radius:var(--radius-sm);padding:9px 18px;
  background:#fff;transition:all .3s ease-out;
}
.filters button:not(.nw-pill):hover{border-color:var(--brand);color:var(--brand)}
.filters button:not(.nw-pill).is-active{background:var(--brand);border-color:var(--brand);color:#fff}
.news-list{display:flex;flex-direction:column}
.news-item{
  display:grid;grid-template-columns:200px 1fr auto;gap:var(--sp-md);align-items:center;
  padding:var(--sp-sm) 0;border-bottom:1px solid var(--line);
}
.news-item:hover h4{color:var(--brand)}
.news-item__thumb{height:118px;border-radius:var(--radius-sm);overflow:hidden;background:#DCE2EE}
.news-item__thumb svg{display:block;width:100%;height:100%}
.news-item h4{font-size:var(--fs-h5);line-height:1.4;margin-bottom:10px;transition:color .3s ease-out}
.news-item p{color:var(--ink-2);line-height:1.7}
.news-item__tag{font-size:var(--fs-sm);color:var(--ink-3);white-space:nowrap}
@media (max-width:1023px){
  .news-item{grid-template-columns:160px 1fr}
  .news-item__tag{display:none}
}
@media (max-width:639px){
  .news-item{grid-template-columns:1fr;gap:20px}
  .news-item__thumb{height:170px}
}
.pager{display:flex;gap:10px;align-items:center;margin-top:var(--sp-lg)}
.pager button,a.pager__item{
  min-width:40px;height:40px;padding:0 12px;border-radius:var(--radius-sm);
  border:1px solid var(--line);font-size:var(--fs-sm);font-weight:600;color:rgba(255,255,255,.72);
  display:inline-flex;align-items:center;justify-content:center;
  transition:all .3s ease-out;
}
.pager button:hover{border-color:var(--brand);color:var(--brand)}
.pager .is-active{background:var(--brand);border-color:var(--brand);color:#fff}

/* ---------------- 表单 ----------------
   全站统一控件体系：join（加盟意向）/ contact / cooperation（供应商）三处共用
   .field = label 上置 + 控件；校验错误态 .is-error 也走同一套 */
.form{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--sp-xs) var(--sp-sm)}
.field{display:flex;flex-direction:column;gap:10px}
.field--full{grid-column:1/-1}
/* 合作商弹层：按合作方式切换的字段组。display:contents 让字段仍直接参与 .form 网格；[hidden] 时整组隐藏 */
.pr-fields{display:contents}
.pr-fields[hidden]{display:none}
.field label{font-size:var(--fs-sm);font-weight:600;color:#1A2538}
.field label i{font-style:normal;color:#DD3500;margin-left:4px}
.field input,.field select,.field textarea{
  font:inherit;font-size:var(--fs-body);color:#0A1220;
  padding:14px 16px;border:1px solid #DCE2EE;border-radius:var(--radius-sm);
  background:#FFFFFF;transition:border-color .2s,box-shadow .2s;width:100%;
}
.field input::placeholder,.field textarea::placeholder{color:#94A3B8}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(0,103,255,.12);
}
.field input:hover,.field select:hover,.field textarea:hover{border-color:#B8C4D8}
.field input.is-error,.field select.is-error,.field textarea.is-error,
.field.is-error input,.field.is-error select,.field.is-error textarea{
  border-color:#DD3500;box-shadow:0 0 0 3px rgba(221,53,0,.1);
}
.field.is-error label{color:#DD3500}
/* 下拉统一自绘 caret（原生箭头各浏览器不一致） */
.field select{
  appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:44px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='13' fill='none'%3E%3Cpath d='m1 1 10 10L21 1' stroke='%2364748B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;background-size:18px auto;
}
.form .actions{grid-column:1/-1;display:flex;align-items:center;gap:var(--sp-xs);flex-wrap:wrap;margin-top:8px}
.form__note{font-size:var(--fs-sm);color:#64748B}
/* 表单提交提示条（成功/失败） */
.form__tip{grid-column:1/-1;padding:12px 16px;border-radius:8px;font-size:var(--fs-sm);line-height:1.5}
.form__tip--ok{background:#F0FDF4;color:#15803D;border:1px solid #BBF7D0}
.form__tip--err{background:#FEF2F2;color:#B91C1C;border:1px solid #FECACA}
@media (max-width:639px){.form{grid-template-columns:1fr}}

/* ---------------- 联系方式 ---------------- */
.contact-list{border-top:1px solid #DCE2EE}
.contact-list div{
  display:grid;grid-template-columns:180px 1fr;gap:var(--sp-xs);
  padding:22px 0;border-bottom:1px solid #DCE2EE;
}
.contact-list dt,.contact-list .k{font-size:var(--fs-sm);font-weight:600;color:#64748B}
.contact-list .v{color:#0A1220;line-height:1.7}
@media (max-width:639px){
  .contact-list div{grid-template-columns:1fr;gap:6px}
}

/* ---------------- 视差区块 ---------------- */
.parallax{position:relative;background:var(--bg-dark)}
.parallax__stage{position:sticky;top:0;height:100vh;overflow:hidden}
.p-mod{position:absolute;inset:0;pointer-events:none}
.p-bg{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:548px;height:460px;border-radius:var(--radius);
  overflow:hidden;will-change:width,height,border-radius;
}
.p-bg img{display:block;width:100%;height:100%;object-fit:cover}
/* 实拍图亮度不一（尤其会议图整体偏亮），全屏压暗渐变保证内容层白字可读 */
.p-bg::after{
  content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(3,35,75,.15) 0%,rgba(3,35,75,.55) 100%);
}
.bg-a{background:#16203C}
.bg-b{background:#0F2C82}
.bg-c{background:#1F4FD8}
.p-content{
  position:absolute;top:0;left:0;
  width:calc(100% - 280px);height:calc(100vh - 184px);
  margin:44px 140px 140px;
  display:flex;flex-direction:column;justify-content:flex-end;
  color:#fff;will-change:transform,opacity;
}
.p-content__hair{margin-bottom:var(--sp-sm);overflow:hidden}
.p-content__hair h4{font-size:calc(var(--fs-h4) * 1.35);color:rgba(255,255,255,.72);font-weight:600}
.p-content__title{overflow:hidden;margin-bottom:var(--sp-md);max-width:88%}
.p-content__title h3{font-size:calc(var(--fs-h2) * 1.3);color:#fff}
.p-content .link{margin-top:8px}
@media (max-width:1279px){
  .p-content{width:calc(100% - 176px);height:calc(100vh - 120px);margin:32px 88px 88px}
  .p-content__title{max-width:88%}
}
@media (max-width:639px){
  .p-content{width:calc(100% - 48px);height:calc(100vh - 152px);margin:24px 24px 128px}
  .p-content__title{max-width:100%}
  .p-bg{width:75vw;height:33vh}
}
.p-intro{
  position:absolute;inset:0;z-index:12;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;pointer-events:none;
}
.p-intro__mask{overflow:hidden;width:100%}
.p-intro__mask h2{font-size:var(--fs-h0);color:#fff;letter-spacing:2px}
.p-intro__para{overflow:hidden;max-width:468px;margin-top:var(--sp-md)}
.p-intro__para p{font-size:var(--fs-h5);color:rgba(255,255,255,.8);line-height:1.4}
.p-intro__arrow{margin-top:var(--sp-sm);opacity:.6}
.p-intro__arrow i{display:block;width:1px;height:56px;background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.8))}
.p-intro__hint{margin-top:var(--sp-md);font-size:var(--fs-sm);font-weight:600;letter-spacing:2px;color:rgba(255,255,255,.5)}
@media (max-width:639px){
  .p-intro__para{max-width:210px;margin-top:var(--sp-sm)}
  .p-intro__arrow i{height:32px}
}

/* ---------------- 加盟 CTA ---------------- */
.join{background:var(--accent);color:#fff}
.join__inner{
  padding-top:var(--sp-xxl);padding-bottom:var(--sp-xxl);
  display:grid;grid-template-columns:1.3fr 1fr;gap:var(--sp-xl);align-items:end;
}
.join h2{color:#fff;max-width:14em}
.join p{margin-top:var(--sp-sm);color:rgba(255,255,255,.84);font-size:var(--fs-lg);line-height:1.6;max-width:34em}
.join__act{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.join .btn{background:var(--bg-dark);color:var(--accent)}
.join .btn:hover{background:#1D2540;color:#fff}
.join .link{color:#fff}
@media (max-width:1023px){.join__inner{grid-template-columns:1fr;gap:var(--sp-lg);align-items:start}}

/* ---------------- 页脚 ---------------- */
.footer{background:var(--bg-dark);color:rgba(255,255,255,.72);padding-top:var(--sp-xl);padding-bottom:var(--sp-md)}
.footer__top{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:var(--sp-lg);padding-bottom:var(--sp-xl)}
.footer__brand .brand__cn{color:#fff}
.footer__brand .brand__en{color:rgba(255,255,255,.45)}
.footer__brand p{margin-top:20px;font-size:var(--fs-sm);line-height:1.9;color:rgba(255,255,255,.55);max-width:26em}
.footer h5{color:#fff;font-size:var(--fs-body);margin-bottom:var(--sp-xs)}
.footer__col li{margin-bottom:12px}
.footer__col a{font-size:var(--fs-sm);color:rgba(255,255,255,.62)}
.footer__col a:hover{color:#fff}
.footer__bottom{
  border-top:1px solid rgba(255,255,255,.12);padding-top:var(--sp-xs);
  display:flex;justify-content:space-between;gap:var(--sp-xs);flex-wrap:wrap;
  font-size:var(--fs-sm);color:rgba(255,255,255,.45);
}
.footer__bottom a:hover{color:#fff}
@media (max-width:1023px){.footer__top{grid-template-columns:1fr 1fr;gap:var(--sp-md)}}
@media (max-width:639px){.footer__top{grid-template-columns:1fr}}

/* ---------------- 内页补充区块 ---------------- */
.media-box{
  position:relative;border-radius:var(--radius);overflow:hidden;
  background:#DCE2EE;aspect-ratio:4/3;
}
.media-box svg{display:block;width:100%;height:100%}
.media-box--wide{aspect-ratio:16/9}

.split{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-lg);align-items:center}
.split--flip .split__text{order:2}
@media (max-width:1023px){
  .split{grid-template-columns:1fr;gap:var(--sp-md)}
  .split--flip .split__text{order:0}
}

.kv{border-top:1px solid var(--line)}
.kv div{display:grid;grid-template-columns:200px 1fr;gap:var(--sp-xs);padding:20px 0;border-bottom:1px solid var(--line)}
.kv .k{font-size:var(--fs-sm);font-weight:600;color:#64748B}
.kv .v{color:#0A1220;line-height:1.75}
@media (max-width:639px){.kv div{grid-template-columns:1fr;gap:6px}}

.quote{
  border-left:3px solid var(--brand);padding:4px 0 4px var(--sp-sm);
  font-size:var(--fs-h5);line-height:1.5;color:#FFFFFF;font-weight:600;
}
.quote cite{display:block;margin-top:14px;font-style:normal;font-size:var(--fs-sm);font-weight:400;color:rgba(255,255,255,.55)}

.badges{display:flex;flex-wrap:wrap;gap:12px}
.badges li{
  font-size:var(--fs-sm);color:rgba(255,255,255,.72);
  border:1px solid var(--line);border-radius:var(--radius-sm);
  padding:9px 16px;background:var(--bg-dark);
}

.report-list{border-top:1px solid var(--line)}
.report-list a{
  display:grid;grid-template-columns:110px 1fr auto;gap:var(--sp-xs);align-items:center;
  padding:20px 0;border-bottom:1px solid var(--line);
}
.report-list a:hover h4{color:var(--brand)}
.report-list h4{font-size:var(--fs-body);font-weight:600;transition:color .3s ease-out}
.report-list .d{font-size:var(--fs-sm);color:rgba(255,255,255,.55)}
.report-list .tag{font-size:var(--fs-sm);font-weight:600;color:var(--brand);white-space:nowrap}
@media (max-width:639px){.report-list a{grid-template-columns:1fr;gap:6px}.report-list .tag{justify-self:start}}

/* ---------------- 首页 03 零售生态（新规范：三色卡 · 点击切换右侧文案 · 文字区白底） ---------------- */
.retail{position:relative;background:#fff;padding-top:min(120px,6.25vw);padding-bottom:min(140px,7.29vw)}
.retail__inner{max-width:var(--shell);margin:0 auto;padding-left:32px;padding-right:32px}
.retail__title{
  text-align:center;font-family:var(--ff-title);
  font-size:min(60px,3.125vw);font-weight:700;line-height:1.2;color:var(--fg);letter-spacing:2px;
}
.retail__layout{
  margin-top:min(64px,3.33vw);
  display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:min(40px,2.08vw);align-items:stretch;
}
.retail__cards{display:flex;flex-direction:column;gap:min(24px,1.25vw)}
.retail__card{
  flex:1;min-height:min(170px,8.85vw);border:0;cursor:pointer;border-radius:var(--radius-md);
  padding:min(28px,1.458vw) min(32px,1.667vw);
  display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:min(10px,.52vw);
  color:#fff;text-align:left;opacity:.5;transform:scale(.97);
  transition:opacity .3s ease,transform .3s ease,box-shadow .3s ease;
}
.retail__card.is-on{opacity:1;transform:none;box-shadow:0 18px 44px rgba(3,35,75,.18)}
.retail__card--zlys{background:var(--zlys)}
.retail__card--lbc{background:var(--lbc)}
.retail__card--shyz{background:var(--shyz)}
.retail__brand{font-family:var(--ff-title);font-size:min(34px,1.77vw);font-weight:700;letter-spacing:2px;line-height:1.15}
.retail__slogan{font-size:min(17px,.885vw);font-weight:500;letter-spacing:1.5px;opacity:.92}
.retail__panel{
  display:grid;border-radius:var(--radius-lg);background:#fff;border:1px solid var(--line);
  padding:min(56px,2.917vw) min(64px,3.33vw);min-height:min(560px,29.17vw);
}
.retail__view{
  grid-area:1/1;display:flex;flex-direction:column;align-items:flex-start;gap:min(20px,1.04vw);
  opacity:0;transform:translateY(14px);transition:opacity .35s ease,transform .35s ease;pointer-events:none;
}
.retail__view.is-on{opacity:1;transform:none;pointer-events:auto}
.retail__logo{display:flex;align-items:center;height:min(56px,2.917vw)}
.retail__name{font-size:min(22px,1.146vw);font-weight:600;letter-spacing:2px;color:var(--fg)}
.retail__head{font-family:var(--ff-title);font-size:min(36px,1.875vw);font-weight:700;line-height:1.35;color:var(--fg);letter-spacing:1px}
.retail__cta{
  margin-top:min(12px,.625vw);display:inline-flex;align-items:center;gap:12px;white-space:nowrap;
  font-size:min(18px,.9375vw);color:var(--brand);text-decoration:none;transition:opacity .3s ease;
}
.retail__cta svg{width:20px;height:20px;transition:transform .3s ease}
.retail__cta:hover{opacity:.85}
.retail__cta:hover svg{transform:translateX(5px)}
@media (max-width:1279px){
  .retail__layout{grid-template-columns:1fr;gap:min(32px,4vw)}
  .retail__cards{flex-direction:row}
  .retail__card{min-height:128px;padding:20px 24px}
  .retail__brand{font-size:26px}
  .retail__slogan{font-size:14px}
  .retail__panel{padding:40px 36px;min-height:0}
  .retail__head{font-size:28px}
  .retail__logo{height:48px}
}
@media (max-width:639px){
  .retail{padding-top:64px;padding-bottom:80px}
  .retail__title{font-size:30px}
  .retail__cards{flex-direction:column}
  .retail__card{min-height:96px;opacity:.65;transform:none}
  .retail__brand{font-size:22px}
  .retail__slogan{font-size:13px}
  .retail__panel{padding:28px 22px}
  .retail__logo{height:40px}
  .retail__name{font-size:16px}
  .retail__head{font-size:21px;line-height:1.45}
  .retail__cta{font-size:15px}
}
/* 产品和服务：业务提供的 1920×729 浅蓝白底图置于跑马灯下方。 */
.mq__backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:0}

/* ---------------- 首页 04 品牌矩阵轮播（设计稿 65:7447 · 727px） ---------------- */
.mq{position:relative;overflow:hidden;background:#EEF1F8;height:727px}
.mq__bg{position:absolute;inset:0;z-index:0;opacity:.5}
.mq__bg .ph{width:100%;height:100%}
.mq__title{
  position:absolute;top:105px;left:0;right:0;z-index:3;
  text-align:center;font-family:var(--ff-title);
  font-size:60px;font-weight:700;line-height:72px;color:var(--fg);letter-spacing:2px;
}
.mq__runs{
  position:absolute;left:0;right:0;top:263px;z-index:1;
  display:flex;flex-direction:column;gap:38px;
}
.mq__track{
  display:flex;flex-wrap:nowrap;gap:0;
  width:max-content;will-change:transform;
  margin-left:-183px;                 /* 设计稿行1 首卡起点 */
  animation:mqL 46s linear infinite;
}
/* 行2：向右循环 + 与设计稿一致的错行偏移（-183 + 185 = 2） */
.mq__track--rev{animation:mqR 54s linear infinite;margin-left:2px}
@keyframes mqL{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes mqR{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.mq__card{
  width:340px;height:130px;flex:none;
  /* 用 margin-right 代替 flex gap：两份内容的 -50% 位移才能严丝合缝，否则每轮会跳 10px */
  margin-right:20px;
  background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius-md);
  display:flex;align-items:center;justify-content:center;
  font-size:44px;font-weight:700;letter-spacing:3px;
}
.mq__card img{display:block;width:85%;height:auto}
@media (prefers-reduced-motion: reduce){.mq__track{animation:none}}

/* 品牌墙的移动端降级：原本完全沿用桌面值（区块固定 727px、标题 60px、卡片 340×130），
   在 390 视口下只能看到 1.1 张卡、上下大片留白，观感很空。
   改为：区块高度随内容、标题缩到 30px、卡片 158×62（可看到 2.4 张，暗示连续滚动）。 */
@media (max-width:639px){
  .mq{position:relative;height:auto;padding:min(46px,11.8vw) 0 min(54px,13.8vw)}
  .mq__title{
    position:static;text-align:center;
    font-size:min(30px,7.7vw);line-height:1.3;letter-spacing:1px;
    margin:0 0 min(30px,7.7vw);
  }
  .mq__runs{position:static;display:flex;flex-direction:column;gap:min(12px,3.1vw)}
  .mq__card{
    width:min(158px,40.5vw);height:min(62px,15.9vw);
    margin-right:min(10px,2.6vw);
    border-radius:8px;
  }
  .mq__card img{width:82%}
  /* 行首偏移随卡片宽同步缩小，保证两份内容 -50% 位移仍能严丝合缝 */
  .mq__track{margin-left:min(-79px,-20.3vw)}
  .mq__track--rev{margin-left:min(1px,0.3vw)}
}
/* 平板档（640~1023）：桌面版在此宽度仍显空（727px 固定高、340px 卡只露 2.3 张），
   取桌面与手机之间的中间值 */
@media (min-width:640px) and (max-width:1023px){
  .mq{height:auto;padding:min(58px,6vw) 0 min(68px,7.1vw)}
  .mq__title{
    position:static;text-align:center;
    font-size:min(40px,5.2vw);line-height:1.3;letter-spacing:1px;
    margin:0 0 min(34px,4.4vw);
  }
  .mq__runs{position:static;gap:min(18px,2.4vw)}
  .mq__card{width:min(240px,31vw);height:min(92px,12vw);margin-right:min(14px,1.8vw)}
  .mq__card img{width:84%}
  .mq__track{margin-left:min(-120px,-15.6vw)}
  .mq__track--rev{margin-left:min(2px,0.26vw)}
}
.mq__fade{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  /* 设计稿原值纵向半径 11.42% 只够露一行，调大到 44% 让两行都可见、标题与上下边缘不受影响 */
  background:radial-gradient(50% 44% at 50% 50%, rgba(255,255,255,0) 69.57%, #FFFFFF 100%);
}

/* ---------------- 页尾（白底 · 结构对齐阿里 ali-home，2026-09-30 实测其线上几何后重做：
   首行 logo+关注我们 通栏带 1px 分隔线 / 中部站点地图横向摊开(组标题可点) / 品牌墙竖线密排 / 底部居中版权两行。
   容器与页头同宽 1650，留白收窄（阿里 .foot-wrap 1440 + padding-bottom 10px 的紧致感） ---------------- */
/*   横向走全站 --gutter（1920→88 / 1279→64 / 767→24，与 .wrap 同参数），竖向走 --sp 节奏 */
.ft2{position:relative;background:#fff;color:rgba(10,30,60,.85);overflow:visible}
.ft2__inner{width:100%;padding:var(--sp-lg) var(--gutter) var(--sp-md)}

/* 首行：logo（深底反白，mask+currentColor）+ 关注我们 */
.ft2__follow{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-xs);padding-bottom:var(--sp-sm);border-bottom:1px solid rgba(10,30,60,.12)}
.ft2__brand{display:flex;flex-direction:column;align-items:flex-start;gap:10px;color:#0A1E3C}
.ft2__brand .brand__logo{width:clamp(116px,7.4vw,144px);height:auto;flex:none}
.ft2__code{font-size:15px;font-weight:400;letter-spacing:.6px;color:rgba(10,30,60,.72);white-space:nowrap}
.ft2__sns{display:flex;align-items:center;gap:22px}
.ft2__sns-label{font-size:16px;font-weight:600;letter-spacing:.5px;color:#0A1E3C}
.ft2__qr{display:flex;flex-direction:column;align-items:center;gap:6px}
.ft2__qr-box{width:56px;height:56px;border-radius:8px;border:1px solid rgba(10,30,60,.18);background:#fff;position:relative}
.ft2__qr-box img{display:block;width:100%;height:100%;object-fit:cover;border-radius:7px}
.ft2__qr-box{cursor:pointer}
.ft2__qr-box::before,.ft2__qr-box::after{position:absolute;left:50%;opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease;z-index:30;pointer-events:none}
.ft2__qr-box::after{
  content:"";bottom:calc(100% + 14px);width:168px;height:168px;transform:translateX(-50%) scale(.92);
  background:#fff url("img/qr-official.png") center/93% 93% no-repeat;border-radius:14px;
  box-shadow:0 10px 34px rgba(0,0,0,.32);
}
.ft2__qr-box::before{
  content:"";bottom:calc(100% + 6px);width:0;height:0;transform:translateX(-50%);
  border-left:8px solid transparent;border-right:8px solid transparent;border-top:9px solid #fff;
}
.ft2__qr-box:hover::after,.ft2__qr-box:hover::before{opacity:1;visibility:visible}
.ft2__qr-box:hover::after{transform:translateX(-50%) scale(1)}
.ft2__qr-box .ph{width:100%;height:100%}
.ft2__qr-box .ph::before{opacity:1}
.ft2__qr-name{font-size:12px;line-height:16px;color:rgba(10,30,60,.55)}

/* 中部：站点地图（白组标题 + 浅灰链接，hover 提亮） */
.ft2__cols{display:flex;justify-content:space-between;gap:var(--sp-xs);flex-wrap:wrap;padding:var(--sp-md) 0 var(--sp-xs)}
.ft2__col{min-width:96px}
.ft2__hd{display:block;margin:0 0 14px;font-size:17px;font-weight:600;line-height:24px;letter-spacing:.6px;color:#0A1E3C;text-decoration:none;transition:color .2s}
a.ft2__hd:hover{color:var(--brand)}
.ft2__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ft2__list a{font-size:15px;font-weight:300;line-height:22px;letter-spacing:.4px;color:rgba(10,30,60,.65);text-decoration:none;transition:color .2s}
.ft2__list a:hover{color:#0A1E3C}

/* 底部：左右分布——左举报渠道、右版权 */
.ft2__bar{margin-top:var(--sp-sm);padding-top:var(--sp-sm);border-top:1px solid rgba(10,30,60,.12);display:flex;justify-content:space-between;align-items:center;gap:12px 24px;flex-wrap:wrap}
.ft2__bar p{margin:0;font-family:var(--ff-tight);font-size:13px;font-weight:300;line-height:22px;letter-spacing:.4px;color:rgba(10,30,60,.5)}
.ft2__bar p:first-child{order:2}
.ft2__bar .ft2__beian{flex-basis:100%;display:flex;align-items:center;font-size:12px;line-height:20px}
.ft2__bar .ft2__beian img{height:14px;width:auto}
.ft2__bar a{color:rgba(10,30,60,.5);text-decoration:none;transition:color .2s}
.ft2__bar a:hover{color:#0A1E3C}
.ft2__gap{display:inline-block;width:14px}

@media (max-width:1279px){
  .ft2__cols{justify-content:flex-start;gap:36px 64px}
}
@media (max-width:767px){
  .ft2__inner{padding-top:var(--sp-md);padding-bottom:var(--sp-xs)}
  .ft2__follow{flex-direction:column;align-items:flex-start;gap:22px}
  .ft2__cols{flex-direction:column;gap:28px;padding-top:var(--sp-sm)}
  .ft2__bar{flex-direction:column;align-items:flex-start;gap:8px;margin-top:var(--sp-xs)}
  .ft2__bar p:first-child{order:0}
}

/* ---------------- 走进驰骋页（设计稿 65:00200 · 1920×7944） ---------------- */
/* 01 Hero（820px，图 + 底部「了解更多」） */
/* 原本 margin-top:var(--header-h) 把 hero 推到页头下方，页头压的是白底空白，
   黑纱压白底变成灰条 —— 阿凯反馈「走进驰骋头部没穿透」即此因。
   改为 hero 顶到 0（页头叠在图上），高度补回 header-h 保证总占位 884 不变 */
.ab-hero{position:relative;height:calc(820px + var(--header-h));margin-top:0;overflow:hidden}
.ab-hero .ab-hero__bg{position:absolute;inset:0}
.ab-hero__bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
/* 阿凯指定：50% 遮罩（品牌深蓝，均匀覆盖） */
.ab-hero__scrim{position:absolute;inset:0;z-index:1;background:rgba(3,35,75,.5)}
.ab-hero__more{
  position:absolute;left:50%;bottom:47px;transform:translateX(-50%);z-index:2;
  display:flex;flex-direction:column;align-items:center;
  color:#fff;font-size:20px;line-height:40px;letter-spacing:1px;
}
.ab-hero__more svg{display:block;margin-top:0}
@media (max-width:639px){.ab-hero{height:min(820px,88vw)}.ab-hero__more{bottom:28px;font-size:16px;line-height:30px}}

/* 02 关于驰骋（570px，居中标题 + 5 行正文） */
.ab-intro{position:relative;height:570px;overflow:hidden;text-align:center;background:#fff}
.ab-intro__deco{position:absolute;left:50%;top:88px;transform:translateX(-50%);z-index:0;color:#E5F5FF}
.ab-intro h2{
  position:relative;z-index:1;margin:0;padding-top:130px;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;color:var(--ink-88);
}
.ab-intro__body{
  position:relative;z-index:1;max-width:1342px;margin:68px auto 0;padding:0 32px;
  font-size:18px;line-height:36px;color:#000;
}
@media (max-width:1279px){
  .ab-intro{height:auto;padding-bottom:72px}
  .ab-intro h2{padding-top:88px;font-size:40px;line-height:52px}
  .ab-intro__body{margin-top:40px;font-size:16px;line-height:30px}
}

/* 03 零售生态（设计稿为整张烘焙图 1920×879） */
/* 03b 零售生态（设计稿 62:6767 · 1920×879 白底）：左侧轨道图 + 右侧角色文案，点球切换。
   几何按 1920×879 换算为百分比；orbit 保持 1920:879 比例，内部全部相对 orbit 等比缩放。
   弧线装饰按设计稿截图目测重绘（原始 SVG 资产短期链接未落盘，出入可后续替换官方导出）；
   店商态文案为设计稿原文，电商/服务商为业务向占位（见 main.js ECO_ROLES 注释） */
/* 高度按设计稿 1920:879 比例缩放（此前写死 879px，窗口变窄时横向缩、纵向不缩，
   圆环/球/点全部错位 —— 阿凯反馈「缩放后元素偏离」的根因），≥1920 封顶 879 */
.ab-eco{position:relative;height:min(45.78125vw,879px);background:#fff;overflow:hidden}
.ab-eco__inner{position:absolute;inset:0;max-width:1920px;margin:0 auto}
.ab-eco__orbit{position:absolute;inset:0}
/* 光环 = 18px 渐变描边圆环（SVG 在 HTML 内）：page(334.5,162.5) 533×533 */
.ab-eco__halo{position:absolute;left:17.42%;top:18.49%;width:27.76%;aspect-ratio:1}
/* 轨道 SVG：viewBox 905.55 按 1:1 渲染，page(150.3,-25.5) 905.55×905.55 */
.ab-eco__rings{position:absolute;left:7.83%;top:-2.9%;width:47.16%;aspect-ratio:1}
.ab-eco__core{
  position:absolute;left:25.52%;top:35.72%;width:11.77%;aspect-ratio:1;border-radius:50%;
  background:#0061F3;display:flex;align-items:center;justify-content:center;
  box-shadow:0 18px 50px rgba(0,103,255,.32);
}
/* 中心放官方 logo 的图形标志（设计稿无文字部分）。
   窗口 = viewBox x 7.4~69 / y 0~82：飞鸟图形（x 7.5~68、y 2~80）完整含入；
   右缘 69 —— 上一版取 72 会切进「驰」字马旁起笔尖端（实测起笔 x≈70），
   在鸟右下角留下一个杂点，故收紧到 69（鸟尾 68 之外、驰字 70 之前）。
   ★ 实现为独立裁切版 assets/logo-bird.svg + <img>（窗口直接烘进 viewBox）：
     此前的 mask 方案在非整数缩放下 mask 位图会舍边，窗口越小鸟缘被啃得越明显
     （阿凯反馈「缩放后 LOGO 会被裁切」的根因）；img 矢量渲染任意尺寸零裁切。
   尺寸/位置按设计稿飞鸟实测（高 128、纵向中心偏上 9.6px、横向偏左 1.1px @1920）
   等比放大对齐，偏移用自身百分比换算（-9.6/134.5、-1.1/101）随缩放同步；
   设计稿的鸟是被拉宽的变体（宽高比 0.89 vs 官方 0.78），按红线不拉伸，
   只对齐高度与纵向位置。柔光投影用 CSS drop-shadow（img 的 alpha 即鸟形） */
/* 中心 logo = 阿凯给的设计稿飞鸟 SVG（assets/logo-bird.svg，154×170 画布已含
   自带柔光投影 filter，故不再另加 CSS drop-shadow）；不再对官方 logo 做拆字/裁窗。
   画布内鸟实际占 x20~138 / y19.7~152.4（118.4×132.7），四周是投影留白。
   按设计稿实测鸟 113.5×128、左上角在球心 (-58.3,-73.6) 反推：
   画布宽 = 113.5×154/118.4 = 147.6 → 占中心球 226 的 65.3%；
   偏移用画布自身百分比（-3.7px / -11.05px）随缩放同步 */
.ab-eco__bird{
  position:absolute;left:50%;top:50%;width:68.6%;height:auto;
  transform:translate(calc(-50% - 1.16%), calc(-50% - 7.77%));
}
/* 卫星层：3 个角色球 + 3 个内环小点绕轨道圆心旋转；轨道环/光环静止 = 跑道上的卫星。
   圆心 = 圆环圆心（603,427）：x 31.41% of W、y 48.58% of H（模块等比缩放时恒定）。
   旋转量由 JS 写成 inline transform（不走 CSS 变量，避免老 Safari 不插值），
   文字反向自转抵消，保证球内标签始终正立 */
.ab-eco__spin{
  position:absolute;inset:0;transform-origin:31.41% 48.58%;
  transition:transform 1.05s cubic-bezier(.65,.02,.32,1);
}
.ab-eco__dots{position:absolute;left:7.83%;top:-2.9%;width:47.16%;aspect-ratio:1}
.ab-eco__ball-t{display:block;transition:transform 1.05s cubic-bezier(.65,.02,.32,1)}
.ab-eco__ball{
  position:absolute;left:var(--x);top:var(--y);width:7.29%;aspect-ratio:1;border-radius:50%;
  border:0;cursor:pointer;padding:0;color:#fff;font-family:inherit;
  font-size:clamp(14px,1.5625vw,30px);font-weight:700;letter-spacing:2px;
  display:flex;align-items:center;justify-content:center;
  transition:transform .25s ease,box-shadow .25s ease;
}
.ab-eco__ball--ds{background:#005BED}
.ab-eco__ball--ds2{background:#FF7429}
.ab-eco__ball--fw{background:#36B1F9}
/* 激活态与设计稿一致：尺寸不变（140），仅加投影区分（此前 1.12 放大为自创，已去掉） */
.ab-eco__ball.is-active{box-shadow:0 16px 40px rgba(11,46,92,.28);z-index:2}
.ab-eco__ball:focus-visible{outline:3px solid rgba(0,103,255,.5);outline-offset:4px}
.ab-eco__panel{
  position:absolute;left:55.16%;top:36.29%;width:35.73%;
  transition:opacity .18s ease;   /* 切换角色时轻淡入淡出，同 ab-hist 面板 */
}
.ab-eco__panel.is-fading{opacity:0}
.ab-eco__head{display:flex;align-items:center;gap:min(24px,1.25vw);flex-wrap:wrap}
.ab-eco__title{margin:0;font-family:var(--ff-title);font-size:min(50px,2.6vw);font-weight:700;line-height:1.1;color:#0B0B0B}
.ab-eco__tag{
  background:#0067FF;color:#fff;font-size:min(28px,1.4583vw);font-weight:700;line-height:1;
  padding:.42em .9em;border-radius:999px;white-space:nowrap;
}
.ab-eco__desc{
  margin:min(16px,.83vw) 0 0;color:#666;
  font-size:min(20px,1.0417vw);line-height:1.5;text-align:justify;
}
@media (max-width:1023px){
  .ab-eco{height:auto;padding:72px 0 64px}
  /* 窄屏排布：core（中心球）与 spin（3 个角色球）都是 .ab-eco 的直接子元素（不在 inner 内）。
     .ab-eco 保持 block（改成 flex 会让整块高度塌陷、球被压成 0），
     中心球独占一行居中、三个角色球另起一行横排，再下面才是文案。
     轨道/光环（orbit）在窄屏装不下也用不上，直接隐藏。 */
  /* inner 必须彻底脱离 absolute（基础规则是 position:absolute;inset:0，inset 在 static 下虽不生效，
     但若某条规则没覆盖到 position，它仍会按 inset 拉伸成 .ab-eco 的高度，把内容裁掉） */
  .ab-eco__inner{position:static;inset:auto;display:block;width:100%;max-width:none}
  /* 中心球：宽高都写死，不依赖 aspect-ratio（height:auto + aspect-ratio:1 在 flex 容器里
     会被算成 0，整块高度塌陷）。内部 .ab-eco__bird 是 absolute(68.6%)，
     所以 core 必须保留 position:relative，否则 logo 的包含块会上浮到 orbit 而溢出。
     尺寸保证「中心球 + 3 个角色球 + 3 个间隙」一行放得下：
     390 档 = 76 + 68×3 + 12×3 = 316px（容器内宽 343） */
  .ab-eco__core{
    position:relative;left:auto;top:auto;margin:0 auto;
    width:min(76px,19.5vw);height:min(76px,19.5vw);
  }
  /* ★ orbit 不能整体 display:none —— core（中心球）与 spin（3 个角色球）都嵌套在它里面，
     隐藏 orbit 会把球一起隐藏（实测球 computed 67.86px 但 offsetWidth 0、offsetParent 为 null）。
     只隐藏轨道装饰层（光环 + 内外环），保留球。 */
  .ab-eco__orbit{position:static;width:100%;height:auto}
  .ab-eco__halo,.ab-eco__rings{display:none}
  /* 窄屏：轨道缩到 92vw 后半径只剩 ~48px，物理上装不下「中心球 + 3 个轨道球」，
     强行等比缩放会把球压成 25px（文字挤成竖排）并互相重叠。
     改为关闭轨道旋转、退化成「中心 logo + 三个角色球横排」，交互仍在（点球切文案），
     JS 写的 transform 用 !important 覆盖（窄屏轨道旋转本身也不适用，无 hover 触点）。 */
  /* 轨道层退化为「居中一行」：用 block + text-align 排球，而不是 flex。
     flex 方案在这套结构里（spin 是 .ab-eco 的直接子元素、.ab-eco 是 block）实测会把
     spin 与球的布局盒算成 0（计算值 67.86px 但 offsetWidth 0），block+inline 最稳。 */
  .ab-eco__spin{
    transform:none!important;
    position:static;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;
    gap:min(12px,3vw);width:auto;height:auto;
    margin:min(10px,2.6vw) 0 0;
  }
  .ab-eco__dots{display:none}
  .ab-eco__ball{
    position:static;flex:none;
    width:min(68px,17.4vw);height:min(68px,17.4vw);
    padding:0 4px;
    font-size:clamp(11px,2.8vw,15px);letter-spacing:0;white-space:nowrap;
  }
  .ab-eco__panel{position:static;width:auto;padding:24px 32px 0}
  .ab-eco__title{font-size:34px}
  .ab-eco__tag{font-size:18px}
  .ab-eco__desc{font-size:16px;line-height:1.6;margin-top:14px}
}

/* 04 发展历程（设计稿 70:1713 · 1920×940 · #0A5CFF）
   新版调整：①底部时间轴由竖向改横向 ②左侧新增 620×380 白色图片卡 ③事件由 4 条改 3 条
   横向坐标按 1920 设计稿换算为百分比，写法：left = 12.5%(轴线起点 240) + 节点相对偏移 */
.ab-hist{position:relative;height:940px;background:var(--brand-num);overflow:hidden;color:#fff}
.ab-hist h2{
  position:absolute;top:115px;left:0;right:0;margin:0;text-align:center;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;
  color:#fff;   /* 全局 h2 色是深墨，蓝底区块必须显式盖回白 */
}
.ab-hist__inner{position:absolute;inset:0;max-width:1920px;margin:0 auto}

/* 左侧白色图片卡 620×380 @ (240,301) */
.ab-hist__pic{
  position:absolute;left:12.5%;top:32.02%;width:32.29%;height:40.43%;
  background:#fff;border-radius:var(--radius);overflow:hidden;
}
.ab-hist__pic .ph{width:100%;height:100%}

/* 右侧年份与事件 686 宽 @ (908,326)：top 到时间轴上方弹性锚定，
   事件多时（如 2025 年 9 条）在事件区内部滚动，不溢出盖轴。
   top 与左侧图片同高（阿凯看稿：原来 34.68% + 20px 内边距让年份比图片顶低约 45px，
   上半留白失衡）→ 顶对齐 32.02%，padding-top 归零 */
.ab-hist__panel{
  position:absolute;left:47.29%;top:32.02%;bottom:19.2%;width:35.73%;
  display:flex;flex-direction:column;gap:min(28px,1.4583vw);
  padding:0 min(12px,.625vw) min(10px,.52vw) min(34px,1.7708vw);
  transition:opacity .18s ease;   /* 年份切换时轻淡入淡出 */
}
.ab-hist__panel.is-fading{opacity:0}
/* 字号按 1920 等比缩放（>1920 封顶），避免长文案在窄一些的桌面屏顶出容器被裁 */
.ab-hist__year{margin:0;flex:none;font-family:var(--ff-num);font-size:min(70px,3.6458vw);font-weight:800;line-height:1.05}
.ab-hist__events{
  flex:1 1 auto;min-height:0;overflow-y:auto;
  display:flex;flex-direction:column;gap:min(20px,1.0417vw);
  padding-right:min(10px,.52vw);
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.45) transparent;
}
.ab-hist__events::-webkit-scrollbar{width:5px}
.ab-hist__events::-webkit-scrollbar-thumb{background:rgba(255,255,255,.4);border-radius:3px}
.ab-hist__events::-webkit-scrollbar-track{background:transparent}
.ab-hist__events span{display:flex;font-size:min(26px,1.3542vw);line-height:1.45;white-space:normal}
.ab-hist__events b{flex:none;font-weight:700;margin-right:min(14px,.7292vw)}

/* 底部横向时间轴：1997—至今由 JS 生成节点，点击年份滑动到焦点位
   轨道模型：rail=可视窗口（滚动条隐藏），track=全宽内容（JS 算 px），
   轴线/圆点/年份全部由 JS 定位；设计稿参数保留为基准（轴线 12.5%→80.1%，步距下限 56） */
.ab-hist__rail{
  position:absolute;left:0;right:0;top:82.87%;height:110px;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.ab-hist__rail::-webkit-scrollbar{display:none}
.ab-hist__track{position:relative;height:100%;width:2000px}
.ab-hist__axis{
  position:absolute;left:0;top:24px;width:0;height:2px;background:#72C9FF;
  transform:scaleX(0);transform-origin:left center;
  transition:transform 1.15s cubic-bezier(.22,.61,.36,1);
}
.ab-hist__years{position:absolute;inset:0;list-style:none;margin:0;padding:0}
/* 命中区：li 以年份 x 为中心，左右各 28px，供 hover / 点击切换（left 由 JS 设置）
   top 24px：overflow-x:auto 会强制裁剪纵向溢出，圆点(上探 7px)+脉冲光晕(15px)必须留在轨道内 */
.ab-hist__years li{
  position:absolute;top:24px;left:0;
  width:56px;height:74px;margin-left:-28px;cursor:pointer;
}
.ab-hist__years i{
  position:absolute;left:50%;top:-7px;width:16px;height:16px;margin-left:-8px;
  border-radius:50%;background:#fff;
  opacity:0;transform:scale(.3);
  transition:opacity .38s ease-out,transform .5s cubic-bezier(.34,1.56,.64,1);
  transition-delay:var(--d,0s);
}
.ab-hist__years span{
  position:absolute;left:50%;top:23px;transform:translate(-50%,12px);
  font-family:var(--ff-num);font-size:20px;font-weight:500;line-height:30px;white-space:nowrap;
  color:rgba(255,255,255,.72);   /* 未选中弱化，拉大与选中的视觉差 */
  opacity:0;transition:opacity .38s ease-out,transform .5s cubic-bezier(.22,.61,.36,1),color .25s ease;
  transition-delay:var(--d,0s);
}
/* 选中态（腾讯式）：字号 20→30、颜色提亮、圆点放大 */
.ab-hist__years li.is-current span{font-size:30px;font-weight:600;color:#fff}
.ab-hist__rail .ab-hist__years li.is-current i{transform:scale(1.35)}

/* ---- 入场：滚到视口内由 JS 加 .show（选择器 .js-in），轴线生长 + 圆点依次点亮
        逐个错位出场的延迟由 JS 写入 li 的 --d，入场结束后移除以保证点击即时反馈 ---- */
.ab-hist__rail.show .ab-hist__axis{transform:scaleX(1)}
.ab-hist__rail.show .ab-hist__years i{opacity:1;transform:scale(1)}
.ab-hist__rail.show .ab-hist__years span{opacity:1;transform:translate(-50%,0)}

/* ---- 常态动效：当前项脉冲光晕；hover 放大 ---- */
@keyframes histPulse{
  0%{box-shadow:0 0 0 0 rgba(255,255,255,.45)}
  70%{box-shadow:0 0 0 15px rgba(255,255,255,0)}
  100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}
}
.ab-hist__years li.is-current i{animation:histPulse 2.6s ease-out 1.1s infinite}
.ab-hist__years li:hover i{transform:scale(1.35);transition-delay:0s}
.ab-hist__years li:hover span{color:#fff}
@media (prefers-reduced-motion: reduce){
  .ab-hist__axis{transform:scaleX(1);transition:none}
  .ab-hist__years i,.ab-hist__years span{opacity:1;transform:none;transition:none}
  .ab-hist__years span{transform:translateX(-50%)}
  .ab-hist__years li.is-current i{animation:none}
}

@media (max-width:1023px){
  .ab-hist{height:auto;padding:80px 0 64px}
  .ab-hist h2{position:static;font-size:40px;line-height:52px;padding:0 32px}
  .ab-hist__inner{position:static;margin-top:40px}
  .ab-hist__pic{position:static;width:calc(100% - 64px);margin:0 32px;aspect-ratio:620/380}
  .ab-hist__panel{position:static;width:auto;margin:32px 0 0;padding:0 32px;gap:28px}
  .ab-hist__events{gap:28px;overflow:visible;flex:none}
  .ab-hist__events span{white-space:normal;font-size:20px;line-height:28px}
  /* 时间轴：横向滑动轨道（与桌面同一套 JS 几何），修复年份条逃逸到区块顶部的 bug */
  .ab-hist__rail{position:static;height:110px;margin-top:48px}
}

/* 05 以文化人 以人强企（1878px，三张 1650×480 大卡） */
.ab-culture{position:relative;background:#fff;padding:113px 0 105px;overflow:hidden}
.ab-title{
  margin:0;text-align:center;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;color:var(--ink-88);
}
.ab-cards{width:1650px;max-width:calc(100% - 64px);margin:78px auto 0}
.ab-card{
  position:relative;height:480px;border-radius:var(--radius);overflow:hidden;
  background:#0B2E5C;margin-bottom:35px;
}
.ab-card:last-child{margin-bottom:0}
.ab-card .ph{position:absolute;inset:0}
.ab-card__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,35,75,.08) 30%,rgba(3,35,75,.55))}
.ab-card__tag{
  position:absolute;left:75px;top:310px;z-index:2;
  display:flex;align-items:center;gap:12px;
  color:#fff;font-family:var(--ff-title);font-size:30px;line-height:36px;
}
.ab-card__tag::before{content:'';width:14px;height:14px;background:var(--brand);flex:none}
.ab-card__slogan{
  position:absolute;left:60px;top:382px;z-index:2;
  color:#fff;font-size:56px;font-weight:700;line-height:68px;letter-spacing:2px;
}
/* 卡片视差：卡当窗口，背景层上下各高出 14%，滚动时缓慢滑动（腾讯式） */
/* 卡片视差（通用：[data-plx] > [data-plx-bg]，卡当窗口、背景上下各出血 14% 缓慢滑动） */
.plx-bg{position:absolute;left:0;right:0;top:-14%;bottom:-14%;will-change:transform}
@media (max-width:1279px){
  .ab-culture{padding:88px 0 72px}
  .ab-title{font-size:40px;line-height:52px}
  .ab-cards{margin-top:48px}
  .ab-card{height:auto;aspect-ratio:1650/480}
  .ab-card__tag{left:36px;top:auto;bottom:118px;font-size:20px}
  .ab-card__slogan{left:32px;top:auto;bottom:36px;font-size:30px;line-height:40px}
}

/* 06 企业精神 / 干部誓词 / 行为准则（932px，#03234B + 三张 #0A5CFF 卡） */
/* 06 企业精神 / 干部誓词 / 行为准则（设计稿 54:5840 · 1920×932 · #03234B）
   三张 480×612 卡，默认图标+标题，hover / 点击（.is-open）展开文案层
   桌面尺寸按 1920 等比（min(px,vw)），>1920 封顶 */
.ab-spirit{position:relative;background:var(--brand-deep);padding:160px 32px;overflow:hidden}
/* 背景层视差：上下各出血 90px，滚动时缓慢滑动（JS 写 transform） */
.ab-spirit__bg{position:absolute;left:0;right:0;top:-90px;bottom:-90px;z-index:0;opacity:.4;will-change:transform}
.ab-spirit__bg .ph{width:100%;height:100%}
.ab-spirit__row{position:relative;z-index:1;display:flex;gap:min(38px,1.98vw);justify-content:center}
.ab-sp{
  position:relative;width:min(480px,25vw);height:min(612px,31.875vw);
  background:var(--brand-num);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;
}
.ab-sp::before{content:'';position:absolute;left:-70px;bottom:-130px;width:420px;height:420px;border-radius:50%;background:rgba(255,255,255,.05)}
.ab-sp::after{content:'';position:absolute;right:-50px;top:-90px;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.08)}
/* 视差：卡体错位由 JS 写 transform；卡内装饰圆按 --sp 反向漂移，制造层间速度差。
   幅度取大（外卡 ±80px / 圆 ±56·38px）：居中时归零对齐设计稿，滚动过程一眼可见 */
.ab-sp{will-change:transform}
.ab-sp::before{transform:translate3d(0,calc(var(--sp,0)*-56px),0)}
.ab-sp::after{transform:translate3d(0,calc(var(--sp,0)*38px),0)}
.ab-sp__face{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;transition:opacity .35s,transform .4s}
.ab-sp__icon{position:relative;z-index:1;margin-top:min(112px,5.83vw);width:min(380px,19.79vw);aspect-ratio:530/410;border-radius:min(12px,.625vw);overflow:hidden}
.ab-sp__icon img{width:100%;height:100%;object-fit:cover;display:block}
.ab-sp__title{position:relative;z-index:1;margin-top:min(48px,2.5vw);font-family:var(--ff-num);font-size:min(40px,2.08vw);font-weight:700;line-height:1.1;color:#fff;letter-spacing:4px}

/* 文案层（展开态） */
.ab-sp__body{
  position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;
  padding-top:min(56px,2.9vw);opacity:0;transform:translateY(16px);
  transition:opacity .4s ease-out,transform .45s cubic-bezier(.22,.61,.36,1);
  pointer-events:none;
}
.ab-sp__name{font-size:min(34px,1.77vw);font-weight:600;line-height:36px;color:#fff;margin-bottom:min(28px,1.46vw)}
.ab-sp__text{font-size:min(20px,1.042vw);line-height:min(36px,1.875vw);color:#fff;text-align:center}
.ab-sp__text b{font-weight:700}
/* hover（指针设备）与点击锁定（.is-open）都展开 */
@media (hover:hover){
  .ab-sp:hover .ab-sp__face{opacity:0;transform:translateY(-12px)}
  .ab-sp:hover .ab-sp__body{opacity:1;transform:none;pointer-events:auto}
}
.ab-sp.is-open .ab-sp__face{opacity:0;transform:translateY(-12px)}
.ab-sp.is-open .ab-sp__body{opacity:1;transform:none;pointer-events:auto}
@media (prefers-reduced-motion: reduce){
  .ab-sp__face,.ab-sp__body{transition:none;transform:none}
  .ab-sp,.ab-sp::before,.ab-sp::after,.ab-spirit__bg{transform:none!important}
}

@media (max-width:1279px){
  .ab-spirit{padding:88px 32px}
  .ab-spirit__row{flex-direction:column;align-items:center;gap:24px}
  /* 移动端列布局：关闭三卡错位与卡内圆漂移，只留背景缓移 */
  .ab-sp{transform:none!important}
  .ab-sp::before,.ab-sp::after{transform:none}
  .ab-sp{width:min(480px,100%);height:auto;padding:64px 24px 72px}
  .ab-sp__icon{margin-top:0;width:320px;max-width:100%}
  .ab-sp__face{position:static;inset:auto}
  .ab-sp__title{margin-top:40px;font-size:32px}
  /* 移动端无 hover：点击切换显示，直接替换内容 */
  .ab-sp__body{position:static;display:none;opacity:1;transform:none;pointer-events:auto;padding:0}
  .ab-sp.is-open .ab-sp__body{display:flex}
  .ab-sp.is-open .ab-sp__face{display:none}
  .ab-sp__name{font-size:24px;margin-bottom:16px}
  .ab-sp__text{font-size:16px;line-height:28px}
}

/* 手机端（≤639）重新布局：平板竖版在 390 宽下每张卡 320px 图标 + 64/72 padding，
   高约 400px、三卡堆叠 1200px+，又长又空。
   改为横向紧凑卡：左侧 88px 图标 + 右侧标题，单行约 116px；点开展开文案（原有点击切换逻辑不变）。
   移动端没有 hover 场景，只有点击 —— 交互已由 .is-open 承担，这里只处理排版。 */
@media (max-width:639px){
  .ab-spirit{padding:min(44px,11.3vw) min(16px,4.1vw) min(52px,13.3vw)}
  .ab-spirit__row{gap:min(12px,3.1vw)}
  .ab-sp{
    width:100%;padding:min(14px,3.6vw);border-radius:14px;
    display:flex;flex-direction:row;align-items:center;
    gap:min(14px,3.6vw);text-align:left;
  }
  .ab-sp__face{
    position:static;inset:auto;flex:1 1 auto;min-width:0;
    flex-direction:row;align-items:center;gap:min(14px,3.6vw);
  }
  .ab-sp__icon{
    margin:0;flex:none;width:min(88px,22.5vw);aspect-ratio:530/410;border-radius:8px;
  }
  .ab-sp__title{
    margin:0;flex:1 1 auto;font-size:min(21px,5.4vw);letter-spacing:1px;line-height:1.25;
  }
  /* 展开：卡片转纵向，face 一行 + 文案一行 */
  .ab-sp.is-open{flex-direction:column;align-items:stretch;gap:min(10px,2.6vw)}
  .ab-sp.is-open .ab-sp__body{display:flex;padding:0 min(2px,.5vw) min(2px,.5vw)}
  .ab-sp__name{font-size:20px;line-height:28px;margin-bottom:10px}
  .ab-sp__text{font-size:15px;line-height:26px;text-align:left}
}

/* 07 阳光驰骋（设计稿 14:02355：1650×620 图卡与下方举报信息） */
.ab-sun{position:relative;background:#fff;padding:105px 0 137px;text-align:center}
.ab-sun__media{
  position:relative;width:1650px;max-width:calc(100% - 64px);aspect-ratio:1650/620;height:auto;
  margin:50px auto 0;border-radius:30px;overflow:hidden;background:#F4F4F4;
}
.ab-sun__media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.ab-sun__text{margin:30px auto 0;max-width:1408px;padding:0 32px}
.ab-sun__statement{font-size:24px;line-height:40px;font-weight:500;color:#595959;margin:0}
.ab-sun__contact{margin-top:8px;font-size:24px;line-height:40px;font-weight:500;color:#000}
.ab-sun__contact p{margin:0}
.ab-sun__contact a{color:inherit;font-weight:700;text-decoration:none}
.ab-sun__contact a:hover{text-decoration:underline}
.ab-sun__qr{display:block;width:226px;height:226px;object-fit:contain;margin:14px auto 0}
@media (max-width:1279px){
  .ab-sun{padding:88px 0 64px}
  .ab-title{font-size:40px;line-height:52px}
  .ab-sun__media{height:auto;aspect-ratio:1650/620;margin-top:36px}
  .ab-sun__text{margin-top:32px}
  .ab-sun__statement,.ab-sun__contact{font-size:18px;line-height:32px}
  .ab-sun__qr{width:180px;height:180px}
}

/* 无脚本环境（禁用 JS 或爬虫只取首屏）下不要把人挡在门外：
   入场这套是靠 JS 解锁的，脚本不跑就永远停在半透明。 */
@media (scripting: none){
  .fade-up,.fade-left,.fade-right,
  :is(.pr-dir__ttl,.pr-dir .pr-card,.nw .filters,.nw .nw-grid,.nw .nw-foot){
    opacity:1!important;visibility:visible!important;transform:none!important;
  }
}

/* ---------------- 减弱动效偏好 ---------------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .fade-up,.fade-left,.fade-right{opacity:1;visibility:visible;transform:none}
}

/* ================= 业务体系页（设计稿 70:0475 · 1920×3998） ================= */
.bz-hero{position:relative;height:820px;background:#E7EDF7;overflow:hidden}
.bz-hero .ph{width:100%;height:100%}
/* banner 实图：cover 铺满（素材比例略窄于 1920:820，居中裁切约 2%，肉眼无感） */
.bz-hero__img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}

.bz-title{
  margin:0;padding-top:88px;text-align:center;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;color:var(--ink-88);
}
.bz-title--light{color:#fff}

/* 02 集团发展 */
.bz-brands{position:relative;background:#fff;padding-bottom:70px}
.bz-tabs{
  display:flex;gap:14px;padding:10px;margin:0 auto;
  width:588px;max-width:calc(100% - 48px);margin-top:80px;
  background:#EBF3FF;border-radius:248px;
}
.bz-tab{
  flex:none;width:180px;height:60px;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  background:transparent;border-radius:10px;
  font-family:var(--ff-body);font-size:30px;font-weight:500;line-height:36px;color:#3D3D3D;
  transition:background .25s,color .25s,border-radius .25s;
}
.bz-tab.is-active{background:#fff;border-radius:232px;color:#000}
/* 集团发展：三品牌卡片轮播（MasterGo 设计稿 17:5919 · 1920×1028）
   顶部胶囊标签栏切换；下方品牌色大圆角卡（1650×718 r40）居中，
   内含：右侧白底图片卡（970×658 r20）+ 左侧 logo/三行文案；
   白卡上有 上一张/下一张 圆形箭头。横向滑动：激活卡居中，邻卡移出。 */
.bz-brands{position:relative;background:#fff;padding-bottom:70px}
/* （重复的 .bz-tabs/.bz-tab 定义已合并到上文唯一一处） */
.bz-viewport{position:relative;margin-top:40px;height:min(718px,37.4vw);overflow:hidden}
.bz-track{display:flex;gap:3.333vw;transition:transform .55s cubic-bezier(.4,0,.2,1);will-change:transform}
.bz-card{
  position:relative;flex:0 0 85.9375vw;height:min(718px,37.4vw);
  background:var(--bg,#E60012);border-radius:2.083vw;overflow:hidden;
  /* 白底图卡的留白共用一个值。原来上下写「高度的 1.5%」、右侧写「宽度的 2.5%」，
     两个基准不同，1920 下上面只有 10.8px、右边却有 41.3px，图卡看着往左挤。
     min(10.77px,.561vw) 正好是 min(718px,37.4vw) 的 1.5%，所以上下位置一点没动，
     只是把右边多出来的 30px 收回去，三边对齐。 */
  --bz-pad:min(10.77px,.561vw);
}
.bz-card__txt{
  position:absolute;left:0;top:0;bottom:0;width:32%;z-index:2;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1.5vw;padding:0 2.5%;text-align:center;
}
.bz-card__media{
  position:absolute;left:32%;top:var(--bz-pad);right:var(--bz-pad);bottom:var(--bz-pad);
  width:auto;height:auto;
  background:#fff;border-radius:1.042vw;overflow:hidden;
}
.bz-img-track{position:absolute;inset:0;display:flex;height:100%;transition:transform .5s cubic-bezier(.4,0,.2,1);will-change:transform}
.bz-img-track img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;display:block}
.bz-card__logo{height:6vw;width:auto}
.bz-card__desc{
  margin:0;width:100%;color:#fff;font-size:1.146vw;font-weight:400;
  line-height:2.083vw;text-align:center;
}
/* 箭头统一到 .ux-arrow 规范：白卡上的深色描边环（深底版由 --on-dark 控制） */
/* 磨砂玻璃箭头（2026-11-10 阿凯：蓝色描边在彩色品牌卡上很怪，全档统一磨砂。
   62px 桌面 / 36px 窄屏。白半透底 + blur + 白描边，彩色卡与白图区上都清晰。 */
.bz-arrow{
  position:absolute;z-index:3;
  width:62px;height:62px;padding:0;border:1px solid rgba(255,255,255,.35);
  border-radius:50%;background:rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  color:#fff;
  transition:background-color .25s ease,transform .2s ease,opacity .2s ease;
}
.bz-arrow:hover{background:rgba(255,255,255,.28)}
.bz-arrow:active{transform:scale(.94)}
.bz-arrow:disabled,.bz-arrow.is-off{opacity:.28;cursor:default;background:rgba(255,255,255,.12);transform:none}
.bz-arrow svg{width:42%;height:42%}

/* 非激活品牌卡弱化（2026-11-10 阿凯截图反馈：两侧露出的邻卡边缘+邻卡箭头很干扰）：
   邻卡降透明度、指针穿透感；箭头只属于激活卡 —— 非激活卡箭头直接隐藏。 */
.bz-card:not(.is-active) .bz-arrow{opacity:0;pointer-events:none}
.bz-card:not(.is-active){opacity:.45;transition:opacity .4s ease}
.bz-card.is-active{opacity:1;transition:opacity .4s ease}

.bz-arrow--prev{left:7.422%;top:45.289%}
.bz-arrow--next{right:1.031%;top:45.289%}

/* 03 / 04 / 05 三段能力区块（左文右图 / 左图右文） */
.bz-core{position:relative;background:#F4F5F7;padding-bottom:90px;overflow:hidden}
.bz-logi{position:relative;background:#F4F5F7;padding:100px 0;overflow:hidden}
.bz-tech{position:relative;background:#F4F5F7;padding:100px 0;overflow:hidden}
.bz-split{
  position:relative;display:flex;gap:80px;justify-content:center;align-items:center;
  width:1299px;max-width:calc(100% - 48px);margin:0 auto;
}
.bz-core .bz-split{margin-top:80px}
.bz-split__text{width:460px;max-width:100%}
.bz-h3{margin:0;font-size:40px;font-weight:700;line-height:40px;color:#fff}
.bz-h3--blue{color:#000}
.bz-p{margin:20px 0 0;font-size:18px;line-height:30px;color:#fff}
.bz-p--grey{color:#757575;text-align:justify}
.bz-tags{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:14px 40px;margin:36px 0 0;padding:0}
.bz-tags li{display:flex;align-items:center;gap:14px;font-size:20px;font-weight:700;line-height:40px;color:#fff}
.bz-tags--dark li{color:#000}
.bz-dot{width:16px;height:16px;border-radius:50%;background:#fff;flex:none}
.bz-dot--blue{background-color:var(--brand);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;background-size:11px 11px}
.bz-split__pic{
  flex:none;width:760px;height:430px;border-radius:var(--radius);overflow:hidden;background:#fff;
}
.bz-split__pic .ph{width:100%;height:100%}
.bz-split__pic img,.bz-split__pic video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.bz-split--rev{flex-direction:row}

@media (max-width:767px){
  .bz-brands{height:auto;overflow:visible}
  /* 三个药丸在 390px 视口放不下（84×3 + 间距 + padding ≈ 300+），
     原来 width:max-content 会把页面撑宽（实测 bodyScrollW 602）。
     改成：药丸等分撑满内容宽，字号按视口缩，字号过小则允许药丸自身横滚。 */
  .bz-tabs{
    position:relative;left:auto;top:auto;
    width:100%;max-width:100%;margin:24px 0 16px;
    padding:6px;gap:6px;border-radius:28px;
    box-sizing:border-box;
  }
  .bz-tab{
    flex:1 1 0;min-width:0;
    width:auto;height:40px;font-size:clamp(13px,3.4vw,15px);
    border-radius:24px;overflow:hidden;
    white-space:nowrap;text-overflow:ellipsis;
  }
  /* ── 2026-11-10 阿凯定稿：移动端恢复「tab 切换单卡」，撤销纵向平铺；
     卡片改上下布局（品牌文字在上、白色图片区在下）；track 横向滑动 ── */
  .bz-viewport{position:relative;top:auto;height:auto;overflow:hidden}
  .bz-track{flex-direction:row;gap:24px;transition:transform .55s cubic-bezier(.4,0,.2,1)}
  .bz-card{
    flex:0 0 100%;width:100%;height:auto;aspect-ratio:auto;
    display:flex;flex-direction:column;
  }
  /* 文字区：静态流式（桌面是 absolute 左 32%），居中排 */
  .bz-card__txt{
    position:static;width:100%;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:12px;padding:24px 20px 20px;
  }
  .bz-card__logo{height:30px;margin:0 auto}
  .bz-card__desc{font-size:14px;line-height:1.75;text-align:center}
  .bz-card__desc br{display:none}   /* 小卡内取消设计稿硬换行，让其自然流式排布避免溢出 */
  /* 图片区：流式占位（桌面 absolute），16:9 白卡 */
  .bz-card__media{
    /* 必须 relative：卡内 .bz-img-track 是 absolute;inset:0，
       static 会让它向上找到 .bz-card 铺满整卡（文字叠图事故，2026-11-10 实测） */
    position:relative;
    /* 清掉桌面定位残留：left:32%/top/right/bottom 在 relative 下依然生效，会把整个图区推偏 */
    left:auto;top:auto;right:auto;bottom:auto;
    width:calc(100% - 24px);height:auto;aspect-ratio:16/9;
    margin:0 auto 24px;border-radius:12px;overflow:hidden;
  }
  /* 卡内图片箭头：磨砂玻璃缩小版（阿凯指定「参考加入我们磨砂玻璃、缩小一点」）。
     白色半透底 + backdrop blur + 白细描边 + 白箭头，36px。 */
  .bz-arrow{
    width:36px;height:36px;padding:0;border:1px solid rgba(255,255,255,.35);
    border-radius:50%;background:rgba(255,255,255,.12);
    -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
    display:flex;align-items:center;justify-content:center;cursor:pointer;
    color:#fff;transition:background-color .25s ease,transform .2s ease;
  }
  .bz-arrow:hover{background:rgba(255,255,255,.28)}
  .bz-arrow:active{transform:scale(.94)}
  .bz-arrow svg{width:44%;height:44%}
  .bz-arrow--prev{left:10px}
  .bz-arrow--next{right:10px}
  .bz-arrow--prev,.bz-arrow--next{top:50%}
}

/* ================= 集团资讯页（设计稿 65:02430 · 1920 内容宽 1660） ================= */
.nw{background:#fff;padding:var(--header-h) 0 60px}
.nw__shell{width:1660px;max-width:calc(100% - 48px);margin:0 auto}

/* 头条 1660×518：左图 849×478 + 右侧文案 */
.nw-lead{
  position:relative;height:min(518px,27vw);
  background:#fff;border-radius:40px;overflow:hidden;
  box-shadow:0 6px 30px rgba(3,35,75,.06);
}
.nw-lead__track{display:flex;height:100%;transition:transform .6s cubic-bezier(.4,0,.2,1)}
.nw-lead__slide{flex:0 0 100%;min-width:100%;display:flex;gap:36px;height:100%;padding:20px;box-sizing:border-box}
.nw-lead__pic{position:relative;flex:none;width:51.14%;border-radius:20px;overflow:hidden;background:#E7EDF7}
.nw-lead__pic .ph{width:100%;height:100%}
.nw-lead__pic img,.nw-lead__pic video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.nw-lead__pic--video{cursor:pointer}
.nw-lead__play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.nw-lead__body{position:relative;flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;padding:6px 4px}
/* 标签 + 日期 同一列（竖排） */
.nw-lead__tagrow{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:20px}
.nw-lead__cat{
  align-self:flex-start;padding:6px 18px;
  background:#EAF2FF;color:var(--brand);border-radius:999px;
  font-size:16px;font-weight:500;line-height:20px;
}
.nw-lead__tagrow .nw-date{display:inline-flex;align-items:center;gap:8px;color:#9AA4B2;font-size:15px}
.nw-lead__title{
  margin:0;font-size:min(38px,2vw);font-weight:600;line-height:1.25;color:#000;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.nw-lead__sum{
  margin:16px 0 0;font-size:min(20px,1.05vw);font-weight:400;line-height:1.6;color:#757575;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
/* 头条轮播数字指示条：图片右下角，带背景（小号） */
.nw-lead__dots{
  position:absolute;left:20px;bottom:26px;width:calc(51.14% - 20px);
  display:flex;justify-content:flex-end;gap:6px;padding-right:20px;pointer-events:none;z-index:3;
}
.nw-lead__dots button{
  pointer-events:auto;min-width:26px;height:26px;padding:0 7px;border:0;border-radius:7px;
  cursor:pointer;background:rgba(255,255,255,.62);color:#0A1A2F;
  font-size:13px;font-weight:600;line-height:26px;backdrop-filter:blur(4px);
  transition:background .25s,color .25s;
}
.nw-lead__dots button.is-active{background:var(--brand);color:#fff}

/* 分类药丸 290×96 */
.filters{display:flex;gap:14px;margin:56px 0 0;flex-wrap:wrap;align-items:center}
.nw-pill{
  flex:none;height:46px;padding:0 26px;border:1px solid #DCE2EE;
  border-radius:999px;background:#F8FAFD;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--ff-body);font-size:15px;font-weight:500;color:#2C3E50;
  transition:all .25s ease-out;
}
.nw-pill:hover:not(.is-active){background:#FFFFFF;border-color:var(--brand);color:var(--brand)}
.nw-pill.is-active{background:var(--brand);border-color:var(--brand);color:#FFFFFF;box-shadow:0 4px 14px rgba(0,103,255,.25)}

/* 新闻卡 540×448，三列 */
.nw-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:48px}
/* 阿里式横排图文卡：白底描边 + hover 边框/箭头反馈 */
.nw-card{
  display:flex;background:#fff;border:1px solid var(--line);border-radius:20px;
  padding:14px 16px;
  overflow:hidden;transition:border-color .25s,box-shadow .25s,transform .25s;
}
.nw-card:hover{border-color:rgba(0,103,255,.45);box-shadow:0 10px 28px rgba(10,30,80,.08);transform:translateY(-2px)}
.nw-card__pic{flex:none;position:relative;width:min(262px,37%);aspect-ratio:3/2;align-self:stretch;
  border-radius:14px;overflow:hidden;background:#E7EDF7;margin:0}
.nw-card__pic .ph{width:100%;height:100%}
.nw-card__info{flex:1;min-width:0;display:flex;flex-direction:column;padding:6px 0 4px 20px}
/* 置顶文章角标（后台置顶 = 前台头条） */
.nw-card__top{display:inline-flex;align-items:center;height:20px;padding:0 7px;margin-right:6px;font-size:12px;font-weight:600;line-height:1;color:#fff;background:var(--brand);border-radius:4px;vertical-align:2px;flex-shrink:0;}
.nw-card__title{margin:0;font-size:20px;font-weight:500;line-height:1.5;color:#0A1220;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:3em}
.nw-card__meta{margin-top:auto;display:flex;align-items:center;justify-content:space-between;padding-top:12px}
.nw-card__date{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ink-3)}
.nw-card__date svg{width:14px;height:14px;flex:none}
.nw-card__arrow{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  color:var(--ink-3);background:#F1F4F9;transition:background .25s,color .25s,transform .25s}
.nw-card__arrow::after{content:"";width:6px;height:6px;flex:none;
  border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg) translate(-1px,1px)}
.nw-card:hover .nw-card__arrow{background:var(--brand);color:#fff;transform:translateX(4px)}
.nw-date{display:flex;align-items:center;gap:8px;font-size:min(20px,1.042vw);line-height:24px;color:#000}
.nw-date svg{flex:none;color:#757575}

/* 底部图（685×115，形态待确认） */
.nw-foot{width:min(685px,35.7vw);height:min(115px,6vw);margin:88px auto 0;overflow:hidden}
.nw-foot .ph{width:100%;height:100%}
/* ---- 资讯 CMS 增强：搜索框 / 分页器 / 详情页（news-loader.js 动态渲染） ---- */
.nw-foot--pager{width:100%;max-width:100%;height:auto;overflow:visible}
.nw-search{margin-left:auto;padding:11px 22px;width:230px;max-width:42%;font:inherit;font-size:13.5px;color:var(--ink-2);background:#fff;border:1px solid var(--line);border-radius:var(--radius-pill);outline:none;transition:border-color .2s}
.nw-search:focus{border-color:var(--brand)}
.nw-search::placeholder{color:var(--ink-3)}
.nw-pager{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}
.nw-page{padding:10px 19px;font:inherit;font-size:13.5px;font-weight:500;letter-spacing:.5px;color:var(--ink-2);background:#fff;border:1px solid var(--line);border-radius:var(--radius-pill);cursor:pointer;transition:border-color .15s,color .15s}
.nw-page:hover:not(:disabled):not(.is-cur){border-color:var(--brand);color:var(--brand)}
.nw-page.is-cur{background:var(--brand-num);border-color:var(--brand-num);color:#fff;cursor:default}
.nw-page:disabled{opacity:.38;cursor:not-allowed}
.nw-page__gap{color:var(--ink-3);padding:0 2px}
.nw-page__info{font-size:13px;color:var(--ink-3);margin-left:10px}
.nw-card__link{display:flex;align-items:stretch;text-decoration:none;color:inherit;width:100%}
.nw-card__link:hover .nw-card__title{color:var(--brand)}
.nw-lead__title a{color:inherit;text-decoration:none}
.nw-lead__title a:hover{color:var(--brand)}
/* ---------- 资讯详情：腾讯式居中版式（居中头部 + 干净封面 + 居中相关区） ---------- */
.nw-det{max-width:920px;margin:40px auto 0;padding:0 24px}
.nw-det__head{text-align:center;max-width:820px;margin:0 auto 36px}
.nw-det__back{display:flex;justify-content:center;align-items:center;gap:8px;font-size:13px;color:var(--ink-3);text-decoration:none;margin-bottom:24px;transition:color .2s}
.nw-det__back::before{content:"";width:6px;height:6px;flex:none;
  border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.nw-det__back:hover{color:var(--brand)}
.nw-det__cat{display:inline-block;font-size:12.5px;font-weight:500;letter-spacing:1px;color:var(--brand);
  background:rgba(0,103,255,.07);padding:5px 16px;border-radius:var(--radius-pill);margin-bottom:18px}
.nw-det__title{font-family:var(--ff-title);font-size:clamp(25px,2.5vw,38px);line-height:1.35;color:var(--brand-deep);margin:0 0 16px}
.nw-det__meta{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:12px;font-size:13.5px;color:var(--ink-3);letter-spacing:.5px}
.nw-det__pic{display:none!important}
.nw-det__pic img{width:100%;height:100%;object-fit:cover;display:block}
/* 正文：居中阅读宽度 + 富文本元素排版规范（标题梯度/引用/列表/表格/图片） */
.nw-det__body{max-width:760px;margin:0 auto;font-size:16.5px;line-height:1.9;color:var(--ink-2)}
.nw-det__body p{margin:0 0 1.2em}
.nw-det__body h2{font-family:var(--ff-title);font-size:21px;line-height:1.4;color:var(--brand-deep);margin:2em 0 .85em}
.nw-det__body h3{font-size:18px;font-weight:600;line-height:1.45;color:var(--brand-deep);margin:1.7em 0 .75em}
.nw-det__body h4{font-size:16.5px;font-weight:600;color:var(--brand-deep);margin:1.5em 0 .7em}
.nw-det__body img{max-width:100%;height:auto;display:block;border-radius:14px;margin:1.6em auto}
.nw-det__body video{max-width:100%;display:block;border-radius:14px;margin:1.6em auto}
.nw-det__body a{color:var(--brand);text-decoration:underline;text-underline-offset:3px}
.nw-det__body ul,.nw-det__body ol{margin:0 0 1.2em;padding-left:1.5em}
.nw-det__body li{margin:.45em 0}
.nw-det__body blockquote{margin:1.6em 0;padding:14px 22px;background:#F5F8FD;
  border-left:3px solid var(--brand);border-radius:0 10px 10px 0;font-size:15.5px;line-height:1.8;color:var(--ink-2)}
.nw-det__body blockquote p:last-child{margin-bottom:0}
.nw-det__body strong{color:var(--brand-deep)}
.nw-det__body table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;margin:1.6em 0}
.nw-det__body th,.nw-det__body td{border:1px solid var(--line);padding:8px 14px;font-size:14.5px;text-align:left;white-space:nowrap}
.nw-det__body hr{border:0;border-top:1px solid var(--line);width:120px;margin:2.4em auto}
/* 标签：居中中性描边（文末极简，无分隔线） */
.nw-det__tags{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;max-width:760px;margin:42px auto 0}
.nw-det__tag{padding:4px 13px;font-size:12px;color:var(--ink-3);border:1px solid var(--line);border-radius:var(--radius-pill);background:#FAFBFD}
/* 缺失态 */
.nw-det--miss .nw-det__empty{padding:64px 0 28px;text-align:center;font-size:16px;color:var(--ink-3);letter-spacing:2px}
.nw-det__backbtn{display:inline-flex;align-items:center;justify-content:center;font-size:14px;color:#fff;text-decoration:none;
  padding:12px 34px;background:var(--brand);border-radius:var(--radius-pill);margin:0 auto}
.nw-det--miss{display:flex;flex-direction:column;align-items:center;padding-bottom:40px}
/* 相关阅读：浅底圆角区块 + 居中标题 + 浏览更多 + 3 卡网格 */
.nw-det-related{max-width:1200px;margin:72px auto 0;padding:52px 40px 48px;background:#F6F8FC;border-radius:28px}
.nw-det-related__t{font-family:var(--ff-title);font-size:24px;color:var(--brand-deep);margin:0;text-align:center}
.nw-det-related__more{display:flex;justify-content:center;align-items:center;gap:9px;font-size:14px;color:var(--brand);text-decoration:none;margin-top:14px;transition:opacity .2s}
.nw-det-related__more::after{content:"";width:7px;height:7px;flex:none;
  border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;transform:rotate(45deg)}
.nw-det-related__more:hover{opacity:.75}
.nw-det-related .nw-grid{margin-top:34px}
@media (max-width:639px){
  .nw-det{margin:24px auto 0;padding:0 20px}
  .nw-det__back{margin-bottom:18px}
  .nw-det__cat{margin-bottom:14px}
  .nw-det__title{font-size:22px}
  .nw-det__pic{border-radius:14px;margin:24px 0 30px}
  .nw-det__body{font-size:15.5px;line-height:1.85}
  .nw-det__body h2{font-size:19px}
  .nw-det__body h3{font-size:17px}
  .nw-det__body blockquote{padding:12px 16px}
  .nw-det__tags{margin-top:32px}
  .nw-det-related{margin:48px auto 0;padding:36px 16px 32px;border-radius:20px}
  .nw-det-related__t{font-size:20px}
  .nw-det-related .nw-grid{margin-top:26px}
}

@media (max-width:1279px){
  /* 顶部留白必须跟着 --header-h 走（此断点页头 96）：写死 64 会让流内子导航被页头压住 32px，
     且首个模块的文档位置低于「页头 + 子导航」的遮挡高度，跳过去时滚到 0 也补不齐 */
  .nw{padding:var(--header-h) 0 80px}
  .nw-lead{height:auto}
  .nw-lead__track{height:auto}
  .nw-lead__slide{flex-direction:column;height:auto;padding-bottom:0}
  .nw-lead__pic{width:100%;aspect-ratio:849/478}
  .nw-lead__body{min-height:0;padding:16px 0 0;justify-content:flex-start}
  .nw-lead__tagrow{margin-bottom:14px}
  .nw-lead__title{font-size:24px}
  .nw-lead__sum{font-size:16px;line-height:26px;margin-top:12px}
  .nw-lead__dots{position:static;width:auto;justify-content:flex-end;margin:16px 0 20px;pointer-events:auto}
  .filters{gap:16px;margin-top:40px;flex-wrap:wrap}
  .nw-pill{height:42px;padding:0 20px;font-size:14px}
  .nw-grid{grid-template-columns:1fr;gap:18px;margin-top:40px}
  .nw-card{padding:12px 14px}
  .nw-card__pic{width:236px;margin:0}
  .nw-card__info{padding:4px 0 2px 16px}
  .nw-card__title{font-size:18px}
  .nw-card__pic{height:52vw}
  .nw-card__title{font-size:18px}
  .nw-date{font-size:14px}
  .nw-foot{width:100%;height:80px}
}
@media (max-width:639px){
  .nw-grid{gap:12px;margin-top:32px}
  .nw-card{border-radius:16px}
  .nw-card{padding:10px 12px}
  .nw-card__pic{width:112px;margin:0;border-radius:10px}
  .nw-card__info{padding:2px 0 0 12px}
  .nw-card__title{font-size:15px;line-height:1.45;min-height:2.7em}
  .nw-card__meta{padding-top:8px}
  .nw-card__date{font-size:12px}
  .nw-card__arrow{width:20px;height:20px}
}

/* ================= 好物合作页（设计稿 70:0616 · 1920×6150） ================= */
.co-ttl{
  margin:0;text-align:center;
  font-family:var(--ff-title);font-size:min(60px,3.125vw);font-weight:400;line-height:min(72px,3.75vw);color:var(--ink-88);
}
.co-sub{
  margin:min(38px,1.979vw) auto 0;width:min(1022px,53.229vw);max-width:calc(100% - 48px);
  text-align:center;font-size:min(20px,1.042vw);line-height:min(24px,1.25vw);color:#333;
}
.co-sub--loose{width:100%;max-width:none;line-height:min(36px,1.875vw)}

/* 01 Hero 1920×820 */

/* ============================================================
   好物合作 Hero 轮播（2026-11-10 阿凯定稿）
   首屏统一轮播形式、箭头复用 careers 的 .jn-slider__nav、
   各档高度与全站首屏一致（移动 ≈ careers 档，桌面 820）。
   co-hslide 为独立淡入实现（jn-slide 是 careers 页局部作用域，不可跨页复用类）。
   ============================================================ */
.co-hslide{
  position:absolute;inset:0;
  opacity:0;visibility:hidden;
  transition:opacity .8s ease,visibility .8s ease;
}
.co-hslide.is-active{opacity:1;visibility:visible}
.co-slider__nav{position:absolute;z-index:4}
.co-slider__dots{position:absolute;z-index:4}
/* 单张时不显示箭头与圆点（JS 控制 hidden，这里兜底） */
.co-slider__nav[hidden],.co-slider__dots[hidden]{display:none}

.co-hero{position:relative;height:820px;box-sizing:border-box;background:#0B2E5C;overflow:hidden}
/* 层序：bg 垫底(z-index:0)，内容层 relative+z-index 抬到图之上。
   历史 bug：__bg 是 absolute(z-index:auto) 会绘制在 static 内容层之上，
   导致书法字(co-hero-word.png)与小字被 banner 图整块盖住（CTA 因 backdrop-filter
   生成层叠上下文而侥幸可见，其 z-index:2 在 position:static 下本不生效） */
.co-hero__bg{position:absolute;left:0;top:0;width:100%;height:100%;z-index:0}
.co-hero__bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
/* Hero 内容三件套（书法字 / 文案 / CTA）改为流式居中：
   原先依赖 1920 设计稿绝对坐标（left 26.8% / left 177px / left 810px），
   视口变窄后三者相对关系散架；流式排列任意视口都保持「字 → 文案 → 按钮」居中节奏。
   relative 仅为建立层叠层级（块级元素 relative 不改变文档流，流式居中不受影响） */
.co-hero__title{
  position:relative;z-index:2;width:min(890px,46.354vw);max-width:calc(100% - 48px);height:auto;
  margin:min(192px,10vw) auto 0;
}
.co-hero__word{height:min(179px,9.323vw)}
.co-hero__word img{display:block;width:100%;height:100%;object-fit:contain}
.co-hero__sub{
  position:relative;z-index:2;
  width:min(536px,27.917vw);max-width:100%;margin:min(24px,1.25vw) auto 0;
  text-align:center;color:#fff;font-size:min(16px,.833vw);line-height:min(26px,1.354vw);
}
.co-hero__cta{
  /* 按钮尺寸改为「内容自适应 + 最小宽」：原先宽/字/图标同为 vw 等比，
     叠加舍入误差后内容恰好挤满导致「提交意向合作」换行 */
  position:relative;z-index:2;
  display:flex;align-items:center;justify-content:center;gap:min(10px,.521vw);
  width:fit-content;min-width:min(300px,15.625vw);
  height:min(90px,4.688vw);padding:0 min(40px,2.083vw);
  margin:min(40px,2.083vw) auto 0;
  border-radius:639px;text-decoration:none;white-space:nowrap;
  background:linear-gradient(305deg,rgba(255,255,255,.15) 0%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.12) 100%);
  border:1px solid rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);
  color:#fff;font-size:min(30px,1.563vw);font-weight:500;line-height:min(30px,1.563vw);
  transition:background .25s,border-color .25s;
}
.co-hero__cta span{white-space:nowrap}
.co-hero__cta:hover{background:rgba(255,255,255,.28);border-color:#fff}
.co-hero__cta svg{flex:none;width:min(30px,1.563vw);height:min(30px,1.563vw)}
/* 下箭头现为 <img class="co-cta-arrow">（co-cta-arrow.svg），旧版只约束了内联 svg，
   补一条 img 尺寸规则，避免移除 cooperation.css 后箭头按 SVG 内禀尺寸失控 */
.co-hero__cta .co-cta-arrow{flex:none;width:min(29px,1.51vw);height:min(44px,2.292vw)}

/* 02 严选基石 1920×941
   结构：4 列图文单元（每列：圆形商品图 + 标题 + 文案），一张图对应一个条目
   栅格：区块左右内距走全站 --gutter（与 .wrap.section 同参数），容器满宽 */
.co-base{
  position:relative;padding:min(80px,4.167vw) var(--gutter) min(183px,9.531vw);overflow:hidden;
  background:linear-gradient(180deg,#FFFFFF 0%,#EBF3FF 100%);
}
.co-base__row{width:100%;margin:min(119px,6.198vw) 0 0}
.co-base__list{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:min(52px,2.708vw);
  margin:0;padding:0;list-style:none;
}
.co-base__list li{text-align:center}
/* 圆形商品图：宽高都要锁 276，否则宽度会被 grid 列撑开、border-radius:50% 变椭圆 */
.co-base__pic{
  width:min(276px,14.375vw);height:min(276px,14.375vw);
  margin:0 auto;border-radius:50%;overflow:hidden;background:#EEF3FA;
}
.co-base__pic img{display:block;width:100%;height:100%;object-fit:cover}
.co-base__list .t{
  display:block;margin-top:min(36px,1.875vw);
  font-size:min(32px,1.667vw);font-weight:700;line-height:min(39px,2.031vw);color:var(--brand);
}
.co-base__list p{
  margin:min(16px,.833vw) auto 0;width:min(270px,14.063vw);max-width:100%;
  font-size:min(16px,.833vw);font-weight:300;line-height:1.5;color:#757575;
}

/* 03 联名优品 1920×964 */
.co-brand{position:relative;padding:min(80px,4.167vw) var(--gutter);background:#fff;overflow:hidden}
.co-cars{position:relative;height:min(579px,30.156vw);margin-top:min(79px,4.115vw);overflow:hidden}
/* 轮播居中不测量 DOM：位移 = -(序号 × (边图宽 + 间距) + 中图宽 / 2)，全走 CSS 变量 calc。
   切图只改 track 上的 --co-i（JS），尺寸随断点变化时居中关系自动保持正确 */
.co-track{
  --co-i:0;--co-edge:min(847px,44.115vw);--co-mid:min(1043px,54.323vw);--co-gap:min(75px,3.906vw);
  position:absolute;left:50%;top:0;height:100%;display:flex;align-items:center;gap:var(--co-gap);
  transform:translateX(calc(-1 * (var(--co-i) * (var(--co-edge) + var(--co-gap)) + var(--co-mid) / 2)));
  transition:transform .62s cubic-bezier(.22,.61,.36,1);
}
.co-slide{
  flex:none;width:var(--co-edge);height:min(470px,24.479vw);
  border-radius:min(40px,2.083vw);overflow:hidden;background:#B3B3B3;
  transition:width .62s cubic-bezier(.22,.61,.36,1),height .62s cubic-bezier(.22,.61,.36,1);
}
.co-slide.is-mid{width:var(--co-mid);height:min(579px,30.156vw)}
.co-slide img{display:block;width:100%;height:100%;object-fit:cover}
/* 克隆位 → 真实位是无缝瞬移，必须连 slide 的宽高过渡一起关掉，否则会看到"弹一下" */
.co-track.is-jump,.co-track.is-jump .co-slide{transition:none}
.co-nav{
  position:absolute;top:calc(50% - min(31px,1.615vw));z-index:3;
  width:min(62px,3.229vw);height:min(62px,3.229vw);border:0;cursor:pointer;border-radius:50%;
  background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;
  transition:background .25s;
}
.co-nav:hover{background:rgba(0,0,0,.72)}
.co-nav[hidden]{display:none}   /* 类选择器会盖掉 UA 的 [hidden]，需显式声明 */
.co-nav svg{width:min(22px,1.146vw);height:min(22px,1.146vw)}
.co-nav--prev{left:min(40px,2.083vw)}
.co-nav--next{right:min(40px,2.083vw)}

/* 04 独家创品 1920×1015 */
.co-excl{position:relative;padding:min(80px,4.167vw) var(--gutter) min(122px,6.354vw);background:#fff;overflow:hidden}
.co-excl__inner{
  display:flex;flex-direction:column;gap:min(40px,2.083vw);
  width:100%;margin:0 auto;
}
.co-excl__inner .co-sub{margin-top:0}   /* 区块内已有 flex gap:40，避免与 .co-sub 的 38 叠加 */
/* 独家创品大图：素材 1440×625（与容器同比例），故用 aspect-ratio 自适应，
   窄屏等比缩放而不是 cover 裁切；图在 1744 内容宽里居中留白（图本身浅底，不可见） */
.co-excl__pic{
  position:relative;width:min(1440px,100%);height:auto;aspect-ratio:1440 / 625;margin:0 auto;
  border-radius:min(40px,2.083vw);overflow:hidden;background:#B3B3B3;
}
.co-track--full{width:100%;--co-edge:100%;--co-mid:100%}
.co-track--full .co-slide,.co-track--full .co-slide.is-mid{
  width:100%;height:100%;border-radius:0;
}

/* 05 为什么是“萝卜白菜”？ 1920×936
   按设计稿：白底、左侧双手机 mockup 大图、右侧 logo + 标题 + 橙色副标题 + 左对齐文案
   栅格：区块左右内距走全站 --gutter，inner 满宽（与 .wrap.section 同参数） */
.co-why{position:relative;background:#F5F7FA;overflow:hidden;padding:min(96px,5vw) var(--gutter)}
.co-why__inner{
  display:flex;align-items:center;gap:min(80px,4.167vw);
  width:100%;margin:0 auto;
}
.co-why__pic{flex:1.15;min-width:0;height:min(620px,32.292vw);border-radius:var(--radius);overflow:hidden;background:#F5F7FA}
.co-why__pic .ph{width:100%;height:100%}
.co-why__col{
  flex:1;min-width:0;
  display:flex;flex-direction:column;align-items:flex-start;gap:min(36px,1.875vw);
}
.co-why__icon{width:min(116px,6.042vw);height:min(111px,5.781vw)}
.co-why__icon .ph{width:100%;height:100%}
.co-why__ttl{
  margin:0;text-align:left;color:#000;
  font-size:min(50px,2.604vw);font-weight:700;line-height:min(61px,3.177vw);
}
.co-why__sub{margin:0;text-align:left;color:#FF5100;font-size:min(28px,1.458vw);font-weight:600;line-height:min(36px,1.875vw)}
.co-why__txt{margin:0;width:100%;color:#4A4A4A;font-size:min(16px,.833vw);line-height:min(32px,1.667vw)}

/* 供应商表单专属控件：上传区 + 隐私协议勾选
   （容器与字段已用全站统一 .form/.field 裸布局，与 join.html「提交加盟意向」一致；
     度量对齐 .field 语言：16px 字 / 8px 圆角） */
.co-up__lb{
  display:block;font-size:var(--fs-sm);font-weight:600;line-height:1.5;color:var(--ink-2);
}
.co-drop{
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;min-height:128px;padding:20px 24px;
  border:1px dashed #C9CED8;border-radius:var(--radius-sm);background:#FAFBFD;
  text-align:center;cursor:pointer;transition:border-color .25s ease,background .25s ease,box-shadow .25s ease;
}
.co-drop:hover{border-color:var(--brand);background:#F5F8FF}
.co-drop:focus-within{border-color:var(--brand);box-shadow:0 0 0 4px rgba(0,103,255,.14)}
.co-drop.is-over{border-color:var(--brand);background:#EDF3FF}
.co-drop__input{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;cursor:pointer}
.co-drop__ico svg{display:block;width:36px;height:36px}
.co-drop__main{font-size:var(--fs-body);font-weight:500;line-height:1.5;color:var(--ink)}
.co-drop__main em{font-style:normal;font-weight:400;color:var(--ink-2)}
.co-drop__hint{font-size:var(--fs-sm);line-height:1.6;color:var(--ink-3)}
.co-drop__file{display:none;font-size:var(--fs-sm);line-height:1.6;color:var(--brand)}
.co-drop.is-picked .co-drop__main,
.co-drop.is-picked .co-drop__hint{display:none}
.co-drop.is-picked .co-drop__file{display:block}

.co-agree{
  grid-column:1/-1;display:flex;align-items:center;gap:10px;
  font-size:var(--fs-body);line-height:1.6;color:var(--ink-2);cursor:pointer;
}
.co-agree input{
  flex:none;appearance:none;-webkit-appearance:none;margin:0;
  width:22px;height:22px;
  border:1px solid #C9CED8;border-radius:4px;background:#fff;
  background-position:center;background-repeat:no-repeat;background-size:13px auto;
  cursor:pointer;transition:background-color .2s ease,border-color .2s ease;
}
.co-agree input:checked{
  border-color:var(--brand);background-color:var(--brand);
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='12' fill='none'%3E%3Cpath d='m1 5.333 4.333 4.334L14 1' stroke='%23fff' stroke-width='2.167' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
.co-agree a{color:var(--brand);text-decoration:none;border-bottom:1px solid rgba(0,103,255,.4)}
.co-agree a:hover{border-bottom-color:var(--brand)}

/* ---------------- 好物合作页：窄屏降级 ---------------- */
@media (max-width:1279px){
  /* 窄屏版式：限制首屏总高不超过820px，box-sizing设为border-box防padding撑高 */
  .co-hero{
    box-sizing:border-box;
    height:820px;
    max-height:820px;
    padding-top:min(140px,12vw);
    padding-bottom:min(48px,4vw);
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  /* 海报文字位置重排（2026-11-10 阿凯：移动端文字位置不合适）
   现状：书法标题从 hero 顶部 0 开始，被 64px 页头 logo 直接压住；
   重排：标题从页头下方 72px 起（呼吸空间），副文案行高收紧，按钮贴下。 */
.co-hero__title{width:min(890px,86vw);margin-top:70px}
.co-hero__word{height:clamp(56px,17vw,74px)}
/* 文字块整体垫一层「上深下透」渐变：标题/文案/按钮都落在渐变上，
   与背景手势图分层，白字始终可读（2026-11-10 阿凯反馈压图问题） */
.co-hslide.is-active .co-hero__bg::after{
  content:'';position:absolute;left:0;top:0;width:100%;height:72%;
  background:linear-gradient(180deg, rgba(11,46,92,.55) 0%, rgba(11,46,92,.28) 55%, rgba(11,46,92,0) 100%);
  pointer-events:none;
}
.co-hero__sub{margin-top:12px;font-size:13px;line-height:1.7;padding:0 24px;max-width:100%}
.co-hero__cta{margin-top:14px}
  .co-hero__word{height:min(179px,17.3vw)}
  .co-hero__sub{width:min(536px,86vw);font-size:13px;line-height:22px}
  .co-hero__cta{
    margin-top:min(40px,4vw);
    min-width:200px;height:56px;padding:0 28px;font-size:17px;line-height:1;
  }
  .co-hero__cta svg{width:20px;height:20px}
  .co-hero__cta .co-cta-arrow{width:18px;height:28px}
  .co-ttl{font-size:34px;line-height:44px}
  .co-sub{width:100%;font-size:15px;line-height:26px}
  .co-sub--loose{line-height:26px}
  .co-base{padding:56px var(--gutter) 72px}
  .co-base__row{margin-top:40px;width:100%}
  .co-base__pic{width:min(240px,30vw);height:min(240px,30vw)}
  .co-base__list{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px}
  .co-base__list .t{margin-top:16px;font-size:22px;line-height:30px}
  .co-base__list p{width:100%;max-width:280px;font-size:14px}
  .co-brand{padding:56px var(--gutter)}
  .co-cars{height:min(520px,44vw);margin-top:32px}
  /* 平板档整体等比缩到「容器装得下两侧」：中图 66vw、边图 54vw（=宽/1.802 与设计稿同比例），
     否则中图 1043 宽会把两侧挤出容器，侧图完全看不见（实测仅露 4px） */
  /* 两侧露出参数只属于联名优品（.co-cars 内的三列轮播）；
     独家创品是 .co-track--full 整宽单图，--co-edge/mid 必须保持 100%，
     否则 54vw/66vw 会让两张图各露一半（2026-11-10 阿凯截图问题） */
  .co-track{--co-edge:54vw;--co-mid:66vw;--co-gap:3.9vw}
  .co-track--full{--co-edge:100%;--co-mid:100%}
  .co-cars .co-slide{height:30vw}
  .co-cars .co-slide.is-mid{height:36.63vw}   /* 高度同样只作用于联名优品，--full 由容器 aspect-ratio 控制 */
  .co-nav{width:44px;height:44px;top:calc(50% - 22px)}
  .co-nav svg{width:18px;height:18px}
  .co-nav--prev{left:12px}
  .co-nav--next{right:12px}
  .co-excl{padding:56px var(--gutter) 64px}
  .co-excl__inner{width:100%}
  .co-excl__pic{width:100%}
  .co-why{padding:56px var(--gutter);text-align:center}
  .co-why__inner{flex-direction:column;align-items:center;gap:32px}
  /* 移动端全部居中（阿凯 2026-11-10 指定）：logo / 标题 / 橙色副标题 / 正文 */
  .co-why__col{align-items:center;text-align:center}
  .co-why__txt{text-align:center}
  .co-why__pic{height:min(420px,60vw)}
  .co-why__col{gap:20px}
  .co-why__icon{width:88px;height:84px}
  .co-why__ttl{font-size:26px;line-height:36px}
  .co-why__sub{font-size:18px;line-height:28px}
  .co-why__txt{font-size:14px;line-height:26px}
  .co-up__lb{margin-bottom:8px;font-size:13px;line-height:20px}
  .co-drop{min-height:116px;padding:20px 16px;gap:4px}
  .co-drop__ico svg{width:30px;height:30px}
  .co-drop__main{font-size:14px}
  .co-drop__hint{font-size:12px;line-height:18px}
  .co-drop.is-picked .co-drop__file{font-size:13px;line-height:20px}
  .co-agree{gap:8px;font-size:13px;line-height:20px}
  .co-agree input{width:20px;height:20px;background-size:12px auto}
}
@media (max-width:767px){
  /* 移动端内容自适应展开，不设死820px防过大空白或遮挡（排在 1279 块之后以覆盖其 .co-hero） */
  .co-hero{
    /* 高度统一：与 careers 首屏同款 min(820px,88vw)，内容 flex 居中（2026-11-10） */
    height:min(820px,88vw);
    max-height:min(820px,88vw);
    padding-top:96px;
    padding-bottom:48px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }
  /* （重复的 .co-hero__title margin-top:0 已合并到上文统一处） */
}

/* ================= 加入我们页（设计稿 65:02680 · 1920×5571） ================= */
.jn-ttl{
  margin:0;text-align:center;
  font-family:var(--ff-title);font-size:min(60px,3.125vw);font-weight:400;line-height:min(72px,3.75vw);color:#000;
}

/* 01b 加入我们 · 栏目子导航（仅 careers / careers-campus / careers-social 三页）
   ① 流内一份随内容上滚；② fixed 副本钉在页头正下方接管。交接时刻两份位置完全重合，视觉无跳变。
   副本淡入（opacity + 上移 16px）而非 translateY(-100%) 滑入：页头是 80% 半透明白 + 毛玻璃，
   整条从页头背后滑过时会被透出来一部分，很脏 */
.jnav{position:relative;z-index:1;background:#fff;border-bottom:1px solid var(--line)}
.jnav__inner{max-width:1650px;margin:0 auto;padding:0 32px;height:72px;display:flex;align-items:center;gap:min(56px,2.917vw)}
.jnav__item{position:relative;display:inline-block;padding:8px 2px;font-size:min(18px,.9375vw);line-height:1.3;color:var(--ink-2);transition:color .25s ease}
.jnav__item::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--brand);transform:scaleX(0);transform-origin:left center;transition:transform .35s cubic-bezier(.22,.61,.36,1)}
.jnav__item:hover{color:var(--ink-88)}
.jnav__item.is-current{color:var(--brand);font-weight:600}
.jnav__item.is-current::after{transform:scaleX(1)}
.jnav--fixed{
  position:fixed;left:0;right:0;top:var(--header-h);z-index:39;
  opacity:0;transform:translateY(-16px);pointer-events:none;
  transition:top .4s ease,opacity .3s ease,transform .35s cubic-bezier(.22,.61,.36,1);
}
/* 页头下滚收起时，子导航补位到顶部接管（与页头同为 .4s，交接不露白） */
.jnav--fixed.is-top{top:0}
/* 投影只在真正「脱离文档流」后加：像资讯页这种流内那份本来就贴着页头的，
   一开始就在同位置重合，加投影会凭空多出一层悬浮感 */
.jnav--fixed.is-detached{box-shadow:0 6px 24px rgba(3,35,75,.08)}
.jnav--fixed.is-pinned{opacity:1;transform:none;pointer-events:auto}
@media (max-width:1279px){
  .jnav__inner{height:60px;padding:0 24px;gap:28px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .jnav__inner::-webkit-scrollbar{display:none}
  .jnav__item{font-size:16px;white-space:nowrap}
}

/* 01 Hero 轮播 1920×820（三张：社会招聘 / 校园招聘 / 合伙人招募）
   淡入 + 轻微 Ken Burns（激活图 1.06→1 缓放）；自动轮播 5s，hover / 切后台暂停
   层序：bg(0) < scrim(1) < body(2) < 箭头/圆点(3) —— 内容层显式 z-index，防止被图盖住 */
.jn-hero{position:relative;height:min(820px,42.708vw);background:#0B2E5C;overflow:hidden}
.jnh-slide{position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .7s ease}
.jnh-slide.is-active{opacity:1;pointer-events:auto;z-index:1}
.jnh-bg{position:absolute;inset:0;z-index:0;overflow:hidden}
.jnh-bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.06);transition:transform 6.5s ease-out}
.jnh-slide.is-active .jnh-bg img{transform:scale(1)}
.jnh-scrim{position:absolute;inset:0;z-index:1;background:rgba(3,35,75,.5)}
.jnh-body{
  position:absolute;left:0;right:0;bottom:min(120px,6.25vw);z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:min(28px,1.458vw);
  text-align:center;
  opacity:0;transform:translateY(18px);transition:opacity .6s .15s ease,transform .6s .15s ease;
}
.jnh-slide.is-active .jnh-body{opacity:1;transform:none}
.jnh-ttl{
  margin:0;font-family:var(--ff-title);font-weight:400;
  font-size:min(60px,3.125vw);line-height:min(72px,3.75vw);color:#fff;letter-spacing:2px;
  text-shadow:0 2px 18px rgba(3,35,75,.45);
}
.jnh-cta{
  display:flex;align-items:center;justify-content:center;gap:min(10px,.521vw);
  width:fit-content;min-width:min(280px,14.583vw);
  height:min(90px,4.688vw);padding:0 min(40px,2.083vw);
  border-radius:639px;text-decoration:none;white-space:nowrap;
  background:linear-gradient(307deg,rgba(255,255,255,.15) 0%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.12) 100%);
  border:1px solid rgba(255,255,255,.3);
  -webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);
  color:#fff;font-size:min(30px,1.563vw);font-weight:500;
  transition:background .25s,border-color .25s,transform .25s;
}
.jnh-cta:hover{background:rgba(255,255,255,.28);border-color:#fff;transform:translateY(-2px)}
.jnh-cta svg{flex:none;width:min(30px,1.563vw);height:min(30px,1.563vw)}
/* 箭头统一到 .ux-arrow 规范：Hero 深色图上用白色描边环 */
.jn-slider__nav{
  position:absolute;top:50%;z-index:3;transform:translateY(-50%);
  width:62px;height:62px;padding:0;border:2px solid currentColor;
  border-radius:50%;background:transparent;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  color:#fff;transition:background-color .2s ease,transform .2s ease,opacity .2s ease;
}
.jn-slider__nav:hover{background:rgba(255,255,255,.18)}
.jn-slider__nav:active{transform:translateY(-50%) scale(.94)}
.jn-slider__nav svg{width:42%;height:42%}
.jn-slider__prev{left:min(48px,2.5vw)}
.jn-slider__next{right:min(48px,2.5vw)}
.jn-slider__dots{
  position:absolute;left:0;right:0;bottom:min(34px,1.77vw);z-index:3;
  display:flex;justify-content:center;gap:12px;
}
.jn-slider__dots button{
  width:32px;height:4px;padding:0;border:0;border-radius:2px;cursor:pointer;
  background:rgba(255,255,255,.35);transition:background .3s;
}
.jn-slider__dots button.is-active{background:#fff}
@media (prefers-reduced-motion: reduce){
  .jnh-slide{transition:none}
  .jnh-bg img{transform:none;transition:none}
  .jnh-body{transition:none;opacity:1;transform:none}
}

/* 02 选择驰骋的N个理由 1920×2559 */
.jn-reason{position:relative;padding:min(88px,4.583vw) 0 min(102px,5.313vw);background:#fff;overflow:hidden}
.jn-cards{
  display:flex;flex-direction:column;gap:min(40px,2.083vw);
  width:min(1650px,85.938vw);max-width:calc(100% - 48px);margin:min(55px,2.865vw) auto 0;
}
/* 02 选择驰骋的N个理由（设计稿 65:21826 · 1920×2559）
   卡片底图在设计稿里是一张「极浅蓝白」柔和渐变图（左上 #DFF2FF → 右下 #FEFEFF，采样无可见纹理），
   等价为一个 135° 线性渐变；此前误做成深蓝 #123A6B，已按设计稿纠正 */
.jn-card{
  position:relative;flex:none;display:flex;flex-direction:column;gap:min(40px,2.083vw);
  padding:min(46px,2.396vw);border-radius:min(40px,2.083vw);overflow:hidden;
  background:linear-gradient(135deg,#DFF2FF 0%,#F7FBFE 100%);
}
.jn-card > *{position:relative;z-index:1}
.jn-card--blue{--hl:#0A5CFF}
.jn-card--orange{--hl:#FF7429}
.jn-card--green{--hl:#00A716}
.jn-card__hd{display:flex;flex-direction:column;align-items:center;padding-top:min(7px,.365vw)}
.jn-card__hd h3{
  margin:0;padding:0 40px;border-radius:min(40px,2.083vw);
  background:var(--hl);            /* 设计稿为实色药丸 + 白字，此前误用了 26% 透明混合 */
  color:#fff;font-size:min(40px,2.083vw);font-weight:700;line-height:min(48px,2.5vw);
}
/* 卡片二 / 三的设计稿标题与副文案间距为 19，卡片一为 21 */
.jn-card--orange .jn-card__hd p,.jn-card--green .jn-card__hd p{margin-top:min(19px,.99vw)}
.jn-card__hd p{
  margin:min(21px,1.094vw) 0 0;max-width:100%;
  color:#999;font-size:min(24px,1.25vw);font-weight:500;line-height:min(29px,1.51vw);text-align:center;
}
.jn-glass{
  position:relative;flex:none;height:min(275px,14.323vw);border-radius:min(20px,1.042vw);overflow:hidden;
  background:linear-gradient(141deg,rgba(255,255,255,.7) 0%,rgba(255,255,255,.4) 100%);
  box-shadow:inset 0 0 0 min(4px,.208vw) rgba(255,255,255,.42);
  -webkit-backdrop-filter:blur(92px);backdrop-filter:blur(92px);
}
.jn-glass__pic{
  position:absolute;left:min(20px,1.042vw);top:min(20px,1.042vw);
  width:min(582px,30.313vw);height:min(235px,12.24vw);border-radius:min(20px,1.042vw);overflow:hidden;background:#fff;
}
.jn-glass__pic .ph{width:100%;height:100%}
/* 素材比例 1.29~2.19，容器 582×235（2.477）→ 按宽度贴合、上下裁切，主体均落在中带 */
.jn-glass__pic img{display:block;width:100%;height:100%;object-fit:cover}
.jn-glass__txt{
  position:absolute;left:min(675px,35.156vw);top:min(78px,4.063vw);
  width:min(712px,37.083vw);max-width:calc(100% - min(695px,36.198vw));
}
.jn-glass__txt h4{margin:0;font-size:min(32px,1.667vw);font-weight:700;line-height:min(38px,2vw);color:#000}
.jn-glass__txt p{margin:min(18px,.938vw) 0 0;font-size:min(20px,1.042vw);line-height:min(31px,1.615vw);color:#000}

/* 03 员工福利（设计稿 65:22085 · 1920×884 · 背景 #F7F7F7）
   结构：单行「1 大 + 小格」，格间距 12。设计稿是 1 大 450 + 5 小 270（总宽 1860，已超画板 75px）；
   阿凯又补 3 张图 → 共 8 张，按同一比例缩到一行放满 1650（大 400 / 小 166 = 1646），保持主次关系不变。
   交互：hover 展开成大图宽度，后面格子随之右移、被区块裁切 → 层叠推进感；静止态不展开。
   hover 规则用 @media (hover:hover) 包住，触屏设备不触发。 */
.jn-wel{position:relative;padding:min(88px,4.583vw) 0 min(137px,7.135vw);background:#F7F7F7;overflow:hidden}
.jn-wel__grid{
  position:relative;display:flex;align-items:flex-start;gap:min(12px,0.625vw);
  width:min(1650px,85.938vw);margin:min(80px,4.167vw) auto 0;
}
.jn-wel__cell{
  position:relative;flex:none;overflow:hidden;border-radius:min(20px,1.042vw);background:#fff;
  transition:width .55s cubic-bezier(.22,.61,.36,1);
}
.jn-wel__cell .ph{width:100%;height:100%}
.jn-wel__cell img{display:block;width:100%;height:100%;object-fit:cover}
.jn-wel--big{width:min(400px,20.833vw);height:min(510px,26.563vw)}
.jn-wel--sm{width:min(166px,8.646vw);height:min(510px,26.563vw)}
/* 展开由 JS 的 .is-active 唯一驱动（自动轮播/点击/悬停预览），替代原纯 CSS hover 展开，
   避免「hover 展开」与「轮播展开」同时把两格撑到 400 造成双展开冲突。
   手风琴式「唯一展开」：激活格展开到 400、格一同时收起（:has），宽度守恒总宽恒为 1646，
   不会像「只展开不收起」那样把后面的格子推出 1920 画布。窄屏是固定尺寸 + 横向滚动，不触发宽度展开。 */
@media (min-width:1280px){
  .jn-wel__cell.is-active{z-index:2;width:min(400px,20.833vw)}
  .jn-wel__grid:has(.jn-wel__cell.is-active) .jn-wel--big:not(.is-active){width:min(166px,8.646vw)}
}
/* 蓝底标签：只有展开的那一格显示（格一默认展开，其他格 hover 时出现） */
.jn-wel__tag{
  position:absolute;left:0;right:0;bottom:0;min-height:min(100px,5.208vw);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:min(6px,0.313vw);
  padding:min(20px,1.042vw) min(40px,2.083vw);background:#0462FF;text-align:center;
  opacity:0;transform:translateY(6px);
  transition:opacity .4s ease,transform .4s ease;
}
.jn-wel__tag b{color:#fff;font-size:min(30px,1.563vw);font-weight:700;line-height:min(36px,1.875vw)}
.jn-wel__tag span{color:#fff;font-size:min(20px,1.042vw);font-weight:400;line-height:min(24px,1.25vw)}
.jn-wel--big .jn-wel__tag{opacity:1;transform:none}          /* 格一默认展开，标签常显 */
/* 激活格标签常显；格一被收起时标签同步隐藏（与上面的宽度规则一一对应） */
@media (min-width:1280px){
  .jn-wel__cell.is-active .jn-wel__tag{opacity:1;transform:none}
  .jn-wel__grid:has(.jn-wel__cell.is-active) .jn-wel--big:not(.is-active) .jn-wel__tag{opacity:0;transform:translateY(6px)}
}
/* 窄屏（2026-11-11 阿凯）：全部同尺寸纯滑动，没有「激活格」概念，不画描边圈 */
@media (max-width:1279px){
  .jn-wel__cell{transition:none}
}
@media (prefers-reduced-motion: reduce){
  .jn-wel__cell{transition:none}
  .jn-wel__tag{transition:none}
}

/* 04 驰骋风采 1920×941 */
.jn-show{position:relative;padding:min(88px,4.583vw) 0 min(60px,3.125vw);background:#E8F4FF;overflow:hidden}
.jn-cars{position:relative;height:min(561px,29.219vw);margin-top:min(80px,4.167vw);overflow:hidden}
.jn-track{
  position:absolute;left:0;top:0;height:100%;display:flex;align-items:center;gap:min(52px,2.708vw);
  transform:translateX(0);transition:transform .62s cubic-bezier(.22,.61,.36,1);
}
.jn-slide{
  flex:none;width:min(1243px,64.74vw);height:min(561px,29.219vw);
  border-radius:min(30px,1.563vw);overflow:hidden;background:#fff;
}
.jn-slide .ph{width:100%;height:100%}
.jn-slide img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.jn-arrows{display:flex;gap:min(32px,1.667vw);justify-content:center;margin-top:min(18px,.938vw)}
.jn-nav{
  width:min(62px,3.229vw);height:min(62px,3.229vw);border:0;cursor:pointer;border-radius:50%;
  background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;transition:background .25s;
}
.jn-nav:hover{background:rgba(0,0,0,.72)}
.jn-nav svg{width:min(22px,1.146vw);height:min(22px,1.146vw)}

/* ---------------- 页头：子菜单 —— 腾讯 UberMenu transition-shift 同款动效 ----------------
   腾讯实现（plugins/ubermenu/pro/assets/css/ubermenu.min.css）：
   .ubermenu-transition-shift .ubermenu-item .ubermenu-submenu-drop{
     margin-top:20px; top:auto; opacity:0;
     transition-property:margin-top,opacity,visibility; }
   .ubermenu-item.ubermenu-active > .ubermenu-submenu-drop{ margin-top:0; opacity:1 }
   公共：transition-duration:.3s; transition-timing-function:ease-in
   面板：absolute top:100%（贴住页头底边）、白底 + 1px #D9D9D9 顶边线、无圆角无投影 */
/* 顶级菜单不显示箭头 —— 腾讯 UberMenu 顶级项无任何 indicator，
   「有下拉」与「当前页」全靠文字变蓝 + 底部蓝线表达（.nav a .t::after） */
.nav__item{position:static;display:inline-flex;align-items:center}
/* 面板视觉 = 腾讯官网 www.tencent.com 真站 hover 实测值（2026-09-29 采样校准）
   - 位置恒定不动：top:100% 贴住页头底边，全程 rect.top 不变
   - 只有 opacity 0→1 淡入：0.2s ease-in，且显示前有约 150ms hover 意图延迟
     （插件自带的 transition-shift 20px 位移被主题 margin-top:calc(2rem - 1px)!important 抵消，
       单纯照抄 ubermenu.min.css 会做出错误的位移感）
   - 白底、1px #D9D9D9 顶边线、无圆角、内距 32px / 80px
   - 投影：腾讯实测 0 0 20px rgba(0,0,0,.15)，但其 header 白色实底层挡住了上半圈，
     实际可见的只有下半圈。等效写法 = 向下偏移阴影（offset 12 / spread -6），
     上溢仅 2px 不可见 —— 我们的 header 是 80% 毛玻璃，子元素阴影会穿透显示，必须用这种写法 */
.nav .sub{
  position:absolute;left:0;right:0;top:100%;z-index:20;
  padding:min(32px,1.667vw) 0 min(80px,4.167vw);
  background:#0A1E3C;border-top:1px solid rgba(255,255,255,.1);
  box-shadow:0 12px 20px -6px rgba(0,0,0,.3);
  opacity:0;visibility:hidden;
  transition:opacity .2s ease-in,visibility 0s linear .2s;
}
.nav__item:hover .sub,.nav__item:focus-within .sub{
  opacity:1;visibility:visible;
  transition:opacity .2s ease-in .15s,visibility 0s linear .15s;
}
/* 面板内容 = 腾讯 mega 范式：首行大标题 + 下方多列链接
   实测值：标题 51px/700/品牌蓝/margin-bottom 96px；链接 21px/500/#000/行高 33.6px */
.nav .sub__inner{
  display:block;max-width:1650px;margin:0 auto;padding:0 32px;
}
.sub__label{
  display:block;margin:0 0 min(64px,3.333vw);
  font-family:var(--ff-title);font-size:min(51px,2.656vw);font-weight:700;line-height:1.2;color:#fff;
}
.sub__cols{display:flex;align-items:flex-start;column-gap:min(96px,5vw)}
.nav .sub a{
  display:block;font-size:min(21px,1.094vw);font-weight:500;line-height:1.6;color:rgba(255,255,255,.85);white-space:nowrap;
}
.nav .sub a .t::after{bottom:-8px}
.nav .sub a:hover{color:#fff}


/* ---------------- 加入我们页：窄屏降级 ---------------- */
@media (max-width:1279px){
  .jn-hero{height:min(820px,88vw)}   /* 窄屏加高：64vw 时标题会被固定头部压住 */
  .jnh-ttl{font-size:34px;line-height:44px;letter-spacing:1px}
  .jnh-body{bottom:96px;gap:16px}
  .jnh-cta{min-width:200px;height:56px;padding:0 28px;font-size:20px}
  .jnh-cta svg{width:20px;height:20px}
  .jn-slider__nav{width:62px;height:62px}   /* 与全站箭头统一 62px（≤767px 才是 44px） */
  .jn-slider__prev{left:12px}
  .jn-slider__next{right:12px}
  .jn-slider__dots{bottom:24px}
  .jn-ttl{font-size:34px;line-height:44px}
  .jn-reason{padding:56px 0 64px}
  .jn-cards{margin-top:32px;gap:24px;width:calc(100% - 32px)}
  .jn-card{padding:24px 20px;gap:24px;border-radius:24px}
  .jn-card__hd h3{font-size:22px;line-height:32px;padding:4px 24px}
  .jn-card__hd p{margin-top:12px;font-size:14px;line-height:22px}
  .jn-glass{height:auto;padding:20px;display:flex;flex-direction:column;gap:16px}
  /* 原为 height:min(235px,44vw)：width:100% 会把框拉成 1151×235（比例 4.9），
     换成真实图后 cover 会裁掉 64%。改为限宽 582 + aspect-ratio，与 1920 档保持同一比例 */
  .jn-glass__pic{position:static;width:100%;max-width:582px;height:auto;aspect-ratio:582/235;border-radius:16px}
  .jn-glass__txt{position:static;width:100%;max-width:none}
  .jn-glass__txt h4{font-size:20px;line-height:28px;font-weight:700}
  .jn-glass__txt p{margin-top:10px;font-size:16px;line-height:24px}
  /* 窄屏配图按 16:9（更接近素材 1.29~2.19 的多数），比 2.48 少裁一些 */
  .jn-glass__pic{aspect-ratio:16/9}
  .jn-wel{padding:56px 0 64px}
  /* 窄屏：6 格总宽 1860 放不下（vw 缩到 88px 太窄），改为固定尺寸 + 横向滚动 */
  .jn-wel__grid{
    width:100%;max-width:none;margin:32px 0 0;padding:0 16px;
    gap:12px;overflow-x:auto;scroll-snap-type:x proximity;scroll-padding-left:16px;-webkit-overflow-scrolling:touch;
  }
  /* 2026-11-11 阿凯：移动端没有点击互动形式，取消「1 大 + N 小」，8 格全部同尺寸，纯左右滑动 */
  .jn-wel--big,.jn-wel--sm{width:280px;height:318px;scroll-snap-align:start}
  .jn-wel__tag{min-height:64px;padding:10px 12px;gap:2px}
  .jn-wel__tag b{font-size:15px;line-height:20px}
  .jn-wel__tag span{font-size:11px;line-height:15px}
  /* 窄屏没有 hover 交互，标签常显，否则 7 张小图没有任何文字说明 */
  .jn-wel--sm .jn-wel__tag{opacity:1;transform:none}
  .jn-wel__cell .lb{font-size:18px;line-height:24px;left:14px;bottom:14px}
  .jn-wel__cell .lb em{font-size:12px;line-height:16px}
  .jn-show{padding:56px 0 64px}
  .jn-cars{height:min(561px,46vw);margin-top:28px}
  .jn-slide{width:min(1243px,86vw);height:min(561px,46vw)}
  /* 窄屏断点修正：track 左起始对齐，不再保留 50% 居中偏移 */
  .jn-track{left:0;}
  .jn-arrows{margin-top:16px;gap:20px}
  .jn-nav{width:44px;height:44px}
  .jn-nav svg{width:18px;height:18px}
}

/* ================= 社会招聘 / 校园招聘（70:1330 · 70:1449） ================= */
/* 01 Hero 1920×640 */
.rc-hero{position:relative;height:min(640px,33.333vw);background:#0B2E5C;overflow:hidden}
.rc-hero__bg{position:absolute;left:0;top:0;width:100%;height:100%;overflow:hidden}
.rc-hero__bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
/* 底图中心高光过亮导致标题不可读：中心柔和压暗，边缘保持原图亮度 */
.rc-hero__bg::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 62% 72% at 50% 46%,rgba(11,46,92,.42),rgba(11,46,92,.10) 72%,rgba(11,46,92,0))}
/* 社会招聘 banner：指定深蓝 50% 平铺遮罩（覆盖上方径向变体） */
.rc-hero--scrim .rc-hero__bg::after{background:rgba(11,46,92,.5)}
.rc-hero__bg .ph{width:100%;height:min(640px,33.333vw)}
/* 社会招聘稿：底图 1920×959 且整体上移 69 */
.rc-hero--shift .rc-hero__bg .ph{height:min(959px,49.948vw);margin-top:min(-69px,-3.594vw)}
.rc-hero__en{
  position:absolute;left:0;right:0;top:min(262px,13.646vw);margin:0;text-align:center;
  font-size:min(60px,3.125vw);font-weight:700;line-height:min(73px,3.802vw);
  background-image:linear-gradient(90deg,#D3FFF3 0%,#FFFFFF 41%,#AAD7FF 71%,#FFFFFF 100%);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;-webkit-text-fill-color:transparent;
  /* 透明填充下 text-shadow 会透字，改用 drop-shadow 作用于最终渲染结果 */
  filter:drop-shadow(0 2px 12px rgba(3,35,75,.5));
}
.rc-hero__cn{
  position:absolute;left:0;right:0;top:min(343px,17.865vw);margin:0;text-align:center;
  color:#fff;font-size:min(30px,1.563vw);font-weight:700;line-height:min(36px,1.875vw);
  text-shadow:0 2px 14px rgba(3,35,75,.45);
}
.rc-hero__cta{
  position:absolute;left:min(840px,43.75vw);top:min(460px,23.958vw);
  display:flex;align-items:center;justify-content:center;
  width:min(240px,12.5vw);height:min(80px,4.167vw);padding:0 min(40px,2.083vw);
  border-radius:min(205px,10.677vw);text-decoration:none;
  background:linear-gradient(308deg,rgba(0,0,0,.15) 0%,rgba(0,0,0,.15) 0%,rgba(0,0,0,.12) 100%);
  border:1px solid rgba(255,255,255,.28);
  -webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);
  color:#fff;font-size:min(36px,1.875vw);font-weight:500;line-height:min(44px,2.292vw);
  transition:background .25s,border-color .25s;
}
.rc-hero__cta:hover{background:rgba(0,0,0,.32);border-color:#fff}

/* 02 / 03 方向卡网格：640×180 两列，列间距 30、行间距 24 */
.rc-dir{position:relative;padding:min(88px,4.583vw) 0 min(67px,3.49vw);background:#E8F4FF;overflow:hidden}
.rc-dir--5{padding-bottom:min(113px,5.885vw)}
.rc-grid{
  display:grid;grid-template-columns:repeat(2,min(640px,33.333vw));
  gap:min(24px,1.25vw) min(30px,1.563vw);
  width:min(1310px,68.229vw);max-width:calc(100% - 48px);margin:min(86px,4.479vw) auto 0;
}
.rc-card{position:relative;height:min(180px,9.375vw);background:#fff;border-radius:min(20px,1.042vw);overflow:hidden}
.rc-card__txt{position:absolute;left:min(60px,3.125vw);top:min(51px,2.656vw);right:min(150px,7.813vw)}
.rc-card__dir{margin:0;font-size:min(32px,1.667vw);font-weight:500;line-height:min(39px,2.031vw);color:#000}
.rc-card__jobs{margin:min(17px,.885vw) 0 0;font-size:min(18px,.938vw);line-height:min(22px,1.146vw);color:#3D3D3D}
.rc-card__icon{
  position:absolute;left:min(490px,25.521vw);top:min(40px,2.083vw);
  width:min(100px,5.208vw);height:min(100px,5.208vw);
}
.rc-card__icon .ph{width:100%;height:100%}
.rc-card__icon img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}

/* 校园招聘 02 驰骋心语（22:02847 · 1920×921） */
.cp-word{position:relative;padding:min(88px,4.583vw) 0 min(85px,4.427vw);background:#fff;overflow:hidden}
.cp-word__row{
  position:relative;width:min(1396px,72.708vw);max-width:calc(100% - 48px);
  margin:min(111px,5.781vw) auto 0;
  display:grid;
}
/* 心语双条目：grid 同格堆叠，行高随最高条目自适应；淡入切换 */
.cpw-slide{
  grid-area:1/1;position:relative;
  /* 设计稿：照片 640×400、蓝色寄语卡只有 350 高，上下各留 25、卡片垂直居中。
     原来交叉轴是 stretch，flex 把卡片拉满到与照片完全等高，所以出现「等高了」。
     改 center 后卡片回到自身 min-height（350 / 18.229vw），照片仍是 400 / 20.833vw。 */
  display:flex;align-items:center;
  opacity:0;pointer-events:none;transition:opacity .55s ease;
}
.cpw-slide.is-active{opacity:1;pointer-events:auto}
.cp-word__pic{
  flex:0 0 min(640px,33.333vw);
  min-height:min(400px,20.833vw);
  border-radius:min(20px,1.042vw);overflow:hidden;background:#E5F5FF;z-index:1;
}
.cp-word__pic .ph{width:100%;height:100%}
.cp-word__pic img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.cp-word__card{
  position:relative;flex:1 1 auto;min-width:0;
  margin-left:min(-56px,-2.917vw);   /* 与图片右侧重叠 56px，还原设计 */
  min-height:min(350px,18.229vw);
  display:flex;flex-direction:column;
  padding:min(48px,2.5vw) min(45px,2.344vw) min(40px,2.083vw);
  background:var(--brand);border-radius:min(20px,1.042vw);overflow:hidden;z-index:2;
}
.cp-word__quote{
  margin:0;
  color:#fff;font-size:min(20px,1.042vw);font-weight:500;line-height:min(50px,2.604vw);text-align:justify;
}
/* 姓名 + 职位沉底，寄语再多也不会重叠；卡片随内容自适应高度 */
.cp-word__foot{
  margin-top:auto;padding-top:min(28px,1.458vw);
  display:flex;align-items:baseline;flex-wrap:wrap;gap:0 min(20px,1.042vw);
}
.cp-word__name{
  color:#fff;font-size:min(30px,1.563vw);font-weight:700;line-height:min(50px,2.604vw);
}
.cp-word__role{
  color:#fff;font-size:min(20px,1.042vw);font-weight:500;line-height:min(50px,2.604vw);
}
.cp-word__mark{
  position:absolute;right:min(43px,2.24vw);top:min(19px,.99vw);opacity:.18;
  width:min(200px,10.417vw);height:min(200px,10.417vw);
}
.cp-word__mark .ph{width:100%;height:100%}
.cp-word__mark img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.cp-word .jn-arrows{margin-top:min(103px,5.365vw)}
/* 装饰色块（设计稿 6 个 #E5F5FF 方块） */
.cp-deco{position:absolute;z-index:0;display:block;background:#E5F5FF;border-radius:min(10px,.521vw)}
.cp-deco--1{left:min(173px,9.01vw);top:min(291px,15.156vw);width:min(72px,3.75vw);height:min(72px,3.75vw)}
.cp-deco--2{left:min(261px,13.594vw);top:min(215px,11.198vw);width:min(46px,2.396vw);height:min(46px,2.396vw)}
.cp-deco--3{left:min(240px,12.5vw);top:min(686px,35.729vw);width:min(42px,2.188vw);height:min(42px,2.188vw)}
.cp-deco--4{left:min(1546px,80.521vw);top:min(656px,34.167vw);width:min(72px,3.75vw);height:min(72px,3.75vw)}
.cp-deco--5{left:min(1629px,84.844vw);top:min(211px,10.99vw);width:min(72px,3.75vw);height:min(72px,3.75vw)}
.cp-deco--6{left:min(1680px,87.5vw);top:min(635px,33.073vw);width:min(41px,2.135vw);height:min(41px,2.135vw)}

/* 子菜单当前项高亮 */
.nav .sub a.is-current{color:#fff;border-bottom:2px solid #fff}
.drawer a.sub-link.is-current{color:var(--brand)}

/* ---------------- 招聘页：窄屏降级 ---------------- */
@media (max-width:1279px){
  .rc-hero{
    position:relative;height:auto;display:flex;flex-direction:column;align-items:center;
    padding:min(160px,26vw) 24px min(120px,20vw);
  }
  .rc-hero__bg .ph,.rc-hero--shift .rc-hero__bg .ph{height:100%;margin-top:0}
  .rc-hero__en,.rc-hero__cn,.rc-hero__cta{position:static}
  .rc-hero__en{margin:0;font-size:26px;line-height:34px}
  .rc-hero__cn{margin:14px 0 0;font-size:16px;line-height:24px}
  .rc-hero__cta{
    margin:28px 0 0;width:auto;min-width:168px;height:52px;padding:0 28px;
    font-size:20px;line-height:1;border-radius:52px;
  }
  .rc-dir{padding:56px 0 64px}
  .rc-dir--5{padding-bottom:64px}
  .rc-grid{grid-template-columns:1fr;width:calc(100% - 32px);margin-top:32px;gap:16px}
  .rc-card{height:auto;padding:20px 20px 22px}
  .rc-card__txt{position:static}
  .rc-card__dir{font-size:22px;line-height:30px}
  .rc-card__jobs{margin-top:8px;font-size:14px;line-height:22px;overflow-wrap:anywhere}
  /* 业务反馈：连锁管理方向「市场开发」溢出卡片右缘 —— 职位间 &nbsp; 连成不可断行串；
     overflow-wrap:anywhere 允许任意点折行，卡片内自然换行不再出界 */
  .rc-card__icon{left:auto;right:20px;top:20px;width:60px;height:60px}
  .cp-word{padding:56px 0 64px}
  .cp-deco{display:none}
  .cp-word__row{height:auto;width:calc(100% - 32px);margin-top:32px;display:block}
  /* 窄屏 slide：未激活直接隐藏，激活的纵向堆叠，行高随内容自适应 */
  .cpw-slide{display:none}
  .cpw-slide.is-active{display:flex;flex-direction:column;align-items:stretch;gap:16px;opacity:1;pointer-events:auto}
  .cp-word__pic{position:static;flex:none;width:100%;height:min(400px,66vw)}
  .cp-word__card{position:static;flex:1 1 auto;margin-left:0;min-height:0;width:100%;height:auto;padding:26px 20px 28px}
  .cp-word__quote{position:static;margin:0;line-height:32px;font-size:15px}
  .cp-word__foot{margin-top:22px;padding-top:0;gap:0 12px}
  .cp-word__name{position:static;font-size:20px;line-height:30px}
  .cp-word__role{position:static;font-size:14px;line-height:24px}
  .cp-word__mark{right:10px;top:10px;width:110px;height:110px}
  .cp-word .jn-arrows{margin-top:24px}
}

/* 集团发展的窄屏适配：不做钉屏视差（JS 也会把区块高度清空），stage 退回静态流 */
@media (max-width:1279px){
  .bz-brands__stage{position:static;height:auto;overflow:visible}
  .bz-brand{position:relative;height:min(1028px,72vw);visibility:visible;opacity:1}
  .bz-brand:not(.is-on){display:none}
  .bz-brand__pic{left:34vw;width:66vw}
  .bz-brand__desc{width:56vw;font-size:min(36px,2.6vw);line-height:min(60px,4.4vw)}
  .bz-brand__logo{left:var(--gutter);width:min(var(--logo-w,197.36px),21vw);height:auto}
  .bz-brand__navs{top:auto;bottom:min(60px,4.2vw);gap:min(68px,5vw)}
}
@media (max-width:639px){
  .bz-brand{height:auto;min-height:118vw;padding:0 0 132px}
  .bz-brand__pic{left:0;top:0;width:100%;height:56vw}
  .bz-brand__logo{left:24px;top:calc(56vw + 28px);height:auto;max-height:56px}
  /* 文案改「相对底部」定位，把底部 110px 让给箭头，避免箭头压在文字上 */
  .bz-brand__desc{left:24px;right:24px;top:auto;bottom:112px;width:auto;font-size:19px;line-height:30px}
  .bz-brand__navs{left:24px;right:auto;bottom:36px;gap:14px}
  .bz-nav{width:44px;height:44px}
  .bz-nav svg{width:18px;height:18px}
}


/* 产品和服务：业务提供的 1920×729 浅蓝白底图置于跑马灯下方。 */
.mq__backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:0}

/* ---------------- 首页 04 品牌矩阵轮播（设计稿 65:7447 · 727px） ---------------- */
.mq{position:relative;overflow:hidden;background:#fff;height:727px}
.mq__bg{position:absolute;inset:0;z-index:0;opacity:.5}
.mq__bg .ph{width:100%;height:100%}
.mq__title{
  position:absolute;top:105px;left:0;right:0;z-index:3;
  text-align:center;font-family:var(--ff-title);
  font-size:60px;font-weight:700;line-height:72px;color:#000;letter-spacing:2px;
}
.mq__runs{
  position:absolute;left:0;right:0;top:263px;z-index:1;
  display:flex;flex-direction:column;gap:38px;
}
.mq__track{
  display:flex;flex-wrap:nowrap;gap:0;
  width:max-content;will-change:transform;
  margin-left:-183px;                 /* 设计稿行1 首卡起点 */
  animation:mqL 46s linear infinite;
}
/* 行2：向右循环 + 与设计稿一致的错行偏移（-183 + 185 = 2） */
.mq__track--rev{animation:mqR 54s linear infinite;margin-left:2px}
@keyframes mqL{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes mqR{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.mq__card{
  width:340px;height:130px;flex:none;
  /* 用 margin-right 代替 flex gap：两份内容的 -50% 位移才能严丝合缝，否则每轮会跳 10px */
  margin-right:20px;
  background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius-md);
  display:flex;align-items:center;justify-content:center;
  font-size:44px;font-weight:700;letter-spacing:3px;
}
.mq__card img{display:block;width:85%;height:auto}
@media (prefers-reduced-motion: reduce){.mq__track{animation:none}}

/* 品牌墙的移动端降级：原本完全沿用桌面值（区块固定 727px、标题 60px、卡片 340×130），
   在 390 视口下只能看到 1.1 张卡、上下大片留白，观感很空。
   改为：区块高度随内容、标题缩到 30px、卡片 158×62（可看到 2.4 张，暗示连续滚动）。 */
@media (max-width:639px){
  .mq{position:relative;height:auto;padding:min(46px,11.8vw) 0 min(54px,13.8vw)}
  .mq__title{
    position:static;text-align:center;
    font-size:min(30px,7.7vw);line-height:1.3;letter-spacing:1px;
    margin:0 0 min(30px,7.7vw);
  }
  .mq__runs{position:static;display:flex;flex-direction:column;gap:min(12px,3.1vw)}
  .mq__card{
    width:min(158px,40.5vw);height:min(62px,15.9vw);
    margin-right:min(10px,2.6vw);
    border-radius:8px;
  }
  .mq__card img{width:82%}
  /* 行首偏移随卡片宽同步缩小，保证两份内容 -50% 位移仍能严丝合缝 */
  .mq__track{margin-left:min(-79px,-20.3vw)}
  .mq__track--rev{margin-left:min(1px,0.3vw)}
}
/* 平板档（640~1023）：桌面版在此宽度仍显空（727px 固定高、340px 卡只露 2.3 张），
   取桌面与手机之间的中间值 */
@media (min-width:640px) and (max-width:1023px){
  .mq{height:auto;padding:min(58px,6vw) 0 min(68px,7.1vw)}
  .mq__title{
    position:static;text-align:center;
    font-size:min(40px,5.2vw);line-height:1.3;letter-spacing:1px;
    margin:0 0 min(34px,4.4vw);
  }
  .mq__runs{position:static;gap:min(18px,2.4vw)}
  .mq__card{width:min(240px,31vw);height:min(92px,12vw);margin-right:min(14px,1.8vw)}
  .mq__card img{width:84%}
  .mq__track{margin-left:min(-120px,-15.6vw)}
  .mq__track--rev{margin-left:min(2px,0.26vw)}
}
.mq__fade{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  /* 设计稿原值纵向半径 11.42% 只够露一行，调大到 44% 让两行都可见、标题与上下边缘不受影响 */
  background:radial-gradient(50% 44% at 50% 50%, rgba(255,255,255,0) 69.57%, #FFFFFF 100%);
}

/* ---------------- 页尾（白底 · 结构对齐阿里 ali-home，2026-09-30 实测其线上几何后重做：
   首行 logo+关注我们 通栏带 1px 分隔线 / 中部站点地图横向摊开(组标题可点) / 品牌墙竖线密排 / 底部居中版权两行。
   容器与页头同宽 1440，留白收窄（阿里 .foot-wrap 1440 + padding-bottom 10px 的紧致感） ---------------- */
/*   横向走全站 --gutter（1920→88 / 1279→64 / 767→24，与 .wrap 同参数），竖向走 --sp 节奏 */
.ft2{position:relative;background:#fff;color:rgba(10,30,60,.85);overflow:visible}
.ft2__inner{width:100%;padding:var(--sp-lg) var(--gutter) var(--sp-md)}

/* 首行：logo（深底反白，mask+currentColor）+ 关注我们 */
.ft2__follow{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-xs);padding-bottom:var(--sp-sm);border-bottom:1px solid rgba(10,30,60,.12)}
.ft2__brand{display:flex;flex-direction:column;align-items:flex-start;gap:10px;color:#0A1E3C}
.ft2__brand .brand__logo{width:clamp(116px,7.4vw,144px);height:auto;flex:none}
.ft2__code{font-size:15px;font-weight:400;letter-spacing:.6px;color:rgba(10,30,60,.72);white-space:nowrap}
.ft2__sns{display:flex;align-items:center;gap:22px}
.ft2__sns-label{font-size:16px;font-weight:600;letter-spacing:.5px;color:#0A1E3C}
.ft2__qr{display:flex;flex-direction:column;align-items:center;gap:6px}
.ft2__qr-box{width:56px;height:56px;border-radius:8px;border:1px solid rgba(10,30,60,.18);background:#fff;position:relative}
.ft2__qr-box img{display:block;width:100%;height:100%;object-fit:cover;border-radius:7px}
.ft2__qr-box{cursor:pointer}
.ft2__qr-box::before,.ft2__qr-box::after{position:absolute;left:50%;opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease;z-index:30;pointer-events:none}
.ft2__qr-box::after{
  content:"";bottom:calc(100% + 14px);width:168px;height:168px;transform:translateX(-50%) scale(.92);
  background:#fff url("img/qr-official.png") center/93% 93% no-repeat;border-radius:14px;
  box-shadow:0 10px 34px rgba(0,0,0,.32);
}
.ft2__qr-box::before{
  content:"";bottom:calc(100% + 6px);width:0;height:0;transform:translateX(-50%);
  border-left:8px solid transparent;border-right:8px solid transparent;border-top:9px solid #fff;
}
.ft2__qr-box:hover::after,.ft2__qr-box:hover::before{opacity:1;visibility:visible}
.ft2__qr-box:hover::after{transform:translateX(-50%) scale(1)}
.ft2__qr-box .ph{width:100%;height:100%}
.ft2__qr-box .ph::before{opacity:1}
.ft2__qr-name{font-size:12px;line-height:16px;color:rgba(10,30,60,.55)}

/* 中部：站点地图（白组标题 + 浅灰链接，hover 提亮） */
.ft2__cols{display:flex;justify-content:space-between;gap:var(--sp-xs);flex-wrap:wrap;padding:var(--sp-md) 0 var(--sp-xs)}
.ft2__col{min-width:96px}
.ft2__hd{display:block;margin:0 0 14px;font-size:17px;font-weight:600;line-height:24px;letter-spacing:.6px;color:#0A1E3C;text-decoration:none;transition:color .2s}
a.ft2__hd:hover{color:var(--brand)}
.ft2__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ft2__list a{font-size:15px;font-weight:300;line-height:22px;letter-spacing:.4px;color:rgba(10,30,60,.65);text-decoration:none;transition:color .2s}
.ft2__list a:hover{color:#0A1E3C}

/* 底部：左右分布——左举报渠道、右版权 */
.ft2__bar{margin-top:var(--sp-sm);padding-top:var(--sp-sm);border-top:1px solid rgba(10,30,60,.12);display:flex;justify-content:space-between;align-items:center;gap:12px 24px;flex-wrap:wrap}
.ft2__bar p{margin:0;font-family:var(--ff-tight);font-size:13px;font-weight:300;line-height:22px;letter-spacing:.4px;color:rgba(10,30,60,.5)}
.ft2__bar p:first-child{order:2}
.ft2__bar .ft2__beian{flex-basis:100%;display:flex;align-items:center;font-size:12px;line-height:20px}
.ft2__bar .ft2__beian img{height:14px;width:auto}
.ft2__bar a{color:rgba(10,30,60,.5);text-decoration:none;transition:color .2s}
.ft2__bar a:hover{color:#0A1E3C}
.ft2__gap{display:inline-block;width:14px}

@media (max-width:1279px){
  .ft2__cols{justify-content:flex-start;gap:36px 64px}
}
@media (max-width:767px){
  .ft2__inner{padding-top:var(--sp-md);padding-bottom:var(--sp-xs)}
  .ft2__follow{flex-direction:column;align-items:flex-start;gap:22px}
  .ft2__cols{flex-direction:column;gap:28px;padding-top:var(--sp-sm)}
  .ft2__bar{flex-direction:column;align-items:flex-start;gap:8px;margin-top:var(--sp-xs)}
  .ft2__bar p:first-child{order:0}
}

/* ---------------- 走进驰骋页（设计稿 65:00200 · 1920×7944） ---------------- */
/* 01 Hero（820px，图 + 底部「了解更多」） */
/* 原本 margin-top:var(--header-h) 把 hero 推到页头下方，页头压的是白底空白，
   黑纱压白底变成灰条 —— 阿凯反馈「走进驰骋头部没穿透」即此因。
   改为 hero 顶到 0（页头叠在图上），高度补回 header-h 保证总占位 884 不变 */
.ab-hero{position:relative;height:calc(820px + var(--header-h));margin-top:0;overflow:hidden}
.ab-hero .ab-hero__bg{position:absolute;inset:0}
.ab-hero__bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
/* 阿凯指定：50% 遮罩（品牌深蓝，均匀覆盖） */
.ab-hero__scrim{position:absolute;inset:0;z-index:1;background:rgba(3,35,75,.5)}
.ab-hero__more{
  position:absolute;left:50%;bottom:47px;transform:translateX(-50%);z-index:2;
  display:flex;flex-direction:column;align-items:center;
  color:#fff;font-size:20px;line-height:40px;letter-spacing:1px;
}
.ab-hero__more svg{display:block;margin-top:0}
@media (max-width:639px){.ab-hero{height:min(820px,88vw)}.ab-hero__more{bottom:28px;font-size:16px;line-height:30px}}

/* 02 关于驰骋（570px，居中标题 + 5 行正文） */
.ab-intro{position:relative;height:570px;overflow:hidden;text-align:center;background:#fff}
.ab-intro__deco{position:absolute;left:50%;top:88px;transform:translateX(-50%);z-index:0;color:#E5F5FF}
.ab-intro h2{
  position:relative;z-index:1;margin:0;padding-top:130px;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;color:var(--ink-88);
}
.ab-intro__body{
  position:relative;z-index:1;max-width:1342px;margin:68px auto 0;padding:0 32px;
  font-size:18px;line-height:36px;color:#000;
}
@media (max-width:1279px){
  .ab-intro{height:auto;padding-bottom:72px}
  .ab-intro h2{padding-top:88px;font-size:40px;line-height:52px}
  .ab-intro__body{margin-top:40px;font-size:16px;line-height:30px}
}

/* 03 零售生态（设计稿为整张烘焙图 1920×879） */
/* 03b 零售生态（设计稿 62:6767 · 1920×879 白底）：左侧轨道图 + 右侧角色文案，点球切换。
   几何按 1920×879 换算为百分比；orbit 保持 1920:879 比例，内部全部相对 orbit 等比缩放。
   弧线装饰按设计稿截图目测重绘（原始 SVG 资产短期链接未落盘，出入可后续替换官方导出）；
   店商态文案为设计稿原文，电商/服务商为业务向占位（见 main.js ECO_ROLES 注释） */
/* 高度按设计稿 1920:879 比例缩放（此前写死 879px，窗口变窄时横向缩、纵向不缩，
   圆环/球/点全部错位 —— 阿凯反馈「缩放后元素偏离」的根因），≥1920 封顶 879 */
.ab-eco{position:relative;height:min(45.78125vw,879px);background:#fff;overflow:hidden}
.ab-eco__inner{position:absolute;inset:0;max-width:1920px;margin:0 auto}
.ab-eco__orbit{position:absolute;inset:0}
/* 光环 = 18px 渐变描边圆环（SVG 在 HTML 内）：page(334.5,162.5) 533×533 */
.ab-eco__halo{position:absolute;left:17.42%;top:18.49%;width:27.76%;aspect-ratio:1}
/* 轨道 SVG：viewBox 905.55 按 1:1 渲染，page(150.3,-25.5) 905.55×905.55 */
.ab-eco__rings{position:absolute;left:7.83%;top:-2.9%;width:47.16%;aspect-ratio:1}
.ab-eco__core{
  position:absolute;left:25.52%;top:35.72%;width:11.77%;aspect-ratio:1;border-radius:50%;
  background:#0061F3;display:flex;align-items:center;justify-content:center;
  box-shadow:0 18px 50px rgba(0,103,255,.32);
}
/* 中心放官方 logo 的图形标志（设计稿无文字部分）。
   窗口 = viewBox x 7.4~69 / y 0~82：飞鸟图形（x 7.5~68、y 2~80）完整含入；
   右缘 69 —— 上一版取 72 会切进「驰」字马旁起笔尖端（实测起笔 x≈70），
   在鸟右下角留下一个杂点，故收紧到 69（鸟尾 68 之外、驰字 70 之前）。
   ★ 实现为独立裁切版 assets/logo-bird.svg + <img>（窗口直接烘进 viewBox）：
     此前的 mask 方案在非整数缩放下 mask 位图会舍边，窗口越小鸟缘被啃得越明显
     （阿凯反馈「缩放后 LOGO 会被裁切」的根因）；img 矢量渲染任意尺寸零裁切。
   尺寸/位置按设计稿飞鸟实测（高 128、纵向中心偏上 9.6px、横向偏左 1.1px @1920）
   等比放大对齐，偏移用自身百分比换算（-9.6/134.5、-1.1/101）随缩放同步；
   设计稿的鸟是被拉宽的变体（宽高比 0.89 vs 官方 0.78），按红线不拉伸，
   只对齐高度与纵向位置。柔光投影用 CSS drop-shadow（img 的 alpha 即鸟形） */
/* 中心 logo = 阿凯给的设计稿飞鸟 SVG（assets/logo-bird.svg，154×170 画布已含
   自带柔光投影 filter，故不再另加 CSS drop-shadow）；不再对官方 logo 做拆字/裁窗。
   画布内鸟实际占 x20~138 / y19.7~152.4（118.4×132.7），四周是投影留白。
   按设计稿实测鸟 113.5×128、左上角在球心 (-58.3,-73.6) 反推：
   画布宽 = 113.5×154/118.4 = 147.6 → 占中心球 226 的 65.3%；
   偏移用画布自身百分比（-3.7px / -11.05px）随缩放同步 */
.ab-eco__bird{
  position:absolute;left:50%;top:50%;width:68.6%;height:auto;
  transform:translate(calc(-50% - 1.16%), calc(-50% - 7.77%));
}
/* 卫星层：3 个角色球 + 3 个内环小点绕轨道圆心旋转；轨道环/光环静止 = 跑道上的卫星。
   圆心 = 圆环圆心（603,427）：x 31.41% of W、y 48.58% of H（模块等比缩放时恒定）。
   旋转量由 JS 写成 inline transform（不走 CSS 变量，避免老 Safari 不插值），
   文字反向自转抵消，保证球内标签始终正立 */
.ab-eco__spin{
  position:absolute;inset:0;transform-origin:31.41% 48.58%;
  transition:transform 1.05s cubic-bezier(.65,.02,.32,1);
}
.ab-eco__dots{position:absolute;left:7.83%;top:-2.9%;width:47.16%;aspect-ratio:1}
.ab-eco__ball-t{display:block;transition:transform 1.05s cubic-bezier(.65,.02,.32,1)}
.ab-eco__ball{
  position:absolute;left:var(--x);top:var(--y);width:7.29%;aspect-ratio:1;border-radius:50%;
  border:0;cursor:pointer;padding:0;color:#fff;font-family:inherit;
  font-size:clamp(14px,1.5625vw,30px);font-weight:700;letter-spacing:2px;
  display:flex;align-items:center;justify-content:center;
  transition:transform .25s ease,box-shadow .25s ease;
}
.ab-eco__ball--ds{background:#005BED}
.ab-eco__ball--ds2{background:#FF7429}
.ab-eco__ball--fw{background:#36B1F9}
/* 激活态与设计稿一致：尺寸不变（140），仅加投影区分（此前 1.12 放大为自创，已去掉） */
.ab-eco__ball.is-active{box-shadow:0 16px 40px rgba(11,46,92,.28);z-index:2}
.ab-eco__ball:focus-visible{outline:3px solid rgba(0,103,255,.5);outline-offset:4px}
.ab-eco__panel{
  position:absolute;left:55.16%;top:36.29%;width:35.73%;
  transition:opacity .18s ease;   /* 切换角色时轻淡入淡出，同 ab-hist 面板 */
}
.ab-eco__panel.is-fading{opacity:0}
.ab-eco__head{display:flex;align-items:center;gap:min(24px,1.25vw);flex-wrap:wrap}
.ab-eco__title{margin:0;font-family:var(--ff-title);font-size:min(50px,2.6vw);font-weight:700;line-height:1.1;color:#0B0B0B}
.ab-eco__tag{
  background:#0067FF;color:#fff;font-size:min(28px,1.4583vw);font-weight:700;line-height:1;
  padding:.42em .9em;border-radius:999px;white-space:nowrap;
}
.ab-eco__desc{
  margin:min(16px,.83vw) 0 0;color:#666;
  font-size:min(20px,1.0417vw);line-height:1.5;text-align:justify;
}
@media (max-width:1023px){
  .ab-eco{height:auto;padding:72px 0 64px}
  /* 窄屏排布：core（中心球）与 spin（3 个角色球）都是 .ab-eco 的直接子元素（不在 inner 内）。
     .ab-eco 保持 block（改成 flex 会让整块高度塌陷、球被压成 0），
     中心球独占一行居中、三个角色球另起一行横排，再下面才是文案。
     轨道/光环（orbit）在窄屏装不下也用不上，直接隐藏。 */
  /* inner 必须彻底脱离 absolute（基础规则是 position:absolute;inset:0，inset 在 static 下虽不生效，
     但若某条规则没覆盖到 position，它仍会按 inset 拉伸成 .ab-eco 的高度，把内容裁掉） */
  .ab-eco__inner{position:static;inset:auto;display:block;width:100%;max-width:none}
  /* 中心球：宽高都写死，不依赖 aspect-ratio（height:auto + aspect-ratio:1 在 flex 容器里
     会被算成 0，整块高度塌陷）。内部 .ab-eco__bird 是 absolute(68.6%)，
     所以 core 必须保留 position:relative，否则 logo 的包含块会上浮到 orbit 而溢出。
     尺寸保证「中心球 + 3 个角色球 + 3 个间隙」一行放得下：
     390 档 = 76 + 68×3 + 12×3 = 316px（容器内宽 343） */
  .ab-eco__core{
    position:relative;left:auto;top:auto;margin:0 auto;
    width:min(76px,19.5vw);height:min(76px,19.5vw);
  }
  /* ★ orbit 不能整体 display:none —— core（中心球）与 spin（3 个角色球）都嵌套在它里面，
     隐藏 orbit 会把球一起隐藏（实测球 computed 67.86px 但 offsetWidth 0、offsetParent 为 null）。
     只隐藏轨道装饰层（光环 + 内外环），保留球。 */
  .ab-eco__orbit{position:static;width:100%;height:auto}
  .ab-eco__halo,.ab-eco__rings{display:none}
  /* 窄屏：轨道缩到 92vw 后半径只剩 ~48px，物理上装不下「中心球 + 3 个轨道球」，
     强行等比缩放会把球压成 25px（文字挤成竖排）并互相重叠。
     改为关闭轨道旋转、退化成「中心 logo + 三个角色球横排」，交互仍在（点球切文案），
     JS 写的 transform 用 !important 覆盖（窄屏轨道旋转本身也不适用，无 hover 触点）。 */
  /* 轨道层退化为「居中一行」：用 block + text-align 排球，而不是 flex。
     flex 方案在这套结构里（spin 是 .ab-eco 的直接子元素、.ab-eco 是 block）实测会把
     spin 与球的布局盒算成 0（计算值 67.86px 但 offsetWidth 0），block+inline 最稳。 */
  .ab-eco__spin{
    transform:none!important;
    position:static;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;
    gap:min(12px,3vw);width:auto;height:auto;
    margin:min(10px,2.6vw) 0 0;
  }
  .ab-eco__dots{display:none}
  .ab-eco__ball{
    position:static;flex:none;
    width:min(68px,17.4vw);height:min(68px,17.4vw);
    padding:0 4px;
    font-size:clamp(11px,2.8vw,15px);letter-spacing:0;white-space:nowrap;
  }
  .ab-eco__panel{position:static;width:auto;padding:24px 32px 0}
  .ab-eco__title{font-size:34px}
  .ab-eco__tag{font-size:18px}
  .ab-eco__desc{font-size:16px;line-height:1.6;margin-top:14px}
}

/* 04 发展历程（设计稿 70:1713 · 1920×940 · #0A5CFF）
   新版调整：①底部时间轴由竖向改横向 ②左侧新增 620×380 白色图片卡 ③事件由 4 条改 3 条
   横向坐标按 1920 设计稿换算为百分比，写法：left = 12.5%(轴线起点 240) + 节点相对偏移 */
.ab-hist{position:relative;height:940px;background:var(--brand-num);overflow:hidden;color:#fff}
.ab-hist h2{
  position:absolute;top:115px;left:0;right:0;margin:0;text-align:center;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;
  color:#fff;   /* 全局 h2 色是深墨，蓝底区块必须显式盖回白 */
}
.ab-hist__inner{position:absolute;inset:0;max-width:1920px;margin:0 auto}

/* 左侧白色图片卡 620×380 @ (240,301) */
.ab-hist__pic{
  position:absolute;left:12.5%;top:32.02%;width:32.29%;height:40.43%;
  background:#fff;border-radius:var(--radius);overflow:hidden;
}
.ab-hist__pic .ph{width:100%;height:100%}

/* 右侧年份与事件 686 宽 @ (908,326)：top 到时间轴上方弹性锚定，
   事件多时（如 2025 年 9 条）在事件区内部滚动，不溢出盖轴。
   top 与左侧图片同高（阿凯看稿：原来 34.68% + 20px 内边距让年份比图片顶低约 45px，
   上半留白失衡）→ 顶对齐 32.02%，padding-top 归零 */
.ab-hist__panel{
  position:absolute;left:47.29%;top:32.02%;bottom:19.2%;width:35.73%;
  display:flex;flex-direction:column;gap:min(28px,1.4583vw);
  padding:0 min(12px,.625vw) min(10px,.52vw) min(34px,1.7708vw);
  transition:opacity .18s ease;   /* 年份切换时轻淡入淡出 */
}
.ab-hist__panel.is-fading{opacity:0}
/* 字号按 1920 等比缩放（>1920 封顶），避免长文案在窄一些的桌面屏顶出容器被裁 */
.ab-hist__year{margin:0;flex:none;font-family:var(--ff-num);font-size:min(70px,3.6458vw);font-weight:800;line-height:1.05}
.ab-hist__events{
  flex:1 1 auto;min-height:0;overflow-y:auto;
  display:flex;flex-direction:column;gap:min(20px,1.0417vw);
  padding-right:min(10px,.52vw);
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.45) transparent;
}
.ab-hist__events::-webkit-scrollbar{width:5px}
.ab-hist__events::-webkit-scrollbar-thumb{background:rgba(255,255,255,.4);border-radius:3px}
.ab-hist__events::-webkit-scrollbar-track{background:transparent}
.ab-hist__events span{display:flex;font-size:min(26px,1.3542vw);line-height:1.45;white-space:normal}
.ab-hist__events b{flex:none;font-weight:700;margin-right:min(14px,.7292vw)}

/* 底部横向时间轴：1997—至今由 JS 生成节点，点击年份滑动到焦点位
   轨道模型：rail=可视窗口（滚动条隐藏），track=全宽内容（JS 算 px），
   轴线/圆点/年份全部由 JS 定位；设计稿参数保留为基准（轴线 12.5%→80.1%，步距下限 56） */
.ab-hist__rail{
  position:absolute;left:0;right:0;top:82.87%;height:110px;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.ab-hist__rail::-webkit-scrollbar{display:none}
.ab-hist__track{position:relative;height:100%;width:2000px}
.ab-hist__axis{
  position:absolute;left:0;top:24px;width:0;height:2px;background:#72C9FF;
  transform:scaleX(0);transform-origin:left center;
  transition:transform 1.15s cubic-bezier(.22,.61,.36,1);
}
.ab-hist__years{position:absolute;inset:0;list-style:none;margin:0;padding:0}
/* 命中区：li 以年份 x 为中心，左右各 28px，供 hover / 点击切换（left 由 JS 设置）
   top 24px：overflow-x:auto 会强制裁剪纵向溢出，圆点(上探 7px)+脉冲光晕(15px)必须留在轨道内 */
.ab-hist__years li{
  position:absolute;top:24px;left:0;
  width:56px;height:74px;margin-left:-28px;cursor:pointer;
}
.ab-hist__years i{
  position:absolute;left:50%;top:-7px;width:16px;height:16px;margin-left:-8px;
  border-radius:50%;background:#fff;
  opacity:0;transform:scale(.3);
  transition:opacity .38s ease-out,transform .5s cubic-bezier(.34,1.56,.64,1);
  transition-delay:var(--d,0s);
}
.ab-hist__years span{
  position:absolute;left:50%;top:23px;transform:translate(-50%,12px);
  font-family:var(--ff-num);font-size:20px;font-weight:500;line-height:30px;white-space:nowrap;
  color:rgba(255,255,255,.72);   /* 未选中弱化，拉大与选中的视觉差 */
  opacity:0;transition:opacity .38s ease-out,transform .5s cubic-bezier(.22,.61,.36,1),color .25s ease;
  transition-delay:var(--d,0s);
}
/* 选中态（腾讯式）：字号 20→30、颜色提亮、圆点放大 */
.ab-hist__years li.is-current span{font-size:30px;font-weight:600;color:#fff}
.ab-hist__rail .ab-hist__years li.is-current i{transform:scale(1.35)}

/* ---- 入场：滚到视口内由 JS 加 .show（选择器 .js-in），轴线生长 + 圆点依次点亮
        逐个错位出场的延迟由 JS 写入 li 的 --d，入场结束后移除以保证点击即时反馈 ---- */
.ab-hist__rail.show .ab-hist__axis{transform:scaleX(1)}
.ab-hist__rail.show .ab-hist__years i{opacity:1;transform:scale(1)}
.ab-hist__rail.show .ab-hist__years span{opacity:1;transform:translate(-50%,0)}

/* ---- 常态动效：当前项脉冲光晕；hover 放大 ---- */
@keyframes histPulse{
  0%{box-shadow:0 0 0 0 rgba(255,255,255,.45)}
  70%{box-shadow:0 0 0 15px rgba(255,255,255,0)}
  100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}
}
.ab-hist__years li.is-current i{animation:histPulse 2.6s ease-out 1.1s infinite}
.ab-hist__years li:hover i{transform:scale(1.35);transition-delay:0s}
.ab-hist__years li:hover span{color:#fff}
@media (prefers-reduced-motion: reduce){
  .ab-hist__axis{transform:scaleX(1);transition:none}
  .ab-hist__years i,.ab-hist__years span{opacity:1;transform:none;transition:none}
  .ab-hist__years span{transform:translateX(-50%)}
  .ab-hist__years li.is-current i{animation:none}
}

@media (max-width:1023px){
  .ab-hist{height:auto;padding:80px 0 64px}
  .ab-hist h2{position:static;font-size:40px;line-height:52px;padding:0 32px}
  .ab-hist__inner{position:static;margin-top:40px}
  .ab-hist__pic{position:static;width:calc(100% - 64px);margin:0 32px;aspect-ratio:620/380}
  .ab-hist__panel{position:static;width:auto;margin:32px 0 0;padding:0 32px;gap:28px}
  .ab-hist__events{gap:28px;overflow:visible;flex:none}
  .ab-hist__events span{white-space:normal;font-size:20px;line-height:28px}
  /* 时间轴：横向滑动轨道（与桌面同一套 JS 几何），修复年份条逃逸到区块顶部的 bug */
  .ab-hist__rail{position:static;height:110px;margin-top:48px}
}

/* 05 以文化人 以人强企（1878px，三张 1650×480 大卡） */
.ab-culture{position:relative;background:#fff;padding:113px 0 105px;overflow:hidden}
.ab-title{
  margin:0;text-align:center;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;color:var(--ink-88);
}
.ab-cards{width:1650px;max-width:calc(100% - 64px);margin:78px auto 0}
.ab-card{
  position:relative;height:480px;border-radius:var(--radius);overflow:hidden;
  background:#0B2E5C;margin-bottom:35px;
}
.ab-card:last-child{margin-bottom:0}
.ab-card .ph{position:absolute;inset:0}
.ab-card__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,35,75,.08) 30%,rgba(3,35,75,.55))}
.ab-card__tag{
  position:absolute;left:75px;top:310px;z-index:2;
  display:flex;align-items:center;gap:12px;
  color:#fff;font-family:var(--ff-title);font-size:30px;line-height:36px;
}
.ab-card__tag::before{content:'';width:14px;height:14px;background:var(--brand);flex:none}
.ab-card__slogan{
  position:absolute;left:60px;top:382px;z-index:2;
  color:#fff;font-size:56px;font-weight:700;line-height:68px;letter-spacing:2px;
}
/* 卡片视差：卡当窗口，背景层上下各高出 14%，滚动时缓慢滑动（腾讯式） */
/* 卡片视差（通用：[data-plx] > [data-plx-bg]，卡当窗口、背景上下各出血 14% 缓慢滑动） */
.plx-bg{position:absolute;left:0;right:0;top:-14%;bottom:-14%;will-change:transform}
@media (max-width:1279px){
  .ab-culture{padding:88px 0 72px}
  .ab-title{font-size:40px;line-height:52px}
  .ab-cards{margin-top:48px}
  .ab-card{height:auto;aspect-ratio:1650/480}
  .ab-card__tag{left:36px;top:auto;bottom:118px;font-size:20px}
  .ab-card__slogan{left:32px;top:auto;bottom:36px;font-size:30px;line-height:40px}
}

/* 06 企业精神 / 干部誓词 / 行为准则（932px，#03234B + 三张 #0A5CFF 卡） */
/* 06 企业精神 / 干部誓词 / 行为准则（设计稿 54:5840 · 1920×932 · #03234B）
   三张 480×612 卡，默认图标+标题，hover / 点击（.is-open）展开文案层
   桌面尺寸按 1920 等比（min(px,vw)），>1920 封顶 */
.ab-spirit{position:relative;background:var(--brand-deep);padding:160px 32px;overflow:hidden}
/* 背景层视差：上下各出血 90px，滚动时缓慢滑动（JS 写 transform） */
.ab-spirit__bg{position:absolute;left:0;right:0;top:-90px;bottom:-90px;z-index:0;opacity:.4;will-change:transform}
.ab-spirit__bg .ph{width:100%;height:100%}
.ab-spirit__row{position:relative;z-index:1;display:flex;gap:min(38px,1.98vw);justify-content:center}
.ab-sp{
  position:relative;width:min(480px,25vw);height:min(612px,31.875vw);
  background:var(--brand-num);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;
}
.ab-sp::before{content:'';position:absolute;left:-70px;bottom:-130px;width:420px;height:420px;border-radius:50%;background:rgba(255,255,255,.05)}
.ab-sp::after{content:'';position:absolute;right:-50px;top:-90px;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.08)}
/* 视差：卡体错位由 JS 写 transform；卡内装饰圆按 --sp 反向漂移，制造层间速度差。
   幅度取大（外卡 ±80px / 圆 ±56·38px）：居中时归零对齐设计稿，滚动过程一眼可见 */
.ab-sp{will-change:transform}
.ab-sp::before{transform:translate3d(0,calc(var(--sp,0)*-56px),0)}
.ab-sp::after{transform:translate3d(0,calc(var(--sp,0)*38px),0)}
.ab-sp__face{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;transition:opacity .35s,transform .4s}
.ab-sp__icon{position:relative;z-index:1;margin-top:min(112px,5.83vw);width:min(380px,19.79vw);aspect-ratio:530/410;border-radius:min(12px,.625vw);overflow:hidden}
.ab-sp__icon img{width:100%;height:100%;object-fit:cover;display:block}
.ab-sp__title{position:relative;z-index:1;margin-top:min(48px,2.5vw);font-family:var(--ff-num);font-size:min(40px,2.08vw);font-weight:700;line-height:1.1;color:#fff;letter-spacing:4px}

/* 文案层（展开态） */
.ab-sp__body{
  position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;
  padding-top:min(56px,2.9vw);opacity:0;transform:translateY(16px);
  transition:opacity .4s ease-out,transform .45s cubic-bezier(.22,.61,.36,1);
  pointer-events:none;
}
.ab-sp__name{font-size:min(34px,1.77vw);font-weight:600;line-height:36px;color:#fff;margin-bottom:min(28px,1.46vw)}
.ab-sp__text{font-size:min(20px,1.042vw);line-height:min(36px,1.875vw);color:#fff;text-align:center}
.ab-sp__text b{font-weight:700}
/* hover（指针设备）与点击锁定（.is-open）都展开 */
@media (hover:hover){
  .ab-sp:hover .ab-sp__face{opacity:0;transform:translateY(-12px)}
  .ab-sp:hover .ab-sp__body{opacity:1;transform:none;pointer-events:auto}
}
.ab-sp.is-open .ab-sp__face{opacity:0;transform:translateY(-12px)}
.ab-sp.is-open .ab-sp__body{opacity:1;transform:none;pointer-events:auto}
@media (prefers-reduced-motion: reduce){
  .ab-sp__face,.ab-sp__body{transition:none;transform:none}
  .ab-sp,.ab-sp::before,.ab-sp::after,.ab-spirit__bg{transform:none!important}
}

@media (max-width:1279px){
  .ab-spirit{padding:88px 32px}
  .ab-spirit__row{flex-direction:column;align-items:center;gap:24px}
  /* 移动端列布局：关闭三卡错位与卡内圆漂移，只留背景缓移 */
  .ab-sp{transform:none!important}
  .ab-sp::before,.ab-sp::after{transform:none}
  .ab-sp{width:min(480px,100%);height:auto;padding:64px 24px 72px}
  .ab-sp__icon{margin-top:0;width:320px;max-width:100%}
  .ab-sp__face{position:static;inset:auto}
  .ab-sp__title{margin-top:40px;font-size:32px}
  /* 移动端无 hover：点击切换显示，直接替换内容 */
  .ab-sp__body{position:static;display:none;opacity:1;transform:none;pointer-events:auto;padding:0}
  .ab-sp.is-open .ab-sp__body{display:flex}
  .ab-sp.is-open .ab-sp__face{display:none}
  .ab-sp__name{font-size:24px;margin-bottom:16px}
  .ab-sp__text{font-size:16px;line-height:28px}
}

/* 手机端（≤639）重新布局：平板竖版在 390 宽下每张卡 320px 图标 + 64/72 padding，
   高约 400px、三卡堆叠 1200px+，又长又空。
   改为横向紧凑卡：左侧 88px 图标 + 右侧标题，单行约 116px；点开展开文案（原有点击切换逻辑不变）。
   移动端没有 hover 场景，只有点击 —— 交互已由 .is-open 承担，这里只处理排版。 */
@media (max-width:639px){
  .ab-spirit{padding:min(44px,11.3vw) min(16px,4.1vw) min(52px,13.3vw)}
  .ab-spirit__row{gap:min(12px,3.1vw)}
  .ab-sp{
    width:100%;padding:min(14px,3.6vw);border-radius:14px;
    display:flex;flex-direction:row;align-items:center;
    gap:min(14px,3.6vw);text-align:left;
  }
  .ab-sp__face{
    position:static;inset:auto;flex:1 1 auto;min-width:0;
    flex-direction:row;align-items:center;gap:min(14px,3.6vw);
  }
  .ab-sp__icon{
    margin:0;flex:none;width:min(88px,22.5vw);aspect-ratio:530/410;border-radius:8px;
  }
  .ab-sp__title{
    margin:0;flex:1 1 auto;font-size:min(21px,5.4vw);letter-spacing:1px;line-height:1.25;
  }
  /* 展开：卡片转纵向，face 一行 + 文案一行 */
  .ab-sp.is-open{flex-direction:column;align-items:stretch;gap:min(10px,2.6vw)}
  .ab-sp.is-open .ab-sp__body{display:flex;padding:0 min(2px,.5vw) min(2px,.5vw)}
  .ab-sp__name{font-size:20px;line-height:28px;margin-bottom:10px}
  .ab-sp__text{font-size:15px;line-height:26px;text-align:left}
}

/* 07 阳光驰骋（设计稿 14:02355：1650×620 图卡与下方举报信息） */
.ab-sun{position:relative;background:#fff;padding:105px 0 137px;text-align:center}
.ab-sun__media{
  position:relative;width:1650px;max-width:calc(100% - 64px);aspect-ratio:1650/620;height:auto;
  margin:50px auto 0;border-radius:30px;overflow:hidden;background:#F4F4F4;
}
.ab-sun__media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.ab-sun__text{margin:30px auto 0;max-width:1408px;padding:0 32px}
.ab-sun__statement{font-size:24px;line-height:40px;font-weight:500;color:#595959;margin:0}
.ab-sun__contact{margin-top:8px;font-size:24px;line-height:40px;font-weight:500;color:#000}
.ab-sun__contact p{margin:0}
.ab-sun__contact a{color:inherit;font-weight:700;text-decoration:none}
.ab-sun__contact a:hover{text-decoration:underline}
.ab-sun__qr{display:block;width:226px;height:226px;object-fit:contain;margin:14px auto 0}
@media (max-width:1279px){
  .ab-sun{padding:88px 0 64px}
  .ab-title{font-size:40px;line-height:52px}
  .ab-sun__media{height:auto;aspect-ratio:1650/620;margin-top:36px}
  .ab-sun__text{margin-top:32px}
  .ab-sun__statement,.ab-sun__contact{font-size:18px;line-height:32px}
  .ab-sun__qr{width:180px;height:180px}
}

/* ---------------- 减弱动效偏好 ---------------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .fade-up,.fade-left,.fade-right{opacity:1;visibility:visible;transform:none}
}

/* ================= 业务体系页（设计稿 70:0475 · 1920×3998） ================= */
.bz-hero{position:relative;height:820px;background:#E7EDF7;overflow:hidden}
.bz-hero .ph{width:100%;height:100%}
/* banner 实图：cover 铺满（素材比例略窄于 1920:820，居中裁切约 2%，肉眼无感） */
.bz-hero__img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}

.bz-title{
  margin:0;padding-top:88px;text-align:center;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;color:var(--ink-88);
}
.bz-title--light{color:#fff}

/* 02 集团发展 */
.bz-brands{position:relative;background:#fff;padding-bottom:70px}
/* （重复的 .bz-tabs/.bz-tab 定义已合并到上文唯一一处） */
/* 集团发展：每屏 1920×1028 整屏（设计稿 65:29632 / 65:31041 / 65:31136）
   品牌色整屏底 + 26% 黑蒙版（--scrim，萝卜白菜为 0）+ 右侧大图出血 1184×1028 at (736,0)
   + 左上 logo（86,~70）+ 左下三行文案（36px/60 w600 at 86,641）+ 左下白色描边轮播箭头（y866）
   坐标按 1920 基准换算 vw；文案字体沿用全站默认字体（不用 --ff-title 主字体）。 */
/* 轮播 + 滚动视差：区块高 = 100vh + (屏数-1)×100vh（JS 设置），stage 整屏钉住，
   三屏 absolute 叠放在 stage 内，靠 .is-on 切换；滚动推进即换屏（--k 贴合度 / --y 文案位移）。
   ⚠ .bz-brands 不能加 overflow:hidden —— 祖先是滚动容器会让 sticky 失效。 */
/* 底色 = 当前屏品牌色（JS 写 --sec-bg）：sticky 到最后一屏会被顶上去几十像素
   （100vh 与实际可用高度有偏差），露出的那条若写死深色就成了"黑框"，
   跟着当前屏色就看不出来了。交接时透出的也是当前屏色，语义一致。 */



/* 产品和服务：业务提供的 1920×729 浅蓝白底图置于跑马灯下方。 */
.mq__backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:0}

/* ---------------- 首页 04 品牌矩阵轮播（设计稿 65:7447 · 727px） ---------------- */
.mq{position:relative;overflow:hidden;background:#fff;height:727px}
.mq__bg{position:absolute;inset:0;z-index:0;opacity:.5}
.mq__bg .ph{width:100%;height:100%}
.mq__title{
  position:absolute;top:105px;left:0;right:0;z-index:3;
  text-align:center;font-family:var(--ff-title);
  font-size:60px;font-weight:700;line-height:72px;color:#000;letter-spacing:2px;
}
.mq__runs{
  position:absolute;left:0;right:0;top:263px;z-index:1;
  display:flex;flex-direction:column;gap:38px;
}
.mq__track{
  display:flex;flex-wrap:nowrap;gap:0;
  width:max-content;will-change:transform;
  margin-left:-183px;                 /* 设计稿行1 首卡起点 */
  animation:mqL 46s linear infinite;
}
/* 行2：向右循环 + 与设计稿一致的错行偏移（-183 + 185 = 2） */
.mq__track--rev{animation:mqR 54s linear infinite;margin-left:2px}
@keyframes mqL{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes mqR{from{transform:translateX(-50%)}to{transform:translateX(0)}}
.mq__card{
  width:340px;height:130px;flex:none;
  /* 用 margin-right 代替 flex gap：两份内容的 -50% 位移才能严丝合缝，否则每轮会跳 10px */
  margin-right:20px;
  background:#fff;border:1px solid var(--line-soft);border-radius:var(--radius-md);
  display:flex;align-items:center;justify-content:center;
  font-size:44px;font-weight:700;letter-spacing:3px;
}
.mq__card img{display:block;width:85%;height:auto}
@media (prefers-reduced-motion: reduce){.mq__track{animation:none}}

/* 品牌墙的移动端降级：原本完全沿用桌面值（区块固定 727px、标题 60px、卡片 340×130），
   在 390 视口下只能看到 1.1 张卡、上下大片留白，观感很空。
   改为：区块高度随内容、标题缩到 30px、卡片 158×62（可看到 2.4 张，暗示连续滚动）。 */
@media (max-width:639px){
  .mq{position:relative;height:auto;padding:min(46px,11.8vw) 0 min(54px,13.8vw)}
  .mq__title{
    position:static;text-align:center;
    font-size:min(30px,7.7vw);line-height:1.3;letter-spacing:1px;
    margin:0 0 min(30px,7.7vw);
  }
  .mq__runs{position:static;display:flex;flex-direction:column;gap:min(12px,3.1vw)}
  .mq__card{
    width:min(158px,40.5vw);height:min(62px,15.9vw);
    margin-right:min(10px,2.6vw);
    border-radius:8px;
  }
  .mq__card img{width:82%}
  /* 行首偏移随卡片宽同步缩小，保证两份内容 -50% 位移仍能严丝合缝 */
  .mq__track{margin-left:min(-79px,-20.3vw)}
  .mq__track--rev{margin-left:min(1px,0.3vw)}
}
/* 平板档（640~1023）：桌面版在此宽度仍显空（727px 固定高、340px 卡只露 2.3 张），
   取桌面与手机之间的中间值 */
@media (min-width:640px) and (max-width:1023px){
  .mq{height:auto;padding:min(58px,6vw) 0 min(68px,7.1vw)}
  .mq__title{
    position:static;text-align:center;
    font-size:min(40px,5.2vw);line-height:1.3;letter-spacing:1px;
    margin:0 0 min(34px,4.4vw);
  }
  .mq__runs{position:static;gap:min(18px,2.4vw)}
  .mq__card{width:min(240px,31vw);height:min(92px,12vw);margin-right:min(14px,1.8vw)}
  .mq__card img{width:84%}
  .mq__track{margin-left:min(-120px,-15.6vw)}
  .mq__track--rev{margin-left:min(2px,0.26vw)}
}
.mq__fade{
  position:absolute;inset:0;z-index:2;pointer-events:none;
  /* 设计稿原值纵向半径 11.42% 只够露一行，调大到 44% 让两行都可见、标题与上下边缘不受影响 */
  background:radial-gradient(50% 44% at 50% 50%, rgba(255,255,255,0) 69.57%, #FFFFFF 100%);
}

/* ---------------- 页尾（白底 · 结构对齐阿里 ali-home，2026-09-30 实测其线上几何后重做：
   首行 logo+关注我们 通栏带 1px 分隔线 / 中部站点地图横向摊开(组标题可点) / 品牌墙竖线密排 / 底部居中版权两行。
   容器与页头同宽 1440，留白收窄（阿里 .foot-wrap 1440 + padding-bottom 10px 的紧致感） ---------------- */
/*   横向走全站 --gutter（1920→88 / 1279→64 / 767→24，与 .wrap 同参数），竖向走 --sp 节奏 */
.ft2{position:relative;background:#fff;color:rgba(10,30,60,.85);overflow:visible}
.ft2__inner{width:100%;padding:var(--sp-lg) var(--gutter) var(--sp-md)}

/* 首行：logo（深底反白，mask+currentColor）+ 关注我们 */
.ft2__follow{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-xs);padding-bottom:var(--sp-sm);border-bottom:1px solid rgba(10,30,60,.12)}
.ft2__brand{display:flex;flex-direction:column;align-items:flex-start;gap:10px;color:#0A1E3C}
.ft2__brand .brand__logo{width:clamp(116px,7.4vw,144px);height:auto;flex:none}
.ft2__code{font-size:15px;font-weight:400;letter-spacing:.6px;color:rgba(10,30,60,.72);white-space:nowrap}
.ft2__sns{display:flex;align-items:center;gap:22px}
.ft2__sns-label{font-size:16px;font-weight:600;letter-spacing:.5px;color:#0A1E3C}
.ft2__qr{display:flex;flex-direction:column;align-items:center;gap:6px}
.ft2__qr-box{width:56px;height:56px;border-radius:8px;border:1px solid rgba(10,30,60,.18);background:#fff;position:relative}
.ft2__qr-box img{display:block;width:100%;height:100%;object-fit:cover;border-radius:7px}
.ft2__qr-box{cursor:pointer}
.ft2__qr-box::before,.ft2__qr-box::after{position:absolute;left:50%;opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease;z-index:30;pointer-events:none}
.ft2__qr-box::after{
  content:"";bottom:calc(100% + 14px);width:168px;height:168px;transform:translateX(-50%) scale(.92);
  background:#fff url("img/qr-official.png") center/93% 93% no-repeat;border-radius:14px;
  box-shadow:0 10px 34px rgba(0,0,0,.32);
}
.ft2__qr-box::before{
  content:"";bottom:calc(100% + 6px);width:0;height:0;transform:translateX(-50%);
  border-left:8px solid transparent;border-right:8px solid transparent;border-top:9px solid #fff;
}
.ft2__qr-box:hover::after,.ft2__qr-box:hover::before{opacity:1;visibility:visible}
.ft2__qr-box:hover::after{transform:translateX(-50%) scale(1)}
.ft2__qr-box .ph{width:100%;height:100%}
.ft2__qr-box .ph::before{opacity:1}
.ft2__qr-name{font-size:12px;line-height:16px;color:rgba(10,30,60,.55)}

/* 中部：站点地图（白组标题 + 浅灰链接，hover 提亮） */
.ft2__cols{display:flex;justify-content:space-between;gap:var(--sp-xs);flex-wrap:wrap;padding:var(--sp-md) 0 var(--sp-xs)}
.ft2__col{min-width:96px}
.ft2__hd{display:block;margin:0 0 14px;font-size:17px;font-weight:600;line-height:24px;letter-spacing:.6px;color:#0A1E3C;text-decoration:none;transition:color .2s}
a.ft2__hd:hover{color:var(--brand)}
.ft2__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ft2__list a{font-size:15px;font-weight:300;line-height:22px;letter-spacing:.4px;color:rgba(10,30,60,.65);text-decoration:none;transition:color .2s}
.ft2__list a:hover{color:#0A1E3C}

/* 底部：左右分布——左举报渠道、右版权 */
.ft2__bar{margin-top:var(--sp-sm);padding-top:var(--sp-sm);border-top:1px solid rgba(10,30,60,.12);display:flex;justify-content:space-between;align-items:center;gap:12px 24px;flex-wrap:wrap}
.ft2__bar p{margin:0;font-family:var(--ff-tight);font-size:13px;font-weight:300;line-height:22px;letter-spacing:.4px;color:rgba(10,30,60,.5)}
.ft2__bar p:first-child{order:2}
.ft2__bar .ft2__beian{flex-basis:100%;display:flex;align-items:center;font-size:12px;line-height:20px}
.ft2__bar .ft2__beian img{height:14px;width:auto}
.ft2__bar a{color:rgba(10,30,60,.5);text-decoration:none;transition:color .2s}
.ft2__bar a:hover{color:#0A1E3C}
.ft2__gap{display:inline-block;width:14px}

@media (max-width:1279px){
  .ft2__cols{justify-content:flex-start;gap:36px 64px}
}
@media (max-width:767px){
  .ft2__inner{padding-top:var(--sp-md);padding-bottom:var(--sp-xs)}
  .ft2__follow{flex-direction:column;align-items:flex-start;gap:22px}
  .ft2__cols{flex-direction:column;gap:28px;padding-top:var(--sp-sm)}
  .ft2__bar{flex-direction:column;align-items:flex-start;gap:8px;margin-top:var(--sp-xs)}
  .ft2__bar p:first-child{order:0}
}

/* ---------------- 走进驰骋页（设计稿 65:00200 · 1920×7944） ---------------- */
/* 01 Hero（820px，图 + 底部「了解更多」） */
/* 原本 margin-top:var(--header-h) 把 hero 推到页头下方，页头压的是白底空白，
   黑纱压白底变成灰条 —— 阿凯反馈「走进驰骋头部没穿透」即此因。
   改为 hero 顶到 0（页头叠在图上），高度补回 header-h 保证总占位 884 不变 */
.ab-hero{position:relative;height:calc(820px + var(--header-h));margin-top:0;overflow:hidden}
.ab-hero .ab-hero__bg{position:absolute;inset:0}
.ab-hero__bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
/* 阿凯指定：50% 遮罩（品牌深蓝，均匀覆盖） */
.ab-hero__scrim{position:absolute;inset:0;z-index:1;background:rgba(3,35,75,.5)}
.ab-hero__more{
  position:absolute;left:50%;bottom:47px;transform:translateX(-50%);z-index:2;
  display:flex;flex-direction:column;align-items:center;
  color:#fff;font-size:20px;line-height:40px;letter-spacing:1px;
}
.ab-hero__more svg{display:block;margin-top:0}
@media (max-width:639px){.ab-hero{height:min(820px,88vw)}.ab-hero__more{bottom:28px;font-size:16px;line-height:30px}}

/* 02 关于驰骋（570px，居中标题 + 5 行正文） */
.ab-intro{position:relative;height:570px;overflow:hidden;text-align:center;background:#fff}
.ab-intro__deco{position:absolute;left:50%;top:88px;transform:translateX(-50%);z-index:0;color:#E5F5FF}
.ab-intro h2{
  position:relative;z-index:1;margin:0;padding-top:130px;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;color:var(--ink-88);
}
.ab-intro__body{
  position:relative;z-index:1;max-width:1342px;margin:68px auto 0;padding:0 32px;
  font-size:18px;line-height:36px;color:#000;
}
@media (max-width:1279px){
  .ab-intro{height:auto;padding-bottom:72px}
  .ab-intro h2{padding-top:88px;font-size:40px;line-height:52px}
  .ab-intro__body{margin-top:40px;font-size:16px;line-height:30px}
}

/* 03 零售生态（设计稿为整张烘焙图 1920×879） */
/* 03b 零售生态（设计稿 62:6767 · 1920×879 白底）：左侧轨道图 + 右侧角色文案，点球切换。
   几何按 1920×879 换算为百分比；orbit 保持 1920:879 比例，内部全部相对 orbit 等比缩放。
   弧线装饰按设计稿截图目测重绘（原始 SVG 资产短期链接未落盘，出入可后续替换官方导出）；
   店商态文案为设计稿原文，电商/服务商为业务向占位（见 main.js ECO_ROLES 注释） */
/* 高度按设计稿 1920:879 比例缩放（此前写死 879px，窗口变窄时横向缩、纵向不缩，
   圆环/球/点全部错位 —— 阿凯反馈「缩放后元素偏离」的根因），≥1920 封顶 879 */
.ab-eco{position:relative;height:min(45.78125vw,879px);background:#fff;overflow:hidden}
.ab-eco__inner{position:absolute;inset:0;max-width:1920px;margin:0 auto}
.ab-eco__orbit{position:absolute;inset:0}
/* 光环 = 18px 渐变描边圆环（SVG 在 HTML 内）：page(334.5,162.5) 533×533 */
.ab-eco__halo{position:absolute;left:17.42%;top:18.49%;width:27.76%;aspect-ratio:1}
/* 轨道 SVG：viewBox 905.55 按 1:1 渲染，page(150.3,-25.5) 905.55×905.55 */
.ab-eco__rings{position:absolute;left:7.83%;top:-2.9%;width:47.16%;aspect-ratio:1}
.ab-eco__core{
  position:absolute;left:25.52%;top:35.72%;width:11.77%;aspect-ratio:1;border-radius:50%;
  background:#0061F3;display:flex;align-items:center;justify-content:center;
  box-shadow:0 18px 50px rgba(0,103,255,.32);
}
/* 中心放官方 logo 的图形标志（设计稿无文字部分）。
   窗口 = viewBox x 7.4~69 / y 0~82：飞鸟图形（x 7.5~68、y 2~80）完整含入；
   右缘 69 —— 上一版取 72 会切进「驰」字马旁起笔尖端（实测起笔 x≈70），
   在鸟右下角留下一个杂点，故收紧到 69（鸟尾 68 之外、驰字 70 之前）。
   ★ 实现为独立裁切版 assets/logo-bird.svg + <img>（窗口直接烘进 viewBox）：
     此前的 mask 方案在非整数缩放下 mask 位图会舍边，窗口越小鸟缘被啃得越明显
     （阿凯反馈「缩放后 LOGO 会被裁切」的根因）；img 矢量渲染任意尺寸零裁切。
   尺寸/位置按设计稿飞鸟实测（高 128、纵向中心偏上 9.6px、横向偏左 1.1px @1920）
   等比放大对齐，偏移用自身百分比换算（-9.6/134.5、-1.1/101）随缩放同步；
   设计稿的鸟是被拉宽的变体（宽高比 0.89 vs 官方 0.78），按红线不拉伸，
   只对齐高度与纵向位置。柔光投影用 CSS drop-shadow（img 的 alpha 即鸟形） */
/* 中心 logo = 阿凯给的设计稿飞鸟 SVG（assets/logo-bird.svg，154×170 画布已含
   自带柔光投影 filter，故不再另加 CSS drop-shadow）；不再对官方 logo 做拆字/裁窗。
   画布内鸟实际占 x20~138 / y19.7~152.4（118.4×132.7），四周是投影留白。
   按设计稿实测鸟 113.5×128、左上角在球心 (-58.3,-73.6) 反推：
   画布宽 = 113.5×154/118.4 = 147.6 → 占中心球 226 的 65.3%；
   偏移用画布自身百分比（-3.7px / -11.05px）随缩放同步 */
.ab-eco__bird{
  position:absolute;left:50%;top:50%;width:68.6%;height:auto;
  transform:translate(calc(-50% - 1.16%), calc(-50% - 7.77%));
}
/* 卫星层：3 个角色球 + 3 个内环小点绕轨道圆心旋转；轨道环/光环静止 = 跑道上的卫星。
   圆心 = 圆环圆心（603,427）：x 31.41% of W、y 48.58% of H（模块等比缩放时恒定）。
   旋转量由 JS 写成 inline transform（不走 CSS 变量，避免老 Safari 不插值），
   文字反向自转抵消，保证球内标签始终正立 */
.ab-eco__spin{
  position:absolute;inset:0;transform-origin:31.41% 48.58%;
  transition:transform 1.05s cubic-bezier(.65,.02,.32,1);
}
.ab-eco__dots{position:absolute;left:7.83%;top:-2.9%;width:47.16%;aspect-ratio:1}
.ab-eco__ball-t{display:block;transition:transform 1.05s cubic-bezier(.65,.02,.32,1)}
.ab-eco__ball{
  position:absolute;left:var(--x);top:var(--y);width:7.29%;aspect-ratio:1;border-radius:50%;
  border:0;cursor:pointer;padding:0;color:#fff;font-family:inherit;
  font-size:clamp(14px,1.5625vw,30px);font-weight:700;letter-spacing:2px;
  display:flex;align-items:center;justify-content:center;
  transition:transform .25s ease,box-shadow .25s ease;
}
.ab-eco__ball--ds{background:#005BED}
.ab-eco__ball--ds2{background:#FF7429}
.ab-eco__ball--fw{background:#36B1F9}
/* 激活态与设计稿一致：尺寸不变（140），仅加投影区分（此前 1.12 放大为自创，已去掉） */
.ab-eco__ball.is-active{box-shadow:0 16px 40px rgba(11,46,92,.28);z-index:2}
.ab-eco__ball:focus-visible{outline:3px solid rgba(0,103,255,.5);outline-offset:4px}
.ab-eco__panel{
  position:absolute;left:55.16%;top:36.29%;width:35.73%;
  transition:opacity .18s ease;   /* 切换角色时轻淡入淡出，同 ab-hist 面板 */
}
.ab-eco__panel.is-fading{opacity:0}
.ab-eco__head{display:flex;align-items:center;gap:min(24px,1.25vw);flex-wrap:wrap}
.ab-eco__title{margin:0;font-family:var(--ff-title);font-size:min(50px,2.6vw);font-weight:700;line-height:1.1;color:#0B0B0B}
.ab-eco__tag{
  background:#0067FF;color:#fff;font-size:min(28px,1.4583vw);font-weight:700;line-height:1;
  padding:.42em .9em;border-radius:999px;white-space:nowrap;
}
.ab-eco__desc{
  margin:min(16px,.83vw) 0 0;color:#666;
  font-size:min(20px,1.0417vw);line-height:1.5;text-align:justify;
}
@media (max-width:1023px){
  .ab-eco{height:auto;padding:72px 0 64px}
  /* 窄屏排布：core（中心球）与 spin（3 个角色球）都是 .ab-eco 的直接子元素（不在 inner 内）。
     .ab-eco 保持 block（改成 flex 会让整块高度塌陷、球被压成 0），
     中心球独占一行居中、三个角色球另起一行横排，再下面才是文案。
     轨道/光环（orbit）在窄屏装不下也用不上，直接隐藏。 */
  /* inner 必须彻底脱离 absolute（基础规则是 position:absolute;inset:0，inset 在 static 下虽不生效，
     但若某条规则没覆盖到 position，它仍会按 inset 拉伸成 .ab-eco 的高度，把内容裁掉） */
  .ab-eco__inner{position:static;inset:auto;display:block;width:100%;max-width:none}
  /* 中心球：宽高都写死，不依赖 aspect-ratio（height:auto + aspect-ratio:1 在 flex 容器里
     会被算成 0，整块高度塌陷）。内部 .ab-eco__bird 是 absolute(68.6%)，
     所以 core 必须保留 position:relative，否则 logo 的包含块会上浮到 orbit 而溢出。
     尺寸保证「中心球 + 3 个角色球 + 3 个间隙」一行放得下：
     390 档 = 76 + 68×3 + 12×3 = 316px（容器内宽 343） */
  .ab-eco__core{
    position:relative;left:auto;top:auto;margin:0 auto;
    width:min(76px,19.5vw);height:min(76px,19.5vw);
  }
  /* ★ orbit 不能整体 display:none —— core（中心球）与 spin（3 个角色球）都嵌套在它里面，
     隐藏 orbit 会把球一起隐藏（实测球 computed 67.86px 但 offsetWidth 0、offsetParent 为 null）。
     只隐藏轨道装饰层（光环 + 内外环），保留球。 */
  .ab-eco__orbit{position:static;width:100%;height:auto}
  .ab-eco__halo,.ab-eco__rings{display:none}
  /* 窄屏：轨道缩到 92vw 后半径只剩 ~48px，物理上装不下「中心球 + 3 个轨道球」，
     强行等比缩放会把球压成 25px（文字挤成竖排）并互相重叠。
     改为关闭轨道旋转、退化成「中心 logo + 三个角色球横排」，交互仍在（点球切文案），
     JS 写的 transform 用 !important 覆盖（窄屏轨道旋转本身也不适用，无 hover 触点）。 */
  /* 轨道层退化为「居中一行」：用 block + text-align 排球，而不是 flex。
     flex 方案在这套结构里（spin 是 .ab-eco 的直接子元素、.ab-eco 是 block）实测会把
     spin 与球的布局盒算成 0（计算值 67.86px 但 offsetWidth 0），block+inline 最稳。 */
  .ab-eco__spin{
    transform:none!important;
    position:static;display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;
    gap:min(12px,3vw);width:auto;height:auto;
    margin:min(10px,2.6vw) 0 0;
  }
  .ab-eco__dots{display:none}
  .ab-eco__ball{
    position:static;flex:none;
    width:min(68px,17.4vw);height:min(68px,17.4vw);
    padding:0 4px;
    font-size:clamp(11px,2.8vw,15px);letter-spacing:0;white-space:nowrap;
  }
  .ab-eco__panel{position:static;width:auto;padding:24px 32px 0}
  .ab-eco__title{font-size:34px}
  .ab-eco__tag{font-size:18px}
  .ab-eco__desc{font-size:16px;line-height:1.6;margin-top:14px}
}

/* 04 发展历程（设计稿 70:1713 · 1920×940 · #0A5CFF）
   新版调整：①底部时间轴由竖向改横向 ②左侧新增 620×380 白色图片卡 ③事件由 4 条改 3 条
   横向坐标按 1920 设计稿换算为百分比，写法：left = 12.5%(轴线起点 240) + 节点相对偏移 */
.ab-hist{position:relative;height:940px;background:var(--brand-num);overflow:hidden;color:#fff}
.ab-hist h2{
  position:absolute;top:115px;left:0;right:0;margin:0;text-align:center;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;
  color:#fff;   /* 全局 h2 色是深墨，蓝底区块必须显式盖回白 */
}
.ab-hist__inner{position:absolute;inset:0;max-width:1920px;margin:0 auto}

/* 左侧白色图片卡 620×380 @ (240,301) */
.ab-hist__pic{
  position:absolute;left:12.5%;top:32.02%;width:32.29%;height:40.43%;
  background:#fff;border-radius:var(--radius);overflow:hidden;
}
.ab-hist__pic .ph{width:100%;height:100%}

/* 右侧年份与事件 686 宽 @ (908,326)：top 到时间轴上方弹性锚定，
   事件多时（如 2025 年 9 条）在事件区内部滚动，不溢出盖轴。
   top 与左侧图片同高（阿凯看稿：原来 34.68% + 20px 内边距让年份比图片顶低约 45px，
   上半留白失衡）→ 顶对齐 32.02%，padding-top 归零 */
.ab-hist__panel{
  position:absolute;left:47.29%;top:32.02%;bottom:19.2%;width:35.73%;
  display:flex;flex-direction:column;gap:min(28px,1.4583vw);
  padding:0 min(12px,.625vw) min(10px,.52vw) min(34px,1.7708vw);
  transition:opacity .18s ease;   /* 年份切换时轻淡入淡出 */
}
.ab-hist__panel.is-fading{opacity:0}
/* 字号按 1920 等比缩放（>1920 封顶），避免长文案在窄一些的桌面屏顶出容器被裁 */
.ab-hist__year{margin:0;flex:none;font-family:var(--ff-num);font-size:min(70px,3.6458vw);font-weight:800;line-height:1.05}
.ab-hist__events{
  flex:1 1 auto;min-height:0;overflow-y:auto;
  display:flex;flex-direction:column;gap:min(20px,1.0417vw);
  padding-right:min(10px,.52vw);
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.45) transparent;
}
.ab-hist__events::-webkit-scrollbar{width:5px}
.ab-hist__events::-webkit-scrollbar-thumb{background:rgba(255,255,255,.4);border-radius:3px}
.ab-hist__events::-webkit-scrollbar-track{background:transparent}
.ab-hist__events span{display:flex;font-size:min(26px,1.3542vw);line-height:1.45;white-space:normal}
.ab-hist__events b{flex:none;font-weight:700;margin-right:min(14px,.7292vw)}

/* 底部横向时间轴：1997—至今由 JS 生成节点，点击年份滑动到焦点位
   轨道模型：rail=可视窗口（滚动条隐藏），track=全宽内容（JS 算 px），
   轴线/圆点/年份全部由 JS 定位；设计稿参数保留为基准（轴线 12.5%→80.1%，步距下限 56） */
.ab-hist__rail{
  position:absolute;left:0;right:0;top:82.87%;height:110px;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.ab-hist__rail::-webkit-scrollbar{display:none}
.ab-hist__track{position:relative;height:100%;width:2000px}
.ab-hist__axis{
  position:absolute;left:0;top:24px;width:0;height:2px;background:#72C9FF;
  transform:scaleX(0);transform-origin:left center;
  transition:transform 1.15s cubic-bezier(.22,.61,.36,1);
}
.ab-hist__years{position:absolute;inset:0;list-style:none;margin:0;padding:0}
/* 命中区：li 以年份 x 为中心，左右各 28px，供 hover / 点击切换（left 由 JS 设置）
   top 24px：overflow-x:auto 会强制裁剪纵向溢出，圆点(上探 7px)+脉冲光晕(15px)必须留在轨道内 */
.ab-hist__years li{
  position:absolute;top:24px;left:0;
  width:56px;height:74px;margin-left:-28px;cursor:pointer;
}
.ab-hist__years i{
  position:absolute;left:50%;top:-7px;width:16px;height:16px;margin-left:-8px;
  border-radius:50%;background:#fff;
  opacity:0;transform:scale(.3);
  transition:opacity .38s ease-out,transform .5s cubic-bezier(.34,1.56,.64,1);
  transition-delay:var(--d,0s);
}
.ab-hist__years span{
  position:absolute;left:50%;top:23px;transform:translate(-50%,12px);
  font-family:var(--ff-num);font-size:20px;font-weight:500;line-height:30px;white-space:nowrap;
  color:rgba(255,255,255,.72);   /* 未选中弱化，拉大与选中的视觉差 */
  opacity:0;transition:opacity .38s ease-out,transform .5s cubic-bezier(.22,.61,.36,1),color .25s ease;
  transition-delay:var(--d,0s);
}
/* 选中态（腾讯式）：字号 20→30、颜色提亮、圆点放大 */
.ab-hist__years li.is-current span{font-size:30px;font-weight:600;color:#fff}
.ab-hist__rail .ab-hist__years li.is-current i{transform:scale(1.35)}

/* ---- 入场：滚到视口内由 JS 加 .show（选择器 .js-in），轴线生长 + 圆点依次点亮
        逐个错位出场的延迟由 JS 写入 li 的 --d，入场结束后移除以保证点击即时反馈 ---- */
.ab-hist__rail.show .ab-hist__axis{transform:scaleX(1)}
.ab-hist__rail.show .ab-hist__years i{opacity:1;transform:scale(1)}
.ab-hist__rail.show .ab-hist__years span{opacity:1;transform:translate(-50%,0)}

/* ---- 常态动效：当前项脉冲光晕；hover 放大 ---- */
@keyframes histPulse{
  0%{box-shadow:0 0 0 0 rgba(255,255,255,.45)}
  70%{box-shadow:0 0 0 15px rgba(255,255,255,0)}
  100%{box-shadow:0 0 0 0 rgba(255,255,255,0)}
}
.ab-hist__years li.is-current i{animation:histPulse 2.6s ease-out 1.1s infinite}
.ab-hist__years li:hover i{transform:scale(1.35);transition-delay:0s}
.ab-hist__years li:hover span{color:#fff}
@media (prefers-reduced-motion: reduce){
  .ab-hist__axis{transform:scaleX(1);transition:none}
  .ab-hist__years i,.ab-hist__years span{opacity:1;transform:none;transition:none}
  .ab-hist__years span{transform:translateX(-50%)}
  .ab-hist__years li.is-current i{animation:none}
}

@media (max-width:1023px){
  .ab-hist{height:auto;padding:80px 0 64px}
  .ab-hist h2{position:static;font-size:40px;line-height:52px;padding:0 32px}
  .ab-hist__inner{position:static;margin-top:40px}
  .ab-hist__pic{position:static;width:calc(100% - 64px);margin:0 32px;aspect-ratio:620/380}
  .ab-hist__panel{position:static;width:auto;margin:32px 0 0;padding:0 32px;gap:28px}
  .ab-hist__events{gap:28px;overflow:visible;flex:none}
  .ab-hist__events span{white-space:normal;font-size:20px;line-height:28px}
  /* 时间轴：横向滑动轨道（与桌面同一套 JS 几何），修复年份条逃逸到区块顶部的 bug */
  .ab-hist__rail{position:static;height:110px;margin-top:48px}
}

/* 05 以文化人 以人强企（1878px，三张 1650×480 大卡） */
.ab-culture{position:relative;background:#fff;padding:113px 0 105px;overflow:hidden}
.ab-title{
  margin:0;text-align:center;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;color:var(--ink-88);
}
.ab-cards{width:1650px;max-width:calc(100% - 64px);margin:78px auto 0}
.ab-card{
  position:relative;height:480px;border-radius:var(--radius);overflow:hidden;
  background:#0B2E5C;margin-bottom:35px;
}
.ab-card:last-child{margin-bottom:0}
.ab-card .ph{position:absolute;inset:0}
.ab-card__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(3,35,75,.08) 30%,rgba(3,35,75,.55))}
.ab-card__tag{
  position:absolute;left:75px;top:310px;z-index:2;
  display:flex;align-items:center;gap:12px;
  color:#fff;font-family:var(--ff-title);font-size:30px;line-height:36px;
}
.ab-card__tag::before{content:'';width:14px;height:14px;background:var(--brand);flex:none}
.ab-card__slogan{
  position:absolute;left:60px;top:382px;z-index:2;
  color:#fff;font-size:56px;font-weight:700;line-height:68px;letter-spacing:2px;
}
/* 卡片视差：卡当窗口，背景层上下各高出 14%，滚动时缓慢滑动（腾讯式） */
/* 卡片视差（通用：[data-plx] > [data-plx-bg]，卡当窗口、背景上下各出血 14% 缓慢滑动） */
.plx-bg{position:absolute;left:0;right:0;top:-14%;bottom:-14%;will-change:transform}
@media (max-width:1279px){
  .ab-culture{padding:88px 0 72px}
  .ab-title{font-size:40px;line-height:52px}
  .ab-cards{margin-top:48px}
  .ab-card{height:auto;aspect-ratio:1650/480}
  .ab-card__tag{left:36px;top:auto;bottom:118px;font-size:20px}
  .ab-card__slogan{left:32px;top:auto;bottom:36px;font-size:30px;line-height:40px}
}

/* 06 企业精神 / 干部誓词 / 行为准则（932px，#03234B + 三张 #0A5CFF 卡） */
/* 06 企业精神 / 干部誓词 / 行为准则（设计稿 54:5840 · 1920×932 · #03234B）
   三张 480×612 卡，默认图标+标题，hover / 点击（.is-open）展开文案层
   桌面尺寸按 1920 等比（min(px,vw)），>1920 封顶 */
.ab-spirit{position:relative;background:var(--brand-deep);padding:160px 32px;overflow:hidden}
/* 背景层视差：上下各出血 90px，滚动时缓慢滑动（JS 写 transform） */
.ab-spirit__bg{position:absolute;left:0;right:0;top:-90px;bottom:-90px;z-index:0;opacity:.4;will-change:transform}
.ab-spirit__bg .ph{width:100%;height:100%}
.ab-spirit__row{position:relative;z-index:1;display:flex;gap:min(38px,1.98vw);justify-content:center}
.ab-sp{
  position:relative;width:min(480px,25vw);height:min(612px,31.875vw);
  background:var(--brand-num);border-radius:var(--radius);
  overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center;
}
.ab-sp::before{content:'';position:absolute;left:-70px;bottom:-130px;width:420px;height:420px;border-radius:50%;background:rgba(255,255,255,.05)}
.ab-sp::after{content:'';position:absolute;right:-50px;top:-90px;width:300px;height:300px;border-radius:50%;background:rgba(255,255,255,.08)}
/* 视差：卡体错位由 JS 写 transform；卡内装饰圆按 --sp 反向漂移，制造层间速度差。
   幅度取大（外卡 ±80px / 圆 ±56·38px）：居中时归零对齐设计稿，滚动过程一眼可见 */
.ab-sp{will-change:transform}
.ab-sp::before{transform:translate3d(0,calc(var(--sp,0)*-56px),0)}
.ab-sp::after{transform:translate3d(0,calc(var(--sp,0)*38px),0)}
.ab-sp__face{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;transition:opacity .35s,transform .4s}
.ab-sp__icon{position:relative;z-index:1;margin-top:min(112px,5.83vw);width:min(380px,19.79vw);aspect-ratio:530/410;border-radius:min(12px,.625vw);overflow:hidden}
.ab-sp__icon img{width:100%;height:100%;object-fit:cover;display:block}
.ab-sp__title{position:relative;z-index:1;margin-top:min(48px,2.5vw);font-family:var(--ff-num);font-size:min(40px,2.08vw);font-weight:700;line-height:1.1;color:#fff;letter-spacing:4px}

/* 文案层（展开态） */
.ab-sp__body{
  position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;
  padding-top:min(56px,2.9vw);opacity:0;transform:translateY(16px);
  transition:opacity .4s ease-out,transform .45s cubic-bezier(.22,.61,.36,1);
  pointer-events:none;
}
.ab-sp__name{font-size:min(34px,1.77vw);font-weight:600;line-height:36px;color:#fff;margin-bottom:min(28px,1.46vw)}
.ab-sp__text{font-size:min(20px,1.042vw);line-height:min(36px,1.875vw);color:#fff;text-align:center}
.ab-sp__text b{font-weight:700}
/* hover（指针设备）与点击锁定（.is-open）都展开 */
@media (hover:hover){
  .ab-sp:hover .ab-sp__face{opacity:0;transform:translateY(-12px)}
  .ab-sp:hover .ab-sp__body{opacity:1;transform:none;pointer-events:auto}
}
.ab-sp.is-open .ab-sp__face{opacity:0;transform:translateY(-12px)}
.ab-sp.is-open .ab-sp__body{opacity:1;transform:none;pointer-events:auto}
@media (prefers-reduced-motion: reduce){
  .ab-sp__face,.ab-sp__body{transition:none;transform:none}
  .ab-sp,.ab-sp::before,.ab-sp::after,.ab-spirit__bg{transform:none!important}
}

@media (max-width:1279px){
  .ab-spirit{padding:88px 32px}
  .ab-spirit__row{flex-direction:column;align-items:center;gap:24px}
  /* 移动端列布局：关闭三卡错位与卡内圆漂移，只留背景缓移 */
  .ab-sp{transform:none!important}
  .ab-sp::before,.ab-sp::after{transform:none}
  .ab-sp{width:min(480px,100%);height:auto;padding:64px 24px 72px}
  .ab-sp__icon{margin-top:0;width:320px;max-width:100%}
  .ab-sp__face{position:static;inset:auto}
  .ab-sp__title{margin-top:40px;font-size:32px}
  /* 移动端无 hover：点击切换显示，直接替换内容 */
  .ab-sp__body{position:static;display:none;opacity:1;transform:none;pointer-events:auto;padding:0}
  .ab-sp.is-open .ab-sp__body{display:flex}
  .ab-sp.is-open .ab-sp__face{display:none}
  .ab-sp__name{font-size:24px;margin-bottom:16px}
  .ab-sp__text{font-size:16px;line-height:28px}
}

/* 手机端（≤639）重新布局：平板竖版在 390 宽下每张卡 320px 图标 + 64/72 padding，
   高约 400px、三卡堆叠 1200px+，又长又空。
   改为横向紧凑卡：左侧 88px 图标 + 右侧标题，单行约 116px；点开展开文案（原有点击切换逻辑不变）。
   移动端没有 hover 场景，只有点击 —— 交互已由 .is-open 承担，这里只处理排版。 */
@media (max-width:639px){
  .ab-spirit{padding:min(44px,11.3vw) min(16px,4.1vw) min(52px,13.3vw)}
  .ab-spirit__row{gap:min(12px,3.1vw)}
  .ab-sp{
    width:100%;padding:min(14px,3.6vw);border-radius:14px;
    display:flex;flex-direction:row;align-items:center;
    gap:min(14px,3.6vw);text-align:left;
  }
  .ab-sp__face{
    position:static;inset:auto;flex:1 1 auto;min-width:0;
    flex-direction:row;align-items:center;gap:min(14px,3.6vw);
  }
  .ab-sp__icon{
    margin:0;flex:none;width:min(88px,22.5vw);aspect-ratio:530/410;border-radius:8px;
  }
  .ab-sp__title{
    margin:0;flex:1 1 auto;font-size:min(21px,5.4vw);letter-spacing:1px;line-height:1.25;
  }
  /* 展开：卡片转纵向，face 一行 + 文案一行 */
  .ab-sp.is-open{flex-direction:column;align-items:stretch;gap:min(10px,2.6vw)}
  .ab-sp.is-open .ab-sp__body{display:flex;padding:0 min(2px,.5vw) min(2px,.5vw)}
  .ab-sp__name{font-size:20px;line-height:28px;margin-bottom:10px}
  .ab-sp__text{font-size:15px;line-height:26px;text-align:left}
}

/* 07 阳光驰骋（设计稿 14:02355：1650×620 图卡与下方举报信息） */
.ab-sun{position:relative;background:#fff;padding:105px 0 137px;text-align:center}
.ab-sun__media{
  position:relative;width:1650px;max-width:calc(100% - 64px);aspect-ratio:1650/620;height:auto;
  margin:50px auto 0;border-radius:30px;overflow:hidden;background:#F4F4F4;
}
.ab-sun__media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.ab-sun__text{margin:30px auto 0;max-width:1408px;padding:0 32px}
.ab-sun__statement{font-size:24px;line-height:40px;font-weight:500;color:#595959;margin:0}
.ab-sun__contact{margin-top:8px;font-size:24px;line-height:40px;font-weight:500;color:#000}
.ab-sun__contact p{margin:0}
.ab-sun__contact a{color:inherit;font-weight:700;text-decoration:none}
.ab-sun__contact a:hover{text-decoration:underline}
.ab-sun__qr{display:block;width:226px;height:226px;object-fit:contain;margin:14px auto 0}
@media (max-width:1279px){
  .ab-sun{padding:88px 0 64px}
  .ab-title{font-size:40px;line-height:52px}
  .ab-sun__media{height:auto;aspect-ratio:1650/620;margin-top:36px}
  .ab-sun__text{margin-top:32px}
  .ab-sun__statement,.ab-sun__contact{font-size:18px;line-height:32px}
  .ab-sun__qr{width:180px;height:180px}
}

/* ---------------- 减弱动效偏好 ---------------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}
  .fade-up,.fade-left,.fade-right{opacity:1;visibility:visible;transform:none}
}

/* ================= 业务体系页（设计稿 70:0475 · 1920×3998） ================= */
.bz-hero{position:relative;height:820px;background:#E7EDF7;overflow:hidden}
.bz-hero .ph{width:100%;height:100%}
/* banner 实图：cover 铺满（素材比例略窄于 1920:820，居中裁切约 2%，肉眼无感） */
.bz-hero__img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}

.bz-title{
  margin:0;padding-top:88px;text-align:center;
  font-family:var(--ff-title);font-size:60px;font-weight:400;line-height:72px;color:var(--ink-88);
}
.bz-title--light{color:#fff}

/* 02 集团发展 */
.bz-brands{position:relative;background:#fff;padding-bottom:70px}
/* （重复的 .bz-tabs/.bz-tab 定义已合并到上文唯一一处） */
/* 集团发展：每屏 1920×1028 整屏（设计稿 65:29632 / 65:31041 / 65:31136）
   品牌色整屏底 + 26% 黑蒙版（--scrim，萝卜白菜为 0）+ 右侧大图出血 1184×1028 at (736,0)
   + 左上 logo（86,~70）+ 左下三行文案（36px/60 w600 at 86,641）+ 左下白色描边轮播箭头（y866）
   坐标按 1920 基准换算 vw；文案字体沿用全站默认字体（不用 --ff-title 主字体）。 */
/* 轮播 + 滚动视差：区块高 = 100vh + (屏数-1)×100vh（JS 设置），stage 整屏钉住，
   三屏 absolute 叠放在 stage 内，靠 .is-on 切换；滚动推进即换屏（--k 贴合度 / --y 文案位移）。
   ⚠ .bz-brands 不能加 overflow:hidden —— 祖先是滚动容器会让 sticky 失效。 */
/* 底色 = 当前屏品牌色（JS 写 --sec-bg）：sticky 到最后一屏会被顶上去几十像素
   （100vh 与实际可用高度有偏差），露出的那条若写死深色就成了"黑框"，
   跟着当前屏色就看不出来了。交接时透出的也是当前屏色，语义一致。 */

/* ============================================================
   03 零售生态（夜景大图铺满 · 整屏钉住视差滚动 · 腾讯同款）
   表现方式参考腾讯官网：大图铺满 + 50% 黑蒙版压暗，左下白色品牌名 / 56px 粗体大标题 / 白色官网 CTA，
   右上角品牌 logo。滚动效果对齐 about.html「以文化人，以理强企」（#ab-culture）的腾讯 section-parallax：
   整屏钉住（.eco__stage sticky 100vh）+ 大图随滚动缩放（--k）+ 三屏文案依次推出（--y）。
   区块高度由 JS 设成 100vh + (屏数-1)×100vh，窄屏不设并退回流式布局。
   ============================================================ */
.eco{position:relative;background:#001B4A}
/* ★ .eco 不能加 overflow:hidden —— 祖先一旦是滚动容器，.eco__stage 的 position:sticky 就会失效
   （钉不住，实测 item 被顶到 -1080）。裁切交给 .eco__stage 自己的 overflow:hidden。 */
.eco__stage{position:sticky;top:0;height:100vh;overflow:hidden}
.eco__item{
  position:absolute;left:0;top:0;width:100%;height:100%;
  opacity:1;will-change:opacity;   /* 默认全可见（JS 不可用时至少不空白），可见性由 JS 按 |rel|<1 接管 */
}
.eco__media{
  position:absolute;left:min(48px,2.5vw);top:min(66px,3.438vw);right:min(48px,2.5vw);bottom:min(66px,3.438vw);
  border-radius:min(16px,0.833vw);overflow:hidden;background:#0B2C63;
}
.eco__media .ph{width:100%;height:100%}
.eco__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.eco__media::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.5)}
.eco__logo{position:absolute;left:min(1606px,83.646vw);top:min(153px,7.969vw);z-index:2;
  height:min(92px,4.792vw);display:flex;align-items:center}
.eco__logo img{max-height:100%;width:auto}
/* Logo 悬停效果：发光 + 放大 + 投影 */
.eco__logo img{
  transition:transform .35s cubic-bezier(.34,1.56,.64,1),filter .35s ease,box-shadow .35s ease;
  border-radius:8px;
  cursor:pointer;
}
.eco__logo:hover img{
  transform:scale(1.12);
  filter:brightness(1.15) drop-shadow(0 0 20px rgba(255,255,255,.4));
}
/* 文案层：完全按设计稿 80:0607 的左下角排版与主次关系 ——
   品牌名「左邻右舍 · 亲如一家」是小标题（36.68px/49 w500，无字距），
   下面是两句大字（56px/68 w800），再下面是 24px 的官网 CTA。 */
.eco__copy{
  position:absolute;left:min(119px,6.198vw);top:min(392px,20.417vw);z-index:2;
  transform:translateY(var(--y,0px));
  display:flex;flex-direction:column;align-items:flex-start;text-align:left;
  max-width:min(1109px,57.76vw);
}
.eco__name{
  margin:0;color:#fff;
  font-size:min(37px,1.927vw);font-weight:400;line-height:min(49px,2.552vw);
  text-shadow:0 2px 30px rgba(0,0,0,.35);
}
.eco__title{
  margin:min(84px,4.375vw) 0 0;
  font-size:min(56px,2.917vw);font-weight:800;line-height:min(68px,3.542vw);color:#fff;
  text-shadow:0 2px 20px rgba(0,0,0,.35);
}
.eco__cta{
  margin-top:min(43px,2.24vw);
  display:inline-flex;align-items:center;gap:min(12px,0.625vw);white-space:nowrap;
  font-size:min(24px,1.25vw);line-height:min(29px,1.51vw);color:#fff;transition:opacity .3s ease;
}
.eco__cta svg{width:min(24px,1.25vw);height:min(24px,1.25vw);transition:transform .3s ease}
.eco__cta:hover{opacity:.85}
.eco__cta:hover svg{transform:translateX(5px)}
/* 官方 logo 图：按容器高度约束，宽随原图比例 */
.logo-img{display:block;width:auto;max-height:100%}
@media (max-width:1279px){
  /* 窄屏不做钉屏：stage 退回静态流，3 屏纵向依次排开（JS 也会把 .eco 的行内高度清空） */
  .eco__stage{position:static;height:auto;overflow:visible}
  .eco__item{
    position:relative;left:auto;top:auto;width:100%;height:auto;opacity:1;min-height:min(620px,80vw);
    display:flex;flex-direction:column;justify-content:center;
    padding:min(130px,15vw) min(32px,4vw) min(76px,9vw);
  }
  .eco__media{left:16px;right:16px;top:16px;bottom:16px;border-radius:12px}
  .eco__logo{left:auto;right:32px;top:32px;height:52px}
  /* 文案层退回流式：窄屏改为居中（与首屏一致），桌面保持左对齐 */
  .eco__copy{
    position:relative;left:auto;top:auto;transform:none;
    margin:auto 0;padding:0 min(32px,4vw);
    align-items:center;text-align:center;max-width:none;
  }
  .eco__name{font-size:26px;line-height:1.3;letter-spacing:2px}
  .eco__title{margin-top:24px;font-size:16px;line-height:1.6}
  .eco__cta{margin-top:16px;font-size:15px;line-height:1.3;gap:8px}
  .eco__cta svg{width:18px;height:18px}
}
@media (max-width:479px){
  /* 手机：品牌名与右上 logo 会撞在同一行带（name y58~88 vs logo y32~84）→ logo 缩小并上移让出垂直空间 */
  .eco__logo{height:36px;top:20px;right:20px}
}
/* 滚动缩放（腾讯 section-parallax 同款）：--k = 该屏与视口的贴合度（1 = 正对齐，0 = 刚进/刚出），
   --y = 文案层位移（由 JS 按 -(rel)×100vh 写入，负值向上推出）。
   只缩放容器内的 img，容器（圆角 + 50% 蒙版 + 深蓝底）保持静止，否则容器一动就在区块底色上露缝。 */
@media (prefers-reduced-motion:reduce){
  /* 减弱动效：JS 不接管，退回三屏纵向流式排布（否则 absolute 叠放会只看到最后一屏） */
  .eco__stage{position:static;height:auto;overflow:visible}
  .eco__item{
    position:relative;left:auto;top:auto;height:auto;min-height:min(620px,80vw);opacity:1;
    display:flex;flex-direction:column;justify-content:center;
  }
  .eco__copy{position:relative;left:auto;top:auto;transform:none;margin:auto 0;max-width:none}
  .eco__media img,.eco__logo{transform:none!important}
}
@media (min-width:1280px){
  /* 大图随贴合度淡出，但曲线刻意做成「早恢复、晚淡出」：k>0.55 就完全实心（clamp 上限），
     只在 k<0.55 的交接区才淡化。这样大部分滚动行程里画面都是实图，不会出现"停在中途画面发虚"；
     文案靠 --y 推出，图不能位移（容器一动就在区块底色上露缝），两者交接用这条淡出衔接。 */
  .eco__media{opacity:clamp(0,(var(--k,1) - .2) / .35, 1)}
  /* logo 与 media 同步淡出：否则滚动到边界时 rel 因亚像素落在 (-1,1) 内、
     item 的 opacity 仍是 1（只有 media 透明），右上角会露出下一屏的 logo */
  .eco__logo{opacity:clamp(0,(var(--k,1) - .2) / .35, 1)}
  .eco__media img{
    transform:translate3d(0,calc((1 - var(--k,1)) * -46px),0)
              scale(calc(.9 + .1 * var(--k,1)));
  }
  /* 文案整块上下推出（--y 写在 .eco__copy 的 translateY 里，与居中的 -50% 合并计算）；
     右上角 logo 只跟随 15%，保持锚定感 */
  .eco__logo{transform:translate3d(0,calc(var(--y,0px) * .15),0)}
}

/* ---------- 新闻：视频直拨与富文本（媒体字段版） ---------- */
/* 视频卡播放角标（悬停浮现，卡片本身可点击播放） */
.nw-card{position:relative}
.nw-card[data-video]:not([data-video=""]){cursor:pointer}
.nw-card__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);pointer-events:none;z-index:1}
.nw-lead{position:relative}
.nw-lead__pic[data-video]:not([data-video=""]){cursor:pointer}
.nw-lead__pic{position:relative}
.nw-lead__pic[data-video]:not([data-video=""])::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(10,18,32,.35));pointer-events:none}
.nw-play-badge{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.92);color:#0A1220;font-size:14px;font-weight:600;letter-spacing:1px;box-shadow:0 6px 18px rgba(10,18,32,.22)}
.nw-play-badge i{font-style:normal}
.nw-card[data-video]:not([data-video=""]) .nw-card__play{opacity:0;transition:opacity .2s}
.nw-card[data-video]:not([data-video=""]):hover .nw-card__play{opacity:1}
/* 详情页独立媒体 */
.nw-det__media{width:100%;margin:0 0 38px}
.nw-det__media video{width:100%;max-height:560px;border-radius:20px;background:#000;display:block}
.nw-det__media img{width:100%;border-radius:20px;display:block}
.nw-det__media img{width:100%;border-radius:20px;display:block}
/* 详情页富文本正文 */
.nw-det__body{font-size:17px;line-height:1.9;color:#333}
.nw-det__body p{margin:0 0 18px}
.nw-det__body h2{font-size:22px;font-weight:700;margin:28px 0 12px;color:#000}
.nw-det__body h3{font-size:19px;font-weight:700;margin:22px 0 10px;color:#000}
.nw-det__body ul,.nw-det__body ol{margin:0 0 18px;padding-left:28px}
.nw-det__body li{margin:0 0 6px}
.nw-det__body blockquote{margin:20px 0;padding:14px 20px;border-left:4px solid var(--brand);background:#F2F5FA;border-radius:0 10px 10px 0;color:#47566B}
.nw-det__body a{color:var(--brand);text-decoration:underline}
.nw-det__body img{max-width:100%;height:auto;border-radius:12px;margin:8px 0;display:block}
.nw-det__body video{max-width:100%;border-radius:12px;background:#000;display:block;margin:8px 0}
/* 视频播放弹层 */
.nw-player{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center}
.nw-player[hidden]{display:none}
.nw-player__mask{position:absolute;inset:0;background:rgba(6,12,22,.78);backdrop-filter:blur(4px)}
.nw-player__box{position:relative;width:min(920px,92vw);background:#0D1626;border-radius:18px;padding:18px 18px 20px;box-shadow:0 24px 80px rgba(0,0,0,.5)}
.nw-player__t{color:#fff;font-size:16px;font-weight:600;line-height:1.4;margin:0 40px 12px 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nw-player__close{position:absolute;right:14px;top:12px;width:34px;height:34px;border:none;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:15px;cursor:pointer;transition:background .15s}
.nw-player__close:hover{background:rgba(255,255,255,.28)}
.nw-player__video{width:100%;max-height:70vh;border-radius:10px;background:#000;display:block}
.nw-player__err{color:#E7ECF5;text-align:center;padding:60px 0;font-size:15px;letter-spacing:1px}
@media (max-width:860px){
  .nw-det__body{font-size:16px}
  .nw-player__box{padding:12px 12px 14px;border-radius:14px}
  .nw-player__t{font-size:14px;margin-right:36px}
}

/* 发展历程年月配图（数据库驱动，无图时回退 .ph 占位） */
.ab-hist__pic .ab-hist__image{width:100%;height:100%;object-fit:cover;display:block}
/* ============================================================
   合作商招募 partner.html —— 设计稿 120:15866
   01 Hero 复用 .rc-hero（渐变字/定位与设计稿一致）
   02 招募方向：白底居中标题 + 两张 760×420 方向卡
   03 提交合作意向：复用全站 .form 体系
   ============================================================ */
.pr-dir{
  padding-top:clamp(48px,4.583vw,88px);
  padding-bottom:clamp(64px,8.229vw,158px);
  background:#FFFFFF;
}
.pr-dir__ttl{
  margin:0;text-align:center;color:var(--ink);
  font-family:var(--ff-title);font-weight:400;
  font-size:clamp(34px,3.125vw,60px);
  line-height:clamp(44px,3.75vw,72px);
}
.pr-cards{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(20px,3.438vw,66px);
  max-width:1586px;margin:clamp(36px,4.479vw,86px) auto 0;   /* 760*2 + 66，对齐设计稿卡片宽度 */
}
.pr-card{
  position:relative;overflow:hidden;
  border-radius:var(--radius);
  aspect-ratio:760/420;
  background:#E8EEF6;
}
.pr-card__bg{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;object-fit:cover;
}
.pr-card__body{
  position:absolute;z-index:1;
  left:clamp(24px,7.24%,55px);
  top:47.5%;transform:translateY(-50%);
}
.pr-card__t{
  margin:0;font-weight:700;color:#000;
  font-size:clamp(24px,2.083vw,40px);
  line-height:1.2;
}
.pr-card__d{
  margin:9px 0 0;color:#3D3D3D;
  font-size:clamp(14px,0.938vw,18px);
  line-height:1.67;
}
.pr-apply{
  padding-top:clamp(40px,2.604vw,50px);
  padding-bottom:clamp(56px,5vw,110px);
}
@media (max-width:900px){
  .pr-cards{grid-template-columns:1fr;gap:20px}
  .pr-card{aspect-ratio:auto;height:280px}
  .pr-card__body{top:50%}
}
@media (max-width:639px){
  .pr-card{height:220px}
  .pr-card__t{font-size:24px}
  .pr-card__d{font-size:14px}
}

/* ============================================================
   页脚白色版（设计稿 页尾 120:3984 · 1920×701）—— 全站生效
   白底 / 品牌蓝 logo / 深色文字 / 单条浅分隔线 / 版权右对齐
   说明：放在末尾靠层叠覆盖原深蓝 .ft2，不改原规则便于回退
   ============================================================ */
.ft2{background:#FFFFFF;color:#5A5A5A}
.ft2__inner{padding-top:clamp(32px,3.2vw,56px);padding-bottom:clamp(20px,1.8vw,32px)}
.ft2__follow{
  align-items:flex-end;
  border-bottom:1px solid rgba(90,90,90,.16);
  padding-bottom:clamp(18px,2vw,32px);
}
.ft2__brand{color:var(--brand);gap:10px}      /* mask+currentColor → 品牌蓝 logo */
.ft2__brand .brand__logo{width:clamp(128px,8.5vw,160px);height:auto}
.ft2__code{font-size:clamp(13px,0.85vw,15px);letter-spacing:1px;color:#5A5A5A}
.ft2__sns{gap:12px}
.ft2__sns-label{font-size:clamp(14px,0.95vw,16px);font-weight:500;color:#000000}
.ft2__qr-box{border-color:#E5E6EB;border-radius:10px}
.ft2__qr-name{color:#999999}
.ft2__cols{padding-top:clamp(28px,2.6vw,44px);padding-bottom:0}
.ft2__hd{
  font-size:clamp(15px,0.95vw,17px);font-weight:600;color:#0B0B0B;
  margin-bottom:12px;
}
a.ft2__hd:hover{color:var(--brand)}
.ft2__list{gap:0}
.ft2__list a{
  font-size:clamp(13.5px,0.82vw,14.5px);line-height:28px;
  font-weight:400;color:#5A5A5A;
}
.ft2__list a:hover{color:var(--brand)}
/* 版权区：设计稿只有一条分隔线（在 logo 行下方），此处去掉第二条线并整体右对齐 */
.ft2__bar{
  border-top:0;margin-top:clamp(24px,2.6vw,44px);padding-top:0;
  justify-content:flex-end;
}
.ft2__bar p{
  font-size:12.5px;letter-spacing:.5px;color:#999999;
}
.ft2__bar p:first-child{order:0}     /* 版权在前、举报在后，整体靠右 */
.ft2__bar a{color:#999999}
.ft2__bar a:hover{color:var(--brand)}
@media (max-width:767px){
  .ft2__follow{align-items:flex-start}
  .ft2__bar{justify-content:flex-start}
}
/* 关注我们：社媒图标（展示图标 + 悬停弹出二维码气泡），40×40 圆角 8，间距 12 */
.ft2__social{
  position:relative;display:block;flex:none;cursor:pointer;
  width:clamp(34px,2.2vw,40px);height:clamp(34px,2.2vw,40px);
}
.ft2__social>img{display:block;width:100%;height:100%;object-fit:cover;border-radius:8px}
/* 悬停气泡：二维码大图 + 名称，向上弹出 */
.ft2__social-pop{
  position:absolute;bottom:calc(100% + 14px);left:50%;
  transform:translateX(-50%) translateY(6px) scale(.94);
  width:170px;padding:10px 10px 8px;background:#fff;border-radius:14px;
  box-shadow:0 12px 36px rgba(3,35,75,.20);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease;
  pointer-events:none;z-index:40;
}
.ft2__social-pop img{width:150px;height:150px;object-fit:contain;border-radius:8px;background:#fff}
.ft2__social-name{font-size:12px;line-height:1.4;color:#5A5A5A;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.ft2__social-pop::after{
  content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);
  border-left:8px solid transparent;border-right:8px solid transparent;border-top:9px solid #fff;
}
.ft2__social:hover .ft2__social-pop,.ft2__social:focus-within .ft2__social-pop{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(0) scale(1);
}
.ft2__sns{gap:16px}
.ft2__sns-label{margin-right:14px}

/* ============================================================
   2026-10-26 · 发展历程改浅底版（MasterGo 94:2807 · 1920×940）
   设计：背景 #F7F7F7 + 底部雪山装饰图；图片卡 720×410 @(271,247)；
        年份 70/800 #0067FF @(1065,247)；事件 24px #000，月份加粗；
        时间轴 @719：轴线 #D8D8D8，圆点 14 空心 / 22 实心蓝，标签 20/500 #999999，
        选中 30/600 #0067FF；左右 62 圆箭头 @(1101,601)，#0067FF / 置灰 #D8D8D8。
   整块为覆盖规则，删除本块即回到旧的蓝底版式。
   ============================================================ */
/* 区块高度跟随视口等比缩放（1920→940），>1920 封顶。
   否则窄屏下宽按 % 缩、高按 940 固定，图片卡会被压扁（720×410 → 480×410） */
.ab-hist{height:min(940px,48.958vw);background:#F7F7F7;color:#000}

/* 底部雪山装饰（1920×147，顶边已融进 #F7F7F7） */
.ab-hist__dec{
  position:absolute;left:0;bottom:0;z-index:0;width:100%;height:auto;
  pointer-events:none;-webkit-user-select:none;user-select:none;
}
.ab-hist__inner{z-index:1}

.ab-hist h2{
  color:#000;top:12.234%;                     /* 115/940 */
  font-size:min(60px,3.125vw);line-height:min(72px,3.75vw);
}

/* 左侧图片卡 720×410 @ (271,247) = 14.1146% / 26.2766% / 37.5% / 43.617% */
.ab-hist__pic{
  left:14.1146%;top:26.2766%;width:37.5%;height:43.617%;
  background:#fff;border-radius:var(--radius);
}
.ab-hist__pic img,.ab-hist__pic .ab-hist__image{
  display:block;width:100%;height:100%;object-fit:cover;
}

/* 右侧年份 + 事件：顶端微调至 21.745%，使大字号年份视觉顶边与左侧图片卡顶端严格水平对齐 */
.ab-hist__panel{
  left:55.4688%;top:21.745%;bottom:38%;width:29.3229%;
  padding:clamp(12px,1.7vw,32px) clamp(16px,1.7708vw,34px);
  gap:clamp(8px,0.8333vw,16px);
}
.ab-hist__year{
  color:#0067FF;font-size:min(70px,3.6458vw);font-weight:800;line-height:1;
}
.ab-hist__events{scrollbar-color:rgba(0,0,0,.22) transparent}
.ab-hist__events::-webkit-scrollbar-thumb{background:rgba(0,0,0,.18)}
.ab-hist__events span{color:#000;font-size:min(24px,1.25vw);line-height:1.25}
.ab-hist__events b{font-weight:700;margin-right:min(10px,.52vw)}

/* 左右箭头 @ (1101,601)：62 圆；到两端变 #D8D8D8 */
.ab-hist__nav{
  position:absolute;left:57.3438%;top:63.936%;z-index:2;
  display:flex;gap:clamp(10px,1.1458vw,22px);   /* 1920 稿两箭头间距 22 */
}
/* 箭头统一到 .ux-arrow 规范：浅底用品牌蓝描边环 */
.ab-hist__arrow{
  display:flex;align-items:center;justify-content:center;
  width:62px;height:62px;padding:0;border:2px solid currentColor;
  border-radius:50%;background:transparent;cursor:pointer;
  color:var(--brand);
  transition:background-color .2s ease,transform .2s ease,opacity .2s ease;
}
.ab-hist__arrow svg{display:block;width:42%;height:42%}
.ab-hist__arrow:hover{background:rgba(0,103,255,.1)}
.ab-hist__arrow:active{transform:scale(.94)}
.ab-hist__arrow:disabled,.ab-hist__arrow.is-off{opacity:.28;cursor:default;background:transparent;transform:none}

/* 时间轴 @719：轴线 17px 处，圆点 14 空心 / 22 实心蓝，标签在轴下 */
.ab-hist__rail{top:76.489%;height:min(96px,5vw)}
.ab-hist__axis{top:17px;height:1px;background:#D8D8D8}
.ab-hist__years li{top:17px}
.ab-hist__years i{
  top:-7px;width:14px;height:14px;margin-left:-7px;
  box-sizing:border-box;background:#fff;border:1.5px solid #D8D8D8;
}
.ab-hist__years span{
  top:14px;color:#999999;font-size:20px;font-weight:500;line-height:30px;
}
.ab-hist__years li:hover span{color:#0067FF}
.ab-hist__years li:hover i{border-color:#0067FF;transform:scale(1.12)}

/* 选中态：字号 20→30、变蓝、圆点 14→22 实心（无光晕，设计稿无脉冲） */
.ab-hist .ab-hist__years li.is-current span{
  top:22px;font-size:30px;font-weight:600;color:#0067FF;
}
.ab-hist .ab-hist__years li.is-current i{
  top:-11px;width:22px;height:22px;margin-left:-11px;
  background:#0067FF;border-color:#0067FF;
  transform:none;animation:none;
  transition:top .28s ease,width .28s ease,height .28s ease,margin-left .28s ease,
             background-color .28s ease,border-color .28s ease,opacity .38s ease-out;
}
.ab-hist__rail.show .ab-hist__years i{opacity:1;transform:scale(1)}

@media (prefers-reduced-motion: reduce){
  .ab-hist .ab-hist__years li.is-current i{transition:none}
  .ab-hist__arrow{transition:none}
}

@media (max-width:1023px){
  .ab-hist{height:auto;padding:64px 0 28px;background:#F7F7F7}
  .ab-hist h2{position:static;font-size:40px;line-height:52px;padding:0 32px;color:#000}
  .ab-hist__inner{position:static;margin-top:36px}
  .ab-hist__pic{
    position:static;width:calc(100% - 64px);margin:0 32px;
    height:auto;aspect-ratio:720/410;
  }
  .ab-hist__panel{position:static;width:auto;margin:26px 0 0;padding:0 32px;gap:18px;bottom:auto}
  .ab-hist__year{font-size:44px;line-height:1}
  .ab-hist__events{gap:14px;overflow:visible;flex:none}
  .ab-hist__events span{font-size:17px;line-height:1.5}
  /* 窄屏恢复箭头（2026-11-10）：此前 display:none 后滑动又不联动，
     移动端等于没有任何切换手段（面板一直停在 2026，阿凯验收发现）。
     现在滑动已联动（scroll 监听），箭头作为显式控件也保留 ——
     双通道：手势滑 + 点箭头，哪个顺手用哪个。 */

/* ============================================================
   移动端滚动预留（2026-11-10 业务反馈：标题滚到顶部被吸顶头挡住）
   header 64px + jnav 60px ≈ 124px；统一给主要区块 scroll-margin-top，
   对 scrollIntoView / 锚点跳转生效，不影响正常文档流。
   ============================================================ */
@media (max-width:1023px){
  .rc-dir, .jn-cars, .jn-wel, .jn-show, .ab-hist, .ab-eco, .co-brand, .co-excl,
  .jf-support, .nw-lead, .rc-grid {
    scroll-margin-top: 130px;
  }
}

  .ab-hist__nav{
    position:static;
    justify-content:center;
    margin-top:18px;
  }
  .ab-hist__arrow{width:44px;height:44px}
  .ab-hist__rail{position:static;top:auto;height:88px;margin-top:34px}
  .ab-hist__axis{top:15px}
  .ab-hist__years li{top:15px}
  .ab-hist__years span{top:12px;font-size:16px;line-height:26px}
  .ab-hist .ab-hist__years li.is-current span{top:19px;font-size:24px;line-height:26px}
}

/* 无大事记数据时不留空轨道/空箭头 */
.ab-hist__rail.is-empty,.ab-hist__nav.is-empty{visibility:hidden}

/* ============ 企业精神 / 干部誓词 / 行为准则：浅灰底三列卡（设计稿 14:0614 · 2026-10-29） ============
   业务反馈上一版（整幅底图 + 装饰圆 + 悬停换色）不满意，按设计稿重做成「配图 + 标题 + 正文」三列卡。
   尺寸按设计稿 2201 稿折算（内容区 1881 → 本站 1650，系数 0.8772），写成 vw + clamp，1920 下即等于折算值：
     配图 336→295（aspect-ratio 锁 607:336）· 标题 48/59→42/52 · 蓝线 124×3→109×3
     正文 20/36→18/32 · 「展开」20/25→18/22 · ＋号 28→25 · 列间 30→26 · 行间 35→30

   ★ 2026-10-29 第二次改（阿凯定稿）：收起态只留「配图 + 标题 + 展开」，
     不预告正文、也不显示分割线；点开时分割线从标题下面**缓缓向右延伸**，正文随之展开。
     为此把 flex 的 gap 换成显式 margin —— 收起时「线」「正文」的高度与外边距都是 0，
     只剩标题下那 30px，展开时线的高度、正文的高度与上下外边距一起补回来。
     用 gap 做不到这一点：即便元素高度是 0，gap 仍会占两份，收起态会多出 60px 空洞。 */
.ab-spirit{
  --spx-lh:clamp(26px,1.6667vw,32px);   /* 正文行高：1920 → 32（设计稿 36 × .8772） */
  --spx-gap:clamp(18px,1.5625vw,30px);  /* 卡内行距：1920 → 30（设计稿 35 × .8772） */
  position:relative;
  background:#F7F7F7;
  padding:var(--sec-pt) 0 var(--sec-pb);       /* 并入全站区块节奏 120 / 96 */
}
.ab-spirit__inner{width:var(--shell-w);margin-inline:auto}
.ab-spirit__cols{display:flex;align-items:flex-start;gap:clamp(14px,1.3542vw,26px)}

/* 每列是独立纵向流；列与列不拉等高 —— 展开只会推自己的按钮往下 */
.ab-spx{
  display:flex;flex-direction:column;align-items:flex-start;
  flex:1 1 0;min-width:0;
}
.ab-spx__media{width:100%;aspect-ratio:607/336;overflow:hidden;border-radius:min(20px,1.042vw);background:#EDEDED;margin-bottom:var(--spx-gap)}
.ab-spx__media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.ab-spx__title{
  margin:0 0 var(--spx-gap);
  font-family:var(--ff-title);font-weight:700;
  font-size:clamp(26px,2.1875vw,42px);line-height:clamp(32px,2.7083vw,52px);
  color:rgba(0,0,0,.9);
}

/* 分割线：收起态高度 0、横向缩到 0；展开时高度回到 3px，宽度从左往右长出来（0.8s，比正文慢半拍收尾） */
.ab-spx__rule{
  display:block;flex:none;
  width:clamp(68px,5.6771vw,109px);height:0;
  background:var(--brand);
  transform:scaleX(0);transform-origin:left center;
  transition:height .3s cubic-bezier(.4,0,.2,1),
             transform .72s cubic-bezier(.45,.05,.25,1);   /* 近匀速、两头收 —— 才是「缓缓延伸」而不是「瞬间铺满」 */
}
.ab-spx.is-open .ab-spx__rule{height:3px;transform:scaleX(1)}

/* 正文：收起态高度 0、不占位；展开时先让线长出来（.16s 起），再撑开高度并淡入 */
.ab-spx__text{
  margin:0;overflow:hidden;
  max-height:0;opacity:0;
  font-family:var(--ff-body);
  font-size:clamp(15px,0.9375vw,18px);line-height:var(--spx-lh);
  color:rgba(0,0,0,.9);
  transition:max-height .58s cubic-bezier(.33,0,.2,1),
             margin-top .48s cubic-bezier(.33,0,.2,1),
             margin-bottom .48s cubic-bezier(.33,0,.2,1),
             opacity .46s ease;
  transition-delay:.2s,.12s,.12s,.24s;   /* 等分割线先长出来一段，正文再跟上 */
}
/* 分组小标题（心态要求 / 工作要求 / 我追求 / 我承诺 / 五"不"五"要"）：独立成行、组间留呼吸
   —— HTML 里 <b> 后不再跟 <br>，靠 display:block 换行，否则会多出一整行空高 */
.ab-spx__text b{display:block;font-weight:700}
.ab-spx__text b:not(:first-child){margin-top:clamp(12px,.8333vw,16px)}
.ab-spx.is-open .ab-spx__text{
  /* --spx-open-h 由 JS 在点击那一刻量出来写进内联（scrollHeight）；没有 JS 时退回 22 行 */
  max-height:var(--spx-open-h, calc(var(--spx-lh) * 22));
  margin-top:var(--spx-gap);
  margin-bottom:var(--spx-gap);   /* 正文下边距就是「正文→展开」的间距，按钮本身不再管间距 */
  opacity:1;
}

/* 展开 / 关闭：收起时紧跟标题（标题自带 30px 下边距），展开时由正文的下边距把它顶下去。
   ★ 这里刻意不写 transition —— 一旦写了，会把 .fade-up 上的入场过渡整条顶掉（同优先级、后写者赢），
     按钮就会不参与分段入场、直接「啪」一下出现。间距交给正文的 margin 过渡来驱动。 */
.ab-spx__more{
  display:inline-flex;align-items:center;gap:clamp(8px,0.7292vw,14px);
  margin:0;padding:0;border:0;background:none;cursor:pointer;
  font-family:var(--ff-title);font-weight:700;
  font-size:clamp(17px,1.1458vw,22px);line-height:clamp(21px,1.3542vw,26px);
  color:var(--brand);
}
.ab-spx__more:hover{color:var(--brand-dk)}
.ab-spx__more:focus-visible{outline:2px solid var(--brand);outline-offset:4px;border-radius:2px}
.ab-spx__plus{display:block;flex:none;width:clamp(23px,1.5625vw,30px);height:clamp(23px,1.5625vw,30px);color:currentColor}
.ab-spx__plus rect{
  fill:currentColor;transform-box:fill-box;transform-origin:center;
  transition:transform .3s ease,opacity .3s ease;
}
/* 展开后竖杠收掉 → ＋ 变 −，和「关闭」文案同步 */
.ab-spx__more[aria-expanded="true"] .ab-spx__plus .ab-spx__v{transform:scaleY(0);opacity:0}

@media (prefers-reduced-motion: reduce){
  .ab-spx__rule,.ab-spx__text,.ab-spx__plus rect{transition:none}
}

/* ---- ≤1023：竖向堆叠，一屏一列；字号抬到移动端可读档 ---- */
@media (max-width:1023px){
  .ab-spirit__cols{flex-direction:column;gap:44px}
  .ab-spx{width:100%;flex:none}
  .ab-spx__title{font-size:28px;line-height:36px}
  .ab-spx__text{--spx-lh:28px;font-size:16px}
  .ab-spx.is-open .ab-spx__text{max-height:var(--spx-open-h, calc(var(--spx-lh) * 22))}
  .ab-spx__rule{width:80px}
  .ab-spx__more{font-size:18px;line-height:22px}
  .ab-spx__plus{width:24px;height:24px}
}

/* ============================================================
   03 零售生态 · 三品牌浅色圆角卡（设计稿 120:11804 · 2026-10-27）
   旧版是「夜景大图铺满 + 50% 黑蒙版 + 右上角 logo」，本次业务改为浅色卡：
   每屏 1920×1040，卡 1650×750 @(135,145) 圆角 50px 底色 #F4F4F4，
   卡内品牌浅色渐变底 + 左上 logo + 左下「标题 → 口号 → 品牌色胶囊 CTA」+ 右侧形象图。
   全部用 .eco--brand 前缀提升优先级，避免与历史 .eco__* 规则打架（本文件历史重复严重）。
   卡尺寸与字号统一按 1920 稿折算 vw，卡宽高都随 vw 缩放 → 长宽比恒定 2.2:1，
   卡内用 % 定位即可与设计稿坐标一一对应，不需要额外断点。
   ============================================================ */
.eco.eco--brand{background:#fff}
.eco--brand .eco__stage{background:#fff}
/* ★ 面板底板只有一块，画在 stage 上（不是每张卡各一块）。
   原来三张卡各带 #F4F4F4 面板，DOM 靠后的那张会用不透明面板把前一张的淡出整个盖住 ——
   换场看上去就是「硬切 + 重新淡入」，往回滚方向还不一样。改成一块常驻底板后，
   三张卡只剩透明裁剪框，淡入淡出是真正的叠化，正反方向都对。 */
.eco--brand .eco__stage::before{
  content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:85.9375vw;height:39.0625vw;                    /* 与 .eco__card 同尺寸 1650×750 @1920 */
  background:#F4F4F4;border-radius:min(50px,2.6042vw);
}
.eco--brand .eco__item{display:flex;align-items:center;justify-content:center}
.eco--brand .eco__card{
  position:relative;width:85.9375vw;height:39.0625vw;       /* 1650 / 750 @1920 */
  background:transparent;border-radius:min(50px,2.6042vw);overflow:hidden;
  /* 这里只负责圆角裁剪（换场滑入的内容要卡在卡内），底色交给上面那块 stage 底板。
     面板常驻 → 换场永远不会闪白底，也不会出现「两层卡对半淡」的重影。 */
}
/* ===== 翻页动效（2026-10-27 第三轮：与滚动解耦，改成时间驱动的分层入场）=====
   机制：JS 把「一次滑动」翻译成「翻一页」——滚动位置瞬时对到 secTop + i×vh（section 仍是 300vh 占位，
   stage 是 sticky 钉住的，所以这一下页面位移在视觉上看不见），内容本身则由 CSS animation 自己跑完。
   时长节奏：卡片出场 360ms → 各元素依次入场，delay 0/110/170/240/320/400ms、时长 740~1000ms，
   加上 170ms 的入场起点，一次翻页 1400ms（阿凯：1s 还是偏快）；JS 在这段时间内锁住滚动（ECO_LOCK 1410ms）。
   曲线用 (.28,.55,.36,1)：比 (.22,.61) 更平缓，慢速下不会「前 20% 就冲完、剩下时间几乎不动」。
   降级：只有 JS 给 section 加上 .is-slide 时才启用「未激活屏隐藏」，否则三张卡照常可见（JS 挂了也不白屏）。 */
/* scene 是 absolute 块级层，会脱离 .eco__item 的 flex 流 → 必须自身也居中，
   否则卡会退到左上角(x:0)，与居中的 ::before 底板错位（截图：卡偏左上、灰底偏右下） */
.eco--brand .eco__scene{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.eco--brand.is-slide .eco__item{opacity:0;visibility:hidden}
.eco--brand.is-slide .eco__item.is-live,
.eco--brand.is-slide .eco__item.is-leaving{opacity:1;visibility:visible}
.eco--brand .eco__item.is-leaving{animation:ecoCardOut .36s ease-out both;pointer-events:none}

@keyframes ecoCardOut{from{opacity:1;translate:0 0}to{opacity:0;translate:0 -14px}}
/* 画面：从 1.06 收回来（推近再落定）。用 scale 独立属性做动画，不碰 transform，
   这样 zlys/shyz 底图上那句 rotate(180deg) 不会被覆盖 */
@keyframes ecoBgIn{from{opacity:0;scale:1.06}to{opacity:1;scale:1}}
@keyframes ecoUp56{from{opacity:0;translate:0 56px}to{opacity:1;translate:0 0}}
@keyframes ecoUp28{from{opacity:0;translate:0 28px}to{opacity:1;translate:0 0}}
@keyframes ecoUp34{from{opacity:0;translate:0 34px}to{opacity:1;translate:0 0}}
@keyframes ecoUp26{from{opacity:0;translate:0 26px}to{opacity:1;translate:0 0}}
@keyframes ecoUp22{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}
@keyframes ecoUp14{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}

.eco--brand.is-slide .eco__item.is-live .eco__bg   {animation:ecoBgIn 1.00s cubic-bezier(.28,.55,.36,1) both}
.eco--brand.is-slide .eco__item.is-live .eco__pic  {animation:ecoUp56 .88s cubic-bezier(.28,.55,.36,1) .11s both}
.eco--brand.is-slide .eco__item.is-live .eco__logo {animation:ecoUp14 .74s cubic-bezier(.28,.55,.36,1) .17s both}
.eco--brand.is-slide .eco__item.is-live .eco__title{animation:ecoUp34 .84s cubic-bezier(.28,.55,.36,1) .24s both}
.eco--brand.is-slide .eco__item.is-live .eco__name {animation:ecoUp26 .84s cubic-bezier(.28,.55,.36,1) .32s both}
.eco--brand.is-slide .eco__item.is-live .eco__cta  {animation:ecoUp22 .83s cubic-bezier(.28,.55,.36,1) .40s both}

/* 品牌渐变底：铺满卡（position 与尺寸都不再随滚动变化） */
.eco--brand .eco__bg{
  position:absolute;left:0;top:0;width:100%;height:100%;
  object-fit:cover;display:block;max-width:none;transform-origin:50% 50%;
}
/* 稿中前两屏的底图是 180° 翻转后铺进去的（Figma rotate(-179.86 / 180)），翻转后光带走向才对 */
.eco__item--zlys .eco__bg,
.eco__item--shyz .eco__bg{transform:rotate(180deg)}
/* 萝卜白菜底图稿中按 (-17,-88) 放大出血放置，非等比（横向 1.01 / 纵向 1.25）→ 1667×936。
   ⚠ 必须给显式宽高百分比：img 是替换元素，width/height:auto 时会退回固有尺寸、无视四边定位 */
.eco__item--lbc .eco__bg{
  left:-1.0303%;top:-11.7333%;width:101.0303%;height:124.8%;right:auto;bottom:auto;
}

/* 品牌 logo（左上）：三屏基线不同（稿中 zlys 131/215、shyz 127/212、lbc 154/191） */
.eco--brand .eco__logo{
  position:absolute;display:block;height:auto;
  left:7.9394%;top:28.6667%;width:min(150px,7.8125vw);
}
.eco__item--shyz .eco__logo{left:7.6969%;top:28.2667%;width:min(79px,4.1146vw)}
.eco__item--lbc .eco__logo{left:9.3333%;top:25.4667%;width:min(89px,4.6354vw)}

/* 文案块（左下）：标题 313 / 口号 392 / CTA 478 —— 三个间距 18 / 38 也从稿里量得 */
.eco--brand .eco__copy{
  position:absolute;left:7.6969%;top:41.7333%;z-index:2;
  display:block;width:auto;max-width:none;text-align:left;
}
/* logo 保持锚定（旧版跟 --y 走会错位），入场位移交给上面的 animation */
.eco--brand .eco__logo{transform:none}
.eco--brand .eco__title{
  margin:0;color:#151515;text-shadow:none;
  font-size:min(50px,2.6042vw);line-height:min(61px,3.1771vw);font-weight:700;
}
.eco--brand .eco__name{
  margin:min(18px,0.9375vw) 0 0;color:#757575;text-shadow:none;
  font-size:min(40px,2.0833vw);line-height:min(48px,2.5vw);font-weight:400;
}
.eco--brand .eco__cta{
  display:inline-flex;align-items:center;justify-content:center;
  gap:min(10px,0.5208vw);padding:0;
  width:min(360px,18.75vw);height:min(90px,4.6875vw);
  margin-top:min(38px,1.9792vw);
  border:0;border-radius:999px;background:#E60012;color:#fff;
  font-family:inherit;font-size:min(40px,2.0833vw);font-weight:500;line-height:1;
  white-space:nowrap;cursor:pointer;
  transition:transform .3s cubic-bezier(.34,1.56,.64,1),filter .3s ease;
}
.eco--brand .eco__cta-arrow{display:block;flex:none;width:min(30px,1.5625vw);height:min(30px,1.5625vw)}
.eco--brand .eco__cta:hover{transform:translateY(-2px);filter:brightness(1.06)}
.eco--brand .eco__cta:active{transform:translateY(0)}
.eco--brand .eco__cta:focus-visible{outline:2px solid #151515;outline-offset:3px}
.eco__item--shyz .eco__cta{background:#00A716}
.eco__item--lbc .eco__cta{background:#FF7429;width:min(320px,16.6667vw)}
.eco--brand .eco__logo:hover img{transform:none;filter:none}   /* 旧版白色发光 hover 在浅底上不适用 */

/* 右侧形象图（三屏尺寸与基线各不相同，按稿直给）。
   z-index:1 是必需的：底图 .eco__bg 是绝对定位，窄屏下本图退回流内静态定位后会画在它下面（被底图盖住）。
   入场时从下方推 56px，比文案早一点到位，形成「画面先到、文字后浮」的层次 */
.eco--brand .eco__pic{
  position:absolute;display:block;width:auto;z-index:1;
}
.eco__item--zlys .eco__pic{left:46.6667%;top:28.6667%;width:48.1818%;height:52.6667%}  /* 795×395 @(770,215) */
.eco__item--shyz .eco__pic{left:46.0606%;top:27.0667%;width:49.8788%;height:53.8667%}  /* 823×404 @(760,203) */
.eco__item--lbc  .eco__pic{left:50%;top:19.2%;width:50.4848%;height:69.7333%}  /* 833×523 @(825,144) */
/* 萝卜白菜这一屏整体比前两屏右移 4px、且文案块基线更高 11px（稿中 logo/CTA 154、标题/口号 150；标题 302、口号 381） */
.eco__item--lbc .eco__copy{left:9.0909%;top:40.2667%}
.eco__item--lbc .eco__cta{margin-left:min(4px,0.2083vw)}
/* ① 不钉屏（窄屏 / 减弱动效）：三张卡纵向排开，卡内仍沿用设计稿的绝对定位比例
   —— 卡宽 85.9375vw、高 39.0625vw 恒为 2.2:1，卡内元素全是 %，等比缩小即可，不用另写一套坐标 */
@media (max-width:1279px), (prefers-reduced-motion: reduce){
  .eco--brand .eco__stage{position:static;height:auto;overflow:visible;padding:24px 0}
  .eco--brand .eco__item{
    position:relative;left:auto;top:auto;width:100%;height:auto;min-height:0;opacity:1;
    display:flex;justify-content:center;padding:0 16px;margin:0 0 24px;
  }
  .eco--brand .eco__item:last-child{margin-bottom:0}
  /* 不钉屏时三张卡各自纵向排开，底板退回每张卡自己身上（stage 不再居中定位） */
  .eco--brand .eco__stage::before{content:none}
  .eco--brand .eco__card{background:#F4F4F4}
  /* 不钉屏时没有翻页，三张卡同时全可见（JS 也会摘掉 .is-slide，禁用隐藏/动画） */
  /* ★ scene 必须退回流内：桌面它是 absolute;inset:0（钉屏铺满 stage），
     不改定位的话 scene 相对塌高的 item 绝对定位，整卡向上溢出 stage、
     盖住上面的数据看板（2026-11-10 阿凯截图「彩条穿过数字」的事故根因） */
  .eco--brand .eco__scene{position:static;width:100%;opacity:1;transform:none;display:flex;flex-direction:column;align-items:center}
}

/* ② 手机 / 平板（≤1023，与站内其它断点一致）：卡内也改为纵向堆叠
   —— 按比例缩放的绝对定位在 800px 以下标题只剩 20px、CTA 39px 高，不可读，
      所以这一档把文字与图片退回流式，图片满血底边铺满卡底 */
@media (max-width:1023px){
  .eco--brand .eco__card{
    width:100%;height:auto;opacity:1;border-radius:20px;
    display:flex;flex-direction:column;align-items:flex-start;
    padding:28px 24px 0;
  }
  /* 可动层退回流内：卡内元素继续按原来的纵向堆叠排（这里不能再绝对定位，否则卡高塌成 padding） */
  .eco--brand .eco__scene{
    position:static;width:100%;opacity:1;transform:none;
    display:flex;flex-direction:column;align-items:flex-start;
  }
  .eco--brand .eco__bg,
  .eco__item--lbc .eco__bg{left:0;top:0;width:100%;height:100%;transform:none}
  .eco--brand .eco__logo{position:static;width:auto;height:34px;margin:0 auto}
  /* 移动端品牌卡文字全部居中（阿凯 2026-11-10 指定）：
     logo、标题、口号、CTA 按钮水平居中 + 文本居中 */
  .eco--brand .eco__copy{position:static;left:auto;top:auto;transform:none;width:100%;max-width:none;margin:18px 0 0;display:flex;flex-direction:column;align-items:center;text-align:center}
  .eco--brand .eco__title{margin:0;font-size:clamp(22px,5.6vw,32px);line-height:1.35;text-align:center}
  .eco--brand .eco__name{margin:10px 0 0;letter-spacing:0;font-size:clamp(15px,4.2vw,20px);line-height:1.4;text-align:center}
  .eco--brand .eco__cta,
  .eco__item--lbc .eco__cta{
    width:auto;height:52px;margin-top:18px;margin-left:0;padding:0 22px;gap:8px;
    font-size:clamp(16px,4.2vw,18px);
  }
  .eco--brand .eco__cta-arrow{width:20px;height:20px}
  .eco--brand .eco__pic{
    position:static;width:calc(100% + 48px);max-width:none;height:auto;
    margin:24px -24px 0;object-fit:contain;
  }
}

/* ============================================================
   05 以文化人 以人强企（设计稿 11:01599 · 1920×1878 白底 · 三张 1650×480 堆叠卡）
   原实现是腾讯 section-parallax（整屏钉住 + 背景 548×460 放大 + 三屏文案推出），
   现按设计稿改回静态堆叠卡：标题 60/72 居中距顶 113，卡顶 263/778/1293（间距 35）。
   卡宽 min(1650px,85.9375vw)、高 min(480px,25vw) —— 两个 min 同在 1920 触发，
   所以卡内一律用 % 定位即可与设计稿坐标一一对应，任何宽度下比例都不跑。
   三张照片的裁切各不相同，用 object-fit:cover 的框来复刻（不是简单 inset:0）。
   ============================================================ */
.ab-cul{position:relative;background:#fff;padding:min(113px,5.8854vw) 0 min(105px,5.4688vw)}
.ab-cul__title{
  margin:0;text-align:center;
  /* 稿中标题色写的是 var(--ant-color-icon-hover)（antd token ≈ rgba(0,0,0,.88)），
     与站内其它 60/72 段标题（--ink-88 + --ff-title）一致，不是品牌蓝 */
  color:var(--ink-88);
  font-family:var(--ff-title);font-weight:400;
  font-size:min(60px,3.125vw);line-height:min(72px,3.75vw);
}
.ab-cul__list{
  display:flex;flex-direction:column;gap:min(35px,1.8229vw);
  margin-top:min(78px,4.0625vw);
}
.ab-cul-card{
  position:relative;margin:0 auto;overflow:hidden;background:#0B2E5C;
  width:min(1650px,85.9375vw);height:min(480px,25vw);
  border-radius:min(30px,1.5625vw);
}
/* ⚠ 必须显式宽高与 left/top：img 是替换元素，只给四边定位会退回固有尺寸 */
.ab-cul-card__bg{position:absolute;display:block;object-fit:cover;max-width:none}
.ab-cul-card--hq      .ab-cul-card__bg{left:0;top:-56.25%;width:100%;height:156.25%}       /* 1650×750 @(0,-270) */
.ab-cul-card--hands   .ab-cul-card__bg{left:-4.9697%;top:-5.8333%;width:109.9394%;height:133.125%}  /* 1814×639 @(-82,-28) */
.ab-cul-card--meeting .ab-cul-card__bg{left:-0.9697%;top:-25.4167%;width:101.8182%;height:131.0417%} /* 1680×629 @(-16,-122) */
.ab-cul-card__label{
  position:absolute;left:3.6364%;top:64.5833%;margin:0;
  color:#fff;font-weight:500;
  font-size:min(30px,1.5625vw);line-height:min(36px,1.875vw);
  display:inline-block;
  background:#0A5CFF;
  padding:min(10px,0.5208vw) min(24px,1.25vw);
  border-radius:min(12px,0.625vw);
  box-shadow:0 min(8px,0.4167vw) min(20px,1.0417vw) rgba(10,92,255,.35);
}
.ab-cul-card__title{
  position:absolute;left:3.6364%;top:79.5833%;margin:0;
  color:#fff;font-weight:700;
  font-size:min(56px,2.9167vw);line-height:min(68px,3.5417vw);
}
/* 平板及以下：卡的比例在窄屏会把 56px 标题压到 20px 以下，
   改为更高的裁切（1650:720）并把两行文字锚到卡底，字号回到可读区间 */
@media (max-width:1023px){
  .ab-cul{padding:56px 0 64px}
  .ab-cul__title{font-size:clamp(24px,5.8vw,40px);line-height:1.25;padding:0 16px}
  .ab-cul__list{margin-top:28px;gap:14px;padding:0 16px}
  .ab-cul-card{width:100%;height:auto;aspect-ratio:1650/720;border-radius:16px}
  .ab-cul-card__bg{left:0;top:0;width:100%;height:100%}
  .ab-cul-card__label{
    left:20px;top:auto;bottom:min(64px,15vw);
    font-size:15px;line-height:1.4;
    display:inline-block;
    background:#0A5CFF;
    padding:6px 14px;
    border-radius:8px;
    box-shadow:0 4px 12px rgba(10,92,255,.35);
  }
  .ab-cul-card__title{
    left:20px;right:20px;top:auto;bottom:min(22px,5vw);
    font-size:clamp(20px,5.2vw,28px);line-height:1.3;
  }
}
/* ============================================================
   集团资讯列表 · 竖版资讯卡（2026-10-27 第四轮）
   参照网易智企资讯中心（zhiqi.163.com/cms/）的**信息架构**，不是皮肤：
     · 封面置顶 2:1 → 分类 | 日期 → 标题两行截断 → 「阅读全文 ›」文字链
     · 类别与时间提到标题之上：卡片自身就能读出归属，不用靠顶部筛选态去推断
     · 主色仍用驰骋蓝，不跟参考站的网易红
     · 不抄它的顶部 hero 与整行文字 tab：本站已有「子导航 + 分类药丸」两层，再叠会三重
   栅格换算：参考站 1200 ÷ 3 = 380px/卡；本站壳宽 1660 ÷ 4 = 392px/卡 —— 等卡宽多一列，
   不是把 380 像素照搬（照搬会只剩 3 列、卡宽 533，变成「专题卡」而不是资讯流）。
   老横排卡规则在 1681~1702 与 1788~1821，这里靠 .nw--cards 双类选择器整体覆盖（不用改老代码）。
   ============================================================ */
.nw--cards .nw-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 30px;margin-top:44px}
.nw--cards .nw-det-related .nw-grid{grid-template-columns:repeat(3,minmax(0,1fr))}

.nw--cards .nw-card{
  display:flex;flex-direction:column;padding:0;
  background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;
  transition:border-color .25s,box-shadow .25s,transform .25s;
}
.nw--cards .nw-card:hover{
  border-color:rgba(0,103,255,.38);
  box-shadow:0 14px 34px rgba(10,30,80,.10);transform:translateY(-4px);
}
.nw--cards .nw-card__link{display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit;width:100%}
.nw--cards .nw-card__pic{
  position:relative;flex:none;width:100%;height:auto;align-self:auto;aspect-ratio:2/1;
  border-radius:0;background:#E7EDF7;overflow:hidden;margin:0;
}
.nw--cards .nw-card__pic img{transition:transform .55s cubic-bezier(.2,.6,.3,1)}
.nw--cards .nw-card:hover .nw-card__pic img{transform:scale(1.045)}
.nw--cards .nw-card__info{flex:1;min-width:0;display:flex;flex-direction:column;padding:20px 22px 22px}

.nw--cards .nw-card__meta{
  margin:0 0 12px;padding:0;display:flex;align-items:center;justify-content:flex-start;gap:8px;
  font-size:13.5px;line-height:20px;color:var(--ink-3);
}
.nw--cards .nw-card__cat{color:var(--brand);font-weight:500;letter-spacing:.2px}
.nw--cards .nw-card__sep{color:#C9D0DE}
.nw--cards .nw-card__date{font-size:13.5px;color:var(--ink-3);font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}

.nw--cards .nw-card__title{
  margin:0;font-size:19px;font-weight:600;line-height:1.55;color:#0A1220;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  min-height:calc(2 * 1.55em);
}
.nw--cards .nw-card__read{
  display:inline-flex;align-items:center;gap:6px;margin-top:18px;
  font-size:14px;font-weight:500;color:var(--brand);
}
.nw--cards .nw-card__read i{
  width:6px;height:6px;flex:none;border-top:1.5px solid currentColor;border-right:1.5px solid currentColor;
  transform:rotate(45deg);transition:transform .25s;
}
.nw--cards .nw-card:hover .nw-card__read i{transform:rotate(45deg) translate(2px,-2px)}

/* 视频卡的播放徽标：改到封面区域内居中（竖版卡不能按整卡居中，否则压到文字） */
.nw--cards .nw-card__play{
  left:0;top:0;width:100%;height:auto;aspect-ratio:2/1;transform:none;
  display:flex;align-items:center;justify-content:center;
}

/* 分页器：跟着参考站换成小方块页码（原来是胶囊，与筛选药丸撞形） */
.nw--cards .nw-foot--pager{margin:56px auto 0}
.nw--cards .nw-pager{gap:8px}
.nw--cards .nw-page{
  min-width:38px;height:38px;padding:0 13px;border-radius:9px;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:13.5px;font-weight:500;letter-spacing:0;
  color:var(--ink-2);background:#F4F6FA;border:1px solid transparent;
  cursor:pointer;transition:background .18s,border-color .18s,color .18s;
}
.nw--cards .nw-page:hover:not(:disabled):not(.is-cur){background:#fff;border-color:var(--brand);color:var(--brand)}
.nw--cards .nw-page.is-cur{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 4px 12px rgba(0,103,255,.28);cursor:default}
.nw--cards .nw-page__info{margin-left:14px;font-size:13px}

@media (max-width:1599px){
  .nw--cards .nw-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 24px}
  .nw--cards .nw-card__title{font-size:18px}
}
@media (max-width:1279px){
  .nw--cards .nw-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 20px;margin-top:36px}
  .nw--cards .nw-card{padding:0}
  .nw--cards .nw-card__pic{width:100%;height:auto;aspect-ratio:2/1}
  .nw--cards .nw-card__info{padding:18px 20px 20px}
  .nw--cards .nw-card__title{font-size:17.5px}
}
@media (max-width:767px){
  .nw--cards .nw-grid{grid-template-columns:1fr;gap:16px;margin-top:28px}
  .nw--cards .nw-card{border-radius:16px;padding:0}
  .nw--cards .nw-card__pic{width:100%;height:auto;aspect-ratio:2/1;border-radius:0;margin:0}
  .nw--cards .nw-card__info{padding:16px 16px 18px}
  .nw--cards .nw-card__meta{font-size:12.5px;margin-bottom:10px}
  .nw--cards .nw-card__date{font-size:12.5px}
  .nw--cards .nw-card__title{font-size:16.5px;line-height:1.5;min-height:calc(2 * 1.5em)}
  .nw--cards .nw-card__read{font-size:13px;margin-top:14px}
  .nw--cards .nw-foot--pager{margin-top:36px}
  .nw--cards .nw-page{min-width:34px;height:34px;padding:0 10px;font-size:13px}
}

/* 置顶标记：数据库 is_top 字段此前前台完全没体现（后台能勾、前端看不见）。
   放在分类之前，用中性墨色实心小标签，不引入新的色相、也不与品牌蓝的分类文字打架。 */
.nw--cards .nw-card__top{
  flex:none;display:inline-flex;align-items:center;height:18px;padding:0 6px;
  border-radius:4px;background:#0A1220;color:#fff;
  font-size:11px;font-weight:600;line-height:1;letter-spacing:.5px;
}
.nw--cards .nw-empty{grid-column:1/-1;padding:64px 0;text-align:center;color:var(--ink-3);font-size:15px;letter-spacing:1px}

/* 资讯页：子导航与头条卡之间原本是 0 间距（.nw__shell 的顶边正好压在 .jnav 的下边线上），
   卡片看着像"贴边"。按站内既定节奏补留白 —— 子导航后首个模块的 padding-top 统一取
   min(88px,4.583vw)（对照 .jn-reason 2171 行），1279/767 两档沿用站内 56 / 40。 */
.nw__shell{margin-top:min(88px,4.583vw)}
@media (max-width:1279px){ .nw__shell{margin-top:56px} }
@media (max-width:767px){ .nw__shell{margin-top:40px} }
/* ============================================================
   集团资讯 · 详情页改版（2026-10-27 第五轮，参照网易智企资讯详情 zhiqi.163.com/cms/EguHOXBo.html）
   抄的是版式与信息层级：
     · 首屏浅蓝带拉满视口：面包屑 → 分类药丸 → 左对齐大标题 → 发布时间/来源/作者（`|` 分隔）
     · 正文回到左对齐阅读列（原来整块居中，长文读起来左右跳）
     · 文末：标签行（带上分隔线）→ 上一篇 / 下一篇（左右各一，箭头朝外）
   不抄：右侧 320px 营销侧栏（放的是售前咨询卡与白皮书下载，集团官网无对应内容）→ 正文列居中，
        因为本站详情页没有侧栏，硬把 820 靠左会剩一大片空。
   主色仍走驰骋蓝，不跟参考站的网易红。
   老版式在 1725~1786（.nw-det 居中版），这里用 .nw--cards 双类选择器整体覆盖。
   ============================================================ */
.nw--cards .nw-det{
  position:relative;z-index:0;                 /* 建独立层叠上下文，首屏带的 z-index:-1 才不会被 .nw 白底盖掉 */
  max-width:min(860px,calc(100% - 48px));margin:0 auto;padding:0;
}

/* —— 首屏带 —— */
.nw--cards .nw-det__hero{position:relative;padding:56px 0 64px}
.nw--cards .nw-det__hero::before{
  content:"";position:absolute;z-index:-1;left:50%;transform:translateX(-50%);
  top:0;bottom:0;width:100vw;pointer-events:none;
  background:
    radial-gradient(circle at 78% 36%,rgba(0,86,255,.10),rgba(0,86,255,0) 30%),
    linear-gradient(#F5F8FF 0%,#EDF3FC 100%);
}
.nw--cards .nw-det__crumb{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:0 0 24px;
  font-size:14px;line-height:22px;color:#8B95A8}
.nw--cards .nw-det__crumb a{color:#8B95A8;text-decoration:none;transition:color .2s}
.nw--cards .nw-det__crumb a:hover{color:var(--brand)}
.nw--cards .nw-det__crumbsep{color:#C3C8D4}
.nw--cards .nw-det__crumb .is-cur{color:var(--ink-2)}
.nw--cards .nw-det__cat{display:inline-flex;align-items:center;height:30px;padding:0 14px;margin:0 0 22px;
  border-radius:999px;font-size:14px;font-weight:500;color:var(--brand);background:rgba(0,103,255,.08)}
.nw--cards .nw-det__title{
  margin:0;font-family:var(--ff-title);font-weight:400;
  font-size:min(40px,2.083vw);line-height:1.34;color:var(--brand-deep);
}
.nw--cards .nw-det__meta{display:flex;justify-content:flex-start;align-items:center;flex-wrap:wrap;gap:12px;margin:22px 0 0;
  font-size:15px;line-height:24px;color:#8B95A8}
.nw--cards .nw-det__meta time{font-variant-numeric:tabular-nums}
.nw--cards .nw-det__metasep{color:#C3C8D4;font-style:normal}

/* —— 正文列 —— */
.nw--cards .nw-det__main{padding-top:56px}
.nw--cards .nw-det__pic{width:100%;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#E7EDF7;margin:0 0 40px}
.nw--cards .nw-det__body{max-width:100%;margin:0;font-size:17px;line-height:1.95;color:var(--ink-2);
  text-align:justify;text-justify:inter-ideograph}
.nw--cards .nw-det__body p{margin:0 0 1.15em}
.nw--cards .nw-det__body img{border-radius:12px}

/* —— 文末：标签行带上分隔线 —— */
.nw--cards .nw-det__tags{display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-start;
  gap:10px;max-width:none;margin:48px 0 0;padding-top:24px;border-top:1px solid #E6E9F0}
.nw--cards .nw-det__taglabel{font-size:14px;color:var(--ink-3)}
.nw--cards .nw-det__tag{padding:5px 14px;font-size:13px;color:var(--ink-2);
  background:#F4F6FA;border:1px solid transparent;border-radius:999px}

/* —— 文末：上一篇 / 下一篇 —— */
.nw--cards .nw-det__pager{display:flex;align-items:flex-start;justify-content:space-between;gap:40px;
  margin:40px 0 0;padding:24px 0 0;border-top:1px solid #E6E9F0}
.nw--cards .nw-det__tags + .nw-det__pager{margin-top:0;padding-top:28px;border-top:0}
.nw--cards .nw-det__pager:empty{display:none}
.nw--cards .nw-det__plink{display:flex;align-items:flex-start;gap:10px;max-width:47%;
  font-size:14.5px;line-height:1.55;color:var(--ink-2);text-decoration:none;transition:color .2s}
.nw--cards .nw-det__plink span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nw--cards .nw-det__plink:hover{color:var(--brand)}
.nw--cards .nw-det__plink i{flex:none;width:7px;height:7px;margin-top:9px;
  border-top:1.5px solid currentColor;border-right:1.5px solid currentColor}
.nw--cards .nw-det__plink--prev i{transform:rotate(-135deg)}
.nw--cards .nw-det__plink--next{margin-left:auto;text-align:right}
.nw--cards .nw-det__plink--next i{order:2;transform:rotate(45deg)}
.nw--cards .nw-det__plink--next span{order:1}

/* 详情缺失态（保持原来的居中提示，只是别被上面的 max-width 规则带歪） */
.nw--cards .nw-det--miss{padding:80px 0 60px}

@media (max-width:1279px){
  .nw--cards .nw-det__hero{padding:44px 0 48px}
  .nw--cards .nw-det__title{font-size:min(40px,3.4vw)}
  .nw--cards .nw-det__main{padding-top:44px}
  .nw--cards .nw-det__body{font-size:16.5px;line-height:1.9}
  .nw--cards .nw-det__pic{margin-bottom:32px}
}
@media (max-width:767px){
  .nw--cards .nw-det{max-width:calc(100% - 40px)}
  .nw--cards .nw-det__hero{padding:32px 0 36px}
  .nw--cards .nw-det__crumb{gap:8px;margin-bottom:18px;font-size:12.5px;line-height:20px}
  .nw--cards .nw-det__cat{height:26px;padding:0 12px;margin-bottom:16px;font-size:12.5px}
  .nw--cards .nw-det__title{font-size:25px;line-height:1.36}
  .nw--cards .nw-det__meta{gap:8px;margin-top:16px;font-size:13px;line-height:20px}
  .nw--cards .nw-det__main{padding-top:30px}
  .nw--cards .nw-det__pic{border-radius:14px;margin-bottom:26px}
  .nw--cards .nw-det__body{font-size:15.5px;line-height:1.9}
  .nw--cards .nw-det__tags{margin-top:34px;padding-top:18px;gap:8px}
  .nw--cards .nw-det__tag{padding:4px 11px;font-size:12px}
  .nw--cards .nw-det__pager{flex-direction:column;align-items:stretch;gap:14px;margin-top:30px;padding-top:18px}
  .nw--cards .nw-det__tags + .nw-det__pager{padding-top:22px}
  .nw--cards .nw-det__plink{max-width:100%}
  .nw--cards .nw-det__plink--next{margin-left:0;text-align:left}
}

/* 正文标题回到品牌深蓝（1681~1821 的老规则被 3901 区的 CMS 增强块用 1 类+元素的写法定死成 #000，
   这里用双类选择器拉回来；h2 用 --ff-title 时 400 已经够重，700 会糊成一团） */
.nw--cards .nw-det__body h2{color:var(--brand-deep);font-weight:400}
.nw--cards .nw-det__body h3,
.nw--cards .nw-det__body h4{color:var(--brand-deep)}

/* 满视口首屏带用 width:100vw 的隐患：Windows/Linux 的非覆盖式滚动条也计入 100vw，
   页面会多出约 15px 横向滚动。这里在资讯页 section 上裁掉横向溢出（clip 不建滚动容器、
   也不给 fixed 后代造包含块，.jnav--fixed 的钉住不受影响）。 */
.nw--cards{overflow-x:clip}

/* 标题字号按列宽走：列宽在 ≥1280 被锁死 860，纯 vw 换算会在 1280 掉到 27px，偏小 */
.nw--cards .nw-det__title{font-size:clamp(28px,2.6vw,40px)}
/* ≤1279 的标题字号已由上面的 clamp 自动接管，无需再写一条同值规则 */

/* 手机端标题收一档（clamp 的下限 28px 是按 738px 列宽定的，302px 列宽下偏大） */
@media (max-width:767px){ .nw--cards .nw-det__title{font-size:24px;line-height:1.38} }

/* 手机端时间行会折成两行，"|" 分隔符会孤零零掉在行尾 —— 改成竖排、直接不要分隔符 */
@media (max-width:767px){
  .nw--cards .nw-det__meta{flex-direction:column;align-items:flex-start;gap:6px;margin-top:14px}
  .nw--cards .nw-det__metasep{display:none}
}

/* ============================================================
   招募方向卡片可点击态 + 意向合作弹层（partner.html）
   ============================================================ */
.pr-card{cursor:pointer;transition:transform .3s ease, box-shadow .3s ease}
.pr-card:hover,.pr-card:focus-visible{transform:translateY(-4px);box-shadow:0 18px 44px rgba(0,40,120,.16);outline:none}
.pr-card__cta{
  display:inline-flex;align-items:center;gap:6px;margin-top:16px;
  padding:9px 18px;border-radius:40px;background:var(--brand);color:#fff;
  font-size:14px;font-weight:600;line-height:1;
}
.pr-card__cta .arw{transition:transform .3s ease}
.pr-card:hover .pr-card__cta .arw{transform:translateX(4px)}

.pr-lock{overflow:hidden}
.pr-modal{position:fixed;inset:0;z-index:1000;display:none}
.pr-modal.is-open{display:block}
.pr-modal__mask{position:absolute;inset:0;background:rgba(10,20,40,.55);backdrop-filter:blur(3px)}
.pr-modal__dlg{
  position:relative;z-index:1;
  width:min(720px,calc(100% - 32px));max-height:90vh;overflow:hidden;
  margin:5vh auto;padding:40px 40px 28px;
  display:flex;flex-direction:column;
  background:#fff;border-radius:16px;box-shadow:0 30px 80px rgba(0,20,60,.28);
  animation:prModalIn .28s ease;
}
@keyframes prModalIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.pr-modal__x{
  position:absolute;top:16px;right:16px;width:36px;height:36px;padding:0;border:none;border-radius:50%;
  background:#F2F4F7;color:#555;font-size:22px;line-height:1;cursor:pointer;transition:background .2s;
  display:flex;align-items:center;justify-content:center;
}
.pr-modal__x:hover{background:#E6EAF0}
.pr-modal__ttl{margin:0;font-size:26px;font-weight:700;color:#111;flex-shrink:0;padding-right:40px}
.pr-modal__sub{margin:8px 0 22px;color:#757575;font-size:14px;flex-shrink:0}
.pr-modal__form{flex:1 1 auto;min-height:0;overflow-y:auto;padding-bottom:8px}
.pr-modal__foot{flex-shrink:0;display:flex;align-items:center;gap:var(--sp-xs);flex-wrap:wrap;padding-top:16px;border-top:1px solid #EEF1F5}
.pr-modal__foot .form__note{flex:1 1 100%}
@media (max-width:639px){
  .pr-modal__dlg{padding:28px 20px 24px;margin:8vh auto}
  .pr-modal__ttl{font-size:22px}
}

/* ============ 首页 02 数据看板 · 对齐设计稿 board（标题「驰骋股份」+ 简介 + 标签在上数字在下 + 图标/数字精校） ============ */
.board .board__row{
  display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;
  width:min(1250px,100%);margin-left:auto;margin-right:auto;
  row-gap:56px;column-gap:0;
}
.board .board__item{flex:0 0 auto;text-align:center}
.board .board__icon img{height:76px}
.board .board__icon img.is-custom{height:76px}
.board .board__label{
  margin-top:12px;
  font-size:20px;font-weight:500;line-height:24px;letter-spacing:0;
  color:rgba(0,0,0,.88);
}
.board .board__num{
  margin-top:24px;
  display:flex;align-items:flex-start;justify-content:center;gap:2px;
  font-family:var(--ff-num);font-size:80px;font-weight:700;line-height:75px;letter-spacing:0;
  color:#0A5CFF;
}
.board .board__num i{font-style:normal;font-family:var(--ff-body);font-size:40px;font-weight:800;line-height:30px;margin-top:0;color:#0A5CFF}

@media (max-width:1279px){
  .board .board__row{width:100%;column-gap:24px}
  .board .board__icon img,
  .board .board__icon img.is-custom{height:60px}
  .board .board__label{margin-top:10px;font-size:17px;line-height:22px}
  .board .board__num{margin-top:18px;font-size:56px;line-height:54px}
  .board .board__num i{font-size:30px;line-height:24px}
}
@media (max-width:767px){
  .board .board__row{justify-content:space-between;column-gap:16px;row-gap:44px;margin-top:64px}
  .board .board__item{flex:0 0 46%}
  .board .board__icon img,
  .board .board__icon img.is-custom{height:44px}
  .board .board__label{margin-top:8px;font-size:15px;line-height:20px}
  .board .board__num{margin-top:12px;font-size:40px;line-height:38px}
  .board .board__num i{font-size:22px;line-height:18px}
}

/* ============ 首页 02 数据看板 · 标题区补齐（设计稿 1:034 · 2026-10-28 第二轮） ============
   第一轮只对调了数据项顺序，标题区还是老的 slogan，跟稿子不是一回事。这轮补：
   标题「驰骋股份」70/75 w700 ls4.9 #57585A（不是纯黑，是深灰）；
   标题下两行公司简介 20/30 ls1 #5A5A5A，居中，断行点按稿子固定在第一行「二十九年，」后；
   整屏竖向节奏对齐设计稿 782：上留白 95 → 标题 75 → 33 → 简介 60 → 96 → 数据 212 → 95 → 来源 17 → 下留白 100。
   来源行按稿子 14/17 #999，并把第二个星号补上（稿子里「；*驰骋智慧数据中心」，若为笔误删一个字符即可）。 */
.board{padding-top:95px;padding-bottom:100px}
.board .board__title{
  font-family:var(--ff-tight);
  font-size:70px;font-weight:700;line-height:75px;letter-spacing:4.9px;
  color:#57585A;
}
.board .board__intro{
  margin:33px 0 0;
  font-family:var(--ff-tight);
  font-size:20px;line-height:30px;letter-spacing:1px;font-weight:400;
  color:#5A5A5A;text-align:center;
}
.board .board__row{margin-top:96px}
.board .board__source{
  margin-top:95px;text-align:center;
  font-size:14px;line-height:17px;letter-spacing:0;
  color:#999999;
}

@media (max-width:1279px){
  .board{padding-top:76px;padding-bottom:76px}
  .board .board__title{font-size:44px;line-height:1.2;letter-spacing:3px}
  .board .board__intro{margin-top:20px;font-size:16px;line-height:26px;letter-spacing:.5px}
  .board .board__row{margin-top:72px}
  .board .board__source{margin-top:64px;font-size:13px;line-height:18px}
}
@media (max-width:767px){
  .board{padding-top:52px;padding-bottom:56px}
  .board .board__title{font-size:30px;line-height:1.25;letter-spacing:2px}
  .board .board__intro{margin-top:14px;font-size:14px;line-height:24px;letter-spacing:0}
  .board .board__intro br{display:none}
  .board .board__row{margin-top:52px}
  .board .board__source{margin-top:44px;font-size:12px;line-height:18px}
}

/* ============ 数据看板图标：颜色与尺寸（设计稿 1:034 实测校正 · 2026-10-28 第三轮） ============
   像素采样：设计稿图标最深处 135-140、均值 ~156（≈#9C9C9C 中灰），ink 高 62-73；
   我们原来 filter:brightness(.25) 把深色 PNG 压到最深处 38（近黑）、ink 76，偏黑偏大。
   改法：brightness(0) 先归一成纯黑，再 invert(60%) 抬到 rgb(153)=#999，与稿子同灰；
   高度 76→66（对齐设计稿 62-73 的 ink 区间），图标→标签 ink 间距补到 ~18。
   自定义上传图标（.is-custom）仍保持原色不加滤镜。 */
.board .board__icon img{height:66px;filter:brightness(0) invert(60%)}
.board .board__icon img.is-custom{height:66px;filter:none}
.board .board__label{margin-top:18px}

@media (max-width:1279px){
  .board .board__icon img,
  .board .board__icon img.is-custom{height:54px}
  .board .board__label{margin-top:14px}
}
@media (max-width:767px){
  .board .board__icon img,
  .board .board__icon img.is-custom{height:42px}
  .board .board__label{margin-top:10px}
}

/* ============ 数据看板：数字字面 + 图标尺寸终校（设计稿 1:034 · 2026-10-28 第四轮） ============
   裁切对比（左设计右实测）暴露的真差异：
   ① 数字字面 —— 稿子是 Impact（极窄笔画粗），我们沿用 D-DIN 宽了一圈；按稿子换 Impact。
      稿子「TOP6」宽 165 / 「6500+」宽 196 / 墨迹高 65 → 反推 Impact ≈ 90px（节点标注 80px 与像素不符，以像素为准）。
   ② 图标偏小 —— 四个 PNG 内部留白比例 0.68~0.97 不一，固定高度会让墨迹大小不匀；
      按平均比例 0.835 取 height:80，墨迹均值 ≈67，接近稿子 62~73 的区间。
   ③ 「+」偏高 —— 稿子里 + 与数字视觉居中，我们原来 flex-start 顶对齐；改 align-items:center。 */
.board .board__num{
  font-family:var(--ff-num);
  font-size:90px;line-height:75px;
  align-items:center;
}
.board .board__num i{font-size:34px;font-weight:800;line-height:1;margin-top:0}
.board .board__icon img{height:80px}
.board .board__icon img.is-custom{height:80px}
.board .board__label{margin-top:15px}

@media (max-width:1279px){
  .board .board__icon img,
  .board .board__icon img.is-custom{height:64px}
  .board .board__label{margin-top:12px}
  .board .board__num{font-size:64px;line-height:54px}
  .board .board__num i{font-size:24px}
}
@media (max-width:767px){
  .board .board__icon img,
  .board .board__icon img.is-custom{height:48px}
  .board .board__label{margin-top:9px}
  .board .board__num{font-size:46px;line-height:38px}
  .board .board__num i{font-size:18px}
}

/* 数字字号重标定（D-DIN 700，canvas measureText 校准，墨迹高与改动前 Impact 80px 一致）：
   ≥1280 数字89/后缀44/lh75 · 1024-1279 数字64/后缀32/lh54 · 768-1023 数字56/后缀28/lh46 · ≤767 数字47/后缀24/lh38 */
.board .board__num{font-size:89px;line-height:75px}
.board .board__num i{font-size:44px}
@media (max-width:1279px){
  .board .board__num{font-size:64px;line-height:54px}
  .board .board__num i{font-size:32px}
}
@media (max-width:1023px){
  .board .board__num{font-size:56px;line-height:46px}
  .board .board__num i{font-size:28px}
}
@media (max-width:767px){
  .board .board__num{font-size:47px;line-height:38px}
  .board .board__num i{font-size:24px}
}

/* 后缀 + 按设计稿回到 40px/800（实测 32px 时整组宽度比稿子窄 6-7px） */
.board .board__num i{font-size:40px;font-weight:800;line-height:1}
/* ============ 数据看板 · 5 项时按条数均分列宽（2026-11-02） ============
   背景：`.board__row--auto{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}`
   （第 531 行）写在 grid 语境下，但 `.board .board__row`（第 4946 行）后置把 display 改成了
   flex，特异性也更高 —— 该列宽规则自对齐设计稿那轮起从未生效。
   实际渲染靠 `flex:0 0 auto` 按内容宽度 + `space-between` 分布，4 项时会出现
   120/213/120/120 四种宽度混排；5 项时靠 `[data-count="5"]` 把数字一刀切缩到 64px 才勉强放下。

   这里只给 5 项补真正的均分列宽（3/4 项是设计稿已验收的 space-between 分布，不动）：
   1250÷5=250/项，实测 76px 数字不溢出，间隙从 146 提到 62~78，各项中心等距。
   移动端 ≤767 仍是 46% 两列，但 5 是奇数，且 `flex:0 0 46%` 的 min-width:auto 会被
   长标签顶宽（实测 375px 下有一项撑到 153px，两两凑不成行 → 排成 1/1/2/1 四行）。
   补 min-width:0 让它退回 46% 正常换行，5 项得到 2/2/1 三行。 */
@media (min-width:768px){
  .board .board__row[data-count="5"]{justify-content:center;column-gap:0}
  /* min-width:0 是结构性保证：5 项必须是 5 个 20%，内容再宽也不允许把 item 撑大。
     .count 的 min-width 是 JS 按「当时字号」量出来写死的，窗口 resize 后不会重算，
     不加这条就会出现「4 项时量到 148px，拖到 768 后 148+后缀 > 140.8 → 第 5 项掉行」。 */
  .board .board__row[data-count="5"] .board__item{flex:0 0 calc(100% / 5);min-width:0}
  .board .board__row[data-count="5"] .board__num{font-size:76px;line-height:66px}
  .board .board__row[data-count="5"] .board__num i{font-size:38px}
  .board .board__row[data-count="5"] .board__label{font-size:18px}
}
@media (min-width:768px) and (max-width:1279px){
  .board .board__row[data-count="5"] .board__num{font-size:56px;line-height:48px}
  .board .board__row[data-count="5"] .board__num i{font-size:28px}
  .board .board__row[data-count="5"] .board__label{font-size:16px}
}
@media (max-width:767px){
  .board .board__row[data-count="5"]{justify-content:space-between;column-gap:16px;row-gap:44px}
  .board .board__row[data-count="5"] .board__item{flex:0 0 46%;min-width:0}
}
@media (max-width:1279px){ .board .board__num i{font-size:28px} }
@media (max-width:767px){ .board .board__num i{font-size:20px} }

/* 「+」的笔画粗细：设计稿标注 Inter 800，但站内 Inter 只挂了 400/700 两档（实测 document.fonts 确认），
   800 会被降权成 700 → + 明显偏细。数字主体已是 Impact，+ 也改用 Impact 保持同一套笔画厚度。 */
.board .board__num i{font-family:Impact,var(--ff-body);font-weight:400;font-size:40px;line-height:1}
@media (max-width:1279px){ .board .board__num i{font-size:28px} }
@media (max-width:767px){ .board .board__num i{font-size:20px} }

/* 「+」后缀改用 D-DIN 700（与数字同一套字体），去掉描边（D-DIN 700 自带笔画，加描边会发虚）；
   字号与数字同步四档：44 / 32 / 28 / 24 */
.board .board__num i{
  font-family:var(--ff-num);font-weight:700;font-size:44px;line-height:1;
}
@media (max-width:1279px){ .board .board__num i{font-size:32px} }
@media (max-width:1023px){ .board .board__num i{font-size:28px} }
@media (max-width:767px){ .board .board__num i{font-size:24px} }

/* 「+」下移到数字基线：设计稿 + 的墨迹 y 548-569（底边距数字基线 571 仅 2px），
   我们垂直居中在 532-552，高了 16px。用相对定位下移，不动布局高度。 */
.board .board__num i{position:relative;top:-3px}
@media (max-width:1279px){ .board .board__num i{top:-2px} }
@media (max-width:1023px){ .board .board__num i{top:-2px} }
@media (max-width:767px){ .board .board__num i{top:-1.5px} }

/* 翻牌防抖：给 .count 预留终值宽度槽（min-width 由 JS 运行时按终值测量写入），
   数字在槽内居中；位数变化时容器宽度恒定，避免 space-between 下后续 item 被整体推开 */
.board .board__num .count{display:block;text-align:center}

/* 收口：数据项实测高 218（图标80+15+标签24+24+数字75），比设计稿 212 高 6，
   把来源行上间距 95→88，来源落回 665、整段落回 782（与设计稿 1:034 完全同高）。 */
.board .board__source{margin-top:88px}

/* 上面那 88 没带媒体查询，会盖掉移动端取值，这里按断点还原（桌面 88 仅 ≥1280） */
@media (max-width:1279px){ .board .board__source{margin-top:64px} }
@media (max-width:767px){ .board .board__source{margin-top:44px} }

/* ============ 萝卜白菜小程序码弹窗（点击「体验小程序」弹出） ============ */
.qr-lock{overflow:hidden}
.qr-modal{position:fixed;inset:0;z-index:210;background:rgba(10,30,60,.18);display:flex;align-items:center;justify-content:center;padding:24px}
.qr-modal[hidden]{display:none}
.qr-modal__box{position:relative;width:min(400px,100%);animation:qr-pop .28s ease}
.qr-modal__card{
  position:relative;background-image:url('/assets/img/eco-wash-lbc.png');background-size:cover;background-position:center;
  border-radius:24px;padding:38px 32px 34px;border:1px solid rgba(255,255,255,.65);
  box-shadow:0 24px 80px rgba(0,0,0,.45);display:flex;flex-direction:column;align-items:center;text-align:center;
}
.qr-modal__qr{width:250px;height:250px;display:block}
.qr-modal__tip{margin:22px 0 0;font-size:18px;font-weight:600;color:#1A1A1A}
.qr-modal__close{position:absolute;top:-14px;right:-14px;z-index:3;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.94);color:#333;font-size:24px;line-height:1;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.25);transition:background .2s,transform .2s}
.qr-modal__close:hover{background:#fff;transform:rotate(90deg)}
@keyframes qr-pop{from{opacity:0;transform:scale(.92) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}
/* 校园招聘投递：小程序码弹窗（QR + 说明横排，移动端竖排） */
.rc-hero__cta[id="openCampusQr"]{cursor:pointer;font-family:inherit}
.qr-modal__box--campus{width:min(560px,100%)}
.campus-qr{display:flex;align-items:center;gap:28px;background:#fff;border-radius:20px;padding:32px 30px;box-shadow:0 24px 80px rgba(0,0,0,.45)}
.campus-qr__img{width:180px;height:180px;flex-shrink:0;display:block;border-radius:8px}
.campus-qr__info{min-width:0}
.campus-qr__title{margin:0 0 14px;font-size:19px;font-weight:700;color:#1A1A1A;line-height:1.45}
.campus-qr__title .hl{color:#07C160}
.campus-qr__line{margin:8px 0 0;font-size:14px;color:#555;line-height:1.6}
@media (max-width:520px){
  .campus-qr{flex-direction:column;text-align:center;gap:20px;padding:28px 22px}
  .campus-qr__img{width:160px;height:160px}
  .campus-qr__title{font-size:17px}
}
/* ======================= 联系我们 · 按设计稿 139:7277 重做（2026-10-28） =======================
   设计稿 1920×879，浅蓝白渐变底 + 左信息 / 右 3D 客服插画。
   量化：内容左边界 185（等价容器 1550 居中）；标题 70/1 w700 #0B0B0B；
   三组联系方式起始 185 / 522 / 856（相对 0 / 337 / 671，用固定列宽 grid 还原）；
   标签 20/30 w300 #434343 ls1.2，数值 30/30 w700 #000 ls1.8；
   总部地址 20/30 w700，两行行距 30；二维码卡片 160×160 圆角 20，横向 185/385/585（间距 40），
   卡片 526-686，下方标签墨迹 702-718；右侧插画 653×653 @ (1105,134)。 */
.ct{
  position:relative;overflow:hidden;
  padding-top:150px;padding-bottom:153px;
  background:
    radial-gradient(92% 72% at 82% 48%, #E6F3FF 0%, rgba(230,243,255,0) 62%),
    radial-gradient(70% 60% at 6% 88%, #EDF7FF 0%, rgba(237,247,255,0) 65%),
    linear-gradient(180deg,#FFFFFF 0%,#F7FBFF 45%,#F1F9FF 100%);
}
.ct__inner{position:relative;width:min(1550px, calc(100% - 88px));margin:0 auto}

.ct__title{
  margin:0;
  font-family:var(--ff-tight);
  font-size:70px;line-height:1;font-weight:700;letter-spacing:0;
  color:#0B0B0B;
}

/* 三组联系方式：185 / 522 / 856 */
.ct__items{
  margin-top:52px;
  display:grid;grid-template-columns:337px 334px auto;justify-content:start;
}
.ct__k{
  display:block;
  font-family:var(--ff-tight);
  font-size:20px;line-height:30px;font-weight:300;letter-spacing:1.2px;
  color:#434343;
}
.ct__v{
  display:block;
  font-family:var(--ff-tight);
  font-size:30px;line-height:30px;font-weight:700;letter-spacing:1.8px;
  color:#000000;
}

/* 总部地址 */
.ct__addr{margin-top:45px}
.ct__addr .ct__v{
  font-size:20px;line-height:30px;font-weight:700;letter-spacing:1.2px;
}

/* 三个二维码 */
.ct__qr{margin:58px 0 0;padding:0;list-style:none;display:flex;gap:40px}
.ct__qr li{display:flex;flex-direction:column;align-items:center;width:160px}
.ct__qrbox{
  width:160px;height:160px;border-radius:20px;background:#FFFFFF;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(15,40,90,.06);
  overflow:hidden;
}
.ct__qrbox img{width:100%;height:100%;object-fit:contain;display:block}
.ct__qrcap{
  margin-top:11px;
  font-family:var(--ff-tight);
  font-size:20px;line-height:30px;font-weight:300;letter-spacing:1.2px;
  color:#666666;text-align:center;
}

/* 右侧插画 */
.ct__art{
  position:absolute;top:134px;
  right:max(0px, calc((100% - 1550px) / 2 - 23px));
  width:653px;height:653px;pointer-events:none;user-select:none;
}

@media (max-width:1550px){
  .ct__art{right:0;width:min(653px,46vw);height:auto}
}
@media (max-width:1279px){
  .ct{padding-top:110px;padding-bottom:96px}
  .ct__title{font-size:48px}
  .ct__items{margin-top:36px;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);gap:0 24px}
  .ct__v{font-size:24px;line-height:30px}
  .ct__addr{margin-top:30px}
  .ct__qr{margin-top:40px;gap:28px}
  .ct__qrbox{width:132px;height:132px;border-radius:16px}
  .ct__qr li{width:132px}
  .ct__qrcap{font-size:16px}
  .ct__art{width:min(420px,40vw);top:96px;opacity:.9}
}
@media (max-width:767px){
  .ct{padding-top:96px;padding-bottom:64px}
  .ct__title{font-size:34px}
  .ct__items{margin-top:24px;grid-template-columns:1fr;gap:18px 0}
  .ct__v{font-size:22px;line-height:28px;letter-spacing:1px}
  .ct__k{font-size:15px;line-height:24px;letter-spacing:.6px}
  .ct__addr{margin-top:22px}
  .ct__addr .ct__v{font-size:16px;line-height:26px;letter-spacing:.6px}
  .ct__qr{margin-top:28px;gap:16px}
  .ct__qrbox{width:96px;height:96px;border-radius:12px}
  .ct__qr li{width:96px}
  .ct__qrcap{font-size:13px;line-height:22px;margin-top:6px}
  .ct__art{position:relative;top:0;right:auto;width:min(320px,72vw);margin:28px auto 0;display:block}
}

/* 微调：整块文字比设计稿高 4px（标题 153 vs 158、标签 278 vs 281、二维码 533 vs 537）→ 整体下移 4；
   二维码标签设计稿未标字重（=400），我们原来跟 .ct__k 用了 300，笔画偏细、墨迹只有 7px 高（应 17）→ 改 400。 */
.ct{padding-top:154px;padding-bottom:154px}
.ct__qrcap{font-weight:400}

/* 二维码标签：实测墨迹 707 vs 设计稿 702，上间距 11 → 6 */
.ct__qrcap{margin-top:6px}

/* 二维码卡片：设计稿里卡片几乎看不见（底色本身接近白），我加的投影反而让它"浮"出来 → 去掉投影 */
.ct__qrbox{box-shadow:none}

/* 平板 768–1023：三列联系方式放不下（第三列会被右侧插画压住，实测 834 下
   「合作邮箱 / zjcchr@163.com」正好被插画盖掉）→ 改为单列堆叠，文字区右侧
   预留 330px 给插画，二维码缩到 120。限定 min-width:768 以免干扰手机端。 */
@media (min-width:768px) and (max-width:1023px){
  .ct__items{grid-template-columns:1fr;gap:16px 0;max-width:calc(100% - 330px)}
  .ct__addr{max-width:calc(100% - 330px)}
  .ct__qr{max-width:calc(100% - 330px);gap:20px}
  .ct__qrbox{width:120px;height:120px}
  .ct__qr li{width:120px}
  .ct__art{width:300px;top:56px}
}

/* 1024–1599：右侧插画贴视口右边，而文字仍在 1550 容器里 → 第三组「合作邮箱」
   会被插画盖住（实测 1440 下 zjcchr@163.com 只剩 zjcchr@163.co）。三列放不下，
   折成两列（邮箱落到第二行），插画按视口收窄到 42vw 让开文字。
   1600 以上仍按设计稿三列 + 653 插画，不受影响。 */
@media (min-width:1024px) and (max-width:1649px){
  .ct__items{grid-template-columns:337px 334px;row-gap:28px}
  .ct__art{width:min(653px,42vw)}
}

/* 1024–1279：字号降到 24 后第二组仍在插画墨迹边缘擦到 2px → 插画再收一点 */
@media (min-width:1024px) and (max-width:1279px){
  .ct__art{width:40vw}
}

/* ============================================================================
   三商版块 · 对齐设计稿 114:00881（1920×879）  2026-10-28
   ── 与旧版（62:6767）逐项差异，全部按稿子改：
      ① 新增 50px 大标题「立足社区 深化"三商"模式」；文案面板整体左移下移
         （面板 x 1059→961、店商首行 y 319→413、正文 y 390→480）
      ② 店商 50→40px；药丸 28px 自适应 → 20px/500、固定高 44、半圆 39、内边距 20
         （药丸实测 320×44，蓝底 #0067FF 不变）
      ③ 中心球 226→202（设计稿实测纵向 338~539）；三个角色球 140→124，
         并按稿子固定在轨道设计位（原「激活球转到与文案居中对齐」的旋转逻辑已撤）
      ④ 底色不是纯白：稿子左下 #EDF7FF、中部 #F6FCFF、右上纯白。
         源图 image-120-3540.png 未导出，用两层径向渐变近似
   ============================================================================ */
.ab-eco{background:
  radial-gradient(78% 62% at 26% 104%, #E9F6FF 0%, rgba(233,246,255,0) 68%),
  radial-gradient(64% 54% at 72% 96%, #F0FAFF 0%, rgba(240,250,255,0) 62%),
  #fff}
.ab-eco__h2{
  position:absolute;left:50%;top:32.65%;margin:0;
  font-family:var(--ff-title);font-size:min(50px,2.6042vw);font-weight:700;
  line-height:1.1;color:#000;letter-spacing:.02em;
}
.ab-eco__panel{left:50.05%;top:46.98%;width:28.4%}
.ab-eco__title{font-size:min(40px,2.0833vw);line-height:1.1}
.ab-eco__head{gap:min(16px,.8333vw)}
.ab-eco__tag{
  background:#0067FF;color:#fff;font-weight:500;line-height:1;
  font-size:min(20px,1.0417vw);
  height:min(44px,2.2917vw);padding:0 min(20px,1.0417vw);
  border-radius:min(39px,2.0313vw);
  display:inline-flex;align-items:center;white-space:nowrap;
  /* 稿子里药丸 406~450 与「店商」文字（行盒 413~443）垂直居中，
     即药丸顶边比标题行盒顶边高 7px */
  position:relative;top:max(-7px,-.3646vw);
}
.ab-eco__desc{margin-top:min(23px,1.1979vw);white-space:pre-line}
/* 整组轨道图（光环 533 / 轨道 905.55 / 中心球 226 / 角色球 140）在新稿里是
   整体缩到 0.89 并下移 11.5px —— 实测内环 323.5→291、中心球 226→202、
   角色球 140→124、球心半径 259→228.6，比例一致，故按同一系数重算各层几何，
   圆心由 (603,427) 移到 (605.5,438.5) */
.ab-eco__halo{left:19.18%;top:22.90%;width:24.71%}
.ab-eco__rings,.ab-eco__dots{left:10.55%;top:4.04%;width:41.97%}
.ab-eco__spin{transform-origin:31.54% 49.89%}
.ab-eco__core{left:26.28%;top:38.40%;width:10.52%}
/* 中心球缩小后，logo 画布同比放大，保证鸟的实际高度仍是设计稿的 128
   （画布宽 = 113.5×154/118.4 = 147.6 → 占中心球 202 的 73.1%） */
.ab-eco__bird{width:73.1%}
.ab-eco__ball{width:6.4583%}

@media (max-width:1023px){
  .ab-eco__h2{
    position:static;left:auto;top:auto;margin:0 0 18px;
    padding:0 32px;font-size:26px;line-height:1.25;
  }
  .ab-eco__panel{left:auto;top:auto;width:auto}
  .ab-eco__title{font-size:34px;line-height:1.1}
  .ab-eco__head{gap:min(24px,1.25vw)}
  .ab-eco__tag{
    font-size:18px;height:auto;padding:.42em .9em;border-radius:999px;
    display:inline-block;line-height:1;position:static;top:auto;
  }
  .ab-eco__desc{margin-top:14px}
  .ab-eco__core{left:auto;top:auto;width:min(76px,19.5vw)}
  .ab-eco__bird{width:68.6%}
  .ab-eco__desc{white-space:normal}
  .ab-eco__ball{width:min(68px,17.4vw)}
}

/* 375/390 档：26px 时「模式」会被拆成两行，降到 22px 正好一行放得下 */
@media (max-width:480px){
  .ab-eco__h2{font-size:22px;padding:0 24px}
}

/* ============================================================================
   三商版块 · 二改（阿凯 2026-10-28 反馈 4 条）
   ── ① 药丸与「店商」垂直对齐
         实测：药丸盒 406~449.5（中心 427.8，已与稿子一致），但「店商」字墨
         420.5~456.5（中心 438.5）—— 40px 中文字在 44px 行盒（line-height:1.1）
         里，字墨中心天然比行盒中心低 3.5px，flex 居中只能让"行盒"居中，
         所以字墨整块比药丸低 10.7px，看着就是没对齐。
         设计稿 114:00881 里字墨 409~445（中心 427）、药丸 406~449（中心 427.5），
         两者是对齐的。故按稿子：药丸抬 7（保持 406~449 不变），标题再单独抬
         11.5 → 字墨落到 409~445，与药丸中心对齐。
         用 max() 而不是 min()：负数缩放时取"更接近 0"的那个才不会在窄屏爆大。
      ② 正文去掉硬换行（原「布局，」后面是 <br>），交给浏览器按语义自然折行。
      ③ 文字入场：大标题 → 店商 → 药丸 → 正文，四层错峰；
         每层位移量（34/26/22/18px）、时长（.66/.74/.68/.80s）都不一样，
         叠起来才有"逐层落位"的层次，而不是整块一起动（section 上的 .fade-up 已撤掉）。
      ④ 背景层：设计稿另一个文件 205845929698054 / 图层 14:316 是整张 1920×879
         的位图，实际内容就是两个大号淡蓝椭圆光斑（右：强、偏右上；左：弱、
         从左下切入）。位图导不出来，改为对导出图按 R 通道反解 alpha
         （B 恒 255、dG/dR≈0.45，单色 #D1EAFF 合成白底），再用广义高斯
         amp·exp(-r^p) 联合拟合两个光斑，得下面的精确参数：
           右 amp 1.20 c(1663,358) σ(266,255) p1.286（峰值贴顶，故内圈是纯色台）
           左 amp 1.00 c(-341,619) σ(700,236) p1.043（圆心在画布左侧外，所以
              画布内最亮只有 .62，正好对上实测的左斑峰值 .65）
         渐变的 11 个色标就是按该公式逐点算出来的（每 10% 一档），
         全图重建误差 p95≈0.085、最大 0.14（换算到 R 通道 ≤6/255），肉眼无差。
   ============================================================================ */

/* ① 对齐 + 底色改回纯白（光斑另起背景层） */
.ab-eco{background:#fff}
.ab-eco__title{position:relative;top:max(-11.5px,-.599vw)}

/* ② 自然折行 */
.ab-eco__desc{white-space:normal}

/* ③ 文字入场：四个元素各自错峰 + 各自不同的位移量与时长
   注意触发点由 JS 定在「店商」这块文字上，不是整个 section —— section 高 879，
   标题在 287、正文在 413，若按 section 进视口就触发，动画会在文字还没进画面前
   就播完，看着就是"整体闪进来"。 */
.ab-eco__h2,
.ab-eco__title,
.ab-eco__tag,
.ab-eco__desc{
  opacity:0;
  transform:translate3d(0,var(--eco-rise,26px),0);
  transition:opacity var(--eco-dur,.72s) cubic-bezier(.22,.61,.36,1) var(--eco-delay,0s),
             transform var(--eco-dur,.72s) cubic-bezier(.22,.61,.36,1) var(--eco-delay,0s);
}
.ab-eco__h2   {--eco-rise:34px;--eco-dur:.66s;--eco-delay:0s}
.ab-eco__title{--eco-rise:26px;--eco-dur:.74s;--eco-delay:.10s}
.ab-eco__tag  {--eco-rise:22px;--eco-dur:.68s;--eco-delay:.20s}
.ab-eco__desc {--eco-rise:18px;--eco-dur:.80s;--eco-delay:.28s}
.ab-eco.is-in .ab-eco__h2,
.ab-eco.is-in .ab-eco__title,
.ab-eco.is-in .ab-eco__tag,
.ab-eco.is-in .ab-eco__desc{opacity:1;transform:none}

/* 切换角色（4.5s 轮播 / 点球）：文字先一起短促下落淡出（.18s），换完字再压缩错峰
   淡入（0/70/140ms）—— 替掉原来"整块面板 opacity→0 眨一下"的闪退感。
   轮播 4.5s 一轮，所以换的这套比首屏入场更紧凑，别让人一直看动画。 */
.ab-eco__panel.is-swapping .ab-eco__title,
.ab-eco__panel.is-swapping .ab-eco__tag,
.ab-eco__panel.is-swapping .ab-eco__desc{
  opacity:0;
  transform:translate3d(0,12px,0);
  transition-duration:.18s;
  transition-delay:0s;
}
.ab-eco__panel.is-returning .ab-eco__title{transition-delay:0s;transition-duration:.55s}
.ab-eco__panel.is-returning .ab-eco__tag{transition-delay:.07s;transition-duration:.52s}
.ab-eco__panel.is-returning .ab-eco__desc{transition-delay:.14s;transition-duration:.62s}

/* ④ 背景层：两个淡蓝光斑，各自随机漂浮 */
.ab-eco__bg{position:absolute;inset:0;pointer-events:none}
.ab-eco__blob{position:absolute;inset:0;will-change:transform}
.ab-eco__blob--r{
  background:radial-gradient(ellipse 41.59% 87.16% at 86.62% 40.72%,
    rgba(209,234,255,1) 0%, rgba(209,234,255,.970) 10%, rgba(209,234,255,.715) 20%,
    rgba(209,234,255,.501) 30%, rgba(209,234,255,.339) 40%, rgba(209,234,255,.223) 50%,
    rgba(209,234,255,.143) 60%, rgba(209,234,255,.089) 70%, rgba(209,234,255,.055) 80%,
    rgba(209,234,255,.033) 90%, rgba(209,234,255,.020) 100%);
}
.ab-eco__blob--l{
  background:radial-gradient(ellipse 109.37% 80.68% at -17.77% 70.42%,
    rgba(209,234,255,1) 0%, rgba(209,234,255,.752) 10%, rgba(209,234,255,.556) 20%,
    rgba(209,234,255,.408) 30%, rgba(209,234,255,.298) 40%, rgba(209,234,255,.217) 50%,
    rgba(209,234,255,.158) 60%, rgba(209,234,255,.114) 70%, rgba(209,234,255,.083) 80%,
    rgba(209,234,255,.060) 90%, rgba(209,234,255,.043) 100%);
}

/* 窄屏复位：不再按 vw 缩放。标题在窄屏固定 34px，字墨同样比行盒中心低 3
   （3.5×34/40≈3）→ 抬 3px，药丸与字墨仍是居中对齐 */
@media (max-width:1023px){
  .ab-eco__title{position:relative;top:-3px}
}

/* 减弱动效：文字直接显示，光斑不漂 */
@media (prefers-reduced-motion:reduce){
  .ab-eco__h2,.ab-eco__title,.ab-eco__tag,.ab-eco__desc,
  .ab-eco__panel.is-swapping .ab-eco__title,
  .ab-eco__panel.is-swapping .ab-eco__tag,
  .ab-eco__panel.is-swapping .ab-eco__desc{
    opacity:1;transform:none;transition:none;
  }
}

/* ============================================================================
   三商版块 · 二改补丁（阿凯 2026-10-28 21:08 两条：蓝色元素不缩放 / 盖住选项）
   ── 实测证据（375px 截图取样）：
        药丸底色 = rgb(112,172,255)，应该是 #0067FF = rgb(0,103,255)；
        正文最暗像素 = rgb(116,119,121)，应该是 #666。
      也就是「淡蓝光斑整层压在文字和药丸上面」，不是颜色配错。
      根因是层叠顺序：桌面的 .ab-eco__inner 是 absolute，压得住；但 ≤1023 的窄屏
      规则把它改成了 static，静态内容的绘制层级在"定位元素"之下，于是
      .ab-eco__bg（absolute）反而盖到了标题/正文/药丸上（三个球自己是 absolute，
      所以球没被盖 —— 这也解释了为什么只有字和药丸发灰发蓝）。
   ── 另一个问题：两个光斑是"百分比椭圆"，窄屏版块变成竖长条后，
      41.59%×87.16% 的椭圆被拉成一条贯穿上下的竖带（半径得按宽度算才不变形）。
   ============================================================================ */

/* ① 层叠：让背景层老老实实待在所有内容下面（isolation 让负 z-index 不会掉到
   section 自己的白底后面去） */
.ab-eco{isolation:isolate}
.ab-eco__bg{z-index:-1}

/* ② 窄屏：光斑改成按 vw 算的圆光，不再随版块变高被拉成竖带 */
@media (max-width:1023px){
  .ab-eco__blob--r{
    background:radial-gradient(64vw 64vw at 84% 26%,
      rgba(209,234,255,.80) 0%, rgba(209,234,255,.52) 22%, rgba(209,234,255,.27) 42%,
      rgba(209,234,255,.11) 64%, rgba(209,234,255,.03) 84%, rgba(209,234,255,0) 100%);
  }
  .ab-eco__blob--l{
    background:radial-gradient(52vw 52vw at 6% 80%,
      rgba(209,234,255,.58) 0%, rgba(209,234,255,.36) 22%, rgba(209,234,255,.17) 42%,
      rgba(209,234,255,.07) 64%, rgba(209,234,255,.02) 84%, rgba(209,234,255,0) 100%);
  }
}

/* ③ 小屏药丸：18px 在 375 上会顶满一整行（288/311），看着像按钮不像标签；
   降到 15px，比例跟桌面（20px 药丸 : 40px 标称）一致 */
@media (max-width:520px){
  .ab-eco__tag{font-size:15px;padding:.42em .82em;max-width:100%}
}

/* ============================================================================
   三商版块 · 卫星层主次（阿凯 2026-10-28 21:30：加强选中、弱化未选中）
   ── 之前只靠一层投影区分，三个球在淡蓝底上几乎看不出谁被选中。
      现在：选中 = 满色 + 轻微放大 + 双层投影（外投影 + 白描边把球从轨道环上托起来）；
            未选中 = 半透明 + 去饱和，视线自然落到选中那个。
      选中放大 1.06 是这次明确要的强调（此前 1.12 因"自创"被撤过，这次按需求保留小幅度）。
   ============================================================================ */
.ab-eco__ball{
  opacity:.6;
  filter:saturate(.68);
  transition:opacity .38s ease,filter .38s ease,
             transform .38s cubic-bezier(.22,.61,.36,1),box-shadow .38s ease;
}
.ab-eco__ball.is-active{
  opacity:1;
  filter:none;
  transform:scale(1.06);
  box-shadow:0 16px 40px rgba(11,46,92,.28),0 0 0 5px rgba(255,255,255,.72);
  z-index:2;
}
/* 未选中的球仍要让人看出可以点 → 悬停时回一点饱和度 */
@media (hover:hover){
  .ab-eco__ball:not(.is-active):hover{opacity:.86;filter:saturate(.92)}
}
@media (prefers-reduced-motion:reduce){
  .ab-eco__ball{transition:opacity .2s ease}
}

/* 选中球投影：换成"自身色的柔光"，不再是深藏青投影（深色投影在淡蓝底上看着像脏边） */
.ab-eco__ball--ds{--eco-glow:rgba(0,91,237,.30)}
.ab-eco__ball--ds2{--eco-glow:rgba(255,116,41,.32)}
.ab-eco__ball--fw{--eco-glow:rgba(54,177,249,.34)}
.ab-eco__ball.is-active{
  box-shadow:0 10px 20px -8px rgba(11,46,92,.10),
             0 22px 44px -12px var(--eco-glow,rgba(11,46,92,.18));
}
/* ===================================================================
   比例统一 v2 · 2026-10-29（阿凯：暂时先不动首屏）
   -------------------------------------------------------------------
   首屏（hero 高度）本轮不动。只做横向栅格与区块节奏：
     ① 全站内容左边界收敛到 135（1920 下内容宽 1650）
        —— 页头 167 / 正文 135 / 页脚 88 三套里，取占比最大的 135
     ② 三个自带一套宽度的地方归位：资讯 1660、招商加盟 1560、页脚 1744
     ③ 区块上下留白统一 120 / 96
     ④ 区块级标题统一 60 / 72
   =================================================================== */

:root{
  --shell-w:min(1650px,85.9375vw);        /* 内容宽：1920 → 1650 */
  --edge:clamp(24px,7.03125vw,135px);      /* 内容左右边距：1920 → 135 */
  --sec-pt:clamp(64px,6.25vw,120px);
  --sec-pb:clamp(56px,5vw,96px);
  /* 全站唯一的内容边距：原来 88，导致正文 1744、页头 1650、页脚 1744 三套并存 */
  --gutter:var(--edge);
}

/* ---------- ① 三处自带宽度的地方归位 ---------- */

/* 集团资讯：写死 1660（左右 130），与全站差 5 */
.nw__shell{width:var(--shell-w)}

/* 招商加盟：1560 + 88 gutter，左右各 180；品牌区更是 1802 */
body .jf-wrap{max-width:var(--shell-w);padding-left:0;padding-right:0}
body .jf-wrap--wide{max-width:var(--shell-w)}

/* 页脚：原来 1744（左右 88），比页头宽 94，滚到底时整块往外撑 */
.ft2__inner{max-width:var(--shell-w);margin-inline:auto;padding-left:0;padding-right:0}

/* ---------- ③ 区块垂直节奏统一 120 / 96 ---------- */
.board,
.jf-support,
.jf-brands,
.wrap.section,
.ab-cul,
.ab-sun{
  padding-top:var(--sec-pt);
  padding-bottom:var(--sec-pb);
}

/* 阳光驰骋按 14:02355 独立标注：标题距顶 105，二维码下留白 137。 */
.ab-sun{padding-top:105px;padding-bottom:137px}
@media (max-width:1279px){.ab-sun{padding-top:88px;padding-bottom:64px}}

/* ---------- ④ 区块级标题统一 60 / 72 ---------- */
.board__title{
  font-size:clamp(36px,3.125vw,60px);
  line-height:1.2;
}

/* ============================================================
   轮播箭头统一规范（2026-11-09）
   ------------------------------------------------------------
   背景：全站四套轮播箭头此前各写各的 ——
     关于页 .ab-hist__arrow  = 品牌蓝实心圆 + 白箭头
     品牌页 .bz-arrow        = 半透明黑圆 + 白箭头（10-06 定稿前的老样式）
     招聘页 .jn-slider__nav  = 毛玻璃圆 + 白箭头
     加盟页 .jf-support__arrow = 透明底 + 黑描边（浅底专用）
   同一个「上一张/下一张」在不同页长得完全不一样，属于视觉不统一。

   统一口径（沿用 10-06 设计稿定稿「圆形与箭头都是白，半透明黑底会不符」）：
     · 深色/图片底 → 透明底 + 白色 2px 描边圆环 + 白色箭头
     · 浅色底      → 透明底 + 品牌蓝 2px 描边圆环 + 品牌蓝箭头
   尺寸统一 62px（窄屏 44px），图标统一占 42%，hover 只加背景不换形。
   描边而不是实心，是为了在任意底图上都保持可见又不抢内容。
   ============================================================ */
.ux-arrow{
  display:flex;align-items:center;justify-content:center;
  width:62px;height:62px;padding:0;border:2px solid currentColor;
  border-radius:50%;background:transparent;cursor:pointer;
  color:#fff;
  transition:background-color .2s ease,transform .2s ease,opacity .2s ease;
}
.ux-arrow svg{display:block;width:42%;height:42%}
/* 深底：白描边 + 白箭头 */
.ux-arrow--on-dark{color:#fff}
/* 浅底：品牌蓝描边 + 蓝箭头 */
.ux-arrow--on-light{color:var(--brand)}
.ux-arrow:hover{background:rgba(255,255,255,.18)}
.ux-arrow--on-light:hover{background:rgba(0,103,255,.1)}
.ux-arrow:active{transform:scale(.94)}
.ux-arrow:disabled,.ux-arrow.is-off{
  opacity:.28;cursor:default;background:transparent;transform:none;
}
@media (max-width:767px){
  .ux-arrow{width:44px;height:44px}
  .ux-arrow svg{width:44%;height:44%}
  /* 四处轮播箭头在手机档统一收成 44px */
  /* bz-arrow 移动端是品牌卡内磨砂小箭头（36px，见 767 档品牌区），不参与此统一 */
  .ab-hist__arrow,.jn-slider__nav,.jf-support__arrow{width:44px;height:44px}
}

/* ============================================================
   移动端触摸热区补足（2026-11-09）
   ------------------------------------------------------------
   走查实测：语言切换 17×17 / 汉堡 24×16 / 抽屉「关闭」55×17，
   全部低于 44px 触控标准，手指很难点准。
   这里不改变视觉尺寸（改了会破坏页头排版），
   而是用伪元素把「可点区域」撑到 44×44 —— 图不变，手感变好。
   ============================================================ */
@media (max-width:1023px){
  .burger{width:24px;height:16px}
  .burger::before{top:0}
  .burger::after{bottom:0}
  /* 汉堡：按钮本体 24×16（两条线是 ::before/::after 画的）。
     用 padding 把「可点区域」撑到 44×44，
     同时把两条线用 inset 归位，保证线的位置与粗细完全不变。
     盒子用 content-box：padding 不计入 24×16 的内容尺寸。 */
  .burger{
    position:relative;
    padding:14px 10px;
    box-sizing:content-box;
    width:24px;height:16px;
  }
  .burger::before,.burger::after{left:10px;width:24px}
  .burger::before{top:14px}
  .burger::after{bottom:14px}

  /* 语言切换：文字 17px 高，热区撑到 44px 高 */
  .lang__item{position:relative}
  .lang__item::after{
    content:'';position:absolute;
    left:-8px;right:-8px;top:-13px;bottom:-13px;
  }

  /* 抽屉关闭：文字 17px 高，热区撑到 44px 高 */
  .drawer__close{position:relative}
  .drawer__close::after{
    content:'';position:absolute;
    left:-10px;right:-10px;top:-14px;bottom:-14px;
  }
}

/* ============================================================
   页脚栏目 5 栏 · 平板段不折行（2026-11-03）
   .ft2__cols 在 ≤1279 走 justify-content:flex-start + gap:36px 64px。
   实测（1920/1440/1280/1024/768）：4 栏列宽和 385 + 3×64 = 577，768 档容器 660 装得下；
   5 栏列宽和 481 + 4×64 = 737 > 660 → 第 5 栏掉到第二行，成 4+1。
   只在「5 栏」这一种情况下把横间距收到 28（481 + 4×28 = 593 < 660，留 ~10% 余量给更长的栏目标题）。
   3 栏 / 4 栏刻意不碰：设计稿的间距是这两档调过的，一个像素都不动。
   ============================================================ */
@media (min-width:768px) and (max-width:1279px){
  .ft2__cols[data-count="5"]{gap:36px 28px}
}

/* ============================================================
   方向卡 · 单数条目时末卡居中（2026-11-03）
   .rc-grid 是两列网格，列宽本身就是 min(640px,33.333vw)（见上文 grid-template-columns）。
   条目数为单数时，最后一张独占左列、右列空半格，整块看着像被截断了。
   这里只做一件事：让末卡横跨两列并居中。宽度仍用同一个表达式 —— 所以它跟别的卡等宽，
   不是「为了填满而拉宽」。
   只在 ≥1280 生效：≤1279 已经切成单列，跨列没有意义，宽度也必须继续跟容器走。
   偶数条不受影响（末卡的 nth-child 序号是偶数，选择器不命中）。
   ============================================================ */
@media (max-width:767px){
  .ab-sun{padding-bottom:64px}
  .ab-sun__media{max-width:calc(100% - 32px);border-radius:12px}
  .ab-sun__text{padding:0 20px;margin-top:24px}
  .ab-sun__statement{font-size:15px;line-height:27px}
  .ab-sun__statement br{display:none}
  .ab-sun__contact{margin-top:20px;font-size:15px;line-height:28px;overflow-wrap:anywhere}
  .ab-sun__qr{width:150px;height:150px;margin-top:16px}
}
@media (min-width:1280px){
  .rc-grid > .rc-card:last-child:nth-child(odd){
    grid-column:1 / -1;
    justify-self:center;
    width:min(640px,33.333vw);
  }
}
/* ============ 三大业务支撑（商品策略 / 物流支持 / 信息赋能）移动端版式（2026-11-03） ============
   开工前实测线上，这三块在 ≤1180 就已经塌了，≤1024 彻底不可读：
     .bz-split{width:1299px;display:flex;gap:80px}  +  .bz-split__pic{flex:none;width:760px}
     +  .bz-split__text{width:460px;max-width:100%}
   760+80+460=1300 是个写死的横排宽度，而 pic 是 flex:none 不能缩，于是只能压文字：
     1280 → 文字 392（挤）
     1180 → 文字 292（勉强）
     1024 → 文字 140.5（一行 7 个字，整块高 1150）
      375 → 文字 140.5 但被左移出屏（left:-302.8），屏幕上只剩一个 760 宽的视频
   而且 .bz-core/.bz-logi/.bz-tech 都带 overflow:hidden，页面不会横向滚动 ——
   所以这个错版在手机上是「安静地坏掉」：没有滚动条提示，只是整块文字不见了。
   三块这里统一改成竖排（图在上、文在下），并给容器一个 760 的上限，
   让平板段不至于出现「图 1231×696」这种过高的比例。 */
@media (max-width:1279px){
  .bz-core{padding-bottom:56px}
  .bz-logi,.bz-tech{padding:56px 0}
  .bz-title{padding-top:56px;font-size:40px;line-height:52px}
  .bz-core .bz-split{margin-top:48px}
  .bz-split,
  .bz-split--rev{
    flex-direction:column;align-items:stretch;gap:36px;
    /* 宽度只写 min()，max-width 必须继续留 48px 的页边距 ——
       直接写 max-width:760px 会把原来的 calc(100% - 48px) 顶掉，手机上变成通栏出血 */
    width:min(760px,100%);
    max-width:calc(100% - 48px);
  }
  .bz-split__pic{order:-1;width:100%;height:auto;aspect-ratio:760/430}
  .bz-split__text{width:100%;max-width:none}
  .bz-h3{font-size:34px;line-height:42px}
  .bz-p{font-size:16px;line-height:28px}
  .bz-tags{margin-top:24px;gap:10px 28px}
  .bz-tags li{font-size:17px;line-height:30px;gap:10px}
}
@media (max-width:767px){
  .bz-core{padding-bottom:40px}
  .bz-logi,.bz-tech{padding:40px 0}
  .bz-title{padding-top:40px;font-size:28px;line-height:36px}
  .bz-core .bz-split{margin-top:28px}
  .bz-split,.bz-split--rev{gap:24px}
  .bz-h3{font-size:24px;line-height:32px}
  .bz-p{margin-top:14px;font-size:15px;line-height:26px}
  /* 标签改单列：两列时「两日一配/一日一配」这种 9 字标签在 155px 列里必折行 */
  .bz-tags{grid-template-columns:1fr;margin-top:18px;gap:8px}
  .bz-tags li{font-size:15px;line-height:24px}
  .bz-dot{width:14px;height:14px}
}

/* ============ 移动端数据看板：长数值不许把列撑宽（2026-11-03） ============
   ≤767 的看板是「flex:0 0 46%」的两列布局，item 没写 min-width，
   而 flex-basis 只管起始尺寸、管不住最小尺寸 —— min-width:auto 会让 item
   长到内容那么宽。实测（375px / 47px 字号）：
     「TOP100」→ item 被撑到 156.8（列宽只有 143），两列 156.8+16+143=315.8 > 311，
     右列整个溢出容器；「10000+」在 360px 下同样越界（138.6 > 136.2）。
   加 min-width:0 让 item 永远守住 46%：内容超宽时向两侧对称溢出到 16px 的列间距里，
   既不撞到相邻项，也不改变列宽。
   注：TOP6 这类纯文字数值只是「看起来比 90+ 宽」—— 它没有 +、又用字母，
   墨迹 112.7 < 143 的列宽，不是溢出。那是内容差异，不在样式层处理。 */
@media (max-width:767px){
  .board .board__item{min-width:0}
}
/* ≤359 再缩一档：320 宽的机器上 46% 的列只有 118px，而「10000+」在 47px 时要 138.6px，
   会向两侧各溢出 10.4px、把 16px 的列间距吃掉大半，相邻两项的墨迹就会贴在一起。
   42px 时降到 123.9px，溢出 3px 落在列间距里，不撞邻项。 */
@media (max-width:359px){
  .board .board__num{font-size:42px}
  .board .board__num i{font-size:18px}
}

/* ============================================================
   首屏高度全站统一（2026-11-10 阿凯重申定稿）
   移动端 ≤1023px：min(820px, 88vw) —— 与加入我们/好物合作完全一致
   （390 宽 ≈ 343px）。走进驰骋原 520px、业务体系原 820px，此处拉齐。
   ============================================================ */
@media (max-width:1023px){
  .ab-hero{height:min(820px,88vw)}
  .ab-hero__bg,.ab-hero__bg img{height:100%}
  .ab-hero__bg img{object-fit:cover;object-position:center}
  .bz-hero{height:min(820px,88vw)}
  .bz-hero__img{height:100%;object-fit:cover;object-position:center}
}