/* ===== 样板 C：Mercury 风 + 思源宋体 —— 规范见 tools/风格规范.md ===== */
:root{--k0:#171721;--k1:#1e1e2a;--k2:#272735;--t1:#ededf3;--t2:#c3c3cc;--t3:#8b8b9e;--ln:rgba(237,237,243,.1);--acc:#5266eb;--acc2:#8ea2ff;
  --L0:#fcfcfa;--L1:#f4f4f8;--Lt1:#171721;--Lt2:#6f6f80;--Lt3:#a3a3b3;--Lln:#e6e6ee;
  --serif:"Source Han Serif CN","Songti SC",serif;--sans:-apple-system,"PingFang SC","Helvetica Neue",sans-serif;
  --out:cubic-bezier(0,0,.2,1);--io:cubic-bezier(.65,0,.35,1);--std:cubic-bezier(.4,0,.2,1)}
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;background:#0d0d14;overflow:hidden;cursor:none}
body{font-family:var(--sans);color:var(--t1);-webkit-font-smoothing:antialiased}
#stage{position:absolute;left:50%;top:50%;width:1920px;height:1080px;overflow:hidden;background:var(--k0)}
/* 胶片颗粒：慢慢流动，很淡（Mercury 的 noise） */
#stage::after{content:"";position:absolute;inset:-20%;z-index:80;pointer-events:none;opacity:.05;mix-blend-mode:overlay;animation:noise 1.6s steps(5) infinite;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='260' height='260'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
@keyframes noise{0%{background-position:0 0}20%{background-position:-5% -10%}40%{background-position:-15% 5%}60%{background-position:7% -25%}80%{background-position:20% 15%}100%{background-position:0 0}}

/* 顶栏（照 Mercury 导航栏）：且曼学院 logo 左上、和正文左边距对齐；原始黄色徽标不改色、不加底板、100% 不透明、不动 */
#nav{position:absolute;left:160px;right:160px;top:46px;height:62px;display:flex;align-items:center;justify-content:space-between;z-index:70;pointer-events:none}
#nav .logo{height:58px;width:auto;display:block;transition:opacity .4s var(--std) .45s}
/* 整屏大图页（data-hero 写哪几下）：logo 改到底部正中；和左上那个是两个独立元素，先淡出再淡入，不移动 */
#logoB{position:absolute;left:50%;bottom:44px;height:58px;width:auto;transform:translateX(-50%);z-index:70;pointer-events:none;opacity:0;transition:opacity .4s var(--std)}
#stage[data-logo=bottom] #logoB{opacity:1;transition-delay:.45s}
#stage[data-logo=bottom] #nav .logo{opacity:0;transition-delay:0s}
#nav .r{font-size:24px;letter-spacing:.26em;color:var(--t2);transition:color .6s var(--std)}
#stage[data-theme=light] #nav .r{color:var(--Lt2)}

/* 翻页：旧页淡出 + 模糊，新页由虚到实 */
.slide{position:absolute;inset:0;opacity:0;visibility:hidden;filter:blur(6px);transform:translateY(14px);
  transition:opacity .6s var(--std),filter .6s var(--std),transform 0s .9s,visibility 0s .9s}
.slide.active{opacity:1;visibility:visible;filter:none;transform:none;transition:opacity .9s var(--out) .15s,filter .9s var(--out) .15s,transform 1.1s var(--out) .15s}

/* 步骤：透明度 + 14px 位移 + 由虚到实 */
[data-s]{opacity:0;transform:translateY(14px);filter:blur(8px);transition:opacity .8s var(--out),transform .9s var(--out),filter .8s var(--out)}
[data-s].on{opacity:1;transform:none;filter:none;transition-delay:var(--d,0s)}
/* 引擎清旧页（.rst）时瞬间归位；第几下用引擎自带的 .stN，回到这一页不会先倒放一遍 */
.rst,.rst *,.rst *::before,.rst *::after{transition:none!important;animation:none!important}
.hang{margin-right:-.95em}
.eb{font-size:28px;letter-spacing:.36em;color:var(--t2)}
.serif{font-family:var(--serif)}
sup{font-size:.42em;vertical-align:1.05em;margin-left:.04em;letter-spacing:0}

