/* 动效样式（首页与产品总览页加载，其余页面不加载）。
   动画写法统一：默认显示最后一帧（脚本没跑、减少动态效果时就是这个样子）；
   html.anim 下先藏起来，data-seq 的元素被脚本依次加上 s1、s2…，对应的那一步才出现。 */

/* ---------- 进场 ---------- */
.anim .rv{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .8s var(--ease);transition-delay:var(--d,0s)}
.anim .rv.is-in{opacity:1;transform:none}  /* 别叫 .in：site.css 里 .in 是输入框 */

/* ---------- 首页首屏：品牌片无声循环 + 光点连线网 + 两句标语 + 结论句 ---------- */
.hv{position:relative;height:calc(100svh - var(--bar));min-height:560px;overflow:hidden;display:flex;align-items:center;
  background:radial-gradient(ellipse 70% 60% at 50% 50%,#0B1710 0%,#060B0E 55%,#05090C 100%)}
.hv-fx{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
/* 背后慢慢转的几道光束（screen 叠加，减少动态效果时不转） */
.hv-rays{position:absolute;left:50%;top:50%;width:160vmax;height:160vmax;margin:-80vmax 0 0 -80vmax;z-index:0;pointer-events:none;mix-blend-mode:screen;opacity:.9;
  background:conic-gradient(from 0deg,transparent 0 6%,rgba(107,173,70,.30) 8.5%,transparent 11% 27%,rgba(134,196,99,.20) 30%,transparent 34% 52%,rgba(220,164,92,.16) 55%,transparent 58% 74%,rgba(107,173,70,.26) 77%,transparent 81%);
  -webkit-mask-image:radial-gradient(circle,#000 0 14%,transparent 50%);mask-image:radial-gradient(circle,#000 0 14%,transparent 50%);filter:blur(10px);animation:spin 70s linear infinite}
@keyframes spin{to{transform:rotate(1turn)}}
/* 星核中心的光晕：播放键就在它正中 */
.hv-core{position:absolute;left:50%;top:50%;width:min(70vh,640px);aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;z-index:0;pointer-events:none;
  background:radial-gradient(circle,rgba(134,196,99,.26) 0%,rgba(107,173,70,.08) 34%,transparent 66%);animation:breathe 7s ease-in-out infinite}
@keyframes breathe{50%{transform:translate(-50%,-50%) scale(1.08);opacity:.8}}
/* 标语那一条压暗一点，边缘收暗，底部融进下一屏 */
.hv-shade{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 46% 30% at 50% 50%,rgba(5,9,12,.5) 0%,rgba(5,9,12,.28) 55%,transparent 100%),radial-gradient(ellipse 90% 80% at 50% 50%,transparent 58%,rgba(5,9,12,.7)),linear-gradient(180deg,transparent 78%,var(--screen))}
.hv-c{position:relative;z-index:2;width:100%;text-align:center}
.hv-s,.hv-h1,.hv-c .eyebrow{text-shadow:0 2px 18px rgba(0,0,0,.85),0 0 40px rgba(0,0,0,.6)}
.hv-c .eyebrow{color:#C9D3CE}
.hv-c .eyebrow{margin-bottom:28px}
.hv-row{display:flex;align-items:center;justify-content:center;gap:clamp(22px,3.4vw,60px)}
.hv-s{flex:1 1 0;font:700 clamp(28px,4.2vw,66px)/1.15 var(--f-disp);letter-spacing:0;white-space:nowrap}
.hv-s.l{text-align:right}.hv-s.r{text-align:left}
.hv-play{position:relative;flex:none;display:grid;place-items:center;width:clamp(78px,7vw,108px);height:clamp(78px,7vw,108px);border-radius:50%;background:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.75),0 16px 44px rgba(0,0,0,.45);color:#fff;transition:transform .3s var(--ease),background .3s,box-shadow .3s}
.hv-play svg{width:36%;height:36%;margin-left:7%}
.hv-play:hover{transform:scale(1.06);background:rgba(107,173,70,.3);box-shadow:inset 0 0 0 1.5px var(--leaf),0 16px 44px rgba(0,0,0,.45)}
.hv-play::before,.hv-play::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid rgba(255,255,255,.5);opacity:0;animation:ring 2.8s var(--ease) infinite}
.hv-play::after{animation-delay:1.3s}
@keyframes ring{0%{transform:scale(1);opacity:.5}100%{transform:scale(1.8);opacity:0}}
.hv-h1{margin:36px auto 0;font:600 clamp(16px,1.6vw,21px)/1.6 var(--f-cjk);color:#D3DCD7;letter-spacing:.02em}
.hv-c .acts{justify-content:center;margin-top:26px}
.hv-ghost{background:rgba(8,13,17,.4);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.hv-down{z-index:2;position:absolute;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translateX(-50%);width:40px;height:40px;display:grid;place-items:center;color:var(--t2);text-decoration:none;font-size:18px;animation:bob 1.8s var(--ease) infinite}
@keyframes bob{50%{margin-bottom:-5px}}
@media (max-width:760px){
  .hv{height:auto;min-height:calc(100svh - var(--bar));padding:48px 0 72px}
  .hv-row{flex-direction:column;gap:18px}
  .hv-s{flex:none;text-align:center!important;font-size:clamp(28px,8.4vw,38px)}
  .hv-play{width:84px;height:84px}
  .hv-h1{margin-top:26px;padding:0 8px}
  .hv-shade{background:radial-gradient(ellipse 70% 26% at 50% 50%,rgba(5,9,12,.32),transparent 100%),radial-gradient(ellipse 100% 80% at 50% 50%,transparent 60%,rgba(5,9,12,.65)),linear-gradient(180deg,transparent 80%,var(--screen))}
}
/* 进场：两句从两边合拢，播放键弹出，结论句和按钮随后 */
.anim .hv-s.l{opacity:0;transform:translateX(-40px);transition:opacity .9s var(--ease) .15s,transform 1s var(--ease) .15s}
.anim .hv-s.r{opacity:0;transform:translateX(40px);transition:opacity .9s var(--ease) .15s,transform 1s var(--ease) .15s}
.anim .hv-play{opacity:0;transform:scale(.6);transition:opacity .6s var(--ease) .45s,transform .7s cubic-bezier(.3,1.5,.5,1) .45s}
.anim .hv-in{opacity:0;transform:translateY(12px);transition:opacity .8s var(--ease) var(--d,0s),transform .9s var(--ease) var(--d,0s)}
.anim .hv.go .hv-s,.anim .hv.go .hv-play,.anim .hv.go .hv-in{opacity:1;transform:none}
.anim .hv.go .hv-play:hover{transform:scale(1.06)}
@media (max-width:760px){.anim .hv-s.l,.anim .hv-s.r{transform:translateY(16px)}}

/* ---------- 第二屏：光点从「散」到「连」（滚动驱动；没脚本时就是一段普通的三句话） ---------- */
.flow{position:relative;padding:96px 0 24px}
.flow-fx{display:none}
.flow h2{font:700 clamp(28px,3.8vw,46px)/1.18 var(--f-disp);margin-bottom:28px;max-width:16em}
.flow-steps{list-style:none;margin:0;padding:0;display:grid;gap:14px;max-width:640px}
.flow-steps li{display:flex;gap:16px;align-items:baseline;font-size:17px;color:#C6D0CB}
.flow-steps b{flex:none;font:700 30px/1 var(--f-disp);color:var(--leaf)}
.flow-more{margin-top:24px}
/* 有脚本、没开减少动态效果：变成 260vh 高的一段，画布钉在屏幕上，三句话随滚动轮流亮 */
.flow.on{height:260vh;padding:0}
.flow.on .flow-pin{position:sticky;top:var(--bar);height:calc(100svh - var(--bar));overflow:hidden;display:flex;align-items:center}
.flow.on .flow-fx{display:block;position:absolute;inset:0;width:100%;height:100%}
.flow-labs{display:none}
.flow.on .flow-labs{display:block;position:absolute;inset:0;pointer-events:none;z-index:1}
.flow-labs span{position:absolute;left:0;top:0;font:600 12px/1.4 var(--f-cjk);letter-spacing:.04em;color:#D4DCD8;padding:3px 10px;border-radius:999px;border:1px solid rgba(226,236,231,.2);background:rgba(8,13,17,.6);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);white-space:nowrap;opacity:0;will-change:transform}
.flow-labs span.ai{font:700 13px/1.4 var(--f-lat);color:var(--leaf-ink);background:var(--leaf);border-color:transparent;box-shadow:0 0 24px var(--leaf-glow)}
.flow.on .flow-txt{position:relative;pointer-events:none;width:100%}  /* 外层是 flex，不写 width 会缩成内容宽然后被居中 */
@media (min-width:761px){.flow.on .flow-txt > *{max-width:min(560px,42vw)}.flow.on h2{font-size:clamp(26px,3vw,42px)}}
.flow.on .flow-txt a{pointer-events:auto}
.flow.on .flow-steps li{opacity:.22;transition:opacity .5s,transform .5s var(--ease);transform:translateX(-6px)}
.flow.on[data-ph="1"] .f1,.flow.on[data-ph="2"] .f2,.flow.on[data-ph="3"] .f3{opacity:1;transform:none}
.flow.on .flow-more{opacity:0;transition:opacity .5s}
.flow.on[data-ph="3"] .flow-more{opacity:1}
.flow.on .flow-txt::before{content:"";position:absolute;inset:-40px -60px -40px calc(var(--gut) * -1 - 40px);background:radial-gradient(ellipse 60% 70% at 25% 50%,rgba(8,13,17,.85),transparent 75%);z-index:-1}
@media (max-width:760px){.flow.on{height:220vh}.flow.on .flow-pin{align-items:flex-end;padding-bottom:40px}.flow-steps li{font-size:15.5px}.flow-steps b{font-size:24px}}

/* ---------- 三层：三块发光平面，从上往下落位叠起来 ---------- */
.stk{display:grid;grid-template-columns:minmax(0,1fr);gap:28px;align-items:center}
@media (min-width:960px){.stk{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px}}
.stk-vis{position:relative;height:380px;perspective:1100px;perspective-origin:50% 30%}
.plate{position:absolute;left:50%;top:50%;width:min(300px,62vw);aspect-ratio:1;margin:calc(min(300px,62vw) / -2) 0 0 calc(min(300px,62vw) / -2);transform-style:preserve-3d;transform:rotateX(58deg) rotateZ(-42deg) translateZ(var(--z));border-radius:18px;border:1.5px solid rgba(107,173,70,.55);
  background:linear-gradient(135deg,rgba(107,173,70,.20),rgba(13,20,25,.75) 60%),repeating-linear-gradient(0deg,rgba(226,236,231,.07) 0 1px,transparent 1px 26px),repeating-linear-gradient(90deg,rgba(226,236,231,.07) 0 1px,transparent 1px 26px);
  box-shadow:0 0 40px rgba(107,173,70,.18),inset 0 0 30px rgba(107,173,70,.10);transition:transform 1s var(--ease),opacity .8s}
.plate.pl1{--z:-90px}.plate.pl2{--z:0px}.plate.pl3{--z:90px;border-color:var(--leaf)}
.plate span{position:absolute;left:18px;bottom:14px;font:600 15px var(--f-cjk);color:var(--t)}
.plate i{position:absolute;inset:22%;border-radius:12px;border:1px dashed rgba(107,173,70,.4)}
.stk-ai{position:absolute;left:50%;top:6%;transform:translateX(-50%);font:700 14px var(--f-lat);color:var(--leaf-ink);background:var(--leaf);padding:4px 12px;border-radius:999px;box-shadow:0 0 30px var(--leaf-glow)}
.stk-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.stk-list li{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;padding:18px 20px;border-radius:16px;background:var(--screen-2);border:1px solid var(--line)}
.stk-list h3{font-size:18px;margin-bottom:4px}
.stk-list p{color:var(--t2);font-size:14.5px}
.stk-list .layer-tags{justify-content:flex-start;max-width:none;margin-top:10px}
@media (max-width:640px){.stk-vis{height:300px}}
.anim .stk-vis .plate{opacity:0;transform:rotateX(58deg) rotateZ(-42deg) translateZ(calc(var(--z) + 260px))}
.anim .stk-vis.s1 .pl1,.anim .stk-vis.s2 .pl2,.anim .stk-vis.s3 .pl3{opacity:1;transform:rotateX(58deg) rotateZ(-42deg) translateZ(var(--z))}
.anim .stk-ai{opacity:0;transition:opacity .6s .4s}
.anim .stk-vis.s3 .stk-ai{opacity:1}
.anim .stk-vis.s3 .plate{animation:float 6s ease-in-out 1.2s infinite}
.anim .stk-vis.s3 .pl2{animation-delay:1.5s}.anim .stk-vis.s3 .pl3{animation-delay:1.8s}
@keyframes float{50%{transform:rotateX(58deg) rotateZ(-42deg) translateZ(calc(var(--z) + 10px))}}

/* ---------- 产品总览页：「读懂」那一圈 ---------- */
.rd-sec{display:grid;grid-template-columns:minmax(0,1fr);gap:36px;align-items:center}
@media (min-width:1000px){.rd-sec{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px}}
.rd-sec .sec-head{margin-bottom:0}
.rd-steps{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:12px;counter-reset:r}
.rd-steps li{counter-increment:r;position:relative;padding-left:40px;color:var(--t2)}
.rd-steps li::before{content:counter(r);position:absolute;left:0;top:2px;width:26px;height:26px;border-radius:50%;background:var(--leaf-soft);color:var(--leaf);font:700 13px/26px var(--f-lat);text-align:center}
.rd-steps b{display:block;color:var(--t);font-weight:600}

/* 三扇窗：老系统 → 翻译层 → 飞书 */
.rd{position:relative;margin:0;font-size:13.5px;display:flex;flex-direction:column;gap:12px}
.rd-win{position:relative;background:linear-gradient(180deg,rgba(20,30,37,.92),rgba(13,20,25,.92));border:1px solid var(--line-2);border-radius:14px;padding:14px 16px;box-shadow:0 18px 50px rgba(0,0,0,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.rd-sys{width:78%}
.rd-tr{width:88%;margin-left:12%}
.rd-chat{width:80%;margin-left:4%}
@media (max-width:640px){.rd{font-size:12.5px}.rd-sys,.rd-tr,.rd-chat{width:100%;margin-left:0}}
.rd-h{font-size:12.5px;color:var(--t2);margin-bottom:10px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rd-h b{color:var(--leaf);font-weight:600}
.rd-lock{font-style:normal;font-size:11.5px;padding:1px 9px;border-radius:999px;border:1px solid rgba(107,173,70,.5);color:var(--leaf-2)}
.rd-tabs{display:flex;gap:4px;margin-bottom:10px}
.rd-tabs span{font:600 10.5px var(--f-lat);letter-spacing:.06em;color:var(--t3);background:var(--screen);border:1px solid var(--line);border-radius:5px;padding:1px 7px}
.rd code{font:12.5px/1.6 var(--f-mono);color:#9FB0A8}
.rd-code{list-style:none;margin:0;padding:0}
.rd-code li{padding:3px 0}
.rd-map{list-style:none;margin:0;padding:0}
.rd-map li{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1.1fr);align-items:center;gap:10px;padding:5px 0;border-bottom:1px dashed var(--line)}
.rd-map li::after{content:"→";grid-column:2;grid-row:1;color:var(--leaf)}
.rd-map code{grid-column:1;grid-row:1;font-size:11.5px;color:var(--t3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rd-map span{grid-column:3;grid-row:1;color:var(--t2);white-space:nowrap}
.rd-map span b{color:var(--t);font-weight:600}
.rd-tools{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:12px}
.rd-tools span{font-size:12px;padding:4px 10px;border-radius:8px;background:var(--screen);border:1px solid var(--line-2)}
.rd-tools span.hot{border-color:var(--leaf);color:var(--leaf-2);box-shadow:0 0 0 4px var(--leaf-soft)}
.rd-tools small{color:var(--t3);font-size:11.5px;margin-left:4px}
.rd-me{margin-left:auto;width:fit-content;max-width:88%;background:#25384a;border-radius:12px 12px 4px 12px;padding:8px 12px;color:#E4ECF4}
.rd-card{margin-top:10px;width:fit-content;min-width:62%;background:var(--screen);border:1px solid rgba(107,173,70,.45);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.rd-card b{color:var(--leaf-2)}
.rd-card em{color:var(--amber)}
.rd-btns{display:flex;gap:6px;margin-top:4px}
.rd-btns i{font-style:normal;font-size:12px;padding:3px 12px;border-radius:7px;border:1px solid var(--line-2)}
.rd-btns i.ok{background:var(--leaf);border-color:transparent;color:var(--leaf-ink);font-weight:600;transition:transform .2s,box-shadow .2s}
.rd-wait{color:var(--amber);font-size:11.5px}
.rd-done{margin-top:10px;font-size:12.5px;color:var(--leaf-2)}

.anim .rd-win{opacity:0;transform:translateY(14px) scale(.98);transition:opacity .6s var(--ease),transform .7s var(--ease)}
.anim .rd.s1 .rd-sys,.anim .rd.s2 .rd-tr,.anim .rd.s5 .rd-chat{opacity:1;transform:none}
.anim .rd-code li{opacity:0;transition:opacity .3s}
.anim .rd.s1 .rd-code li{opacity:1}
.anim .rd.s1 .rd-code li:nth-child(2){transition-delay:.2s}.anim .rd.s1 .rd-code li:nth-child(3){transition-delay:.4s}
.anim .rd-map li{opacity:0;transform:translateX(-8px);transition:opacity .4s,transform .5s var(--ease)}
.anim .rd.s2 .m1,.anim .rd.s3 .m2,.anim .rd.s4 .m3{opacity:1;transform:none}
.anim .rd-tools{opacity:0;transition:opacity .4s}
.anim .rd.s5 .rd-tools{opacity:1}
.anim .rd-tools span.hot{box-shadow:none;border-color:var(--line-2);color:inherit;transition:all .4s}
.anim .rd.s6 .rd-tools span.hot{box-shadow:0 0 0 4px var(--leaf-soft);border-color:var(--leaf);color:var(--leaf-2)}
.anim .rd-me,.anim .rd-card,.anim .rd-done{opacity:0;transform:translateY(8px);transition:opacity .45s,transform .5s var(--ease)}
.anim .rd.s6 .rd-me,.anim .rd.s7 .rd-card,.anim .rd.s9 .rd-done{opacity:1;transform:none}
.anim .rd.s8 .rd-btns i.ok{transform:scale(.92);box-shadow:0 0 0 6px var(--leaf-soft)}
.anim .rd-wait{transition:opacity .3s}
.anim .rd.s9 .rd-wait{opacity:0}
/* 已写入之后，给卡片一个「落定」的绿边 */
.anim .rd.s9 .rd-card{border-color:var(--leaf)}

/* ---------- 一天里，四个人 ---------- */
.day-in{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
@media (min-width:960px){.day-in{grid-template-columns:240px minmax(0,1fr);gap:56px}}
.day-clock{display:none}
@media (min-width:960px){.day-clock{display:flex;flex-direction:column;gap:6px;position:sticky;top:calc(var(--bar) + 40px);align-self:start}}
.day-t{font:700 64px/1 var(--f-lat);color:var(--t);letter-spacing:-.02em;transition:color .3s}
.day-who{font-size:15px;color:var(--leaf-2)}
.day-bar{display:block;height:2px;background:var(--line-2);margin-top:14px;border-radius:2px;overflow:hidden}
.day-bar i{display:block;height:100%;width:var(--p,25%);background:var(--leaf);transition:width .5s var(--ease)}
.day-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px}
.day-it{background:var(--screen-2);border:1px solid var(--line);border-radius:20px;padding:24px 26px;transition:border-color .3s}
.day-it.on{border-color:rgba(107,173,70,.55)}
.day-m{font-size:13px;color:var(--t2);margin-bottom:8px}
.day-m b{font:700 15px var(--f-lat);color:var(--leaf)}
.day-q{font:600 clamp(19px,2vw,24px)/1.45 var(--f-cjk);color:var(--t)}
.day-a{margin-top:12px;color:#C3CCC7;display:flex;gap:10px;align-items:baseline}
.day-a span{flex:none;font-size:11.5px;font-weight:600;color:var(--leaf-ink);background:var(--leaf);border-radius:999px;padding:1px 9px}
.day-case{display:flex;align-items:center;gap:14px;margin-top:16px;padding:10px;border-radius:12px;background:var(--screen);border:1px solid var(--line);text-decoration:none;font-size:14px;color:var(--leaf-2);transition:border-color .2s}
.day-case:hover{border-color:var(--leaf)}
.day-case img{width:120px;aspect-ratio:16/9;object-fit:cover;border-radius:8px;flex:none}
.day-case small{display:block;color:var(--t3);font-size:12px}
@media (max-width:520px){.day-case img{width:88px}.day-it{padding:20px}}

/* ---------- 能力墙 ---------- */
.caps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
@media (max-width:1100px){.caps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.caps{grid-template-columns:minmax(0,1fr)}}
.cap{background:var(--screen-2);border:1px solid var(--line);border-radius:18px;padding:16px 16px 20px;display:flex;flex-direction:column;gap:8px;transition:border-color .25s,transform .25s var(--ease)}
.cap:hover{border-color:rgba(107,173,70,.5);transform:translateY(-3px)}
.cap h3{font-size:17px;margin-top:8px}
.cap p{color:var(--t2);font-size:14px;line-height:1.7}
.cap-st{position:relative;height:168px;border-radius:12px;background:var(--screen);border:1px solid var(--line);padding:14px;font-size:12.5px;overflow:hidden;display:flex;flex-direction:column;justify-content:center;gap:8px}
.cap-st::before{content:"";position:absolute;inset:0;background:radial-gradient(240px circle at 80% 0%,rgba(107,173,70,.10),transparent 70%);pointer-events:none}
.c-bub{align-self:flex-end;background:#25384a;color:#E4ECF4;border-radius:10px 10px 3px 10px;padding:6px 10px}
.c-card{align-self:flex-start;background:var(--screen-3);border:1px solid rgba(107,173,70,.45);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:3px}
.c-card b{color:var(--leaf-2);font-weight:600}
.c-btns{display:flex;flex-wrap:wrap;gap:5px;margin-top:3px}
.c-btns i{font-style:normal;font-size:11.5px;padding:2px 8px;border-radius:6px;border:1px solid var(--line-2)}
.c-btns i.ok{background:var(--leaf);color:var(--leaf-ink);border-color:transparent;font-weight:600}
.c-done{color:var(--leaf-2)}
.c-line{color:var(--t2);font-size:12px;border-left:2px solid var(--line-2);padding-left:8px}
.c-kv{margin:0;display:grid;gap:4px}
.c-kv div{display:grid;grid-template-columns:5.5em minmax(0,1fr);gap:8px;padding:3px 0;border-bottom:1px dashed var(--line)}
.c-kv dt{color:var(--t3)}
.c-kv dd{margin:0;color:var(--t)}
.c-kv .c-no dd{color:var(--amber)}
.c-cmp p{display:flex;gap:8px;padding:3px 0;color:var(--t2)}
.c-cmp p span{flex:none;width:3.6em;color:var(--t3)}
.c-diff{background:rgba(224,104,90,.12);border-radius:6px;padding:3px 6px!important;color:var(--t)!important}
.c-diff s{color:var(--t3)}
.c-diff b{color:var(--red)}
.c-top{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.c-top li{display:flex;gap:8px;align-items:flex-start;background:var(--screen-3);border-radius:8px;padding:6px 8px;color:var(--t)}
.c-top li b{flex:none;width:18px;height:18px;border-radius:50%;background:var(--leaf);color:var(--leaf-ink);font:700 11px/18px var(--f-lat);text-align:center}
.c-bars{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.c-bars li{display:grid;grid-template-columns:6em minmax(0,1fr) 3em;align-items:center;gap:8px;color:var(--t2)}
.c-bars i{display:block;height:6px;border-radius:6px;background:linear-gradient(90deg,var(--leaf),var(--leaf-2));width:var(--w)}
.c-bars em{font:500 12px var(--f-lat);color:var(--t);font-style:normal;text-align:right}
.c-gantt p{display:grid;grid-template-columns:3em minmax(0,1fr);align-items:center;gap:8px;padding:6px 0;color:var(--t3)}
.c-gantt p i{display:block;height:16px;border-radius:5px;background:var(--screen-4);position:relative}
.c-gantt .g1::after{content:"";position:absolute;left:18%;width:36%;top:0;bottom:0;border-radius:5px;background:var(--leaf)}
.c-gantt .g2::after{content:"";position:absolute;left:48%;width:36%;top:0;bottom:0;border-radius:5px;border:1.5px dashed var(--amber)}
.c-why{color:var(--t);font-size:12px}

/* 能力卡的三拍：s1 第一样出现，s2 第二样，s3 收尾 */
.anim .cap-st > *,.anim .cap-st .c-kv > div,.anim .cap-st .c-top li,.anim .cap-st .c-cmp p,.anim .cap-st .c-bars li{opacity:0;transform:translateY(6px);transition:opacity .4s,transform .45s var(--ease)}
.anim .cap-st.s1 > :nth-child(1),.anim .cap-st.s2 > :nth-child(2),.anim .cap-st.s3 > :nth-child(3),.anim .cap-st.s3 > :nth-child(n+3){opacity:1;transform:none}
.anim .cap-st.s1 > .c-kv,.anim .cap-st.s1 > .c-top,.anim .cap-st.s1 > .c-cmp,.anim .cap-st.s1 > .c-bars,.anim .cap-st.s1 > .c-gantt{opacity:1;transform:none}
.anim .cap-st.s1 .c-kv > div:nth-child(1),.anim .cap-st.s2 .c-kv > div:nth-child(2),.anim .cap-st.s2 .c-kv > div:nth-child(3),.anim .cap-st.s3 .c-kv > div{opacity:1;transform:none}
.anim .cap-st.s1 .c-top li:nth-child(1),.anim .cap-st.s2 .c-top li:nth-child(2),.anim .cap-st.s3 .c-top li{opacity:1;transform:none}
.anim .cap-st.s1 .c-cmp p:nth-child(1),.anim .cap-st.s2 .c-cmp p,.anim .cap-st.s3 .c-cmp p{opacity:1;transform:none}
.anim .cap-st.s1 .c-bars li,.anim .cap-st.s3 .c-bars li{opacity:1;transform:none}
.anim .cap-st .c-bars i{width:0;transition:width .9s var(--ease)}
.anim .cap-st.s2 .c-bars i{width:var(--w)}
.anim .cap-st .c-diff{background:transparent;transition:background .4s}
.anim .cap-st.s3 .c-diff{background:rgba(224,104,90,.12)}
.anim .cap-st .c-diff b{opacity:0;transition:opacity .3s}
.anim .cap-st.s3 .c-diff b{opacity:1}
.anim .cap-st .c-gantt .g2::after{left:18%;transition:left .9s var(--ease)}
.anim .cap-st.s2 .c-gantt .g2::after{left:48%}
.anim .cap-st .c-btns i.ok{transition:transform .2s,box-shadow .2s}
.anim .cap-st.s3 .c-btns i.ok{transform:scale(.92);box-shadow:0 0 0 5px var(--leaf-soft)}

/* 顺序微调：「已写入」只在最后一拍出现；纪要卡先出两句原话，再出归纳；排产卡先挪，再给结论 */
.anim .cap-st.cap-st:not(.s3) > .c-done{opacity:0;transform:translateY(6px)}
.anim .cap-st.cap-minutes:not(.s3) > .c-kv{opacity:0}
.anim .cap-st.cap-aps:not(.s3) > .c-why{opacity:0}

/* ---------- 我们自己就这么跑 ---------- */
.self-in{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;align-items:center;background:radial-gradient(ellipse 70% 90% at 0% 0%,rgba(107,173,70,.09),transparent 60%),var(--screen-2);border:1px solid var(--line);border-radius:24px;padding:32px}
@media (min-width:960px){.self-in{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;padding:44px}}
@media (max-width:600px){.self-in{padding:22px}}
.self .sec-head{margin-bottom:0}
.self .val{margin-top:18px}

/* ---------- 三层 ---------- */
.layers{display:flex;flex-direction:column;gap:10px;perspective:1200px}
.layer{display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:18px;align-items:center;padding:20px 24px;border-radius:18px;border:1px solid var(--line-2);background:var(--screen-2);transition:opacity .6s var(--ease),transform .7s var(--ease)}
.layer.l1{background:linear-gradient(90deg,rgba(107,173,70,.16),var(--screen-2) 60%);border-color:rgba(107,173,70,.5)}
.layer.l2{background:linear-gradient(90deg,rgba(107,173,70,.09),var(--screen-2) 60%)}
.layer-n{font:700 28px var(--f-lat);color:var(--leaf)}
.layer h3{font-size:19px;margin-bottom:4px}
.layer p{color:var(--t2);font-size:14.5px}
.layer-tags{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end;max-width:260px}
.layer-tags i{font-style:normal;font-size:12.5px;padding:3px 10px;border-radius:999px;background:var(--screen);border:1px solid var(--line-2);color:var(--t2)}
@media (max-width:760px){.layer{grid-template-columns:40px minmax(0,1fr);padding:18px}.layer-tags{grid-column:1/-1;justify-content:flex-start;max-width:none}.layer-n{font-size:22px}}
/* 从下往上搭起来：业务系统先落地，再加技能包，最后是飞书入口 */
.anim .layers .layer{opacity:0;transform:translateY(24px) rotateX(18deg)}
.anim .layers.s1 .l3,.anim .layers.s2 .l2,.anim .layers.s3 .l1{opacity:1;transform:none}

/* ---------- 做事的讲究 ---------- */
.habits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
@media (max-width:1100px){.habits{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.habits{grid-template-columns:minmax(0,1fr)}}
.habit{background:var(--screen-2);border:1px solid var(--line);border-radius:18px;padding:18px 18px 22px;display:flex;flex-direction:column;gap:8px}
.habit h3{font-size:17px;margin-top:6px}
.habit p{color:var(--t2);font-size:14px;line-height:1.7}
.habit-v{height:96px;border-radius:12px;background:var(--screen);border:1px solid var(--line);display:grid;place-items:center;padding:10px}
.h-cell{display:flex;align-items:center;gap:12px;font-size:15px}
.h-cell s{font:700 20px var(--f-lat);color:var(--t3)}
.h-cell b{font-weight:600;color:var(--amber);border:1px dashed rgba(220,164,92,.6);border-radius:8px;padding:4px 10px}
.h-chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.h-chips i,.h-chips b{font-style:normal;font-size:13px;padding:4px 10px;border-radius:999px;border:1px solid var(--line-2)}
.h-chips b{font-weight:600;color:var(--amber);border-style:dashed;border-color:rgba(220,164,92,.6)}
/* 先出现「别处常见的写法」，再被划掉换成我们的 */
.anim .habit-v s{text-decoration-color:transparent;transition:text-decoration-color .3s,opacity .4s}
.anim .habit-v.s1 s{text-decoration-color:var(--t3);opacity:.6}
.anim .habit-v b{opacity:0;transform:translateX(-6px);transition:opacity .4s,transform .45s var(--ease)}
.anim .habit-v.s1 b{opacity:1;transform:none}

/* ---------- 案例墙：一格格亮起来 ---------- */
.anim .wall .tile{opacity:.35;filter:grayscale(1);transition:opacity .5s,filter .5s,transform .3s var(--ease),box-shadow .3s}
.anim .wall .tile.lit{opacity:1;filter:none}

/* ---------- 数字：计数的那个 span 别吃到 .stat span 的说明文字样式 ---------- */
.stat b [data-count]{display:inline;margin:0;font:inherit;color:inherit}

/* ---------- 合作四段：一条线从左走到右 ---------- */
.steps-line{position:relative}
.anim .steps-line li{opacity:.35;transition:opacity .5s,border-color .5s}
.anim .steps-line.s1 li:nth-child(1),.anim .steps-line.s2 li:nth-child(2),.anim .steps-line.s3 li:nth-child(3),.anim .steps-line.s4 li:nth-child(4){opacity:1;border-color:rgba(107,173,70,.5)}

/* ---------- 品牌片弹窗 ---------- */
.film-dlg{width:min(1200px,100vw);max-width:none;padding:0;border:0;background:#000;border-radius:14px;overflow:hidden}
.film-dlg::backdrop{background:rgba(3,6,8,.86);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.film-dlg video{display:block;width:100%;aspect-ratio:16/9;background:#000}
.film-x{position:absolute;top:10px;right:10px;width:40px;height:40px;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:24px;line-height:40px;text-align:center}
@media (max-width:640px){.film-dlg{border-radius:0}}

/* =====================================================================
   首页 v2 · 统一成一个宇宙（东杰 10/3：「首页要风格保持一致，逼格和动效都要满满」）
   整页背后：星尘画布（bg-fx）+ 两道慢慢漂的光 + 颗粒质感 + 跟着鼠标的光；全部 z-index:-1，压在内容下面、body 底色上面
   所有卡片：玻璃 + 绕边跑的光 + 跟着鼠标的光斑 + 轻微 3D 倾斜；标题逐字浮现
   ===================================================================== */
.hm{position:relative;overflow-x:clip}   /* 画布、光晕往外溢的部分裁掉，手机上不能横向滑；clip 不建滚动容器，sticky 照样能用 */
.bg-fx,.bg-beams,.bg-grain{position:fixed;inset:0;z-index:-1;pointer-events:none}
.bg-fx{width:100%;height:100%}
.bg-beams{background:
    radial-gradient(60vmax 20vmax at 12% 28%,rgba(107,173,70,.10),transparent 70%),
    radial-gradient(52vmax 18vmax at 88% 72%,rgba(134,196,99,.08),transparent 70%),
    radial-gradient(40vmax 26vmax at 70% 8%,rgba(220,164,92,.05),transparent 70%);
  animation:drift 28s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate3d(-4%,3%,0) rotate(3deg)}}
.bg-grain{opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.cursor-light{position:fixed;left:0;top:0;z-index:-1;pointer-events:none;width:560px;height:560px;margin:-280px 0 0 -280px;border-radius:50%;
  background:radial-gradient(circle,rgba(134,196,99,.15),rgba(107,173,70,.05) 40%,transparent 66%);transform:translate3d(var(--cx,-999px),var(--cy,-999px),0);opacity:0;transition:opacity .6s}
.cursor-light.on{opacity:1}

/* ---------- 版块节奏与标题 ---------- */
.hm-sec{padding-top:140px}
.hm-last{padding-bottom:140px}
@media (max-width:760px){.hm-sec{padding-top:96px}.hm-last{padding-bottom:96px}}
.hm-head{max-width:860px;margin-bottom:48px}
.hm-head .eyebrow,.flow .eyebrow{display:flex;align-items:center;gap:12px;color:var(--t2)}
.idx{display:inline-flex;align-items:center;gap:10px;font:500 12px var(--f-mono);letter-spacing:.08em;color:var(--leaf)}
.idx::after{content:"";width:44px;height:1px;background:linear-gradient(90deg,var(--leaf),transparent);transform-origin:left;transition:transform 1s var(--ease) .2s}
.anim .rv:not(.is-in) .idx::after{transform:scaleX(0)}
.hm-head h2{font-size:clamp(32px,4.6vw,62px);line-height:1.1;letter-spacing:0}
.hm h2 em{text-shadow:0 0 34px rgba(107,173,70,.35)}
.hm .flow h2 em{background:linear-gradient(100deg,#6BAD46 0%,#B8EC93 45%,#6BAD46 70%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none;animation:shine 7s ease-in-out infinite}
@keyframes shine{0%,55%{background-position:100% 0}100%{background-position:-140% 0}}
.hm-head .lede{font-size:17px;max-width:40em}
/* 逐字浮现：脚本把标题拆成 .ch，带 --i 序号 */
.anim .hm [data-split] .ch{display:inline-block;opacity:0;transform:translateY(.55em) rotateX(40deg);filter:blur(10px);transition:opacity .7s var(--ease),transform .9s var(--ease),filter .8s var(--ease);transition-delay:calc(var(--i) * 24ms)}
.anim .hm [data-split].go .ch{opacity:1;transform:none;filter:none}
/* 进场：再加一点虚化，更像镜头对焦 */
.anim .hm .rv{transform:translateY(30px) scale(.985);transition:opacity .9s var(--ease),transform 1s var(--ease),filter .9s var(--ease);transition-delay:var(--d,0s)}
.anim .hm .rv:not(.is-in):not(.glass):not(.glass-lite){filter:blur(6px)}
.anim .hm .rv.is-in{opacity:1;transform:none;filter:none}

/* ---------- 玻璃 ---------- */
.hm .glass,.hm .glass-lite{position:relative;isolation:isolate;border-radius:22px;
  background:linear-gradient(160deg,rgba(30,46,52,.66),rgba(10,16,20,.6) 60%,rgba(12,22,18,.62));
  border:1px solid rgba(226,236,231,.10);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 26px 70px rgba(0,0,0,.38)}
@media (min-width:900px) and (pointer:fine){
  .hm .glass{background:linear-gradient(160deg,rgba(30,46,52,.46),rgba(10,16,20,.36) 60%,rgba(12,22,18,.42));-webkit-backdrop-filter:blur(16px) saturate(1.3);backdrop-filter:blur(16px) saturate(1.3)}}
@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}
.hm .glass.lit::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1.5px;pointer-events:none;z-index:1;
  background:conic-gradient(from var(--ang),transparent 0 60%,rgba(134,196,99,.0) 62%,rgba(160,222,120,.95) 74%,rgba(220,164,92,.75) 80%,transparent 88%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;animation:ang 7s linear infinite}
@keyframes ang{to{--ang:360deg}}
.hm .glass::after,.hm .glass-lite::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;opacity:0;transition:opacity .4s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(134,196,99,.15),transparent 60%)}
.hm .glass:hover::after,.hm .glass-lite:hover::after{opacity:1}
.hm .glass-lite{transition:border-color .3s,box-shadow .3s}
.hm .glass-lite:hover{border-color:rgba(134,196,99,.38);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 30px 80px rgba(0,0,0,.45),0 0 40px rgba(107,173,70,.12)}
/* 跟着鼠标轻轻倾斜（只在有鼠标的设备上，由脚本写 --rx / --ry） */
.anim .hm [data-tilt].is-in,.anim .hm [data-tilt].tilting{transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
.hm .btn-go{box-shadow:0 0 0 0 rgba(107,173,70,0),0 8px 30px rgba(107,173,70,.35)}
.hm .chips a{background:rgba(226,236,231,.06);border:1px solid rgba(226,236,231,.08);transition:background .2s,color .2s,border-color .2s,box-shadow .2s}
.hm .chips a:hover{border-color:rgba(134,196,99,.5);box-shadow:0 0 20px rgba(107,173,70,.2)}

/* ---------- 第二屏补充 ---------- */
.flow-bar{display:none}
.flow.on .flow-bar{display:block;width:min(320px,70%);height:2px;margin-top:26px;border-radius:2px;background:rgba(226,236,231,.1);overflow:hidden}
.flow.on .flow-bar i{display:block;height:100%;width:var(--fp,0%);background:linear-gradient(90deg,var(--leaf),#B8EC93);box-shadow:0 0 12px var(--leaf)}
.flow.on{height:300vh}
@media (max-width:760px){.flow.on{height:260vh}}
.flow.on .flow-steps li b{text-shadow:0 0 24px rgba(107,173,70,.5)}
/* 手机上只留当前那一句，给上面的 3D 场景让出半屏 */
@media (max-width:760px){.flow.on .flow-steps li{display:none}.flow.on[data-ph="1"] .f1,.flow.on[data-ph="2"] .f2,.flow.on[data-ph="3"] .f3{display:flex}.flow.on h2{font-size:clamp(24px,7vw,30px);margin-bottom:16px}}
.flow-labs span.sys{transition:border-color .5s,color .5s,box-shadow .5s,background .5s}
.flow[data-ph="2"] .flow-labs span.sys{border-color:rgba(220,164,92,.55);color:#F3D7AE;background:rgba(30,20,8,.6)}
.flow[data-ph="3"] .flow-labs span.sys{border-color:rgba(134,196,99,.65);color:#E6F7DA;background:rgba(10,26,12,.65);box-shadow:0 0 18px rgba(107,173,70,.3)}
.flow-labs span.ai-x{font-weight:700;color:#F6D9A8;border-color:rgba(220,164,92,.7);background:rgba(40,24,6,.7);box-shadow:0 0 24px rgba(220,164,92,.35)}
.flow-labs span.ring-lab{border-style:dashed;border-color:rgba(134,196,99,.6);color:#C9EDB0;background:rgba(8,20,10,.7)}

/* ---------- 02 两面 ---------- */
.hm .side{padding:28px;gap:20px}
.hm .side h3{font-size:clamp(28px,3.2vw,40px)}
.hm .side .pv-box{box-shadow:0 0 0 1px rgba(134,196,99,.25),0 24px 60px rgba(0,0,0,.5),0 0 50px rgba(107,173,70,.12)}
.side-orb{position:absolute;top:24px;right:24px;width:58px;height:58px;pointer-events:none;z-index:2}
.side-orb.in{border-radius:50%;background:radial-gradient(circle at 34% 30%,#D9F7C4,#86C463 24%,#3E7A2A 52%,#0E1D10 72%);box-shadow:0 0 36px rgba(107,173,70,.6),inset -6px -8px 16px rgba(0,0,0,.45)}
.side-orb.in i{position:absolute;inset:-9px;border-radius:50%;border:1px solid rgba(134,196,99,.55);border-top-color:transparent;border-left-color:transparent;animation:spin 6s linear infinite}
.side-orb.out{border-radius:50%;border:1px solid rgba(134,196,99,.55);box-shadow:inset 0 0 22px rgba(107,173,70,.3),0 0 26px rgba(107,173,70,.18)}
.side-orb.out::before{content:"";position:absolute;inset:18px;border-radius:50%;background:radial-gradient(circle,#B8EC93,#3E7A2A 70%);box-shadow:0 0 18px rgba(134,196,99,.7)}
.side-orb.out i{position:absolute;left:50%;top:-4px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:#E9FFD9;box-shadow:0 0 14px 2px #86C463;transform-origin:4px 33px;animation:spin 4s linear infinite}

/* ---------- 03 一天里，四个人 ---------- */
.hm .day-clock{gap:2px}
.day-sun{width:240px;height:132px;overflow:visible;margin-bottom:6px}
.day-sun .arc{fill:none;stroke:rgba(226,236,231,.16);stroke-width:1.2;stroke-dasharray:2 5}
.day-sun .arc-lit{fill:none;stroke:var(--leaf);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:var(--off,100);transition:stroke-dashoffset .9s var(--ease);filter:drop-shadow(0 0 6px rgba(107,173,70,.9))}
.day-sun .hz{stroke:rgba(226,236,231,.12)}
.day-sun .sun{fill:#F2FFE8;filter:drop-shadow(0 0 8px #A6E07F)}
.day-sun .sun-glow{fill:rgba(134,196,99,.2)}
.hm .day-t{font:700 76px/1 var(--f-lat);letter-spacing:-.03em;background:linear-gradient(180deg,#FFFFFF,#A6E07F);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 22px rgba(107,173,70,.45))}
.hm .day-who{font-size:16px}
.hm .day-list{position:relative;padding-left:34px;gap:22px}
.hm .day-list::before{content:"";position:absolute;left:10px;top:10px;bottom:10px;width:2px;border-radius:2px;background:rgba(226,236,231,.08)}
.hm .day-list::after{content:"";position:absolute;left:10px;top:10px;width:2px;height:var(--fill,0%);max-height:calc(100% - 20px);border-radius:2px;background:linear-gradient(180deg,var(--leaf),#B8EC93);box-shadow:0 0 12px var(--leaf)}
.hm .day-it{padding:26px 28px}
.hm .day-it::before{content:"";position:absolute;left:-30px;top:32px;width:10px;height:10px;border-radius:50%;background:var(--screen);border:2px solid rgba(226,236,231,.25);transition:all .4s}
.hm .day-it.on::before{background:var(--leaf);border-color:#B8EC93;box-shadow:0 0 14px 3px rgba(107,173,70,.7)}
.hm .day-it.on{border-color:rgba(134,196,99,.45)}
.hm .day-m b{font:700 18px var(--f-lat);color:#A6E07F;text-shadow:0 0 16px rgba(107,173,70,.6)}
.hm .day-a span{box-shadow:0 0 14px rgba(107,173,70,.5)}
.hm .day-case{background:rgba(5,9,12,.55);border-color:rgba(226,236,231,.08)}
.day-pic{position:relative;flex:none;width:128px;aspect-ratio:16/9;border-radius:8px;overflow:hidden}
.day-pic img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.day-pic::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(134,196,99,.35),transparent);background-size:100% 60%;background-repeat:no-repeat;background-position:0 -120%;transition:background-position .9s var(--ease)}
.hm .day-case:hover .day-pic img{transform:scale(1.08)}
.hm .day-case:hover .day-pic::after{background-position:0 220%}
@media (max-width:520px){.day-pic{width:92px}.hm .day-it{padding:20px}}

/* ---------- 04 我们自己就这么跑 ---------- */
.hm .self-in{padding:44px}
@media (max-width:600px){.hm .self-in{padding:24px}}
.self-pv{position:relative}
.self-halo{position:absolute;inset:-14%;border-radius:50%;z-index:-1;pointer-events:none;
  background:conic-gradient(from 0deg,transparent,rgba(107,173,70,.32),transparent 28%,rgba(220,164,92,.18),transparent 58%,rgba(134,196,99,.28),transparent 88%);filter:blur(34px);animation:spin 20s linear infinite}
.self-pv .pv-box{box-shadow:0 0 0 1px rgba(134,196,99,.35),0 30px 80px rgba(0,0,0,.55),0 0 70px rgba(107,173,70,.18)}

/* ---------- 05 三层（3D） ---------- */
.stk-vis3d{position:relative;height:500px}
.stk-vis3d .stk-fx{position:absolute;left:-40px;top:-40px;width:calc(100% + 80px);height:calc(100% + 80px)}
.stk-labs{position:absolute;left:-40px;top:-40px;width:calc(100% + 80px);height:calc(100% + 80px);pointer-events:none}
.stk-labs span{position:absolute;left:0;top:0;font:600 12.5px/1.4 var(--f-cjk);color:#E2F4D6;padding:4px 11px;border-radius:999px;border:1px solid rgba(134,196,99,.5);background:rgba(8,18,10,.72);white-space:nowrap;opacity:0;will-change:transform;box-shadow:0 0 18px rgba(107,173,70,.2)}
.stk-labs span.l0{border-color:rgba(107,173,70,.6)}
.stk-labs span.l2{border-color:rgba(200,236,180,.6);color:#F2FFE8}
.stk-labs span.ai{font:700 13px/1.4 var(--f-lat);color:var(--leaf-ink);background:var(--leaf);border-color:transparent;box-shadow:0 0 26px var(--leaf-glow)}
.stk-vis3d .stk-fx,.stk-vis3d .stk-labs{display:none}
.stk-vis3d.gl .stk-fx,.stk-vis3d.gl .stk-labs{display:block}
.stk-vis3d.gl .stk-vis{display:none}
.stk-vis3d .stk-vis{height:100%}
@media (max-width:640px){.stk-vis3d{height:340px}.stk-vis3d .stk-fx,.stk-labs{left:0;top:0;width:100%;height:100%}}
.hm .stk-list li{padding:20px 22px}
.hm .stk-list .layer-n{text-shadow:0 0 18px rgba(107,173,70,.6)}
.hm .layer-tags i{background:rgba(5,9,12,.5);border-color:rgba(134,196,99,.25)}

/* ---------- 06 做事的讲究 ---------- */
.hm .habit{padding:20px 20px 24px}
.hm .habit-v{position:relative;overflow:hidden;height:110px;background:linear-gradient(180deg,rgba(5,9,12,.85),rgba(13,20,25,.6));border-color:rgba(226,236,231,.08)}
.hm .habit-v::after{content:"";position:absolute;left:0;right:0;top:-45%;height:45%;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(134,196,99,.14),transparent);animation:scan 3.8s ease-in-out infinite}
@keyframes scan{to{top:120%}}
.hm .h-cell b,.hm .h-chips b{box-shadow:0 0 18px rgba(220,164,92,.25)}

/* ---------- 07 案例墙：从倾斜的透视里立起来 ---------- */
.wall-3d{perspective:1400px;perspective-origin:50% 0%}
.wall-3d .wall{position:relative;transform:rotateX(var(--wx,0deg)) scale(var(--ws,1));transform-origin:50% 0;will-change:transform}
.wall-3d .wall::after{content:"";position:absolute;inset:-2px;pointer-events:none;border-radius:14px;mix-blend-mode:screen;
  background:linear-gradient(105deg,transparent 42%,rgba(200,255,170,.14) 50%,transparent 58%);background-size:260% 100%;animation:sweep 6s ease-in-out infinite}
@keyframes sweep{0%{background-position:160% 0}55%,100%{background-position:-60% 0}}
.hm .tile{box-shadow:0 0 0 1px rgba(107,173,70,.35),0 20px 50px rgba(0,0,0,.45)}
.hm .tile.lit{box-shadow:0 0 0 1px rgba(160,222,120,.6),0 0 34px rgba(107,173,70,.22),0 20px 50px rgba(0,0,0,.45)}
.hm .tile.you{background:radial-gradient(circle at 50% 50%,rgba(107,173,70,.12),transparent 70%)}

/* ---------- 08 数字：圆环 ---------- */
.hm .stat{display:grid;justify-items:center;text-align:center;padding:30px 24px 28px}
.ring{grid-area:1/1;width:168px;height:168px;transform:rotate(-90deg);overflow:visible}
.ring .rg{fill:none;stroke:rgba(226,236,231,.08);stroke-width:4}
.ring .rl{fill:none;stroke:var(--leaf);stroke-width:4;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--f));filter:drop-shadow(0 0 8px rgba(107,173,70,.8));transition:stroke-dashoffset 1.8s var(--ease) .25s}
.anim .hm .stat:not(.is-in) .ring .rl{stroke-dashoffset:100}
.hm .stat b{grid-area:1/1;align-self:center;display:flex;align-items:baseline;justify-content:center;font-size:clamp(40px,4vw,52px);text-shadow:0 0 30px rgba(107,173,70,.35)}
.hm .stat > span{grid-area:2/1;margin-top:16px;max-width:16em}

/* ---------- 09 合作：一束光依次穿过四段 ---------- */
.beam-wrap{position:relative}
.beam{display:none}
@media (min-width:981px){
  .beam{display:block;position:absolute;left:12.5%;right:12.5%;top:-22px;height:2px;border-radius:2px;background:rgba(226,236,231,.1)}
  .beam i{position:absolute;left:0;top:0;bottom:0;width:100%;background:linear-gradient(90deg,var(--leaf),#B8EC93);box-shadow:0 0 14px var(--leaf);transition:width .7s var(--ease)}
  .beam b{position:absolute;top:-4px;left:0;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:#F2FFE8;box-shadow:0 0 16px 5px rgba(134,196,99,.85);animation:travel 3.4s ease-in-out infinite}
  .anim .beam i{width:0}
  .anim .beam b{opacity:0}
  .anim .beam-wrap:has(.steps-line.s2) .beam i{width:33.3%}
  .anim .beam-wrap:has(.steps-line.s3) .beam i{width:66.6%}
  .anim .beam-wrap:has(.steps-line.s4) .beam i{width:100%}
  .anim .beam-wrap:has(.steps-line.s4) .beam b{opacity:1}
  .beam .nd{position:absolute;top:-5px;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:var(--leaf);border:2px solid #B8EC93;box-shadow:0 0 14px 3px rgba(107,173,70,.7);transition:all .5s}
  .beam .nd:nth-of-type(1){left:0}.beam .nd:nth-of-type(2){left:33.33%}.beam .nd:nth-of-type(3){left:66.66%}.beam .nd:nth-of-type(4){left:100%}
  .anim .beam .nd{background:var(--screen);border-color:rgba(226,236,231,.25);box-shadow:none}
  .anim .beam-wrap:has(.steps-line.s1) .nd:nth-of-type(1),.anim .beam-wrap:has(.steps-line.s2) .nd:nth-of-type(2),.anim .beam-wrap:has(.steps-line.s3) .nd:nth-of-type(3),.anim .beam-wrap:has(.steps-line.s4) .nd:nth-of-type(4){background:var(--leaf);border-color:#B8EC93;box-shadow:0 0 14px 3px rgba(107,173,70,.7)}
  .hm .beam-wrap{margin-top:64px}
  .beam{top:-30px}
}
@keyframes travel{0%{left:0}100%{left:100%}}
.hm .steps li{position:relative;padding:24px 24px}
.hm .steps li::before{text-shadow:0 0 14px rgba(107,173,70,.6)}

/* ---------- 下一步 ---------- */
.hm .next .card{padding:32px 34px}
.hm .next{grid-template-columns:minmax(0,1fr)}   /* 10/4 东杰：联系方式挪到页脚，这里只留体检一张卡 */
.hm .inline-form .in{background:rgba(5,9,12,.6);border-color:rgba(134,196,99,.35);animation:glowin 3.2s ease-in-out infinite}
@keyframes glowin{50%{box-shadow:0 0 0 4px rgba(107,173,70,.12),0 0 24px rgba(107,173,70,.2)}}
.hm .contact-list li{border-color:rgba(226,236,231,.08)}

/* =====================================================================
   10/4 再改：首页不放截图、产品标签、小痛点（东杰：「一下子低端了」）
   ===================================================================== */
/* ---------- 02 两面：抽象画面 + 一句承诺 + 三句成果 ---------- */
.duo{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
@media (min-width:900px){.duo{grid-template-columns:1fr 1fr}}
.hm .face{padding:34px 34px 30px;display:flex;flex-direction:column;gap:14px;min-width:0}
.hm .face .kick{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--t2)}
.hm .face .kick b{font:700 12px var(--f-lat);letter-spacing:.06em;color:var(--leaf-ink);background:var(--leaf);border-radius:6px;padding:2px 8px}
.hm .face h3{font:700 clamp(28px,3.2vw,42px)/1.15 var(--f-disp)}
.face-line{font-size:18px;color:#DCE6E0}
.face-caps{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:10px}
.face-caps li{position:relative;padding-left:22px;color:var(--t2);font-size:15px}
.face-caps li::before{content:"";position:absolute;left:0;top:.62em;width:10px;height:1px;background:var(--leaf);box-shadow:0 0 8px var(--leaf)}
.face-acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:auto;padding-top:12px}
.play-chip{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px 0 6px;border-radius:999px;border:1px solid rgba(226,236,231,.16);font-size:13.5px;color:var(--t2);transition:border-color .2s,color .2s}
.play-chip svg{width:28px;height:28px;padding:8px 7px 8px 9px;border-radius:50%;background:rgba(107,173,70,.18);color:#C9EDB0}
.play-chip:hover{border-color:rgba(134,196,99,.55);color:var(--t)}
/* 抽象画面共用的框 */
.vis{position:relative;height:260px;margin:-6px -6px 6px;border-radius:16px;overflow:hidden;
  background:radial-gradient(ellipse 70% 80% at 50% 55%,rgba(107,173,70,.12),transparent 70%),linear-gradient(180deg,rgba(5,9,12,.55),rgba(5,9,12,.2))}
@media (max-width:600px){.vis{height:220px}}
/* 对内：一颗光核，三层光环在转（业务系统 / 技能包 / 飞书入口） */
.vis-in .orb{position:absolute;left:50%;top:52%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;
  background:radial-gradient(circle at 36% 30%,#F2FFE8,#A6E07F 22%,#4E8F36 50%,#14280F 74%);box-shadow:0 0 50px 8px rgba(107,173,70,.55),0 0 120px 30px rgba(107,173,70,.18);animation:breathe2 5s ease-in-out infinite}
@keyframes breathe2{50%{box-shadow:0 0 70px 14px rgba(107,173,70,.65),0 0 140px 40px rgba(107,173,70,.22)}}
.vis-in .rg{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%) rotateX(68deg);transform-style:preserve-3d}
.vis-in .rg b{display:block;width:100%;height:100%;border-radius:50%;border:1px solid rgba(134,196,99,.45);box-shadow:0 0 18px rgba(107,173,70,.18),inset 0 0 18px rgba(107,173,70,.12);animation:spin 14s linear infinite}
.vis-in .r1{width:150px;height:150px}.vis-in .r2{width:240px;height:240px}.vis-in .r3{width:330px;height:330px}
.vis-in .r2 b{animation-duration:22s;animation-direction:reverse;border-style:dashed;border-color:rgba(134,196,99,.35)}
.vis-in .r3 b{animation-duration:34s;border-color:rgba(226,236,231,.18)}
.vis-in .rg i{position:absolute;left:50%;top:-4px;width:8px;height:8px;margin-left:-4px;border-radius:50%;background:#F2FFE8;box-shadow:0 0 12px 3px #86C463}
.vis-in .r2 i:nth-child(2){top:auto;bottom:-4px}
.vis-in .lb{position:absolute;font:600 11.5px var(--f-cjk);letter-spacing:.06em;color:#C9EDB0;padding:2px 9px;border-radius:999px;border:1px solid rgba(134,196,99,.35);background:rgba(8,18,10,.7)}
.vis-in .l1{left:50%;top:calc(52% + 36px);transform:translateX(-50%)}
.vis-in .l2{left:calc(50% + 96px);top:calc(52% - 14px)}
.vis-in .l3{left:calc(50% - 170px);top:calc(52% - 52px)}
@media (max-width:600px){.vis-in .r3{width:280px;height:280px}.vis-in .l2{left:auto;right:12px}.vis-in .l3{left:12px}}
/* 对外：一颗点阵星球，几个国产 AI 的名字绕着它转 */
.vis-out .globe{position:absolute;left:50%;top:52%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;
  background-image:radial-gradient(rgba(166,224,127,.85) 1px,transparent 1.6px);background-size:8px 8px;
  -webkit-mask:radial-gradient(circle,#000 52%,rgba(0,0,0,.3) 68%,transparent 71%);mask:radial-gradient(circle,#000 52%,rgba(0,0,0,.3) 68%,transparent 71%);animation:roll 16s linear infinite}
@keyframes roll{to{background-position:80px 0}}
.vis-out .globe-core{position:absolute;left:50%;top:52%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 34% 30%,rgba(242,255,232,.35),transparent 40%),radial-gradient(circle at 60% 70%,rgba(5,9,12,.0),rgba(5,9,12,.75) 80%);box-shadow:0 0 70px 10px rgba(107,173,70,.25)}
.vis-out .orbit{position:absolute;left:50%;top:52%;border-radius:50%;border:1px solid rgba(226,236,231,.12);animation:spin 20s linear infinite}
.vis-out .orbit b{position:absolute;left:50%;top:0;transform:translate(-50%,-50%)}
.vis-out .orbit i{display:block;font:600 11.5px var(--f-cjk);font-style:normal;white-space:nowrap;color:#E6F7DA;padding:3px 10px;border-radius:999px;border:1px solid rgba(134,196,99,.5);background:rgba(8,18,10,.8);box-shadow:0 0 16px rgba(107,173,70,.3);animation:spin 20s linear infinite reverse}
.vis-out .o1{width:220px;height:220px;margin:-110px 0 0 -110px}
.vis-out .o2{width:300px;height:300px;margin:-150px 0 0 -150px;animation-duration:28s;animation-delay:-9s}.vis-out .o2 i{animation-duration:28s;animation-delay:-9s}
.vis-out .o3{width:250px;height:250px;margin:-125px 0 0 -125px;animation-duration:24s;animation-delay:-14s;animation-direction:reverse}.vis-out .o3 i{animation-duration:24s;animation-delay:-14s;animation-direction:normal}
.vis-out .o4{width:340px;height:340px;margin:-170px 0 0 -170px;animation-duration:34s;animation-delay:-4s}.vis-out .o4 i{animation-duration:34s;animation-delay:-4s}
@media (max-width:600px){.vis-out .o4{width:290px;height:290px;margin:-145px 0 0 -145px}}

/* ---------- 03 宣言：大字随滚动一句句亮起来 ---------- */
.hm .mf .hm-head{margin-bottom:28px}
.mf-text{max-width:1100px;font:700 clamp(26px,3.6vw,52px)/1.42 var(--f-disp);letter-spacing:0;color:#E8EDEA}
.mf-text span{transition:color .5s var(--ease),text-shadow .5s}
.mf-text .hi{color:#A6E07F;text-shadow:0 0 30px rgba(107,173,70,.35)}
.anim .mf-text span{color:rgba(232,237,234,.16)}
.anim .mf-text span.hi{color:rgba(166,224,127,.18);text-shadow:none}
.anim .mf-text span.on{color:#E8EDEA}
.anim .mf-text span.hi.on{color:#A6E07F;text-shadow:0 0 30px rgba(107,173,70,.4)}
.impact{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:64px;border-top:1px solid rgba(226,236,231,.1)}
@media (max-width:900px){.impact{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.impact{grid-template-columns:minmax(0,1fr)}}
.imp{display:flex;flex-direction:column;gap:8px;padding:28px 24px 24px 0;text-decoration:none;border-bottom:1px solid rgba(226,236,231,.08);transition:background .3s}
.imp + .imp{padding-left:24px;border-left:1px solid rgba(226,236,231,.08)}
@media (max-width:900px){.imp:nth-child(3){padding-left:0;border-left:0}}
@media (max-width:520px){.imp + .imp{padding-left:0;border-left:0}}
.imp b{font:700 clamp(34px,3.4vw,48px)/1.05 var(--f-lat);letter-spacing:-.02em;background:linear-gradient(180deg,#FFFFFF,#A6E07F);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(107,173,70,.35))}
.imp b small{font:600 18px var(--f-cjk);margin-left:6px;-webkit-text-fill-color:#A6E07F}
.imp span{color:#DCE6E0;font-size:15px}
.imp em{font-style:normal;font-size:12.5px;color:var(--t3);transition:color .2s}
.imp:hover em{color:var(--leaf)}

/* ---------- 07 案例墙：抽象纹理卡 + 系统名水印 ---------- */
.hm .tile.abs{background:linear-gradient(160deg,rgba(24,38,44,.9),rgba(8,13,17,.95));overflow:hidden}
.hm .tile.abs::after{display:none}
.hm .tile.abs::before{content:"";position:absolute;inset:0;z-index:0;opacity:.9;pointer-events:none}
.hm .tile.v0::before{background:repeating-radial-gradient(circle at 85% 15%,rgba(134,196,99,.22) 0 1px,transparent 1.5px 16px)}
.hm .tile.v1::before{background:linear-gradient(rgba(134,196,99,.14) 1px,transparent 1px) 0 0/22px 22px,linear-gradient(90deg,rgba(134,196,99,.14) 1px,transparent 1px) 0 0/22px 22px;-webkit-mask:radial-gradient(ellipse at 70% 30%,#000,transparent 75%);mask:radial-gradient(ellipse at 70% 30%,#000,transparent 75%)}
.hm .tile.v2::before{background:repeating-linear-gradient(120deg,rgba(134,196,99,.16) 0 1px,transparent 1px 12px);-webkit-mask:linear-gradient(200deg,#000,transparent 70%);mask:linear-gradient(200deg,#000,transparent 70%)}
.hm .tile.v3::before{background:radial-gradient(rgba(166,224,127,.5) 1px,transparent 1.6px) 0 0/10px 10px;-webkit-mask:radial-gradient(circle at 80% 25%,#000,transparent 65%);mask:radial-gradient(circle at 80% 25%,#000,transparent 65%)}
.hm .tile.v4::before{background:repeating-conic-gradient(from 0deg at 90% 10%,rgba(134,196,99,.16) 0 2deg,transparent 2deg 12deg);-webkit-mask:radial-gradient(circle at 90% 10%,#000,transparent 70%);mask:radial-gradient(circle at 90% 10%,#000,transparent 70%)}
.hm .tile.abs .wm{position:absolute;right:-6px;bottom:-14px;z-index:0;font:700 clamp(54px,7vw,92px)/1 var(--f-lat);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1px rgba(134,196,99,.28);white-space:nowrap;pointer-events:none;transition:-webkit-text-stroke-color .4s,transform .6s var(--ease)}
.hm .tile.abs:hover .wm{-webkit-text-stroke-color:rgba(166,224,127,.6);transform:translateX(-6px)}
.hm .tile.abs .k,.hm .tile.abs .l{z-index:1}
.hm .tile.abs::after{content:none}
.anim .hm .tile.abs:not(.lit) .wm{-webkit-text-stroke-color:rgba(226,236,231,.08)}
.anim .hm .wall .tile.abs{filter:none}
.anim .hm .wall .tile.abs:not(.lit){opacity:.45}

/* =====================================================================
   10/4 第三轮（东杰逐图）：宣言两句、只加一层、研产供销服、合作一句话
   ===================================================================== */
.hm-center{margin-left:auto;margin-right:auto;text-align:center}
.hm-center .eyebrow{justify-content:center}
.hm-center .lede{margin-left:auto;margin-right:auto}
.hm-center .lede .ph{display:inline-block}   /* 居中的副标题按短句断行 */
.hm h2 em{display:inline-block}   /* 标题里绿色那半句整块换行，手机上不许「AI 各就 / 各位」 */
/* 宣言：两句，居中大字，滚动点亮 */
.hm .mf{padding-top:170px}
.mf .mf-text{max-width:none;margin:0 auto;text-align:center;font:700 clamp(34px,5.6vw,84px)/1.22 var(--f-disp);letter-spacing:0}
.mf .mf-text span{display:inline-block;white-space:nowrap}   /* 断行只许落在两个短句之间，手机上不许「人却越 / 来越忙」 */
@media (max-width:760px){.hm .mf{padding-top:110px}.mf .mf-text{font-size:clamp(32px,10.4vw,44px);line-height:1.3}}

/* 只加一层：标题在上，整幅 3D 在下 */
.one .hm-head{margin-bottom:8px}
.one .stk-vis3d{position:relative;height:600px;margin-top:0}
.one .stk-vis3d .stk-fx,.one .stk-labs{left:0;top:0;width:100%;height:100%}
@media (max-width:760px){.one .stk-vis3d{height:440px}}
.one .stk-labs span{font:600 12.5px/1.4 var(--f-cjk);padding:4px 11px}
.one .stk-labs span.blk{font:700 12px/1.3 var(--f-lat);letter-spacing:.06em;color:#D7DFDB;background:rgba(14,20,24,.82);border-color:rgba(226,236,231,.22);box-shadow:none}
.one .stk-labs span.base{color:#C5CFCA;background:rgba(14,20,24,.85);border-color:rgba(226,236,231,.28);border-style:dashed;box-shadow:none}
.one .stk-labs span.lay{color:#E2F4D6;border-color:rgba(134,196,99,.6);background:rgba(8,20,10,.82)}
.one .stk-labs span.ai{font:700 13px/1.4 var(--f-cjk);color:var(--leaf-ink);background:var(--leaf);border-color:transparent;box-shadow:0 0 26px var(--leaf-glow)}
@media (max-width:760px){.one .stk-labs span{font-size:11px;padding:3px 8px}.one .stk-labs span.blk{font-size:10.5px}}

/* 研产供销服：卡上只留系统名，不再有「研 / 产 / 管」小章 */
.hm .tile.abs .k{gap:0}
.hm .tile.abs .l{word-break:keep-all;text-wrap:balance}.hm .lede{text-wrap:pretty}   /* 手机上不许「排产规 / 则」这种单字落行 */

/* 合作：一条光线串起四个点 */
.f4{position:relative;max-width:980px;margin:56px auto 0}
.f4 ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:relative;z-index:1}
.f4 li{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.f4 .nd{width:16px;height:16px;border-radius:50%;margin-bottom:14px;background:var(--leaf);border:2px solid #B8EC93;box-shadow:0 0 18px 4px rgba(107,173,70,.7);transition:all .5s}
.f4 li b{font:700 clamp(24px,2.6vw,34px)/1.2 var(--f-disp);color:#E8EDEA;transition:color .5s,text-shadow .5s}
.f4 li small{font:500 13px var(--f-lat);color:var(--t2);letter-spacing:.04em}
.f4-line{position:absolute;left:12.5%;right:12.5%;top:7px;height:2px;border-radius:2px;background:rgba(226,236,231,.1)}
.f4-line i{position:absolute;left:0;top:0;bottom:0;width:100%;background:linear-gradient(90deg,var(--leaf),#B8EC93);box-shadow:0 0 14px var(--leaf);transition:width .6s var(--ease)}
.f4-line b{position:absolute;top:-4px;left:0;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:#F2FFE8;box-shadow:0 0 16px 5px rgba(134,196,99,.85);animation:travel 3.4s ease-in-out infinite}
.anim .f4 .nd{background:var(--screen);border-color:rgba(226,236,231,.25);box-shadow:none}
.anim .f4 li b{color:rgba(232,237,234,.3)}
.anim .f4-line i{width:0}.anim .f4-line b{opacity:0}
.anim .f4.s1 li:nth-child(1) .nd,.anim .f4.s2 li:nth-child(2) .nd,.anim .f4.s3 li:nth-child(3) .nd,.anim .f4.s4 li:nth-child(4) .nd{background:var(--leaf);border-color:#B8EC93;box-shadow:0 0 18px 4px rgba(107,173,70,.7)}
.anim .f4.s1 li:nth-child(1) b,.anim .f4.s2 li:nth-child(2) b,.anim .f4.s3 li:nth-child(3) b,.anim .f4.s4 li:nth-child(4) b{color:#E8EDEA;text-shadow:0 0 24px rgba(107,173,70,.35)}
.anim .f4.s2 .f4-line i{width:33.3%}.anim .f4.s3 .f4-line i{width:66.6%}.anim .f4.s4 .f4-line i{width:100%}.anim .f4.s4 .f4-line b{opacity:1}
.f4-more{text-align:center;margin-top:40px}
@media (max-width:600px){
  .f4 ol{grid-template-columns:minmax(0,1fr);gap:26px}
  .f4 li{flex-direction:row;justify-content:flex-start;text-align:left;gap:14px;padding-left:4px}
  .f4 .nd{margin:0}
  .f4-line{left:11px;right:auto;top:8px;bottom:8px;width:2px;height:auto}
  .f4-line i{width:100%;height:100%}.anim .f4-line i{width:100%;height:0}
  .anim .f4.s2 .f4-line i{width:100%;height:33.3%}.anim .f4.s3 .f4-line i{width:100%;height:66.6%}.anim .f4.s4 .f4-line i{width:100%;height:100%}
  .f4-line b{display:none}
  .f4 li small{margin-left:auto}
}