:root{
  --navy:#06101C;
  --navy-2:#0A1E36;
  --light:#F1F6FA;
  --cyan:#19C8D4;
  --cyan-soft:#7FE7EC;
  --ink:#0A2135;
  --ink-2:#3D5266;
  --ink-3:#7A8DA1;
  --on-dark-2:#A9C0D4;
  --pink:#F5A9C0;
  --line:#DCE6EE;
  --line-dark:rgba(127,231,236,.18);
  --gutter:40px;
  --wide:1400px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  font-family:Arial,system-ui,-apple-system,"Segoe UI","PingFang SC","HarmonyOS Sans SC","Noto Sans SC","Microsoft YaHei",sans-serif;
  color:var(--ink);background:#fff;line-height:1.8;font-size:16px;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;-webkit-tap-highlight-color:transparent;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
.wrap{max-width:1240px;margin:0 auto;padding:0 var(--gutter)}
section[id]{scroll-margin-top:96px}
.gridlight{
  background-image:
    linear-gradient(rgba(10,33,53,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(10,33,53,.04) 1px,transparent 1px);
  background-size:64px 64px;
}
.griddark{
  background-color:var(--navy);
  background-image:
    linear-gradient(rgba(25,200,212,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(25,200,212,.055) 1px,transparent 1px);
  background-size:64px 64px;
}

/* ============ FLOATING PILL NAV ============ */
.navdock{position:fixed;top:20px;left:0;right:0;z-index:100;display:flex;justify-content:center;pointer-events:none;padding:0 20px}
.pill{
  position:relative;
  pointer-events:auto;display:flex;align-items:center;gap:10px;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);
  border:1px solid var(--line);border-radius:999px;
  padding:11px 11px 11px 24px;max-width:1200px;width:100%;
  transition:max-width .45s cubic-bezier(.4,0,.2,1),padding .45s cubic-bezier(.4,0,.2,1),gap .45s;
}
.pill.collapsed{max-width:74px;padding:11px 0;justify-content:center;gap:0;cursor:pointer}
.pill.collapsed .pill-brandtext,.pill.collapsed .pill-links,.pill.collapsed .pill-cta,.pill.collapsed .pill-toggle{display:none}
.pill-brand{display:flex;align-items:center;gap:13px;flex:none}
.pill-brand img{height:31px;width:auto;flex:none;object-fit:contain}
.pill-brandtext{display:flex;flex-direction:column;line-height:1.05;white-space:nowrap}
.pill-brandtext b{font-size:16.5px;font-weight:700;letter-spacing:.02em}
.pill-brandtext i{font-style:normal;font-size:9.5px;letter-spacing:.17em;color:var(--cyan);margin-top:5px}
.pill-links{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:2px}
.pill-links a{font-size:15px;color:var(--ink-2);padding:10px 16px;border-radius:999px;transition:.2s;white-space:nowrap}
.pill-links a:hover{background:rgba(25,200,212,.1);color:var(--ink)}
.pill-cta{
  flex:none;margin-left:auto;display:inline-flex;align-items:center;gap:7px;
  background:var(--navy);color:#fff;font-size:15px;
  padding:13px 26px;border-radius:999px;transition:.25s;
}
.pill-cta:hover{background:#0F2C48}
.pill-cta svg{transition:transform .25s}
.pill-cta:hover svg{transform:translateX(3px)}
.pill-toggle{display:none;background:none;border:0;cursor:pointer;padding:8px;flex:none;margin-left:auto}
.pill-toggle span{display:block;width:22px;height:1.8px;background:var(--ink);margin:4.5px 0}

/* ---- 悬浮展开的完整目录 ---- */
.navpanel{
  pointer-events:none;opacity:0;visibility:hidden;
  position:absolute;top:88px;left:50%;
  transform:translate(-50%,-8px);
  width:min(1200px,calc(100vw - 40px));
  background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);
  border:1px solid var(--line);border-radius:24px;
  padding:30px 34px 28px;
  box-shadow:0 28px 64px -28px rgba(6,16,28,.24);
  transition:opacity .3s ease,visibility .3s,transform .3s cubic-bezier(.2,0,.2,1);
}
.navdock.open .navpanel{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.np-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.15fr;gap:34px}
.np-col{display:flex;flex-direction:column;gap:11px;min-width:0}
.np-col .np-h{font-size:14.5px;font-weight:700;color:var(--ink);letter-spacing:.02em;margin-bottom:6px}
.np-col a{font-size:13px;color:var(--ink-2);line-height:1.35;transition:color .18s}
.np-col a:hover{color:var(--cyan)}

/* ============ SPLASH ============ */
.splash{
  position:fixed;inset:0;z-index:500;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background-color:var(--navy);
  background-image:
    linear-gradient(rgba(25,200,212,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(25,200,212,.06) 1px,transparent 1px);
  background-size:64px 64px;
  animation:splashOut .8s cubic-bezier(.76,0,.24,1) 1.5s forwards;
}
@keyframes splashOut{to{transform:translateY(-100%)}}
.splash-in{display:flex;flex-direction:column;align-items:center;text-align:center;
  animation:splashIn .6s cubic-bezier(.19,1,.22,1) .05s both, splashFade .45s ease-in 1.02s forwards}
@keyframes splashIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes splashFade{to{opacity:0;transform:translateY(-14px)}}
.splash-logo{height:58px;width:auto;margin-bottom:26px}
.splash-name{display:flex;flex-direction:column;line-height:1.1;margin-bottom:38px}
.splash-name b{font-size:24px;font-weight:700;color:#fff;letter-spacing:.08em}
.splash-name i{font-style:normal;font-size:10px;letter-spacing:.32em;color:var(--cyan-soft);margin-top:9px}
.splash-slogan{font-size:20px;font-weight:700;color:#fff;letter-spacing:.18em;margin-bottom:14px}
.splash-en{font-size:11px;letter-spacing:.34em;color:var(--cyan)}
.splash-bar{position:absolute;left:50%;bottom:78px;transform:translateX(-50%);width:180px;height:1.5px;background:rgba(127,231,236,.2);overflow:hidden}
.splash-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--cyan),var(--pink));animation:splashBar 1.5s cubic-bezier(.4,0,.2,1) .1s forwards}
@keyframes splashBar{to{width:100%}}
.splash-skip{position:absolute;right:34px;bottom:30px;background:none;border:0;color:rgba(169,192,212,.7);font-family:inherit;font-size:12px;letter-spacing:.16em;cursor:pointer}
.splash-skip:hover{color:var(--cyan-soft)}
html.skip-intro .splash{display:none!important}

/* ============ HERO ============ */
.hero{position:relative;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) clamp(330px,38vw,620px);gap:28px;align-items:stretch;
  padding-top:112px;padding-left:max(var(--gutter),calc((100vw - 1240px)/2));padding-right:0}
.hero-txt{padding:66px 0 80px;display:flex;flex-direction:column;justify-content:center;max-width:880px}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:11.5px;letter-spacing:.18em;
  color:var(--ink-3);margin-bottom:34px}