/* ---------- P03 主视觉 → 镜头推进 → 入海口面板 ---------- */
.c03 .cam{position:absolute;inset:0;transform-origin:56% 64%;transition:transform 2.6s var(--io),filter 2.6s var(--io)}
.c03 .bg{position:absolute;inset:0;background:url(img/m_valley.png) center/cover;filter:sepia(.55) saturate(.7) contrast(1.06) brightness(.94)}
.c03 .cam::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,transparent 45%,rgba(40,26,14,.55));mix-blend-mode:multiply}
.slide.active .bg{animation:push 16s var(--out) both}
@keyframes push{from{transform:scale(1.03)}to{transform:scale(1.1)}}
.c03.st1 .cam{transform:scale(1.45);filter:saturate(.7)}
.mk{display:none}
.c03 .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,23,33,.55),rgba(23,23,33,.05) 46%,rgba(23,23,33,.25));transition:background 2s var(--io)}
.c03 .veil::after{content:"";position:absolute;inset:0;background:rgba(23,23,33,.8);opacity:0;transition:opacity 2.2s var(--io)}
.c03.st1 .veil::after{opacity:1}
.c03 .hero{position:absolute;left:0;right:0;top:150px;text-align:center}
.c03 .hero h1{margin-top:26px;font:700 132px/1.15 var(--serif);letter-spacing:.01em;text-shadow:0 2px 40px rgba(23,23,33,.5)}
.c03 .hero p{margin-top:24px;font-size:38px;font-weight:400;color:var(--t1);opacity:.85}
.c03.st1 .hero>*{opacity:0;filter:blur(6px);transform:translateY(-24px);transition-delay:0s}
/* 左：标题 + 细线 + 可展开条目 */
.c03 .left{position:absolute;left:160px;top:170px;width:560px}
.c03 .left h2{font:700 72px/1.25 var(--serif)}
.c03 .rule{height:1px;background:var(--ln);margin:40px 0 6px;transform-origin:0 50%}
.c03 .rule[data-s]{transform:scaleX(0);filter:none}
.c03 .rule.on{transform:none;transition:transform 1.2s var(--out) var(--d),opacity .4s var(--d)}
.c03 .it{border-bottom:1px solid var(--ln);padding:18px 0;color:var(--t3);transition:color .4s var(--std)}
.c03 .it h4{display:flex;align-items:center;gap:16px;font-size:36px;font-weight:500}
.c03 .it h4::before{content:"";width:10px;height:10px;border-radius:50%;background:currentColor;opacity:0;transition:opacity .3s}
.c03 .it .bd{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--std)}
.c03 .it .bd>div{overflow:hidden}
.c03 .it p{padding:10px 0 2px 26px;font-size:30px;line-height:1.5;color:var(--t2);opacity:0;transition:opacity .4s var(--std)}
.c03.st1:not(.st2) .i1,.c03.st2:not(.st3) .i2,.c03.st3 .i3{color:var(--t1)}
.c03.st1:not(.st2) .i1 h4::before,.c03.st2:not(.st3) .i2 h4::before,.c03.st3 .i3 h4::before{opacity:1}
.c03.st1:not(.st2) .i1 .bd,.c03.st2:not(.st3) .i2 .bd,.c03.st3 .i3 .bd{grid-template-rows:1fr}
.c03.st1:not(.st2) .i1 p,.c03.st2:not(.st3) .i2 p,.c03.st3 .i3 p{opacity:1;transition-delay:.2s}
/* 右：产品面板式的入海口示意 */
.c03 .panel{position:absolute;left:780px;top:150px;width:980px;padding:30px 40px 34px;border-radius:28px;background:rgba(30,30,42,.72);
  border:1px solid var(--ln);-webkit-backdrop-filter:blur(26px) saturate(1.2);backdrop-filter:blur(26px) saturate(1.2);box-shadow:0 40px 80px rgba(0,0,0,.35)}
