/* 方案稿 v2：海报式版面。原则：文字不压图片——文字放在图片旁边或下面的实色区域。 */
figure{margin:0}
.cap{display:block;font-size:12px;color:var(--dim);margin-top:8px;letter-spacing:.02em}
.sec.ink .cap,.on-night .cap{color:var(--night-dim)}

/* ---------- 首屏：左文右图的海报 ---------- */
.poster{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);min-height:min(92vh,880px);background:var(--night);color:#fff}
.poster-tx{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(28px,4vw,64px) clamp(20px,3.5vw,56px) clamp(24px,3vw,40px) clamp(56px,6vw,96px)}
.poster-tx .vert{position:absolute;left:clamp(16px,2vw,32px);top:clamp(28px,4vw,64px);writing-mode:vertical-rl;font-size:13px;letter-spacing:.5em;color:var(--gold)}
.poster-tx .k{font-size:13px;letter-spacing:.24em;color:var(--night-dim)}
.poster-tx h1{font-size:clamp(44px,6.2vw,104px);font-weight:900;line-height:1.04;letter-spacing:-.03em;margin:clamp(20px,4vh,48px) 0 0}
.poster-tx h1 em{font-style:normal;color:var(--lamp)}
.poster-tx p{max-width:26em;color:rgba(255,255,255,.78);margin-top:clamp(16px,2.4vh,28px);font-size:clamp(14px,1.1vw,16px)}
.poster-tx .btns{margin-top:clamp(20px,3vh,32px)}
.poster-stats{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:0 clamp(20px,3vw,44px);border-top:1px solid var(--night-line);padding-top:16px;margin-top:clamp(24px,4vh,48px)}
.poster-stats b{display:block;font-family:var(--num);font-size:clamp(24px,2.4vw,36px);line-height:1.1}
.poster-stats b small{font-family:var(--sans);font-size:.45em;margin-left:2px}
.poster-stats span{font-size:12px;color:var(--night-dim)}
.poster-ph{display:flex;flex-direction:column;min-height:0;padding:clamp(12px,1.4vw,20px) clamp(12px,1.4vw,20px) 0 0}
.poster-ph .im{flex:1;min-height:0;overflow:hidden}
.poster-ph img{width:100%;height:100%;object-fit:cover;object-position:62% 40%}
.poster-ph .cap{padding:10px 0 14px;text-align:right}
@media (max-width:900px){
  .poster{grid-template-columns:1fr;min-height:0}
  .poster-ph{order:-1;padding:0}
  .poster-ph .im{aspect-ratio:4/5;flex:none}
  .poster-ph .cap{padding:8px var(--gut) 0;text-align:left}
  .poster-tx{padding:24px var(--gut) 32px}
  .poster-tx .vert{display:none}
}