.eyebrow i{width:22px;height:1px;background:var(--cyan);display:block}
.hero h1{font-size:clamp(36px,4.8vw,66px);line-height:1.22;font-weight:700;letter-spacing:-.02em;margin-bottom:0}
.hero h1 .hl{display:block}
.hero .rv{transition-delay:1.45s}
.lnf{
  position:relative;display:inline-block;color:transparent;opacity:0;
  -webkit-text-stroke:1.4px rgba(25,200,212,.6);
}
.lnf::before{
  content:attr(data-t);
  position:absolute;left:0;top:0;white-space:nowrap;
  -webkit-text-stroke:0;color:transparent;
  background-repeat:no-repeat;background-size:100% 200%;
  -webkit-background-clip:text;background-clip:text;
  -webkit-mask-image:linear-gradient(90deg,#000,#000);
  -webkit-mask-repeat:no-repeat;-webkit-mask-position:left center;
  -webkit-mask-size:0% 100%;
}
.ln1::before{
  background-image:linear-gradient(100deg,#0E9C9A 0%,#16B2B6 42%,#19C8D4 80%,#2ECFD8 100%);
  background-position:0 0;
}
.ln2::before{
  background-image:linear-gradient(100deg,#19C8D4 0%,#5FD3DB 26%,#C3A8C0 68%,#EE9CBB 100%);
  background-position:0 100%;
}
.ln1{animation:lnShow .35s ease-out 1.5s forwards, lnClear .4s ease-out 2.95s forwards}
.ln2{animation:lnShow .35s ease-out 2.05s forwards, lnClear .4s ease-out 3.5s forwards}
.ln1::before{animation:lnWipe 1.05s cubic-bezier(.4,0,.2,1) 1.8s forwards}
.ln2::before{animation:lnWipe 1.05s cubic-bezier(.4,0,.2,1) 2.35s forwards}
@keyframes lnShow{to{opacity:1}}
@keyframes lnWipe{to{-webkit-mask-size:100% 100%}}
@keyframes lnClear{to{-webkit-text-stroke-color:rgba(25,200,212,0)}}
.hrule{display:block;height:2px;width:0;margin:28px 0 34px;
  background:linear-gradient(90deg,var(--cyan),rgba(25,200,212,0));
  animation:draw 1.05s cubic-bezier(.19,1,.22,1) 3.6s forwards}
@keyframes draw{to{width:200px}}
html.skip-intro .lnf{animation:none!important;opacity:1!important;-webkit-text-stroke-color:transparent!important}
html.skip-intro .lnf::before{animation:none!important;-webkit-mask-size:100% 100%!important}
html.skip-intro .hrule{animation:none!important;width:200px!important}
html.skip-intro .hero .rv{transition-delay:0s!important}
@media (prefers-reduced-motion:reduce){
  .splash{display:none}
  .hero .rv{transition-delay:0s!important}
  .lnf{animation:none!important;opacity:1!important;-webkit-text-stroke-color:transparent}
  .lnf::before{animation:none!important;-webkit-mask-size:100% 100%!important}
  .hrule{width:200px;animation:none!important}
}
.hero .stmt{font-size:16px;color:var(--ink-2);max-width:540px;line-height:1.95;margin-bottom:42px}
.hero-act{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.btn,.btn-ghost{display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-size:14.5px;height:52px;padding:0 26px;border-radius:4px;transition:.25s;white-space:nowrap}
.btn{background:var(--navy);color:#fff}
.btn:hover{background:#0F2C48}
.btn svg,.btn-ghost svg{transition:transform .25s}
.btn:hover svg,.btn-ghost:hover svg{transform:translateX(4px)}
.btn-ghost{background:#fff;color:var(--ink-2);border:1px solid var(--line)}
.btn-ghost:hover{border-color:var(--cyan);color:var(--ink);background:rgba(25,200,212,.05)}
/* 首屏丝带图：遮罩沿丝带轨迹从左上 / 右下生长，两端在中间相接 */
.hero-plate{position:relative;overflow:visible;background:transparent;min-height:420px}
.hero-bg{display:none}
.ribbon-svg{width:100%;height:100%;display:block}
.rb-grow{stroke-dasharray:1;stroke-dashoffset:1;
  animation:rbGrow 3.2s cubic-bezier(.3,0,.22,1) 1.6s forwards}
@keyframes rbGrow{to{stroke-dashoffset:0}}
html.skip-intro .rb-grow{animation:none!important;stroke-dashoffset:0!important}
@media (prefers-reduced-motion:reduce){
  .rb-grow{animation:none!important;stroke-dashoffset:0!important}
}

/* ============ LEDGER ============ */
.ledger{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ledger-in{max-width:var(--wide);margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:repeat(4,1fr);column-gap:48px}
.lg{padding:36px 0;display:flex;align-items:baseline;gap:18px}
.lg b{font-size:clamp(26px,3vw,40px);font-weight:700;line-height:1;letter-spacing:-.02em;flex:none}
.lg b em{font-style:normal;font-size:.52em;color:var(--cyan)}
.lg span{font-size:13px;color:var(--ink-3);line-height:1.6}

/* ============ CHAPTER ============ */
.chap{padding:112px 0}
.chap-grid{display:grid;grid-template-columns:138px minmax(0,1fr);gap:52px;align-items:start}
.rail{position:sticky;top:118px;display:flex;align-items:center;gap:10px}
.rail i{width:22px;height:2px;background:var(--cyan);display:block;flex:none}
.rail span{font-size:14.5px;font-weight:700;letter-spacing:.16em;color:var(--ink);white-space:nowrap}
.chap-body{min-width:0}
.h2{font-size:clamp(26px,3.2vw,42px);line-height:1.34;font-weight:700;letter-spacing:-.015em;margin-bottom:22px;max-width:820px}
.lede{font-size:16px;color:var(--ink-2);line-height:1.95;max-width:720px}
.alt{background:var(--light)}

/* ---- index list ---- */
.index{margin-top:60px}
.ix{display:grid;grid-template-columns:46px 268px minmax(0,1fr);gap:32px;padding:24px 0;
  border-top:1px solid var(--line);align-items:baseline;transition:background .25s}
.ix:last-child{border-bottom:1px solid var(--line)}
.ix:hover{background:rgba(25,200,212,.045)}
.ix .ri{font-size:12px;font-weight:700;color:var(--cyan);letter-spacing:.08em}
.ix h3{font-size:16.5px;font-weight:700}
.ix p{font-size:14.2px;color:var(--ink-2)}
.base{margin-top:34px;display:flex;gap:26px;align-items:baseline;flex-wrap:wrap;
  background:var(--navy);color:#fff;padding:28px 32px;border-radius:4px}
.base span{font-size:11.5px;letter-spacing:.18em;color:var(--cyan-soft);flex:none}
.base strong{font-size:16px;font-weight:400;line-height:1.65}

/* ============ PLATE ============ */
.plate{position:relative;overflow:hidden;background:var(--navy)}
.plate img{width:100%;height:clamp(300px,44vw,540px);object-fit:cover}
.plate::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,16,28,.15) 30%,rgba(6,16,28,.88))}
.plate-cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding-bottom:64px}
.plate-cap .pl-lab{font-size:11.5px;letter-spacing:.18em;color:var(--cyan-soft);display:block;margin-bottom:18px}
.plate-cap p{font-size:clamp(20px,2.5vw,32px);font-weight:700;line-height:1.48;color:#fff;max-width:840px;letter-spacing:-.01em}

/* ============ SPLIT ============ */
.split{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:64px;align-items:center}
.split.rev .sideplate{order:-1}
.sideplate{border-radius:4px;overflow:hidden;background:var(--light)}
.sideplate img,.sideplate video{width:100%;aspect-ratio:5/4;object-fit:cover;display:block;background:var(--navy)}

/* ---- ruler ---- */
.ruler{display:grid;grid-template-columns:repeat(4,1fr);column-gap:40px;margin-top:56px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ru{padding:26px 0}
.ru b{display:block;font-size:clamp(24px,2.6vw,34px);font-weight:700;line-height:1.05;letter-spacing:-.02em;color:var(--ink)}
.ru b em{font-style:normal;font-size:.5em;color:var(--ink-3);margin-left:3px}
.ru span{display:block;margin-top:10px;font-size:13px;color:var(--ink-2);line-height:1.7}
.ru.cy b{color:var(--cyan)}

/* ---- ladder ---- */
.ladder{margin-top:44px;display:grid;grid-template-columns:repeat(4,1fr);column-gap:40px}
.lad{padding:0}
.lad .ln{font-size:11px;letter-spacing:.14em;color:var(--cyan);display:block;margin-bottom:12px}
.lad h4{font-size:15.5px;font-weight:700;margin-bottom:9px}
.lad p{font-size:13.4px;color:var(--ink-2);line-height:1.8}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.chip{font-size:12.5px;color:var(--ink-2);border:1px solid var(--line);border-radius:999px;padding:7px 15px}
.dfine{margin-top:26px;font-size:12px;color:var(--ink-3);line-height:1.8}

/* ---- case list ---- */
.cases{margin-top:56px}
.cs{display:grid;grid-template-columns:210px 46px minmax(0,1fr);gap:28px;padding:28px 0;border-top:1px solid var(--line);align-items:baseline}
.cs:last-child{border-bottom:1px solid var(--line)}
.cs .csector{font-size:11.5px;letter-spacing:.14em;color:var(--cyan);margin-bottom:8px;display:block}
.cs .cname{font-size:16px;font-weight:700;line-height:1.5}
.cs .ri{font-size:12px;font-weight:700;color:var(--ink-3);letter-spacing:.08em}
.cs .cbody p{font-size:14.2px;color:var(--ink-2);line-height:1.9}
.cs .cbody p+p{margin-top:7px}
.cs .cbody b{color:var(--ink);font-weight:700}
.cs .cres{display:flex;align-items:baseline;gap:10px;margin-top:12px}
.cs .cres b{font-size:20px;font-weight:700;color:var(--cyan);letter-spacing:-.01em}
.cs .cres span{font-size:12.5px;color:var(--ink-3)}

/* ---- timeline ---- */
.tl{margin-top:56px;display:grid;grid-template-columns:repeat(3,1fr);column-gap:48px}
.tli{padding:0}
.tli .tk{font-size:11.5px;letter-spacing:.16em;color:var(--cyan);display:block;margin-bottom:16px}
.tli h4{font-size:17px;font-weight:700;margin-bottom:11px}
.tli p{font-size:14px;color:var(--ink-2);line-height:1.9}
.steps{margin-top:20px;display:grid;grid-template-columns:repeat(4,1fr);column-gap:40px}
.st{padding:24px 0 0;border-top:1px solid var(--line)}
.st .sn{font-size:11.5px;font-weight:700;color:var(--cyan);letter-spacing:.1em;display:block;margin-bottom:12px}
.st h4{font-size:15.5px;font-weight:700;margin-bottom:9px}
.st p{font-size:13.4px;color:var(--ink-2);line-height:1.8}
.callout{margin-top:38px}
.callout b{font-weight:700}
.callout p{font-size:15px;color:var(--ink-2);line-height:1.9}

/* ============ TEAM ============ */
.teams{margin-top:52px}
.tm{display:grid;grid-template-columns:250px minmax(0,1fr);gap:32px;padding:24px 0;border-top:1px solid var(--line);align-items:baseline}
.tm:last-child{border-bottom:1px solid var(--line)}
.tm h4{font-size:16.5px;font-weight:700}
.tm p{font-size:14.4px;color:var(--ink-2)}

/* ============ CLOSING ============ */
.close{position:relative;overflow:hidden;color:#fff;padding:120px 0 0}
.close .bg{position:absolute;inset:0}
.close .bg img{width:100%;height:100%;object-fit:cover;opacity:.5}
.close::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,16,28,.72),rgba(6,16,28,.94))}
.close .wrap{position:relative;z-index:2}
.close h2{font-size:clamp(30px,4vw,54px);font-weight:700;line-height:1.26;letter-spacing:-.02em;margin-bottom:20px;max-width:760px}
.slg{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;font-size:15px;font-weight:700;
  letter-spacing:.16em;color:var(--cyan-soft);margin-bottom:22px}
.slg span{font-size:10.5px;font-weight:400;letter-spacing:.3em;color:var(--on-dark-2)}
.close .cl{font-size:16px;color:var(--on-dark-2);max-width:620px;margin-bottom:76px}
.next{display:grid;grid-template-columns:repeat(3,1fr);column-gap:48px;border-top:1px solid var(--line-dark);padding-bottom:96px}
.nx{padding:34px 0 0}
.nx .nn{font-size:11.5px;font-weight:700;color:var(--cyan-soft);letter-spacing:.12em;display:block;margin-bottom:15px}
.nx h4{font-size:18px;font-weight:700;margin-bottom:11px}
.nx p{font-size:14px;color:var(--on-dark-2);line-height:1.9}
.cline{display:flex;gap:44px;flex-wrap:wrap;padding:34px 0;border-top:1px solid var(--line-dark);font-size:13.5px}
.cline div b{display:block;font-size:10.5px;letter-spacing:.16em;color:var(--ink-3);font-weight:400;margin-bottom:5px}
.cline div a{color:var(--cyan-soft)}
.cline div a:hover{color:#fff}

/* ============ FOOTER ============ */
footer{background:#fff;padding:72px 0 32px;border-top:1px solid var(--line)}
.f-grid{display:grid;grid-template-columns:minmax(0,1.95fr) 1fr 1fr 1fr;gap:44px;padding-bottom:48px}
.fb-mark{display:flex;align-items:center;gap:11px;margin-bottom:18px}
.fb-mark img{height:28px;width:auto;flex:none;object-fit:contain}
.fb-mark span{display:flex;flex-direction:column;line-height:1.05;white-space:nowrap}
.fb-mark b{font-size:16px;font-weight:700;letter-spacing:.02em}
.fb-mark i{font-style:normal;font-size:9px;letter-spacing:.17em;color:var(--cyan);margin-top:5px}
.f-brand p{font-size:13.4px;color:var(--ink-3);line-height:1.85}
.f-brand p:first-of-type{white-space:nowrap}
.f-slg{margin-top:18px;font-size:12.5px;font-weight:700;letter-spacing:.14em;color:var(--cyan)}
.f-slg span{display:block;font-size:9.5px;font-weight:400;letter-spacing:.28em;color:var(--ink-3);margin-top:7px}
.f-col h6{font-size:13px;font-weight:700;margin-bottom:20px;letter-spacing:.04em}
.f-col a{display:block;font-size:13.4px;color:var(--ink-2);margin-bottom:12px;transition:.2s}
.f-col a:hover{color:var(--cyan)}
.f-bot{border-top:1px solid var(--line);padding-top:24px;display:flex;justify-content:space-between;
  align-items:center;gap:20px;flex-wrap:wrap;font-size:12.2px;color:var(--ink-3)}
.f-legal{display:flex;gap:18px;flex-wrap:wrap}
.f-legal a:hover{color:var(--cyan)}

/* ============ REVEAL ============ */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.2,0,.2,1),transform .8s cubic-bezier(.2,0,.2,1)}
.rv.in{opacity:1;transform:none}

/* ============ RESPONSIVE ============ */
@media(max-width:1080px){
  .ix{grid-template-columns:40px 230px minmax(0,1fr);gap:24px}
  .cs{grid-template-columns:170px 40px minmax(0,1fr);gap:22px}
}
@media(max-width:900px){
  /* 顶部导航：常驻 pill + 全宽下拉目录 */
  .navdock{top:calc(10px + env(safe-area-inset-top));padding:0 14px;justify-content:stretch}
  .pill{max-width:100%;padding:8px 8px 8px 15px;border-radius:16px;gap:8px;justify-content:space-between;z-index:3;
    background:rgba(255,255,255,.97)}
  .pill.collapsed{max-width:100%;padding:8px 8px 8px 15px;justify-content:space-between}
  .pill.collapsed .pill-brandtext,.pill.collapsed .pill-toggle{display:block}
  .pill.collapsed .pill-toggle{display:flex}
  .pill-links,.pill-cta{display:none}
  .pill-brand{gap:10px}
  .pill-brand img{height:27px}
  .pill-brandtext b{font-size:15.5px}
  .pill-brandtext i{font-size:8.5px;letter-spacing:.15em;margin-top:3px}
  .pill-toggle{display:flex;flex-direction:column;justify-content:center;align-items:center;
    width:44px;height:44px;padding:0;margin-left:auto;border-radius:12px;flex:none}
  .pill-toggle span{width:20px;height:1.8px;margin:3.4px 0}

  .navmask{display:block;position:fixed;inset:0;background:rgba(6,16,28,.4);
    opacity:0;visibility:hidden;transition:opacity .26s ease,visibility .26s;
    pointer-events:none;z-index:1}
  .navdock.mopen .navmask{opacity:1;visibility:visible;pointer-events:auto}
  .navpanel{display:block;position:fixed;
    top:calc(78px + env(safe-area-inset-top));left:14px;right:14px;width:auto;
    max-height:calc(100vh - 98px);
    max-height:calc(100dvh - 98px - env(safe-area-inset-top));
    overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;
    border-radius:18px;padding:22px 20px 6px;
    background:#fff;z-index:2;
    -webkit-backdrop-filter:none;backdrop-filter:none;
    box-shadow:0 24px 60px -20px rgba(6,16,28,.35);
    transform:translateY(-10px);
    transition:opacity .26s ease,visibility .26s,transform .3s cubic-bezier(.2,0,.2,1)}
  .navdock.mopen .navpanel{opacity:1;visibility:visible;pointer-events:auto;transform:none}
  .np-grid{grid-template-columns:1fr 1fr;gap:18px 14px}
  .np-col{gap:9px;padding-bottom:16px}
  .np-col .np-h{font-size:14px;margin-bottom:3px}
  .np-col a{font-size:12.5px;line-height:1.45}
  .np-col:nth-child(4){grid-column:span 1}

  /* 首屏：图片铺满整屏做背景，文字压在最上层 */
  .hero{isolation:isolate;min-height:100svh;min-height:100dvh;display:flex;flex-direction:column;justify-content:flex-end}
  .hero-grid{display:block;padding:0;gap:0}
  .hero-plate{position:absolute;inset:0;z-index:-1;margin:0;min-height:0;aspect-ratio:auto;overflow:hidden}
  .hero-bg{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
    object-position:32% 28%;transform:scale(1.18);will-change:transform}
  .hero-plate .ribbon-svg{display:none}
  .hero-plate::after{content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.2) 30%,
      rgba(255,255,255,.62) 45%,rgba(255,255,255,.9) 58%,#fff 74%)}
  .hero-txt{padding:0 var(--gutter) calc(34px + env(safe-area-inset-bottom));max-width:none}
  .hero .rv{transition-delay:.15s!important}

  /* 章节骨架 */
  .chap-grid{grid-template-columns:1fr;gap:20px}
  .rail{position:static}
  .rail span{font-size:13.5px;letter-spacing:.14em}
  .chap{padding:64px 0}
  section[id]{scroll-margin-top:78px}

  /* 列表 */
  .ix{grid-template-columns:30px minmax(0,1fr);gap:5px 14px;padding:21px 0}
  .ix .ri{font-size:11px;line-height:1.9}
  .ix h3{grid-column:2;font-size:16px}
  .ix p{grid-column:2;font-size:13.8px;line-height:1.75}

  /* 案例：单列，禁止左侧 40px 窄列 */
  .cs{grid-template-columns:minmax(0,1fr);gap:0;padding:26px 0}
  .cs .ri{display:none}
  .cs .csector,.cs .cname,.cs .cbody{grid-column:1}
  .cs .csector{font-size:10.8px;margin-bottom:6px}
  .cs .cname{font-size:16.5px;line-height:1.45}
  .cs .cbody{margin-top:12px}
  .cs .cbody p{font-size:13.8px;line-height:1.8}
  .cs .cres{margin-top:12px}
  .cs .cres b{font-size:19px}

  .tm{grid-template-columns:minmax(0,1fr);gap:6px;padding:20px 0}
  .tm h4{font-size:16px}
  .tm p{font-size:13.8px;line-height:1.8}

  .split{grid-template-columns:1fr;gap:32px}
  .split.rev .sideplate{order:0}

  /* 平板保留两列 */
  .tl,.steps,.next,.ladder{grid-template-columns:1fr 1fr;column-gap:34px}
  .ruler{grid-template-columns:1fr 1fr;column-gap:34px}
  .lad,.st,.tli,.nx{padding:0 0 26px}
  .f-grid{grid-template-columns:1fr 1fr}
  .f-brand p:first-of-type{white-space:normal}
  .ledger-in{grid-template-columns:1fr 1fr;column-gap:36px}
  .lg:nth-child(1),.lg:nth-child(2){border-bottom:1px solid var(--line)}
}
/* ---------- 手机横屏：文字左、图右，压进一屏 ---------- */
@media(max-width:900px) and (max-height:520px){
  .hero{display:block;min-height:0;isolation:auto}
  .hero-plate{position:relative;inset:auto;z-index:auto;overflow:visible}
  .hero-bg{display:none}
  .hero-plate .ribbon-svg{display:block}
  .hero-plate::after{display:none}
  .hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 26vw;gap:18px;align-items:center;
    padding:calc(74px + env(safe-area-inset-top)) var(--gutter) 16px}
  .hero-txt{padding:0}
  .hero h1{font-size:clamp(24px,4.2vw,32px);line-height:1.24}
  .eyebrow{font-size:9.8px;letter-spacing:.12em;margin-bottom:14px}
  .hrule{margin:14px 0 16px}
  .hero .stmt{font-size:13.5px;line-height:1.75;margin-bottom:20px;max-width:520px}
  .hero-act{flex-direction:row;gap:10px;align-items:center}
  .hero-act .btn,.hero-act .btn-ghost{height:44px;font-size:13.5px;flex:0 1 auto;padding:0 20px}
  .hero-plate{margin:0;aspect-ratio:3/4;max-height:calc(100dvh - 96px)}
  .navpanel{max-height:calc(100dvh - 84px)}
  .splash-logo{height:36px;margin-bottom:16px}
  .splash-name{margin-bottom:20px}
  .splash-name b{font-size:18px}
  .splash-slogan{font-size:15px;margin-bottom:10px}
  .splash-bar{bottom:36px}
}
/* ---------- 手机 ---------- */
@media(max-width:640px){
  :root{--gutter:20px}

  .hero-txt{padding:0 20px calc(30px + env(safe-area-inset-bottom))}
  .hero h1{font-size:clamp(30px,9.2vw,40px);line-height:1.26}
  .hero .stmt{max-width:34em}
  .eyebrow{font-size:10.8px;letter-spacing:.14em;margin-bottom:26px}
  .hero .stmt{font-size:15px;line-height:1.85;margin-bottom:32px}
  .hrule{margin:22px 0 26px}
  .hero-act{gap:10px;flex-direction:column;align-items:stretch}
  .hero-act .btn,.hero-act .btn-ghost{flex:1 1 auto;height:50px;font-size:14.5px}

  .ledger-in{grid-template-columns:1fr;column-gap:0}
  .lg{border-bottom:1px solid var(--line);padding:20px 0;gap:14px}
  .lg:last-child{border-bottom:0}
  .lg b{font-size:30px}
  .lg span{font-size:12.5px;line-height:1.55}

  .chap{padding:56px 0}
  .h2{font-size:25px;line-height:1.36;margin-bottom:16px}
  .lede{font-size:14.6px;line-height:1.85}

  .index{margin-top:40px}
  .base{padding:22px 20px;gap:12px;flex-direction:column;align-items:flex-start;margin-top:28px}
  .base strong{font-size:15px;line-height:1.7}

  .plate img{height:clamp(250px,64vw,360px)}
  .plate-cap{padding-bottom:30px}
  .plate-cap .pl-lab{font-size:10.5px;margin-bottom:12px}
  .plate-cap p{font-size:19px;line-height:1.52}

  /* 数据栅格：两列 + 分隔线，避免单列粘连 */
  .tl,.steps,.next,.ladder{grid-template-columns:1fr;column-gap:0}
  .ruler{grid-template-columns:1fr 1fr;column-gap:0;margin-top:36px;
    border-top:0;border-bottom:0}
  .ru{padding:16px 14px 18px;border-top:1px solid var(--line)}
  .ru:nth-child(odd){padding-left:0;border-right:1px solid var(--line)}
  .ru:nth-child(even){padding-right:0}
  .ru b{font-size:26px}
  .ru span{font-size:12.3px;line-height:1.6;margin-top:7px}

  .ladder{column-gap:0;margin-top:32px}
  .lad{border-top:1px solid var(--line);padding:18px 0 20px}
  .lad h4{font-size:15px}
  .lad p{font-size:13px;line-height:1.75}

  .tl{column-gap:0}
  .tli{border-top:1px solid var(--line);padding:20px 0 6px}
  .tli h4{font-size:16px}
  .tli p{font-size:13.4px;line-height:1.8}
  .steps{column-gap:0;margin-top:14px}
  .st{border-top:1px solid var(--line);padding:18px 0 6px}
  .st h4{font-size:15px}
  .st p{font-size:13px;line-height:1.75}

  /* 成绩页：配图压扁一点，案例卡收紧 */
  .sideplate img{aspect-ratio:4/3}
  .cases{margin-top:34px}
  .cs{padding:22px 0}
  .cs .cname{font-size:17px;line-height:1.4}
  .cs .cbody{margin-top:10px}
  .cs .cbody p{font-size:13.6px;line-height:1.82;text-indent:-3.05em;padding-left:3.05em}
  .cs .cres{margin-top:10px}
  .cs .cres b{font-size:18px}

  .chips{gap:8px;margin-top:20px}
  .chip{font-size:11.8px;padding:6px 13px}
  .dfine{font-size:11.8px;line-height:1.7}

  .close{padding:66px 0 0}
  .close h2{font-size:clamp(27px,8.4vw,36px)}
  .close .cl{font-size:14.6px;line-height:1.8;margin-bottom:40px}
  .slg{font-size:13.5px;letter-spacing:.1em;gap:7px;flex-direction:column;margin-bottom:18px}
  .slg span{letter-spacing:.24em}
  .next{column-gap:0;padding-bottom:52px}
  .nx{border-top:1px solid var(--line-dark);padding:22px 0 4px}
  .next .nx:first-child{border-top:0;padding-top:0}
  .nx h4{font-size:17px}
  .nx p{font-size:13.4px;line-height:1.8}
  .cline{gap:18px;padding:26px 0}
  .cline div{flex:1 1 100%}

  footer{padding:52px 0 calc(24px + env(safe-area-inset-bottom))}
  .f-grid{grid-template-columns:1fr 1fr;gap:26px 20px;padding-bottom:34px}
  .f-brand{grid-column:1/-1}
  .f-brand p{font-size:13px}
  .f-slg{margin-top:14px}
  .f-col h6{font-size:12.5px;margin-bottom:14px}
  .f-col a{font-size:13px;margin-bottom:9px}
  .f-col:last-child{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:0 20px;align-items:baseline}
  .f-col:last-child h6{width:100%}
  .f-col:last-child a{display:inline-block}
  .f-bot{flex-direction:column;align-items:flex-start;gap:14px;font-size:11.5px;padding-top:20px}
  .f-legal{flex-wrap:wrap;gap:7px 16px}
  .f-legal span{flex:0 0 100%}

  /* 开屏 */
  .splash-logo{height:46px;margin-bottom:22px}
  .splash-name b{font-size:21px}
  .splash-name{margin-bottom:30px}
  .splash-slogan{font-size:17px;letter-spacing:.14em}
  .splash-bar{bottom:calc(66px + env(safe-area-inset-bottom))}
  .splash-skip{bottom:calc(24px + env(safe-area-inset-bottom));right:22px}
}

/* ---------- 小屏（iPhone SE / 安卓小屏） ---------- */
@media(max-width:380px){
  :root{--gutter:17px}
  .hero h1{font-size:29px}
  .h2{font-size:23px}
  .plate-cap p{font-size:17.5px}
  .ru b{font-size:23px}
  .pill-brandtext b{font-size:14.5px}
  .np-grid{grid-template-columns:1fr 1fr}
  .np-col:nth-child(4){grid-column:1/-1}
}

/* ---------- 触屏：去掉粘住的 hover 态 ---------- */
@media(hover:none){
  .ix:hover{background:transparent}
  .pill-links a:hover{background:transparent}
  .btn:hover{background:var(--navy)}
  .btn-ghost:hover{border-color:var(--line);color:var(--ink-2);background:#fff}
  .f-col a:hover{color:var(--ink-2)}
  .np-col a:hover{color:var(--ink-2)}
  .pill-cta:hover{background:var(--navy)}
}

/* ---------- 语言切换（中 / EN） ---------- */
.langsw{display:flex;align-items:center;gap:5px;flex:none;
  font-size:11.5px;letter-spacing:.1em;line-height:1;white-space:nowrap}
.langsw i{font-style:normal;opacity:.26;font-size:10px}
.langsw .sw-on{color:var(--ink);font-weight:700}
.langsw a{color:var(--ink-3);transition:color .2s}
.langsw a:hover{color:var(--cyan)}
.pill .langsw{margin-left:auto}
.pill .pill-cta{margin-left:8px}
.pill.collapsed .langsw{display:none}
@media(max-width:640px){
  /* 窄屏只留「可以切过去的那一个」，当前语言与分隔符隐去 */
  .langsw .sw-on,.langsw i{display:none}
  /* 隐去之后只剩 EN / 中 两个字母，热区只有 18×12，手指根本点不准。
     用负 margin 抵消 padding，视觉位置不变，点击区域扩到 32×32 */
  .langsw a{padding:10px 7px;margin:-10px -4px}
  .subnav .langsw{font-size:11px}
}

/* ---------- 英文版的排版微调 ---------- */
/* 中文靠字距和方块字撑版式，英文同样字距会发虚，行高也需要收一点 */
html[lang="en"] body{line-height:1.72}
html[lang="en"] .hero h1{letter-spacing:-.028em;line-height:1.14}
html[lang="en"] .ln2::before{background-image:linear-gradient(100deg,#19C8D4 0%,#5FD3DB 34%,#C3A8C0 78%,#EE9CBB 100%)}
html[lang="en"] .h2{letter-spacing:-.012em}
html[lang="en"] .lede{letter-spacing:0}
html[lang="en"] .eyebrow{letter-spacing:.14em}
html[lang="en"] .rail span{letter-spacing:.12em}
html[lang="en"] .dhead h1{letter-spacing:-.022em}
html[lang="en"] b,html[lang="en"] strong{letter-spacing:0}
/* 中文里「01挑战」靠汉字自带的侧边距就分得开，英文挤在一起，要显式补一个空隙 */
html[lang="en"] .blk>h2 i{margin-right:.52em}
html[lang="en"] .dbody h2 i,html[lang="en"] .prose h2 i{margin-right:.52em}

/* 首屏两行标题是 .lnf 动效件：底色那一层是 ::before + white-space:nowrap 画的，
   允许换行会让描边和渐变错位，所以只能压字号。中文每行 5–6 个字，英文同字号要
   宽出一倍多（375px 下 29px 会跑出屏外），这里按行宽反推一个 vw 值。 */
@media(max-width:640px){
  html[lang="en"] .hero h1{font-size:clamp(20px,7vw,40px)}
}

/* ---------- 英文版页脚 ----------
   中文页脚第一列那句是 25 个字（约 335px），靠 .f-brand p:first-of-type 的
   white-space:nowrap 排成一行，在 436px 的列宽里刚好。英文同一句 88 个字符
   要 630px，nowrap 会直接冲出去盖住第二列「Service lines」。标语同理。
   所以英文版：授权换行 + 第一列加宽，服务线名也跟着宽松一点。 */
html[lang="en"] .f-brand p:first-of-type{white-space:normal}
html[lang="en"] .f-slg{white-space:normal;letter-spacing:.06em;line-height:1.5}
html[lang="en"] .f-slg span{letter-spacing:.2em}
@media(min-width:901px){
  /* 只在桌面四列档加宽；900 以下本来回两列，别把断点覆盖掉 */
  html[lang="en"] .f-grid{grid-template-columns:minmax(0,2.3fr) 1fr 1fr 1fr}
  /* 服务线名比中文长，桌面档给一点行距，避免两行贴太紧 */
  html[lang="en"] .f-col a{line-height:1.45;margin-bottom:11px}
}
@media(max-width:900px){
  /* 这一档回到两列，第一列只占半宽，必须继续允许换行 */
  html[lang="en"] .f-brand p:first-of-type,
  html[lang="en"] .f-slg{white-space:normal}
}