.c03 .ph{display:flex;justify-content:space-between;align-items:center;font-size:32px;font-weight:500}
.c03 .ph span{font-size:22px;color:var(--t3);border:1px solid var(--ln);border-radius:99px;padding:5px 14px;font-weight:400}
.c03 .tabs{position:relative;display:flex;gap:6px;margin:22px 0 18px;font-size:26px;color:var(--t3)}
.c03 .tabs b{position:relative;z-index:1;font-weight:400;padding:10px 24px;transition:color .3s var(--std)}
.c03 .tabs i{position:absolute;left:0;top:0;height:100%;width:var(--w,128px);border-radius:99px;background:rgba(237,237,243,.08);border:1px solid var(--ln);transition:transform .45s var(--std),width .45s var(--std)}
.c03.st1:not(.st2) .tabs b:nth-of-type(1),.c03.st2:not(.st3) .tabs b:nth-of-type(2),.c03.st3 .tabs b:nth-of-type(3){color:var(--t1)}
.c03 .mapw{position:relative;height:450px;border-radius:18px;overflow:hidden;background:#1a1a25}
.c03 .mapw svg{position:absolute;inset:0;width:100%;height:100%}
.c03 .sea{fill:rgba(142,162,255,.07)}
.c03 .coast{fill:none;stroke:rgba(237,237,243,.22);stroke-width:2;stroke-linejoin:round}
.c03 .pv{font:400 28px var(--sans);fill:rgba(237,237,243,.28);letter-spacing:.32em}
.c03 .sl{font:400 30px var(--serif);fill:rgba(142,162,255,.6);letter-spacing:.32em}
.c03 .cr{fill:none;stroke-linecap:round;stroke-dasharray:1400;stroke-dashoffset:1400;transition:stroke-dashoffset 1.8s var(--out),stroke .5s,opacity .5s}
.c03 .up{stroke:var(--t2);stroke-width:4}
.c03 .old{stroke:var(--t1);stroke-width:4}
.c03 .new{stroke:var(--acc2);stroke-width:5;filter:drop-shadow(0 0 8px rgba(142,162,255,.8))}
.c03 .song{stroke:var(--t1);stroke-width:3}
.c03.st1 .up,.c03.st1 .old{stroke-dashoffset:0;transition-delay:1.4s}
.c03.st1 .old{transition-delay:2s}
.c03.st2 .old{stroke:var(--t3);stroke-dasharray:6 12;stroke-dashoffset:0;opacity:.7;transition-delay:0s}
.c03.st2 .new{stroke-dashoffset:0;transition-delay:.3s}
.c03.st3 .new{opacity:.45}
.c03.st3 .song{stroke-dashoffset:0;stroke-dasharray:10 10;transition-delay:.3s}
.c03 .pin{position:absolute;left:var(--x);top:var(--y);width:0;height:0}
.c03 .pin i{position:absolute;left:-8px;top:-8px;width:16px;height:16px;border-radius:50%;background:var(--t1);box-shadow:0 0 0 5px rgba(237,237,243,.15)}
.c03 .pin i::after{content:"";position:absolute;inset:-5px;border-radius:50%;border:1.5px solid var(--t1);animation:ring 2.8s var(--out) infinite}
@keyframes ring{from{transform:scale(.7);opacity:.8}to{transform:scale(3);opacity:0}}
.c03 .pin b{position:absolute;left:18px;top:-68px;white-space:nowrap;padding:8px 16px;border-radius:12px;background:rgba(237,237,243,.1);border:1px solid var(--ln);font:500 26px var(--sans);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
/* 流向字放到地图左上的空处（原来压在河南、江苏和河道上） */
.c03 .flow{position:absolute;left:28px;top:22px}
.c03 .flow small{display:block;font-size:24px;color:var(--t3);letter-spacing:.1em}
.c03 .tc{position:absolute;left:0;top:0;white-space:nowrap;font:500 48px var(--serif);opacity:0;translate:0 5px;transition:opacity .3s var(--std),translate .3s var(--std)}
.c03 .tc em{font:400 24px var(--sans);font-style:normal;color:var(--t2);display:table;margin:14px 0 0;padding:5px 12px;border-radius:99px;background:rgba(142,162,255,.14)}
.c03 .flow .tcs{position:relative;height:120px;margin-top:8px;width:480px}
.c03.st1:not(.st2) .tc1,.c03.st2:not(.st3) .tc2,.c03.st3 .tc3{opacity:1;translate:0 0;transition-delay:.25s}
.c03.st1:not(.st2) .tc1{transition-delay:2.4s}

/* ---------- P24 亮底：焦虑 → 具体 ---------- */
.c24{background:radial-gradient(ellipse 70% 55% at 50% 0%,#eceefa,transparent 70%),var(--L0);color:var(--Lt1)}
.c24 .eb{color:var(--Lt2)}
.c24 .hero{position:absolute;left:0;right:0;top:300px;text-align:center}
.c24 .hero h1{margin-top:34px;font:700 140px/1.28 var(--serif)}
.c24 .focus{display:inline-block;filter:blur(16px);opacity:.25;transition:filter 1.6s var(--out),opacity 1.6s var(--out);transition-delay:2s}
.c24 .hero .on .focus,.c24 .hero.on .focus{filter:none;opacity:1}
.c24.st1 .hero>*{opacity:0;filter:blur(6px);transform:translateY(-20px);transition-delay:0s}
.c24 .left{position:absolute;left:160px;top:190px;width:600px}
.c24 .left h2{font:700 76px/1.3 var(--serif)}
.c24 .rule{height:1px;background:var(--Lln);margin:44px 0 40px}
.c24 .anx{padding:30px 34px;border-radius:24px;background:rgba(255,255,255,.55);border:1px solid var(--Lln);box-shadow:0 20px 50px rgba(23,23,33,.06)}
.c24 .anx small{font-size:26px;letter-spacing:.4em;color:var(--Lt3)}
.c24 .anx p{margin-top:16px;font:500 50px/1.35 var(--serif);color:var(--Lt2);filter:blur(2.6px)}
.c24 .ui{position:absolute;left:840px;top:130px;width:940px;padding:34px 44px 18px;border-radius:28px;background:#fff;border:1px solid var(--Lln);box-shadow:0 40px 90px rgba(23,23,33,.08)}
.c24 .ui h3{display:flex;justify-content:space-between;align-items:baseline;font-size:32px;font-weight:500}
.c24 .ui h3 span{font-size:24px;color:var(--Lt3);font-weight:400}
.c24 .rows{position:relative;margin-top:18px}
.c24 .rows::before{content:"";position:absolute;left:25px;top:50px;bottom:50px;width:1.5px;background:var(--Lln);transform:scaleY(0);transform-origin:50% 0;transition:transform 1.6s var(--out) 1.4s}
.c24.st1 .rows::before{transform:none}
.c24 .row{position:relative;display:flex;align-items:center;gap:30px;height:112px;border-bottom:1px solid var(--L1);filter:none;transform:translateY(5px);transition:opacity .35s var(--std),transform .35s var(--std)}
.c24 .row:last-child{border-bottom:0}
.c24 .row.on{transform:none;transition-delay:var(--d)}
.c24 .row i{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--L1);border:1px solid var(--Lln);font:500 22px var(--sans);font-style:normal;color:var(--Lt2);position:relative;z-index:1}
.c24 .row p{flex:1;font:600 48px var(--serif)}
.c24 .row u{text-decoration:none;width:12px;height:12px;border-right:2px solid var(--Lt3);border-top:2px solid var(--Lt3);transform:rotate(45deg);margin-right:8px}
.c24 .row.last i{background:var(--acc);border-color:var(--acc);color:#fff}
.c24 .row.last u{border-color:var(--acc)}

/* ================= 正式稿：通用件（样板章起用，铺开时都用这些） ================= */
.light{background:radial-gradient(ellipse 70% 55% at 50% 0%,#eceefa,transparent 70%),var(--L0);color:var(--Lt1)}
.light .eb{color:var(--Lt2)}
.pic{position:absolute;inset:0;background:center/cover}
.cam{position:absolute;inset:0;transition:transform 2.6s var(--io),filter 2.6s var(--io)}
.vl{position:absolute;inset:0;background:linear-gradient(180deg,rgba(23,23,33,.55),rgba(23,23,33,.05) 46%,rgba(23,23,33,.25))}
.vl::after{content:"";position:absolute;inset:0;background:rgba(23,23,33,.82);opacity:0;transition:opacity 2.2s var(--io)}
/* 居中大标题 */
.hx{position:absolute;left:0;right:0;top:150px;text-align:center}
.hx h1{margin-top:26px;font:700 132px/1.18 var(--serif);letter-spacing:.01em}
.hx p{margin-top:26px;font-size:38px;color:var(--t2)}
.light .hx p{color:var(--Lt2)}
.onpic h1,.onpic p,.onpic .eb{text-shadow:0 2px 40px rgba(23,23,33,.55)}
.onpic p,.onpic .eb{color:var(--t1)}
.mid{top:300px}
/* 左栏：眉标 + 标题 + 细线 */
.col{position:absolute;left:160px;top:170px;width:580px}
.col h2{margin-top:26px;font:700 72px/1.25 var(--serif)}
.rl{height:1px;background:var(--ln);margin:40px 0 6px;transform-origin:0 50%}
.light .rl{background:var(--Lln)}
.rl[data-s]{transform:scaleX(0);filter:none}
.rl.on{transform:none;transition:transform 1.2s var(--out) var(--d),opacity .4s var(--d)}
/* 可展开条目：a1 在第 1 下亮，a2 第 2 下，a3 第 3 下 */
.acc .it{border-bottom:1px solid var(--ln);padding:16px 0;color:var(--t3);transition:color .4s var(--std)}
.acc .it h4{display:flex;align-items:center;gap:16px;font-size:36px;font-weight:500}
.acc .it h4::before{content:"";width:10px;height:10px;border-radius:50%;background:currentColor;opacity:0;transition:opacity .3s}
.acc .bd{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--std)}
.acc .bd>div{overflow:hidden}
.acc .it p{padding:10px 0 2px 26px;font-size:30px;line-height:1.5;color:var(--t2);opacity:0;transition:opacity .4s var(--std)}
.st1:not(.st2) .a1,.st2:not(.st3) .a2,.st3:not(.st4) .a3{color:var(--t1)}
.st1:not(.st2) .a1 h4::before,.st2:not(.st3) .a2 h4::before,.st3:not(.st4) .a3 h4::before{opacity:1}
.st1:not(.st2) .a1 .bd,.st2:not(.st3) .a2 .bd,.st3:not(.st4) .a3 .bd{grid-template-rows:1fr}
.st1:not(.st2) .a1 p,.st2:not(.st3) .a2 p,.st3:not(.st4) .a3 p{opacity:1;transition-delay:.2s}
/* 深色面板 */
.pn{position:absolute;left:780px;top:150px;width:980px;padding:30px 40px 34px;border-radius:28px;background:var(--k1);border:1px solid var(--ln);box-shadow:0 40px 80px rgba(0,0,0,.35)}
.pn .ph{display:flex;justify-content:space-between;align-items:center;font-size:32px;font-weight:500}
.pn .ph span{font-size:22px;color:var(--t3);border:1px solid var(--ln);border-radius:99px;padding:5px 14px;font-weight:400}
/* 面板里的场景：s1 第 1 下、s2 第 2 下、s3 第 3 下，切换用透明度 + 5px */
.sc{position:absolute;inset:0;padding:40px;opacity:0;translate:0 5px;transition:opacity .3s var(--std),translate .3s var(--std)}
.st1:not(.st2) .s1,.st2:not(.st3) .s2,.st3:not(.st4) .s3{opacity:1;translate:0 0;transition-delay:.3s}

/* ---------- P04 良田变河床 / 河床变沃土 ---------- */
.c04 .top{position:absolute;left:0;right:0;top:150px;text-align:center}
.c04 .top h2{margin-top:24px;font:700 72px/1.25 var(--serif)}
.c04 .pair{position:absolute;left:160px;top:336px;width:1600px;display:grid;grid-template-columns:1fr 1fr;gap:24px}
.c04 .cd{position:relative;height:464px;border-radius:28px;overflow:hidden;border:1px solid var(--ln);background:var(--k1)}
.c04 .pic{transition:filter 1.6s var(--io),transform 6s var(--out)}
.c04 .lost .pic{background-image:url(img/m_lost.png)}
.c04 .gain .pic{background-image:url(img/m_fertile.png)}
.c04 .cd::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(23,23,33,.85))}
.c04 .cp{position:absolute;left:36px;right:36px;bottom:30px;z-index:2;display:flex;justify-content:space-between;align-items:baseline;transition:opacity .5s var(--std)}
.c04 .cp b{font:600 52px var(--serif)}
.c04 .cp span{font-size:28px;color:var(--t2)}
.c04 .big{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center}
.c04 .big small{position:absolute;left:0;right:0;top:calc(50% - 130px);text-align:center;font-size:32px;letter-spacing:.3em;margin-right:-.3em;color:var(--t2)}
.c04 .big em{margin-top:0;font:700 140px/1.1 var(--serif);font-style:normal;text-shadow:0 2px 40px rgba(23,23,33,.6)}
.c04.st1 .lost .pic{filter:brightness(.42) saturate(.5);transform:scale(1.06)}
.c04.st1 .gain .pic{filter:brightness(.8) saturate(1.1);transform:scale(1.06)}
.c04.st1 .cp{opacity:0}

/* ---------- P05 四种人 ---------- */
.c05 .col{width:1200px}
.c05 .cards{position:absolute;left:160px;top:356px;width:1600px;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.c05 .cd{height:444px;padding:0 30px 0;border-radius:24px;background:var(--k1);border:1px solid var(--ln);color:var(--t3);transition:opacity .8s var(--out),transform .9s var(--out),filter .8s var(--out),color .5s var(--std),background .5s var(--std),border-color .5s var(--std)}
.c05 .cd.on{transition-delay:var(--d),var(--d),var(--d),0s,0s,0s}
.c05 .cd svg{display:block;width:calc(100% + 60px);margin:0 -30px;height:118px;border-radius:24px 24px 0 0;background:radial-gradient(ellipse 80% 90% at 78% 100%,rgba(142,162,255,.1),transparent 70%)}
.c05 .cd i{display:block;margin-top:18px;font:400 24px var(--sans);font-style:normal;letter-spacing:.1em}
.c05 .cd h4{margin-top:8px;font:600 46px/1.2 var(--serif)}
.c05 .cd p{margin-top:14px;font-size:28px;line-height:1.5;height:84px}
.c05 .cd em{display:block;margin-top:18px;padding-top:18px;border-top:1px solid var(--ln);font-size:28px;font-style:normal}
.c05 .dot{fill:currentColor}.c05 .hol{fill:none;stroke:currentColor;stroke-width:2}
.c05 .trl{fill:none;stroke:currentColor;stroke-width:2;stroke-dasharray:3 8;stroke-linecap:round;opacity:.7}
.c05 .bk{stroke:rgba(237,237,243,.16);stroke-width:1.5;stroke-dasharray:4 6}
.c05 .wv{fill:none;stroke:var(--acc2);stroke-width:2.5;stroke-linecap:round;opacity:.75}
.c05.st1:not(.st2) .k1,.c05.st2:not(.st3) .k2,.c05.st3:not(.st4) .k3,.c05.st4 .k4{color:var(--t1);background:var(--k2);border-color:rgba(237,237,243,.2)}
.c05.st1:not(.st2) .k1 em,.c05.st2:not(.st3) .k2 em,.c05.st3:not(.st4) .k3 em,.c05.st4 .k4 em{color:var(--acc2)}

/* ---------- P06 AI，就是这一代人的黄河改道 ---------- */
.c06 .pic{background-image:url(img/m_fork2.png),url(img/m_fork.png)}
.c06 .cam{transform-origin:40% 55%}
.c06 .hx h1{font-size:124px}
.c06 .hx p{font-size:44px;margin-top:34px}
.c06.st2 .cam{transform:scale(1.35);filter:saturate(.7)}
.c06.st2 .vl::after{opacity:1}
.c06 .ask h1{font-size:150px}

/* ---------- P37 粗算 ---------- */
.c37 .col{width:1400px}
.c37 .col h2{font-size:76px}
.c37 .tag{position:absolute;right:160px;top:262px;font-size:26px;color:var(--Lt2);padding:8px 22px;border-radius:99px;border:1px solid var(--Lln);background:rgba(255,255,255,.6)}
.c37 .fx{position:absolute;left:160px;top:410px;width:1600px;display:flex;align-items:flex-start;justify-content:space-between}
.c37 .t b{display:block;font:500 136px/1 var(--serif);white-space:nowrap;letter-spacing:-.01em}
.c37 .t b small{font-size:.38em;color:var(--Lt2);margin-left:.14em;font-weight:400;letter-spacing:0}
.c37 .t span{display:block;margin-top:24px;font-size:32px;color:var(--Lt2)}
.c37 .t em{display:block;margin-top:6px;font-size:24px;font-style:normal;color:var(--Lt3)}
.c37 .op{font:300 96px/136px var(--serif);color:var(--Lt3)}
.c37 .t.res b{color:var(--acc)}
.c37 .rl{position:absolute;left:160px;top:668px;width:1600px;margin:0}
.c37 .pure{position:absolute;left:160px;top:704px;width:1600px;display:flex;align-items:center;gap:16px}
.c37 .pure span{font-size:32px;padding:14px 28px;border-radius:99px;background:#fff;border:1px solid var(--Lln);box-shadow:0 10px 30px rgba(23,23,33,.05)}
.c37 .pure b{margin-left:auto;font:600 56px var(--serif)}

/* ---------- P38 一连串「不做」 ---------- */
.c38 .hx h1{font-size:124px}
.c38 .pn{height:634px;padding:0}
.c38 .sc{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.c38 .bx{position:relative;border-radius:20px;background:var(--k2);border:1px solid var(--ln);display:flex;flex-direction:column;overflow:hidden}
.c38 .bx .v{flex:1;position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:12px}
.c38 .bx .c{padding:0 30px 28px}
.c38 .bx .c small{font-size:24px;letter-spacing:.3em;color:var(--t3)}
.c38 .bx .c p{margin-top:10px;font:600 40px/1.3 var(--serif)}
.c38 .bx .c em{display:block;margin-top:8px;font-size:26px;font-style:normal;color:var(--t2)}
.c38 .bx.no{background:transparent}.c38 .bx.no .c p{color:var(--t3)}
.c38 .dv{width:58px;height:150px;border-radius:14px;background:linear-gradient(180deg,#3a3a4c,#2b2b3a);border:1px solid var(--ln);box-shadow:6px 0 0 #232330}
.c38 .wt{position:relative;width:150px;height:176px;border-radius:44px;background:linear-gradient(180deg,#fff,#d6d8e6);box-shadow:0 0 50px rgba(237,237,243,.3)}
.c38 .wt::before{content:"";position:absolute;left:30px;right:30px;top:-70px;bottom:-70px;z-index:-1;border-radius:16px;background:linear-gradient(180deg,transparent,#4a4a5e 20%,#4a4a5e 80%,transparent)}
.c38 .wt::after{content:"";position:absolute;inset:14px;border-radius:32px;background:#1e1e2a}
.c38 .lines{width:76%;display:grid;gap:18px}
.c38 .lines i{height:12px;border-radius:6px;background:rgba(237,237,243,.14)}
.c38 .wave{width:84%;height:150px}
.c38 .wave rect{fill:#e6e7f0}
.c38 .tags{position:absolute;left:0;right:0;top:22px;display:flex;justify-content:center;gap:10px}
.c38 .tags span,.c38 .nos span{font-size:24px;padding:6px 16px;border-radius:99px;background:rgba(142,162,255,.14);color:var(--t1);white-space:nowrap}
.c38 .nos{display:grid;gap:16px;justify-items:start}
.c38 .nos span{font-size:32px;padding:12px 26px;background:transparent;border:1px solid var(--ln);color:var(--t3);text-decoration:line-through;text-decoration-color:rgba(237,237,243,.35)}
.c38 .ph2{position:relative;width:130px;height:240px;border-radius:30px;border:2px solid var(--t2);display:grid;place-items:center}
.c38 .ph2 b{width:56px;height:56px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#cfd2e2 60%,#a9acc0);box-shadow:0 0 40px rgba(237,237,243,.35)}
.c38 .fin h1{font-size:124px;line-height:1.28}


/* 校徽位：有 assets/img/badge/校名.png 就用图，没有就先显示一个字 */
.bdg{flex:none;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#dcdeea 60%,#b9bccd);color:#2b2b3a;font-family:var(--serif);font-weight:700;overflow:hidden}
.bdg.has{background:#fff}
.bdg img{width:86%;height:86%;object-fit:contain}

/* ---------- P01 很高兴来到河北大学 / P01b 小缘分 ---------- */
.c01 .pic,.c01b .pic{background-image:url(img/hbu.jpg),url(img/m_plain.png)}
.c01b .vl::after{opacity:1}
.c01b .pic{filter:blur(6px) saturate(.7);transform:scale(1.2)}
.c01b .hx{top:170px}
.c01b .way{position:absolute;left:300px;right:300px;top:250px;display:flex;align-items:flex-start;gap:50px}
.c01b .nd{width:420px;text-align:center}
.c01b .nd .bdg{width:200px;height:200px;margin:0 auto;font-size:96px;box-shadow:0 0 60px rgba(237,237,243,.2)}
.c01b .nd small{display:block;margin-top:30px;font-size:28px;color:var(--t3);letter-spacing:.14em}
.c01b .nd b{display:block;margin-top:12px;font:600 64px/1.15 var(--serif);white-space:nowrap}
.c01b .ln{flex:1;position:relative;height:200px;transform:none;filter:none}
.c01b .ln::before{content:"";position:absolute;left:0;right:0;top:100px;height:1.5px;background:linear-gradient(90deg,var(--t3),var(--t1));transform:scaleX(0);transform-origin:0 50%;transition:transform 1.6s var(--io)}
.c01b .ln::after{content:"";position:absolute;right:0;top:94px;width:12px;height:12px;border-right:1.5px solid var(--t1);border-top:1.5px solid var(--t1);transform:rotate(45deg);opacity:0;transition:opacity .4s}
.c01b .ln.on::before{transform:none;transition-delay:var(--d)}
.c01b .ln.on::after{opacity:1;transition-delay:calc(var(--d) + 1.3s)}
.c01b .home{position:absolute;left:0;right:0;top:650px;text-align:center}
.c01b .home h2{font:700 100px/1.2 var(--serif)}

/* ---------- P02 照片底：七所学校 → 问题一个个冒出来 → 不给标准答案 / P02b 过渡 ---------- */
.c02 .pic{background-image:url(img/p_talk.jpg);filter:saturate(.72) contrast(1.02);transition:filter 1.4s var(--io),transform 2.4s var(--io)}
.c02 .sh{position:absolute;inset:0;background:linear-gradient(90deg,rgba(23,23,33,.35),rgba(23,23,33,.2) 34%,rgba(23,23,33,.9) 54%,rgba(23,23,33,.95)),linear-gradient(180deg,rgba(23,23,33,.5),transparent 30%)}
.c02 .sh::after{content:"";position:absolute;inset:0;background:rgba(23,23,33,.86);opacity:0;transition:opacity 1.2s var(--io)}
.c02.st1 .sh::after{opacity:1}
.c02.st1 .pic{filter:saturate(.5) blur(10px);transform:scale(1.08)}
.c02 .rt{position:absolute;left:1070px;top:170px;width:700px}
.c02 .rt h2{margin-top:26px;font:700 72px/1.25 var(--serif)}
.c02 .sch{margin-top:44px;display:grid;grid-template-columns:1fr 1fr;gap:26px 30px}
.c02 .sch div{display:flex;align-items:center;gap:18px}
.c02 .sch .bdg{width:62px;height:62px;font-size:30px}
.c02 .sch b{font:600 40px var(--serif);white-space:nowrap}
.c02 .qs{position:absolute;left:0;right:0;top:170px;text-align:center}
.c02 .q{margin-top:50px;font:700 88px/1.2 var(--serif)}
.c02 .q:first-of-type{margin-top:64px}
.c02 .say h1{font-size:120px;line-height:1.28}
.c02b{background:radial-gradient(ellipse 60% 50% at 50% 40%,rgba(142,162,255,.1),transparent 70%)}
.c02b .hx h1{font-size:124px;line-height:1.28}
.c02b .hx p{margin-top:44px;font-size:42px}

/* ---------- P35 Auday：全天候 → 80+ 种活动 → 以前 / 现在 ---------- */
.c35 .wimg{position:absolute;left:1000px;top:60px;width:860px;height:484px;background:url(img/m_watch.png) center/cover;
  -webkit-mask-image:radial-gradient(ellipse 50% 60% at 76% 52%,#000 50%,transparent 82%);mask-image:radial-gradient(ellipse 50% 60% at 76% 52%,#000 50%,transparent 82%)}
.c35 .col{width:760px;top:150px}
.c35 .col h2{margin-top:30px;font:700 120px/1 var(--serif)}
.c35 .lead{margin-top:28px;font-size:38px;color:var(--t2)}
.c35 .who{margin-top:30px;display:flex;gap:12px}
.c35 .who span{font-size:26px;color:var(--t2);padding:8px 20px;border-radius:99px;border:1px solid var(--ln);background:rgba(237,237,243,.05)}
.c35 .day{position:absolute;left:160px;top:548px;width:1600px}
.c35 .day .wave{display:block;width:100%;height:120px;margin-top:22px}
.c35 .day .wave rect{fill:#dfe1ee}
.c35 .hrs,.c35 .mo{display:flex;justify-content:space-between}
.c35 .hrs{margin-top:14px;padding-top:12px;border-top:1px solid var(--ln);font-size:22px;color:var(--t3);font-variant-numeric:tabular-nums}
.c35 .mo{margin-top:10px;font-size:28px;color:var(--t2)}
.c35 .n{position:absolute;right:160px;top:130px;text-align:right}
.c35 .n b{display:block;font:500 220px/1 var(--serif);letter-spacing:-.02em}
.c35 .n b small{font-size:.45em;color:var(--t2);vertical-align:.7em;margin-left:.04em}
.c35 .n span{display:block;margin-top:6px;font-size:34px;color:var(--t2)}
.c35 .flow{position:absolute;left:160px;top:478px;font-size:30px;color:var(--t2);white-space:nowrap}
.c35 .flow u{text-decoration:none;color:var(--t3);margin:0 16px}
.c35 .mq{position:absolute;left:0;right:0;top:548px;display:grid;gap:18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.c35 .mq div{display:flex;gap:14px;width:max-content;animation:mq 90s linear infinite}
.c35 .mq div:nth-child(2){animation-direction:reverse;animation-duration:110s}
.c35 .mq span{font-size:30px;padding:12px 28px;border-radius:99px;border:1px solid var(--ln);background:var(--k1);color:var(--t1);white-space:nowrap}
.c35 .mq span:nth-child(3n){background:var(--k2)}.c35 .mq span:nth-child(7n){color:var(--acc2)}
@keyframes mq{to{transform:translateX(-50%)}}
.c35 .note{position:absolute;right:160px;top:800px;font-size:22px;color:var(--t3)}
.c35 .top2{position:absolute;left:0;right:0;top:150px;text-align:center}
.c35 .top2 h2{margin-top:24px;font:700 72px/1.25 var(--serif)}
.c35 .pair{position:absolute;left:160px;top:336px;width:1600px;display:grid;grid-template-columns:1fr 1fr;gap:24px}
.c35 .pair .cd{position:relative;height:464px;border-radius:28px;overflow:hidden;border:1px solid var(--ln);background:var(--k1);display:flex;flex-direction:column}
.c35 .pair .v{flex:1;position:relative;display:grid;place-items:center}
.c35 .pair .now .v{background:url(img/m_watch.png) 68% 50%/150% auto no-repeat}
.c35 .pair .c{padding:0 36px 30px}
.c35 .pair .c small{font-size:26px;letter-spacing:.3em;color:var(--t3)}
.c35 .pair .c p{margin-top:10px;font:600 42px var(--serif);white-space:nowrap}
.c35 .pair .was .c p{color:var(--t2)}.c35 .pair .now{background:var(--k2)}.c35 .pair .now .c small{color:var(--acc2)}
.c35 .phn{position:relative;width:150px;height:290px;border-radius:30px;background:linear-gradient(180deg,#3a3a4c,#2b2b3a);border:1px solid var(--ln)}
.c35 .phn::before{content:"";position:absolute;left:14px;top:14px;width:54px;height:54px;border-radius:16px;background:#232330;border:1px solid var(--ln)}
.c35 .phn::after{content:"";position:absolute;left:25px;top:120px;width:100px;height:100px;border-radius:50%;background:linear-gradient(180deg,#8b8b9e,#5c5c70);box-shadow:8px 8px 0 #232330,0 0 0 1px var(--ln)}

/* ---------- P36 时间线 → 三行数据 → 两枚桂冠（重点） ---------- */
.c36 .hd{position:absolute;left:160px;top:150px}
.c36 .hd h2{margin-top:26px;font:700 96px/1.1 var(--serif)}
.tl{position:absolute;left:160px;top:590px;width:1600px;height:0}
.tl .ax{position:absolute;left:0;right:0;top:0;height:1.5px;background:linear-gradient(90deg,var(--t3),var(--t1));transform:scaleX(0);transform-origin:0 50%;filter:none;transition:transform 2.4s var(--io),opacity .4s}
.tl .ax.on{transform:none;transition-delay:var(--d)}
.tl .nd{position:absolute;left:var(--x);width:300px}
.tl .nd i{position:absolute;left:0;top:-7px;width:14px;height:14px;border-radius:50%;background:var(--t1);box-shadow:0 0 0 6px rgba(237,237,243,.12)}
.tl .nd b{display:block;font:500 68px/1.1 var(--serif);white-space:nowrap}
.tl .nd b small{font-size:.5em;color:var(--t2);margin:0 .1em;font-weight:400}
.tl .nd span{display:block;margin-top:10px;font-size:28px;line-height:1.4;color:var(--t2)}
.tl .nd em{display:block;font-size:22px;font-style:normal;color:var(--t3);margin-top:4px}
.tl .nd.up{bottom:0;padding-bottom:36px}.tl .nd.up i{top:auto;bottom:-7px}.tl .nd.dn{top:0;padding-top:34px}
.tl .nd.hi b{font-size:96px}
.c36 .dt{position:absolute;left:160px;top:176px;width:1600px}
.c36 .dr{display:grid;grid-template-columns:560px 1fr;align-items:center;height:186px;border-bottom:1px solid var(--ln)}
.c36 .dr:last-child{border-bottom:0}
.c36 .dr h4{font:500 108px/1 var(--serif);white-space:nowrap}
.c36 .dr h4 small{font-size:.38em;color:var(--t2);margin-left:.14em;font-weight:400}
.c36 .dr h4+span{display:block;margin-top:12px;font-size:30px;color:var(--t2)}
.c36 .vs{display:grid;gap:14px}
.c36 .vs div{display:flex;align-items:center;gap:22px;font-size:28px;color:var(--t2);white-space:nowrap}
.c36 .vs i{display:block;height:38px;border-radius:19px;width:calc(var(--w) * 1%);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.4s var(--out) 1.2s}
.c36 .vs .ap i{background:linear-gradient(180deg,#3a3a4c,#2b2b3a);border:1px solid var(--ln)}
.c36 .vs .au i{background:linear-gradient(180deg,#fff,#d6d8e6);box-shadow:0 0 30px rgba(237,237,243,.3)}
.c36 .vs .au{color:var(--t1)}
.c36.st1 .vs i,.c36.st1 .bat i{transform:none}
.c36 .bat{display:flex;align-items:center;gap:24px;font:500 40px var(--serif);color:var(--t2)}
.c36 .bat div{flex:1;height:76px;border-radius:38px;padding:8px;background:linear-gradient(180deg,#2e2e3e,#232330);border:1px solid var(--ln);box-shadow:inset 0 2px 6px rgba(0,0,0,.4)}
.c36 .bat i{display:block;height:100%;width:50%;border-radius:30px;background:linear-gradient(180deg,#fff,#d6d8e6);box-shadow:0 0 36px rgba(237,237,243,.35);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.6s var(--out) 1.4s}
.c36 .coin{display:flex;align-items:center;gap:16px;font-size:28px;color:var(--t2)}
.c36 .coin b{display:grid;place-items:center;width:76px;height:76px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#cfd2e2 60%,#a9acc0);box-shadow:0 0 30px rgba(237,237,243,.25);font:700 26px var(--serif);color:#2b2b3a}
.c36 .coin span{margin-left:14px}
.c36 .mini{position:absolute;left:0;right:0;top:150px;text-align:center;font-size:26px;color:var(--t3);letter-spacing:.06em}
.c36 .mini u{text-decoration:none;margin:0 18px;opacity:.5}
.c36 .gh{position:absolute;left:0;right:0;top:226px;text-align:center}
.c36 .gh h3{margin-top:22px;font:700 76px/1.18 var(--serif);letter-spacing:.01em}
.c36 .gh p{margin-top:6px;font-size:24px;color:var(--t3)}
.c36 .lrs{display:flex;justify-content:center;gap:90px;margin-top:26px}
.c36 .lr{position:relative;width:440px;height:392px}
.c36 .lr::before{content:"";position:absolute;inset:-12%;background:radial-gradient(circle at 50% 46%,rgba(142,162,255,.16),transparent 62%);opacity:0;transition:opacity .6s var(--std)}
.c36.st2 .lr::before{opacity:1;transition:opacity 1.6s var(--out) .7s}
.c36 .lr svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 14px rgba(237,237,243,.18))}
.c36 .lf{opacity:0;transform:scale(.3);transform-box:fill-box;transform-origin:center;transition:opacity .4s var(--std),transform .5s var(--std)}
.c36.st2 .lf{opacity:1;transform:none;transition:opacity .6s var(--out) var(--ld,0s),transform .9s var(--out) var(--ld,0s)}
.c36 .lr .txt{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-bottom:14px}
.c36 .lr .num{font:500 136px/1 var(--serif);letter-spacing:-.01em;white-space:nowrap}
.c36 .lr .num small{font-size:.4em;color:var(--t2);margin-left:.08em;font-weight:400}
.c36 .lr .lab{margin-top:16px;font-size:28px;color:var(--t2);letter-spacing:.3em;margin-right:-.3em}

/* P35 合并版：第 1 下五个节点，第 2 下一排数据 + 粗算大数 */
.c35 .tl{top:650px}
.c35 .tl .nd b{font-size:54px}
/* 最后一个节点「还能问它」：小字不折行，靠右对齐，不往上顶到手表图 */
.c35 .tl .nd span{white-space:nowrap}
.c35 .tl .nd:last-child{left:auto;right:0;width:auto;text-align:right}
.c35 .tl .nd:last-child i{left:auto;right:0}
.c35 .stats{position:absolute;left:160px;top:190px;width:1600px;display:grid;grid-template-columns:repeat(4,1fr)}
.c35 .st b{display:block;font:500 124px/1 var(--serif);white-space:nowrap;letter-spacing:-.01em}
.c35 .st b small{font-size:.38em;color:var(--t2);margin:0 .14em;font-weight:400}
.c35 .st span{display:block;margin-top:20px;font-size:32px;color:var(--t2)}
.c35 .st em{display:block;margin-top:6px;font-size:22px;font-style:normal;color:var(--t3)}
.c35 .rl2{position:absolute;left:160px;top:452px;width:1600px;margin:0}
.c35 .est{position:absolute;left:160px;top:496px;width:1600px;display:flex;align-items:flex-end;justify-content:space-between}
.c35 .est h3{margin-top:22px;font:700 72px/1.2 var(--serif)}
.c35 .est p{margin-top:18px;font-size:30px;color:var(--t2)}
.c35 .est b{font:500 220px/1 var(--serif);letter-spacing:-.02em;white-space:nowrap;color:var(--acc2);text-shadow:0 0 80px rgba(142,162,255,.35)}
.c35 .est b small{font-size:.3em;color:var(--t1);margin-left:.14em;font-weight:400;letter-spacing:0}

/* 到第 n 下时自己淡出（放在文件最后，压过 [data-s].on） */
.st1 .x1,.st2 .x2,.st3 .x3,.st4 .x4{opacity:0;filter:blur(6px);transform:translateY(-20px);transition-delay:0s}