/* ---------- 两大业务：图在上，字在下 ---------- */
.duo{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:clamp(12px,1.6vw,24px);padding:clamp(40px,5vw,72px) var(--gut);max-width:calc(var(--max) + 2 * var(--gut));margin:0 auto}
.duo a{text-decoration:none;color:inherit;display:grid;grid-template-rows:auto 1fr}
.duo .im{overflow:hidden;height:clamp(300px,34vw,520px)}
.duo img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.duo a:hover img{transform:scale(1.03)}
.duo .tx{display:grid;grid-template-columns:auto 1fr;gap:4px 18px;padding:20px 0 0;align-items:start}
.duo .no{grid-row:span 3;font-family:var(--num);font-size:clamp(48px,5vw,80px);line-height:.9;font-weight:700;color:var(--lamp)}
.duo a+a .no{color:var(--moss)}
.duo h2{font-size:clamp(24px,2.6vw,38px);font-weight:900}
.duo p{color:var(--ink2);font-size:15px}
.duo .go{font-size:14px;border-bottom:1px solid currentColor;justify-self:start;margin-top:6px}
.duo a:hover .go{color:var(--lamp-d)}
.duo .pct{display:inline-block;font-family:var(--num);font-size:12px;color:#fff;background:var(--lamp);padding:1px 7px;margin-left:10px;vertical-align:middle;letter-spacing:.04em}
.duo a+a .pct{background:var(--moss)}
.duo-r{display:grid;grid-template-rows:1fr auto}
.duo a{grid-template-rows:auto auto;align-content:start}
@media (max-width:800px){ .duo{grid-template-columns:1fr} .duo .im{height:auto;aspect-ratio:16/10} }

/* ---------- 全球足迹 ---------- */
.globe{background:var(--night);color:var(--night-text);padding:clamp(56px,7vw,112px) var(--gut)}
.globe-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,4vw,64px);align-items:end;margin-bottom:clamp(20px,3vw,40px)}
.globe-num{font-family:var(--num);font-size:clamp(96px,14vw,220px);font-weight:700;line-height:.82;letter-spacing:-.04em;color:var(--lamp)}
.globe-num sup{font-size:.4em;vertical-align:top;margin-left:4px;color:var(--gold)}
.globe-head h2{font-size:clamp(26px,3.2vw,46px);font-weight:900;color:#fff}
.globe-head p{color:var(--night-dim);margin-top:12px;max-width:36em}
.globe-map{margin:0}
.globe-map img{width:100%;height:auto}
.globe-legend{display:flex;flex-wrap:wrap;gap:6px 24px;font-size:12px;color:var(--night-dim);margin-top:10px}
.globe-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:-1px}
.regions{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px;margin-top:clamp(28px,4vw,48px);border-top:1px solid var(--night-line);padding-top:20px}
.regions h3{font-size:14px;color:#fff;margin-bottom:8px}
.regions h3 span{font-family:var(--num);color:var(--gold);margin-left:6px;font-weight:400}
.regions ul{list-style:none;margin:0;padding:0;font-size:13px;line-height:1.9;color:var(--night-dim)}
.regions li.c{color:#fff}
.regions li.c::after{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--lamp);margin-left:6px;vertical-align:2px}
@media (max-width:1000px){ .regions{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:640px){ .globe-head{grid-template-columns:1fr} .regions{grid-template-columns:repeat(2,minmax(0,1fr))} .globe-map{margin:0 calc(-1 * var(--gut))} }

/* ---------- 篇章分隔：大号篇号 ---------- */
.chapter{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(16px,3vw,40px);align-items:end;padding-bottom:clamp(24px,3vw,40px);margin-bottom:clamp(32px,4vw,56px);border-bottom:1px solid var(--night-line)}
.chapter .big{font-family:var(--num);font-size:clamp(80px,11vw,170px);font-weight:700;line-height:.8;color:var(--lamp);letter-spacing:-.04em}
.chapter h2{font-size:clamp(34px,5vw,72px);font-weight:900;line-height:1.05;color:#fff}
.chapter p{color:var(--night-dim);margin-top:10px;max-width:34em}
.chapter .pct{font-family:var(--num);font-size:14px;letter-spacing:.1em;color:var(--gold);border:1px solid currentColor;padding:4px 10px;white-space:nowrap}
.sec.moss .chapter{border-color:#c9cdb8}
.sec.moss .chapter .big{color:var(--moss)}
.sec.moss .chapter h2{color:var(--ink)}
.sec.moss .chapter p{color:var(--dim)}
.sec.moss .chapter .pct{color:var(--moss)}
@media (max-width:700px){ .chapter{grid-template-columns:auto 1fr} .chapter .pct{grid-column:1/-1;justify-self:start} }

/* ---------- 科威特重点项目：左图右文 ---------- */
.feature{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:clamp(16px,2.4vw,36px);align-items:end}
.feature .im{overflow:hidden;aspect-ratio:2/1}
.feature img{width:100%;height:100%;object-fit:cover}
.feature .award{display:inline-block;background:#b3261e;color:#fff;font-size:12px;font-weight:700;padding:4px 10px;margin-bottom:16px}
.feature .where{font-size:12px;letter-spacing:.14em;color:var(--gold)}
.feature h3{font-size:clamp(26px,2.8vw,40px);font-weight:900;margin:6px 0 12px;color:#fff}
.feature p{color:#c9c8c2;font-size:15px}
.feature .nums{display:grid;grid-template-columns:1fr 1fr;gap:12px;border-top:1px solid var(--night-line);margin-top:18px;padding-top:12px}
.feature .nums b{display:block;font-family:var(--num);font-size:30px;color:#fff;line-height:1.1}
.feature .nums b small{font-family:var(--sans);font-size:.45em;margin-left:2px}
.feature .nums span{font-size:12px;color:var(--night-dim)}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,20px);margin-top:clamp(24px,3vw,40px)}
.trio a{text-decoration:none;color:inherit}
.trio .im{overflow:hidden;aspect-ratio:3/2}
.trio img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.trio a:hover img{transform:scale(1.04)}
.trio .where{display:block;font-size:12px;letter-spacing:.12em;color:var(--gold);margin-top:12px}
.trio h3{font-size:17px;color:#fff;margin-top:2px}
@media (max-width:900px){ .feature{grid-template-columns:1fr} .trio{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ .trio{grid-template-columns:1fr} }

/* ---------- 安装带：字在左，图在右，说明在图下 ---------- */
.band{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,5fr);gap:clamp(10px,1.2vw,18px);align-items:start}
.band .tx h2{font-size:clamp(24px,2.8vw,38px);font-weight:900;color:#fff}
.band .tx p{margin-top:14px;color:var(--night-dim)}
.band .im{aspect-ratio:4/3;overflow:hidden}
.band img{width:100%;height:100%;object-fit:cover}
@media (max-width:900px){ .band{grid-template-columns:1fr 1fr} .band .tx{grid-column:1/-1} }
@media (max-width:520px){ .band{grid-template-columns:1fr} }

/* ---------- 款式：图上不写字，标题放在图下 ---------- */
.fam2{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,20px) clamp(10px,1.2vw,18px)}
.fam2 a{text-decoration:none;color:inherit}
.fam2 .im{aspect-ratio:1/1;overflow:hidden;background:var(--night2)}
.fam2 img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.fam2 a:hover img{transform:scale(1.05)}
.fam2 h3{font-size:16px;color:#fff;margin-top:12px;display:flex;gap:10px;align-items:baseline}
.fam2 h3 b{font-family:var(--num);font-size:12px;color:var(--gold);font-weight:400}
.fam2 p{font-size:12px;color:var(--night-dim);margin-top:2px}
@media (max-width:900px){ .fam2{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ---------- 委内瑞拉重点案例 ---------- */
.ve{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.2vw,18px)}
.ve-main{grid-column:span 2}
.ve-main .im{aspect-ratio:16/10;overflow:hidden}
.ve .im img{width:100%;height:100%;object-fit:cover}
.ve .sm .im{aspect-ratio:3/2;overflow:hidden}
.ve-tx{display:flex;flex-direction:column;justify-content:center}
.ve-tx .meta{display:flex;gap:10px;font-size:12px;color:var(--moss);letter-spacing:.06em}
.ve-tx h3{font-size:clamp(24px,2.4vw,34px);font-weight:900;margin:6px 0 10px}
.ve-tx p{color:var(--ink2);font-size:15px}
.ve-cats{display:flex;flex-wrap:wrap;gap:6px;list-style:none;padding:0;margin:14px 0 0}
.ve-cats li{font-size:13px;border:1px solid var(--moss);color:var(--moss-d);padding:2px 10px}
.ve-nums{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px;border-top:2px solid var(--ink)}
.ve-nums div{padding-top:10px}
.ve-nums b{display:block;font-family:var(--num);font-size:clamp(26px,2.6vw,36px);line-height:1.1}
.ve-nums b small{font-family:var(--sans);font-size:.45em;margin-left:2px}
.ve-nums span{font-size:12px;color:var(--dim)}
@media (max-width:900px){ .ve{grid-template-columns:1fr 1fr} .ve-main,.ve-tx{grid-column:1/-1} }
@media (max-width:520px){ .ve{grid-template-columns:1fr} }
.pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.6vw,24px);margin-top:clamp(28px,3vw,44px)}
@media (max-width:640px){ .pair{grid-template-columns:1fr} }
.lines.four .line .ph{aspect-ratio:1/1}
.feat-ph img{width:100%;aspect-ratio:4/3;object-fit:cover}
/* P0 交互样张专用样式（叠在 styles.css + concept/poster.css 之上） */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}

/* ---------- 首屏：high 档是粒子画布，其余是实拍海报 ---------- */
.lh{position:relative;height:min(100vh,940px);min-height:620px;background:radial-gradient(ellipse at 70% 60%,#1a1210 0%,#0d0e12 60%);color:#fff;overflow:hidden}
.lh canvas{display:none;position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y}
.lh.gl canvas{display:block}
.lh .still{position:absolute;right:0;top:0;width:58%;height:100%;object-fit:cover;object-position:62% 40%}
.lh.gl .still{display:none}
.lh .still-cap{position:absolute;right:var(--gut);bottom:24px;font-size:12px;color:#a09f9a;z-index:2}
.lh.gl .still-cap{display:none}
.lh .tx{position:relative;z-index:2;max-width:var(--max);margin:0 auto;height:100%;display:flex;flex-direction:column;justify-content:center;padding:0 var(--gut);pointer-events:none}
.lh .tx>*{pointer-events:auto;max-width:min(30em,40%)}
.lh .k{font-size:13px;letter-spacing:.24em;color:var(--gold)}
.lh h1{font-size:clamp(44px,6vw,100px);font-weight:900;line-height:1.04;letter-spacing:-.03em;margin:20px 0 0}
.lh h1 em{font-style:normal;color:var(--lamp)}
.lh p{color:rgba(255,255,255,.75);margin-top:22px;max-width:24em}
.lh .btns{margin-top:28px}
.lh .meta{display:none;position:absolute;z-index:2;right:var(--gut);bottom:28px;align-items:center;gap:18px;font-size:12px;color:#a09f9a}
.lh.gl .meta{display:flex}
.lh [data-dots]{display:flex;gap:8px}
.lh [data-dots] i{width:26px;height:3px;background:#3a3b42;cursor:pointer}
.lh [data-dots] i.on{background:var(--lamp)}
/* 首屏照片与文字之间用渐隐衔接，但渐隐只落在照片左边缘，不压主体 */
.lh .still-fade{position:absolute;top:0;bottom:0;right:58%;width:120px;transform:translateX(100%);background:linear-gradient(90deg,#0d0e12,rgba(13,14,18,0));z-index:1}
.lh.gl .still-fade{display:none}
@media (max-width:800px){
  .lh{height:auto;min-height:0;display:flex;flex-direction:column}
  .lh canvas,.lh .still{position:relative;width:100%;height:62vh;order:-1}
  .lh .still-fade{display:none}
  .lh .tx{height:auto;padding:16px var(--gut) 72px}.lh .tx>*{max-width:none}
  .lh .meta,.lh .still-cap{left:var(--gut);right:auto;bottom:24px}
}

/* ---------- 3D 地球（high/mid），low 档用平面点阵图 ---------- */
.gl-sec{position:relative;background:var(--night);color:var(--night-text);padding:clamp(56px,7vw,110px) var(--gut)}
.gl-sec .in{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(20px,3vw,48px);align-items:center}
.gl-sec .num{font-family:var(--num);font-size:clamp(90px,11vw,180px);font-weight:700;line-height:.82;color:var(--lamp);letter-spacing:-.04em}
.gl-sec .num sup{font-size:.4em;color:var(--gold);vertical-align:top}
.gl-sec h2{font-size:clamp(24px,2.8vw,40px);font-weight:900;color:#fff;margin-top:16px}
.gl-sec .lead{color:var(--night-dim);margin-top:10px;font-size:15px}
.gl-sec ul{list-style:none;margin:22px 0 0;padding:0;border-top:1px solid var(--night-line)}
.gl-sec li button{all:unset;box-sizing:border-box;display:grid;grid-template-columns:5.5em 1fr;gap:12px;width:100%;padding:9px 4px;border-bottom:1px solid var(--night-line);cursor:pointer;font-size:14px}
.gl-sec li button b{color:#fff}.gl-sec li button span{color:var(--night-dim);font-size:13px}
.gl-sec li button:hover b,.gl-sec li button.on b{color:var(--gold)}
.gl-sec li button:focus-visible{outline:2px solid var(--lamp)}
.stage{position:relative;aspect-ratio:1/1;max-height:82vh;width:100%}
.stage canvas,[data-labels]{display:none}
.gl-sec.gl .stage canvas{display:block;position:absolute;inset:0;width:100%;height:100%;cursor:grab;touch-action:pan-y}
.gl-sec.gl [data-labels]{display:block;position:absolute;inset:0;pointer-events:none}
.gl-sec.gl .flat{display:none}
.stage .flat{width:100%;height:100%;object-fit:contain}
.gl-label{position:absolute;left:0;top:0;margin:-9px 0 0 10px;font:13px/1 var(--sans);color:#ecebe6;background:none;border:0;padding:3px 6px;white-space:nowrap;cursor:pointer;transition:opacity .25s;text-shadow:0 0 6px #000}
.gl-label.on{background:var(--lamp);color:#fff;text-shadow:none}
.gl-label.home{font-weight:700;color:#fff;margin-left:12px}
[data-card]{position:absolute;right:0;bottom:0;width:min(280px,60%);background:#16171d;border:1px solid var(--night-line);padding:10px;font-size:13px}
[data-card] img{width:100%;aspect-ratio:3/2;object-fit:cover;display:block;margin-bottom:8px}
[data-card] b{display:block;color:#fff;font-size:15px}[data-card] span{color:var(--night-dim)}
@media (max-width:900px){ .gl-sec .in{grid-template-columns:1fr} .stage{order:-1;max-height:none} }

/* ---------- 篇章：左侧篇号固定，右侧内容滚动 ---------- */
.chap{position:relative;padding:clamp(56px,7vw,110px) var(--gut)}
.chap.night{background:var(--night);color:var(--night-text)}
.chap.day{background:#e7e9dc;color:var(--ink)}
.chap-in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:clamp(24px,4vw,64px)}
.chap-side{position:sticky;top:96px;align-self:start}
.chap-side .big{display:block;font-family:var(--num);font-size:clamp(90px,10vw,170px);font-weight:700;line-height:.8;letter-spacing:-.04em;color:var(--lamp)}
.chap-side h2{font-size:clamp(30px,3.6vw,54px);font-weight:900;line-height:1.08;margin-top:14px}
.chap-side p{font-size:14px;margin-top:12px;opacity:.75}
.chap-side .pct{display:inline-block;margin-top:16px;font-family:var(--num);font-size:13px;letter-spacing:.1em;color:var(--gold);border:1px solid currentColor;padding:3px 10px}
.chap-nav{display:grid;margin-top:28px;border-top:1px solid rgba(128,128,128,.3)}
.chap-nav a{display:flex;gap:10px;padding:9px 0;font-size:14px;text-decoration:none;opacity:.55;border-bottom:1px solid rgba(128,128,128,.2);transition:opacity .3s}
.chap-nav a b{font-family:var(--num);font-weight:400;font-size:12px;padding-top:2px}
.chap-nav a.on{opacity:1}
.chap-nav a.on b{color:var(--lamp)}
.chap.day .chap-side .big{color:var(--moss)}
.chap.day .chap-side .pct{color:var(--moss)}
.chap.day .chap-nav a.on b{color:var(--moss)}
.chap-main>section+section{margin-top:clamp(64px,8vw,120px)}
.chap-main h3.t{font-size:clamp(22px,2.4vw,32px);font-weight:900;margin-bottom:8px}
.chap-main .sub{opacity:.7;font-size:14px;margin-bottom:22px;max-width:40em}
.chap.night .chap-main h3.t{color:#fff}
/* 天亮时机模篇文字由浅变深 */
html.sky-on .chap.day{color:#c9c8c2;transition:color .6s}
html.sky-on .chap.day.lit{color:var(--ink)}
@media (max-width:900px){ .chap-in{grid-template-columns:1fr} .chap-side{position:relative;top:0} .chap-nav{display:none} }

/* 篇章内网格（主栏比整页窄，列数相应减少） */
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,20px)}
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.2vw,16px)}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
@media (max-width:1000px){ .g4{grid-template-columns:repeat(2,minmax(0,1fr))} .g3{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:520px){ .g3,.g2{grid-template-columns:1fr} }
.shot{margin:0}
.shot .im{overflow:hidden;background:#15161b}
.chap.day .shot .im,.sec .shot .im{background:#d9dccd}
.shot .im img{width:100%;height:100%;object-fit:cover;display:block}
.shot .r32{aspect-ratio:3/2}.shot .r11{aspect-ratio:1/1}.shot .r21{aspect-ratio:2/1}.shot .r43{aspect-ratio:4/3}.shot .r1610{aspect-ratio:16/10}
.shot figcaption{font-size:13px;margin-top:10px;line-height:1.6}
.shot figcaption b{display:block;font-size:16px}
.chap.night .shot figcaption b{color:#fff}
.shot figcaption small{display:block;font-size:12px;opacity:.6}
.shot figcaption .n{font-family:var(--num);color:var(--lamp);margin-right:8px;font-weight:400}
.chap.day .shot figcaption .n{color:var(--moss)}

/* 款式宫格：鼠标停在哪张，哪张亮，其余变暗 */
.dimgroup .im img{transition:filter .4s,transform .7s}
.dimgroup:has([data-lb]:hover) [data-lb]:not(:hover) .im img{filter:brightness(.38) saturate(.6)}
.dimgroup [data-lb]:hover .im img{transform:scale(1.04)}

/* 可点开的图：鼠标变成放大镜，右上角提示 */
[data-lb]{cursor:zoom-in;position:relative}
[data-lb] .im{position:relative}
[data-lb] .im::after{content:"";position:absolute;right:10px;top:10px;width:30px;height:30px;border-radius:50%;background:rgba(0,0,0,.45) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2'%3E%3Cpath d='M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7'/%3E%3C/svg%3E") center/14px no-repeat;opacity:0;transition:opacity .3s}
[data-lb]:hover .im::after,[data-lb]:focus-visible .im::after{opacity:1}
@media (pointer:coarse){ [data-lb] .im::after{opacity:.85} }
[data-lb]:focus-visible{outline:3px solid var(--lamp);outline-offset:3px}

/* 鼠标灯光 */
[data-light]{position:relative}
.glow{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:0;transition:opacity .5s;mix-blend-mode:screen;background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(242,181,68,.13),rgba(228,87,31,.05) 40%,transparent 70%)}

/* ---------- 看大图 ---------- */
#lb{position:fixed;inset:0;width:100vw;height:100vh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;color:#fff;overflow:hidden}
#lb::backdrop{background:rgba(8,9,12,0);transition:background .4s}
#lb.in::backdrop{background:rgba(8,9,12,.94)}
#lb .lb-stage{position:absolute;inset:0}
#lb .lb-img{position:absolute;object-fit:contain;will-change:transform,clip-path;user-select:none;-webkit-user-drag:none}
#lb .lb-bar{position:absolute;left:0;right:0;bottom:0;display:flex;gap:16px;align-items:center;justify-content:space-between;padding:16px clamp(16px,3vw,32px) calc(16px + env(safe-area-inset-bottom));font-size:14px;opacity:0;transition:opacity .3s .15s}
#lb.in .lb-bar,#lb.in .lb-close,#lb.in .lb-nav{opacity:1}
#lb .lb-cap{color:#ecebe6;max-width:60em}
#lb .lb-count{font-family:var(--num);color:#a09f9a;white-space:nowrap}
#lb button{font:inherit;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);cursor:pointer}
#lb button:hover{background:rgba(255,255,255,.18)}
#lb .lb-close{position:absolute;right:clamp(12px,2vw,24px);top:clamp(12px,2vw,24px);width:44px;height:44px;font-size:22px;opacity:0;transition:opacity .3s}
#lb .lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:64px;font-size:22px;opacity:0;transition:opacity .3s}
#lb .lb-prev{left:clamp(8px,1.5vw,20px)}#lb .lb-next{right:clamp(8px,1.5vw,20px)}
@media (max-width:700px){ #lb .lb-nav{display:none} }

/* ---------- 演示用：设备等级面板 ---------- */
#tier-panel{position:fixed;left:12px;bottom:12px;z-index:70;display:flex;align-items:center;gap:6px;font:12px/1 var(--sans);color:#ddd;background:rgba(10,10,14,.82);border:1px solid #333;padding:6px 8px;backdrop-filter:blur(6px)}
#tier-panel button{font:inherit;color:#ddd;background:none;border:1px solid #555;padding:4px 8px;cursor:pointer}
#tier-panel button.on{background:var(--lamp);border-color:var(--lamp);color:#fff}
#tier-panel [data-fps]{font-family:var(--mono);color:#999;margin-left:6px}
@media (max-width:700px){ #tier-panel{bottom:60px} }

.gl-sec:not(.gl) .gl-only{display:none}

/* ---------- P1：篇章里的深色主题、地球项目清单 ---------- */
.chap-main h3.t .n{font-family:var(--num);color:var(--lamp);margin-right:10px;font-weight:400}
.chap.day .chap-main h3.t .n{color:var(--moss)}
.chap.night .faq details{border-color:var(--night-line)}
.chap.night .faq details p{color:#c9c8c2}
.chap.night .case h3{color:#fff}
.chap.night .case p{color:var(--night-dim)}
.chap.night .case .meta{color:var(--gold)}
.chap.night .more{color:var(--night-text);border-color:var(--gold)}
.chap .sub a{color:inherit;border-bottom:1px solid currentColor;text-decoration:none}
.line-tile figcaption b a{text-decoration:none}
.line-tile figcaption b a:hover{color:var(--lamp-d)}
.gl-sec li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border-bottom:1px solid var(--night-line)}
.gl-sec li button{border-bottom:0}
.gl-case{font-size:12px;color:var(--gold);text-decoration:none;border:1px solid rgba(242,181,68,.4);padding:2px 8px;margin-left:8px}
.gl-case:hover{background:var(--gold);color:var(--night)}
.gl-sec .regions{max-width:var(--max);margin:clamp(28px,4vw,48px) auto 0}
.globe-note{max-width:var(--max);margin:14px auto 0;font-size:12px;color:var(--night-dim)}

/* ---------- 首屏“走进灯会”：全屏光点场景 + 三幕滚动 ---------- */
.fx{position:relative;height:100vh;min-height:600px;background:#07080b;color:#fff}
.fx.fx-on{height:320vh}
.fx-stick{position:sticky;top:0;height:100vh;min-height:600px;overflow:hidden}
.fx canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity 1.2s}
.fx.gl canvas{opacity:1}
.fx-still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:62% 40%;transition:opacity 1.6s}
.fx.gl .fx-still{opacity:0}
.fx-shade{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 60% 55% at 0% 0%,rgba(7,8,11,.78),rgba(7,8,11,0) 70%),radial-gradient(ellipse 60% 55% at 100% 0%,rgba(7,8,11,.55),rgba(7,8,11,0) 70%),linear-gradient(180deg,rgba(7,8,11,0) 75%,rgba(7,8,11,.6))}
.fx-step{position:absolute;z-index:2;top:calc(68px + 7vh);max-width:min(32em,40vw);opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.fx-step.on{opacity:1;transform:none;pointer-events:auto}
.fx-step.tl{left:var(--gut)}
.fx-step.tr{right:var(--gut);text-align:right}
.fx-step.tr .btns{justify-content:flex-end}
.fx-step .k{font-size:13px;letter-spacing:.24em;color:var(--gold)}
.fx-step h1,.fx-step h2{font-size:clamp(38px,5vw,84px);font-weight:900;line-height:1.06;letter-spacing:-.03em;margin:16px 0 0;text-shadow:0 2px 30px rgba(0,0,0,.5)}
.fx-step h2{font-size:clamp(32px,4vw,64px)}
.fx-step h1 em{font-style:normal;color:var(--lamp)}
.fx-step p{color:rgba(255,255,255,.8);margin-top:18px;max-width:26em;text-shadow:0 1px 12px rgba(0,0,0,.6)}
.fx-step.tr p{margin-left:auto}
.fx-step .btns{margin-top:24px}
.fx:not(.gl) [data-step]:not(:first-of-type){display:none}
.fx-meta{position:absolute;z-index:2;right:var(--gut);bottom:26px;display:flex;align-items:center;gap:16px;font-size:12px;color:rgba(255,255,255,.7)}
.fx-ticks{display:flex;gap:6px}
.fx-ticks i{width:24px;height:3px;background:rgba(255,255,255,.25);transition:background .4s}
.fx:not(.gl) .fx-ticks{display:none}
.fx[data-step="0"] .fx-ticks i:nth-child(1),.fx[data-step="1"] .fx-ticks i:nth-child(2),.fx[data-step="2"] .fx-ticks i:nth-child(3){background:var(--lamp)}
.fx-hint{position:absolute;z-index:2;left:50%;bottom:24px;transform:translateX(-50%);font-size:12px;letter-spacing:.3em;color:rgba(255,255,255,.55);padding-bottom:26px}
.fx-hint::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:18px;background:currentColor;animation:fxhint 1.8s infinite}
@keyframes fxhint{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
.fx:not(.fx-on) .fx-hint{display:none}
@media (max-width:800px){
  .fx-step,.fx-step.tl,.fx-step.tr{left:var(--gut);right:var(--gut);max-width:none;text-align:left;top:auto;bottom:84px}
  .fx-step.tr .btns{justify-content:flex-start}.fx-step.tr p{margin-left:0}
  .fx-shade{background:linear-gradient(180deg,rgba(7,8,11,0) 35%,rgba(7,8,11,.85) 78%)}
  .fx-meta{left:var(--gut);right:auto;bottom:22px}
  .fx-hint{display:none}
}
@media (prefers-reduced-motion:reduce){ .fx-hint::after{animation:none} }
/* 文字所在一侧加深，按幕切换（照片本身不变，只在文字后面压暗） */
.fx-shade-l,.fx-shade-r{opacity:0;transition:opacity .9s}
.fx-shade-l{background:linear-gradient(90deg,rgba(7,8,11,.8) 0%,rgba(7,8,11,.45) 30%,rgba(7,8,11,0) 52%)}
.fx-shade-r{background:linear-gradient(270deg,rgba(7,8,11,.8) 0%,rgba(7,8,11,.45) 30%,rgba(7,8,11,0) 52%)}
.fx[data-step="0"] .fx-shade-l,.fx[data-step="1"] .fx-shade-l,.fx:not([data-step]) .fx-shade-l{opacity:.75}
.fx[data-step="1"] .fx-shade-l{opacity:1}
.fx[data-step="2"] .fx-shade-r{opacity:1}
@media (max-width:800px){ .fx-shade-l,.fx-shade-r{display:none} }

/* ---------- 仿真机模开场：光点 → 实体恐龙 ---------- */
.dx{position:relative;height:100vh;min-height:560px;background:radial-gradient(ellipse 70% 60% at 65% 70%,#1b1712 0%,#0b0c0f 70%);color:#fff}
.dx.dx-on{height:300vh}
.dx-stick{position:sticky;top:0;height:100vh;min-height:560px;overflow:hidden}
.dx canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity 1s}
.dx.gl canvas{opacity:1}
.dx-still{position:absolute;inset:0;margin:0}
.dx-still img{width:100%;height:100%;object-fit:cover}
.dx-still::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,12,15,.85),rgba(11,12,15,.2) 55%,rgba(11,12,15,0))}
.dx.gl .dx-still{display:none}
.dx-step{position:absolute;z-index:2;left:var(--gut);top:50%;transform:translateY(-40%);max-width:min(30em,38vw);opacity:0;transition:opacity .8s,transform .8s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.dx-step.on{opacity:1;transform:translateY(-50%);pointer-events:auto}
.dx:not(.gl) .dx-step:not(:first-of-type){display:none}
.dx-step .k{font-size:13px;letter-spacing:.24em;color:#b9d79a}
.dx-step h2{font-size:clamp(34px,4.4vw,72px);font-weight:900;line-height:1.08;letter-spacing:-.02em;margin:14px 0 0}
.dx-step h2 em{font-style:normal;color:var(--lamp)}
.dx-step p{color:rgba(255,255,255,.75);margin-top:16px;max-width:24em}
.dx-step .btns{margin-top:22px}
.dx-note{position:absolute;z-index:2;right:var(--gut);bottom:22px;font-size:12px;color:rgba(255,255,255,.45)}
.dx:not(.gl) .dx-note{display:none}
@media (max-width:800px){
  .dx-step{top:auto;bottom:70px;transform:translateY(20px);max-width:none;right:var(--gut)}
  .dx-step.on{transform:none}
  .dx-note{left:var(--gut);right:auto;bottom:14px}
}

/* ---------- 海报式首屏（彩灯页、机模页） ---------- */
.phero{position:relative;min-height:min(100vh,980px);height:100vh;max-height:1080px;color:#fff;background:#0b0c0f;overflow:hidden;isolation:isolate;display:flex;flex-direction:column;justify-content:flex-end}
.ph-bg{position:absolute;inset:-6% 0;margin:0;z-index:-3}
.ph-bg img{width:100%;height:100%;object-fit:cover;animation:phzoom 2.6s cubic-bezier(.2,.7,.2,1) both;filter:saturate(1.06) contrast(1.04)}
@keyframes phzoom{from{transform:scale(1.08);filter:brightness(.55) saturate(.8) contrast(1.04)}to{transform:scale(1);filter:saturate(1.06) contrast(1.04)}}
/* 渐变：左侧多段平滑压暗（无硬边）；底部融进下一屏；四角暗角；整体微暖调色 */
.ph-grade{position:absolute;inset:0;z-index:-2;pointer-events:none;background:
  linear-gradient(90deg,rgba(11,12,15,.94) 0%,rgba(11,12,15,.9) 14%,rgba(11,12,15,.78) 24%,rgba(11,12,15,.58) 33%,rgba(11,12,15,.36) 41%,rgba(11,12,15,.18) 49%,rgba(11,12,15,.07) 56%,rgba(11,12,15,0) 64%),
  linear-gradient(180deg,rgba(11,12,15,.55) 0%,rgba(11,12,15,0) 18%,rgba(11,12,15,0) 62%,rgba(11,12,15,.55) 82%,#0b0c0f 100%),
  radial-gradient(ellipse 85% 75% at 62% 48%,rgba(0,0,0,0) 55%,rgba(0,0,0,.45) 100%)}
.ph-grade::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(228,87,31,.10),rgba(242,181,68,.04) 40%,rgba(20,40,70,.10));mix-blend-mode:soft-light}
/* 胶片颗粒，给画面质感 */
.ph-grain{position:absolute;inset:-50%;z-index:-1;pointer-events:none;opacity:.10;mix-blend-mode:overlay;background: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%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 1 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
/* 细线框四角，海报版式感 */
.ph-frame{position:absolute;inset:calc(68px + 18px) var(--gut) 18px;pointer-events:none}
.ph-frame i{position:absolute;width:26px;height:26px;border-color:rgba(255,255,255,.45);border-style:solid;border-width:0}
.ph-frame i:nth-child(1){left:0;top:0;border-left-width:1px;border-top-width:1px}
.ph-frame i:nth-child(2){right:0;top:0;border-right-width:1px;border-top-width:1px}
.ph-frame i:nth-child(3){left:0;bottom:0;border-left-width:1px;border-bottom-width:1px}
.ph-frame i:nth-child(4){right:0;bottom:0;border-right-width:1px;border-bottom-width:1px}
.ph-in{position:relative;width:100%;max-width:var(--max);margin:0 auto;padding:0 calc(var(--gut) + 28px) clamp(110px,15vh,170px)}
.ph-in>*:not(.ph-head){max-width:min(34em,48vw)}
.ph-head{display:flex;align-items:flex-end;gap:18px}
.ph-num{font-family:var(--num);font-weight:700;font-size:clamp(70px,8vw,128px);line-height:.78;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.55)}
.phero .k{font-size:13px;letter-spacing:.26em;color:var(--gold);padding-bottom:6px}
.phero h1{font-size:clamp(46px,6.4vw,112px);font-weight:900;line-height:1.02;letter-spacing:-.035em;margin:22px 0 0;text-shadow:0 4px 40px rgba(0,0,0,.35)}
.phero h1 em{font-style:normal;color:var(--lamp)}
.ph-rule{display:block;width:72px;height:2px;background:var(--lamp);margin:26px 0 0}
.phero p{color:rgba(255,255,255,.78);margin-top:18px;font-size:clamp(14px,1.05vw,16px);max-width:30em}
.phero .btns{margin-top:28px}
.phero .crumb{padding:0 0 22px!important}
.ph-foot{position:absolute;left:0;right:0;bottom:calc(18px + 14px);display:flex;align-items:flex-end;gap:28px;max-width:var(--max);margin:0 auto;padding:0 calc(var(--gut) + 28px);font-size:12px;color:rgba(255,255,255,.62)}
.ph-place{flex:none}
.ph-facts{display:flex;gap:clamp(18px,3vw,44px);list-style:none;margin:0 0 0 auto;padding:0}
.ph-facts li{display:grid;border-left:1px solid rgba(255,255,255,.25);padding-left:12px}
.ph-facts b{font-family:var(--num);font-size:clamp(20px,1.8vw,28px);color:#fff;font-weight:700;line-height:1.1}
.ph-scroll{writing-mode:vertical-rl;letter-spacing:.3em;position:relative;padding-bottom:30px}
.ph-scroll::after{content:"";position:absolute;left:50%;bottom:0;width:1px;height:22px;background:currentColor;animation:fxhint 1.8s infinite}
@media (max-width:900px){
  .phero{height:auto;min-height:0;max-height:none;display:block}
  .ph-bg{position:relative;inset:auto;height:64vh}
  .ph-grade{background:linear-gradient(180deg,rgba(11,12,15,.4) 0%,rgba(11,12,15,0) 16%,rgba(11,12,15,0) 38%,rgba(11,12,15,.75) 54%,#0b0c0f 64%)}
  .ph-in{margin-top:-14vh;padding:0 var(--gut) 28px}.ph-in>*:not(.ph-head){max-width:none}
  .ph-foot{position:relative;bottom:auto;padding:0 var(--gut) 24px;flex-wrap:wrap}
  .ph-facts{margin:0;width:100%}.ph-scroll,.ph-frame{display:none}
}
@media (prefers-reduced-motion:reduce){ .ph-bg img,.ph-grain,.ph-scroll::after{animation:none} }

.dx.gl canvas{cursor:grab;touch-action:pan-y}
.dx.dragging canvas{cursor:grabbing}
.dx-step{z-index:3}

.phero{height:calc(100vh - 68px);min-height:560px;max-height:1012px}
@media (max-width:900px){ .phero{height:auto;min-height:0;max-height:none} }

/* ---------- 海报字体：大标题用思源宋体粗体，数字与英文标签用 Bebas Neue ---------- */
:root{--poster:"Noto Serif SC","Source Han Serif SC","Songti SC",serif;--label:"Bebas Neue","DIN Alternate","Bahnschrift",sans-serif}
.phero h1,.fx-step h1,.fx-step h2,.dx-step h2,.chap-side h2,.chap-main h3.t,.gl-sec h2,.duo h2,.feat h2,.cta h2,.sh h2,.gx-title{font-family:var(--poster);font-weight:900;letter-spacing:-.01em}
.phero h1{letter-spacing:-.02em;line-height:1.08}
.ph-num,.chap-side .big,.gl-sec .num,.ph-facts b,.ve-nums b,.facts b,.duo .no,.gx-idx,.gx-label{font-family:var(--label);font-weight:400;letter-spacing:.01em}
.phero .k,.fx-step .k,.dx-step .k,.kicker{font-family:var(--label),var(--sans);letter-spacing:.18em;font-size:15px}

/* ---------- 旋转光廊 ---------- */
.gx{position:relative;background:radial-gradient(ellipse 80% 60% at 50% 55%,#17130f 0%,#0b0c0f 70%);color:#fff}
.gx-stick{display:none}
.gx-fallback{padding:clamp(56px,7vw,110px) var(--gut)}
.gx-fallback .shot{text-decoration:none;color:inherit}
.gx-fallback h2{color:#fff}.gx-fallback .shot figcaption b{color:#fff}.gx-fallback .shot figcaption small{color:var(--night-dim)}
.gx.gx-on{height:calc(var(--gx-n, 6) * 55vh + 100vh)}
.gx.gx-on .gx-fallback{display:none}
.gx.gx-on .gx-stick{display:block;position:sticky;top:0;height:100vh;min-height:560px;overflow:hidden}
.gx canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .8s;cursor:grab;touch-action:pan-y}
.gx.gl canvas{opacity:1}
.gx.dragging canvas{cursor:grabbing}
.gx-head{position:absolute;z-index:2;left:var(--gut);top:calc(68px + 4vh);max-width:min(28em,40vw);pointer-events:none}
.gx-head h2{font-size:clamp(30px,3.6vw,58px);line-height:1.08;margin-top:8px}
.gx-head p{color:var(--night-dim);margin-top:12px;font-size:14px}
.gx-nav{position:absolute;z-index:2;left:var(--gut);right:var(--gut);bottom:26px;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 22px}
.gx-nav button{all:unset;cursor:pointer;font-size:13px;color:rgba(255,255,255,.5);padding:6px 0;border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
.gx-nav button .gx-idx{color:var(--gold);margin-right:6px;font-size:14px}
.gx-nav button[aria-current="true"]{color:#fff;border-color:var(--lamp)}
.gx-nav button:focus-visible{outline:2px solid var(--lamp);outline-offset:3px}
.gx-hint{position:absolute;z-index:2;right:var(--gut);top:calc(68px + 4vh);font-size:12px;letter-spacing:.2em;color:rgba(255,255,255,.45)}
.gx:focus-visible{outline:none}
.gx:focus-visible .gx-stick{box-shadow:inset 0 0 0 2px var(--lamp)}
@media (max-width:800px){
  .gx-head{max-width:none;right:var(--gut)}
  .gx-nav{gap:4px 14px;bottom:18px}.gx-nav button{font-size:12px}
  .gx-hint{display:none}
}

@media (max-width:800px){ .gx-nav{justify-content:center;gap:10px;bottom:84px} .gx-nav button{font-size:0;width:22px;padding:8px 0} .gx-nav button .gx-idx{font-size:14px;margin:0;color:rgba(255,255,255,.45)} .gx-nav button[aria-current="true"] .gx-idx{color:#fff} .gx-head{top:calc(60px + 3vh)} .gx-head h2{font-size:30px} }

.dx .dx-step{text-shadow:0 2px 24px rgba(0,0,0,.55)}
.dx-still::after{background:linear-gradient(90deg,rgba(11,12,15,.8),rgba(11,12,15,.25) 45%,rgba(11,12,15,0) 65%)}

/* ---------- 灯光展廊（首页） ---------- */
.cx{position:relative;background:#09090c;color:#fff}
.cx-stick{display:none}
.cx.cx-on{height:calc(var(--cx-n, 5) * 120vh)}
.cx.cx-on .cx-fallback{display:none}
.cx.cx-on .cx-stick{display:block;position:sticky;top:var(--top-h,68px);height:calc(100vh - var(--top-h,68px));min-height:520px;overflow:hidden}
.cx canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity 1.2s}
.cx.gl canvas{opacity:1}
.cx.cx-on .cx-stick::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(9,9,12,.82) 0,rgba(9,9,12,.55) 26%,rgba(9,9,12,0) 46%)}
.cx[data-step="0"] .cx-stick::before{opacity:0}
.cx-stick::before{transition:opacity .9s}
/* 文字：每个展位一段，“点亮”式出现 */
.cx-step{position:absolute;z-index:2;left:calc(var(--gut) + 8px);top:50%;transform:translateY(-44%);max-width:min(30em,36vw);opacity:0;filter:blur(6px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1),filter .9s;pointer-events:none}
.cx-step.on{opacity:1;filter:none;transform:translateY(-50%);pointer-events:auto}
.cx-step .k{display:block;font-family:var(--label),var(--sans);font-size:15px;letter-spacing:.2em;color:var(--gold)}
.cx-step h1,.cx-step h2{font-family:var(--poster);font-weight:900;font-size:clamp(38px,4.4vw,76px);line-height:1.1;letter-spacing:-.01em;margin-top:18px;text-shadow:0 4px 40px rgba(0,0,0,.6)}
.cx-step h1 em,.cx-step h2 em{font-style:normal;color:var(--lamp)}
.cx-step p{color:rgba(255,255,255,.72);margin-top:18px;font-size:15px;max-width:26em;text-shadow:0 1px 14px rgba(0,0,0,.7)}
.cx-step .btns{margin-top:24px}
.cx-cap{display:block;margin-top:22px;font-size:12px;letter-spacing:.06em;color:rgba(255,255,255,.45)}
.cx-step.intro{left:50%;transform:translate(-50%,-44%);text-align:center;max-width:none}
.cx-step.intro.on{transform:translate(-50%,-50%)}
.cx-step.intro h1{font-size:clamp(64px,10vw,180px);letter-spacing:.02em}
.cx-step.intro p{margin:18px auto 0}
/* 角落展签 */
.cx-hud{position:absolute;z-index:2;left:calc(var(--gut) + 8px);right:calc(var(--gut) + 8px);bottom:24px;display:flex;align-items:center;gap:20px;font-family:var(--label),var(--sans);font-size:13px;letter-spacing:.18em;color:rgba(255,255,255,.55)}
.cx-hud b{font-weight:400;color:#fff}
.cx-bar{flex:1;height:1px;background:rgba(255,255,255,.15);position:relative;overflow:hidden}
.cx-bar i{position:absolute;inset:0;background:var(--lamp);transform-origin:0 50%;transform:scaleX(0)}
.cx-hint{position:absolute;z-index:2;left:50%;bottom:64px;transform:translateX(-50%);font-size:12px;letter-spacing:.3em;color:rgba(255,255,255,.45);transition:opacity .6s}
.cx:not([data-step="0"]) .cx-hint{opacity:0}
@media (max-width:800px){
  .cx-step,.cx-step.intro{left:var(--gut);right:var(--gut);top:auto;bottom:calc(84px + env(safe-area-inset-bottom));transform:translateY(16px);max-width:none;text-align:left}
  .cx-step.on,.cx-step.intro.on{transform:none}
  .cx-step.intro{top:42%;bottom:auto;text-align:center}
  .cx-step h1,.cx-step h2{font-size:clamp(32px,9vw,44px)}
  .cx-step.intro h1{font-size:64px}
  .cx-hud{bottom:calc(64px + env(safe-area-inset-bottom));font-size:11px;gap:12px}
  .cx-hint{display:none}
  .cx-step .btns{display:flex;gap:10px;margin-top:18px}.cx-step .btns .btn{flex:1 1 0;min-width:0;padding-left:10px;padding-right:10px;justify-content:center;text-align:center;font-size:14px}
  .cx-cap{display:none}
  .cx-stick::after{content:"";position:absolute;left:0;right:0;bottom:0;height:55%;background:linear-gradient(180deg,rgba(9,9,12,0),rgba(9,9,12,.85));pointer-events:none;z-index:1}
}
@media (prefers-reduced-motion:reduce){ .cx-step{transition:none;filter:none} }

/* ==================== 首页两扇门（34 号文档）==================== */
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.doors{--ease:cubic-bezier(.2,.7,.2,1);position:relative;display:flex;height:calc(100svh - var(--top-h,69px));min-height:520px;max-height:1100px;background:#000;color:#fff;overflow:hidden}
.door{position:relative;flex:1 1 0;min-width:0;display:block;color:inherit;text-decoration:none;transition:flex-grow 1s var(--ease)}
.door .media{position:absolute;inset:0;overflow:hidden;background:#0b0c0f}
.door video,.door .still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:filter 1s var(--ease),transform 6s var(--ease)}
.door video{opacity:0;transition:opacity 1.2s,filter 1s var(--ease),transform 6s var(--ease)}
.door video.on,.vhero .ph-bg video.on{opacity:1}
.door::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.35) 0,rgba(0,0,0,0) 30%,rgba(0,0,0,0) 45%,rgba(0,0,0,.82) 100%),radial-gradient(120% 90% at 50% 40%,transparent 55%,rgba(0,0,0,.45))}
.door .tx{position:absolute;z-index:3;left:clamp(24px,4vw,64px);right:clamp(24px,3vw,48px);bottom:clamp(32px,7vh,72px);transition:opacity .5s,transform 1s var(--ease)}
.door .no{font-family:var(--label),var(--sans);font-size:clamp(15px,1.1vw,18px);letter-spacing:.28em;color:rgba(255,255,255,.7)}
.door .no b{font-weight:400;color:var(--gold);margin-right:.8em}
.door .t{font-family:var(--poster);font-weight:900;line-height:1.08;letter-spacing:-.01em;font-size:clamp(56px,7.2vw,132px);margin:14px 0 0;text-shadow:0 6px 50px rgba(0,0,0,.5)}
.door .t em{font-style:normal;color:var(--lamp)}
.door p{margin-top:14px;max-width:24em;color:rgba(255,255,255,.8);font-size:clamp(14px,1.05vw,16px);line-height:1.7}
.door .go{display:inline-flex;align-items:center;gap:14px;margin-top:22px;font-size:15px;letter-spacing:.06em}
.door .go i{display:block;width:36px;height:1px;background:currentColor;position:relative;transition:width .6s var(--ease)}
.door .go i::after{content:"";position:absolute;right:0;top:-4px;width:9px;height:9px;border-top:1px solid;border-right:1px solid;transform:rotate(45deg)}
.door .cap{position:absolute;z-index:3;right:clamp(24px,3vw,48px);top:22px;font-size:12px;letter-spacing:.06em;color:rgba(255,255,255,.6)}
.door:focus-visible{outline:none}
.door:focus-visible .t{text-decoration:underline;text-decoration-color:var(--lamp);text-underline-offset:.18em;text-decoration-thickness:3px}
.door:first-child{z-index:2;box-shadow:1px 0 0 rgba(255,255,255,.22)}
.seam{position:absolute;z-index:4;right:0;top:50%;transform:translate(50%,-50%);display:grid;justify-items:center;gap:12px;padding:18px 10px;background:rgba(9,9,12,.72);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18);pointer-events:none;transition:opacity .5s}
.seam b{writing-mode:vertical-rl;font-family:var(--poster);font-weight:900;font-size:18px;letter-spacing:.4em}
.seam span{writing-mode:vertical-rl;font-family:var(--label),var(--sans);font-size:12px;letter-spacing:.3em;color:var(--gold)}
.doors .hint{position:absolute;left:50%;bottom:16px;transform:translateX(-50%);z-index:5;font-size:12px;letter-spacing:.3em;color:rgba(255,255,255,.5);pointer-events:none}
@media (hover:hover) and (min-width:901px){
  .doors:has(.door:hover) .door,.doors:has(.door:focus-visible) .door{flex-grow:.7}
  .doors:has(.door:hover) .door:hover,.doors:has(.door:focus-visible) .door:focus-visible{flex-grow:1.3}
  .doors:has(.door:hover) .door:not(:hover) :is(video,.still){filter:brightness(.45) saturate(.6)}
  .doors:has(.door:hover) .door:not(:hover) .tx{opacity:.55}
  .door:hover :is(video,.still){transform:scale(1.04)}
  .door:hover .go i{width:64px}
}
/* 点击：门铺满，再进入下一页 */
.doors.opening .door{flex-grow:0!important}.doors.opening .door.open{flex-grow:1!important}
.doors.opening .door:not(.open) .tx,.doors.opening .seam,.doors.opening .hint{opacity:0}
@media (max-width:900px){
  .doors{flex-direction:column;min-height:560px}
  .door:first-child{box-shadow:0 1px 0 rgba(255,255,255,.22)}
  .door .tx{left:var(--gut);right:var(--gut);bottom:20px}
  .door .t{font-size:clamp(44px,13vw,72px);margin-top:8px}
  .door p,.door .cap,.doors .hint{display:none}
  .door .go{margin-top:10px}
  .seam{right:var(--gut);top:auto;bottom:0;transform:translateY(50%);grid-auto-flow:column;align-items:center;gap:10px;padding:7px 12px;white-space:nowrap}
  .seam b,.seam span{writing-mode:horizontal-tb}.seam b{font-size:13px;letter-spacing:.24em}.seam span{font-size:11px;letter-spacing:.18em}
}
@media (max-width:700px){ .doors{height:calc(100svh - var(--top-h,61px) - 55px)} }

/* 门后的首屏：同一段视频接着放 */
.vhero .ph-bg{inset:0}
.vhero .ph-bg .still{animation:none}
.vhero .ph-bg video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.2s;filter:saturate(1.06) contrast(1.04)}
@media (max-width:900px){ .vhero .ph-bg{inset:auto} }

/* 门和首屏之间的转场（支持跨页视图转场的浏览器）；只在从门进入时启用，其余跳转在 interact.js 里跳过 */
@view-transition{navigation:auto}
.vhero .ph-bg{view-transition-name:door-media}.vhero h1{view-transition-name:door-title}
::view-transition-group(door-media),::view-transition-group(door-title){animation-duration:.7s;animation-timing-function:cubic-bezier(.2,.7,.2,1)}
::view-transition-old(root),::view-transition-new(root){animation-duration:.35s}
@media (prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  .door,.door video,.door .still{transition:none}
}

/* 桥：一个项目，两样都交付 */
.bridge{background:var(--night);color:var(--night-text);padding:clamp(64px,9vw,128px) var(--gut)}
.bridge .in{max-width:var(--max);margin:0 auto}
.bridge .k{display:block;font-family:var(--label),var(--sans);font-size:15px;letter-spacing:.22em;color:var(--gold)}
.bridge .bt{font-family:var(--poster);font-weight:900;line-height:1.1;letter-spacing:-.01em;font-size:clamp(34px,4.4vw,72px);margin:16px 0 0;color:#fff}
.bridge .bt em{font-style:normal;color:var(--lamp)}
.bridge .lead{max-width:34em;color:var(--night-dim);margin-top:18px}
.both{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,28px);margin-top:clamp(36px,5vw,64px)}
.both figure{margin:0}
.both .im{display:block;aspect-ratio:4/3;overflow:hidden;background:#111}
.both .im img{width:100%;height:100%;object-fit:cover;transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.both figure:hover .im img{transform:scale(1.03)}
.both figcaption{padding-top:16px}
.both .tag{display:block;font-family:var(--label),var(--sans);letter-spacing:.2em;font-size:14px;color:var(--gold)}
.both h3{font-family:var(--poster);font-weight:900;font-size:clamp(22px,2vw,30px);margin:6px 0 0}
.both h3 a{color:#fff;text-decoration:none}.both h3 a:hover{color:var(--lamp-soft)}
.both p{color:var(--night-dim);margin-top:8px;font-size:15px}
.both ul{list-style:none;padding:0;margin:12px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.both li{font-size:13px;padding:3px 10px;border:1px solid var(--night-line)}
.both li.l{border-color:rgba(228,87,31,.6)}
@media (max-width:860px){ .both{grid-template-columns:1fr} }

/* ---------- 专属询价表单（彩灯页、机模页末尾）：深色海报底，宋体大标题，Bebas 标签 ---------- */
.iq{position:relative;background:var(--night);color:var(--night-text);padding:clamp(64px,8vw,120px) var(--gut);overflow:hidden;overflow:clip;isolation:isolate}
.iq::before{content:"";position:absolute;z-index:-1;left:-180px;top:-220px;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(228,87,31,.2),rgba(228,87,31,0) 70%);pointer-events:none}
.iq-in{max-width:var(--max);margin:0 auto;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(36px,6vw,96px);align-items:start}
.iq-head{position:sticky;top:100px}
.iq .k{display:block;font-family:var(--label),var(--sans);font-size:15px;letter-spacing:.22em;color:var(--gold)}
.iq h2{font-family:var(--poster);font-weight:900;line-height:1.12;letter-spacing:-.01em;font-size:clamp(30px,3.6vw,58px);margin:16px 0 0;color:#fff}
.iq h2 em{font-style:normal;color:var(--lamp)}
.iq .lead{color:var(--night-dim);margin-top:18px;max-width:28em}
.iq-tel{margin-top:30px;padding-top:18px;border-top:1px solid var(--night-line)}
.iq-tel span{display:block;font-size:13px;color:var(--night-dim)}
.iq-tel a{font-family:var(--label);font-size:clamp(32px,3.2vw,46px);line-height:1.2;letter-spacing:.03em;color:#fff;text-decoration:none}
.iq-tel a:hover{color:var(--lamp-soft)}
.iq-form{display:grid;gap:clamp(30px,3.4vw,44px)}
.iq-form fieldset{border:0;margin:0;padding:0;min-width:0}
.iq-g>legend{display:flex;align-items:baseline;gap:12px;width:100%;padding:0 0 16px;border-bottom:1px solid var(--night-line);font-family:var(--poster);font-weight:900;font-size:clamp(20px,1.8vw,26px);color:#fff}
.iq-g>legend b{font-family:var(--label);font-weight:400;font-size:.9em;letter-spacing:.06em;color:var(--lamp)}
.iq-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 22px;margin-top:22px}
.iq-f{display:grid;gap:8px;align-content:start;min-width:0}
.iq-f.full{grid-column:1/-1}
fieldset.iq-f{display:block}
.iq-l{display:block;padding:0;font-size:14px;font-weight:600;color:#fff;line-height:1.5}
fieldset.iq-f>.iq-l{margin-bottom:10px}
.iq-l i{font-style:normal;font-weight:400;font-size:12px;color:var(--night-dim);margin-left:8px}
.iq .req::after{content:" *";color:var(--lamp)}
.iq-f small{display:block;font-size:13px;line-height:1.6;color:var(--night-dim)}
fieldset.iq-f>small{margin-top:10px}
.iq-f input[type=text],.iq-f textarea{font:inherit;font-size:16px;line-height:1.5;color:#fff;background:rgba(255,255,255,.045);border:0;border-bottom:1px solid #4d4e58;border-radius:0;padding:12px 14px;width:100%;min-height:48px;transition:background .2s,border-color .2s}
.iq-f textarea{min-height:120px;resize:vertical}
.iq-f input::placeholder,.iq-f textarea::placeholder{color:#7f7e79}
.iq-f input:hover,.iq-f textarea:hover{border-bottom-color:#8a8983}
.iq-f input:focus,.iq-f textarea:focus{outline:2px solid var(--lamp);outline-offset:0;border-bottom-color:var(--lamp);background:rgba(255,255,255,.08)}
.iq-f [aria-invalid=true]{border-bottom:2px solid #ff8a65;background:rgba(255,138,101,.08)}
/* 单选 / 多选按钮：原生控件铺满按钮、透明，键盘和读屏照常 */
.iq-chips{display:flex;flex-wrap:wrap;gap:8px}
.iq-chip{position:relative;display:inline-flex}
.iq-chip input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.iq-chip span{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 15px;border:1px solid #4d4e58;font-size:14px;line-height:1.35;color:var(--night-text);transition:background .2s,border-color .2s,color .2s}
.iq-chip span::before{content:"";flex:none;width:10px;height:10px;border:1px solid currentColor;border-radius:50%;opacity:.6}
.iq-chip.m span::before{border-radius:1px}
.iq-chip input:hover+span{border-color:#8a8983;color:#fff}
.iq-chip input:checked+span{background:var(--lamp);border-color:var(--lamp);color:#fff}
.iq-chip input:checked+span::before{background:#fff;border-color:#fff;opacity:1}
.iq-chip input:focus-visible+span{outline:3px solid #fff;outline-offset:2px}
.iq-send{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.iq-send .btn{min-height:52px;padding:14px 34px;font-size:16px;font-weight:600}
.iq-send .btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.iq-send .btn[disabled]{opacity:.6;cursor:progress}
.iq-send>span{font-size:13px;color:var(--night-dim)}
.iq-msg{padding:14px 16px;border-left:4px solid var(--gold);background:rgba(255,255,255,.06);color:#fff;font-size:15px;line-height:1.7}
.iq-msg.err{border-left-color:#ff8a65}
.iq-msg:focus{outline:none}.iq-msg:focus-visible{outline:2px solid var(--gold)}
.msg-copy{margin-top:10px;font:inherit;font-size:14px;min-height:40px;padding:6px 14px;background:transparent;color:inherit;border:1px solid currentColor;cursor:pointer}
.msg-copy:hover{background:rgba(255,255,255,.1)}
.form .msg-copy:hover{background:var(--paper2)}
@media (max-width:900px){
  .iq-in{grid-template-columns:1fr}
  .iq-head{position:static}
}
@media (max-width:560px){
  .iq-row{grid-template-columns:1fr;gap:20px}
  .iq-send .btn{width:100%;justify-content:center}
  .iq-chip span{padding:8px 13px}
}
@media (prefers-reduced-motion:reduce){ .iq-f input,.iq-f textarea,.iq-chip span{transition:none} }