:root{--bg:#191919;--orange:#ff702b;--yellow:#eab238;--white:#f5f4f1;--muted:#aaa9a4;--ease:cubic-bezier(.2,.8,.2,1);font-family:'Microsoft YaHei','PingFang SC',Arial,sans-serif;color:var(--white);background:var(--bg)}
*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button,a{outline-offset:6px}a{color:inherit;text-decoration:none}button{border:0;background:none}button:focus-visible,a:focus-visible{outline:2px solid var(--orange)}::selection{background:var(--orange);color:#191919}
#pages{height:100vh;height:100svh;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;scroll-behavior:smooth}.page{height:100vh;height:100svh;min-height:600px;position:relative;isolation:isolate;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden}.grid-lines{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,transparent 8.2%,#ffffff08 8.25%,transparent 8.35%,transparent 41.5%,#ffffff08 41.6%,transparent 41.7%);pointer-events:none}
.site-header{position:fixed;left:5.6%;right:3%;height:88px;top:0;display:flex;align-items:center;justify-content:space-between;z-index:20}.wordmark{font-size:13px;font-weight:700;letter-spacing:2px}.wordmark span{display:block;font-size:8px;font-weight:400;margin-top:5px;letter-spacing:3px;color:#b5b5b5}.site-header nav{display:flex;gap:36px;align-items:center;margin-right:auto;margin-left:9vw}.site-header nav a,.site-header nav button{font-size:11px;letter-spacing:2px;padding:10px 0}.site-header nav a:before,.site-header nav button:before{content:'◦';margin-right:7px}.site-header nav a:hover,.site-header nav button:hover{color:var(--orange)}.menu-button{width:42px;height:42px;border-radius:50%;background:#292929;display:grid;align-content:center;gap:5px;justify-content:center}.menu-button span{width:13px;height:1px;background:white}.page-dots{position:fixed;z-index:30;left:19px;top:48%;display:grid;gap:12px}.page-dots a{width:22px;height:22px;display:flex;align-items:center;gap:12px}.page-dots i{width:6px;height:6px;flex-shrink:0;border:1px solid #98938b;border-radius:50%;transition:transform 180ms var(--ease)}.page-dots a[aria-current=page] i{background:var(--orange);border-color:var(--orange);transform:scale(1.4)}.page-dots span{font-size:10px;white-space:nowrap;background:#191919;padding:5px;opacity:0;transition:opacity 180ms}.page-dots a:hover span,.page-dots a:focus-visible span{opacity:1}
.image-slot{background-size:cover;background-position:center}.hero-image{position:absolute;top:10.7%;right:0;width:57%;height:86.5%;background-color:var(--yellow);border-radius:48% 0 0 48%;z-index:-1;overflow:hidden}.hero-image:after{content:'';position:absolute;inset:0;background:linear-gradient(120deg,#ff702b15,transparent 60%);pointer-events:none}.slot-caption{position:absolute;right:9%;bottom:9%;color:#3d2b12;text-align:right;font-size:12px;letter-spacing:2px}.slot-caption small{display:block;font-size:10px;opacity:.55;margin-top:9px}.slot-cross{position:absolute;left:53%;top:46%;font-size:28px;color:#60400950;font-weight:200}.hero-intro{position:absolute;top:29%;left:5.6%;display:flex;gap:2.3vw;align-items:center}.capsule{width:19.6vw;height:8.4vh;max-height:78px;min-height:48px;border-radius:100px;background-color:#b06b42;display:flex;align-items:center;justify-content:center;font-size:11px;letter-spacing:3px;color:#edc8af;overflow:hidden}.hero-intro p{font-size:clamp(12px,1.2vw,17px);line-height:1.9;margin:0;width:25vw;text-shadow:0 1px 5px #19191966}.hero h1{position:absolute;top:41%;left:5.6%;margin:0;font-size:clamp(56px,6.9vw,112px);line-height:1.24;letter-spacing:-.055em;font-weight:800;z-index:2}.title-line{display:block;white-space:nowrap}.hero h1 em{font-style:normal;color:var(--orange)}.letter{display:inline-block}.capsule-bottom{position:absolute;top:70%;left:5.6%;background-color:#454749;color:#ddd;justify-content:space-around;padding:0 19px}.capsule-bottom b{font-size:25px;font-weight:400;transition:transform 200ms}.capsule-bottom:hover b{transform:translate(3px,3px)}.hero-footer{position:absolute;bottom:3.1%;left:5.6%;display:flex;gap:4.5vw}.hero-footer button{text-align:left;padding:0}.hero-footer small{display:block;font-size:10px;color:var(--orange);letter-spacing:2px;margin-bottom:8px}.hero-footer span{display:block;font-size:11px}.scroll-prompt{position:absolute;bottom:3%;right:3.5%;font-size:10px;letter-spacing:2px;color:#332713;display:flex;align-items:center;gap:24px}.scroll-prompt span{font-size:22px}
.works-heading{position:absolute;top:17%;left:8.3%}.works-heading p{font-size:12px;color:var(--orange);letter-spacing:3px;margin:0 0 16px}.works h2{font-size:clamp(42px,5vw,82px);margin:0;line-height:1.2;letter-spacing:-.04em}.orange{color:var(--orange)}.works-intro{position:absolute;right:6%;top:21%;font-size:13px;line-height:1.9;color:var(--muted)}.card-stage{position:absolute;top:38%;left:0;width:100%;height:51%;overflow:visible;perspective:1800px;touch-action:pan-y}.card-track{position:relative;width:100%;height:100%}.project-card{position:absolute;left:0;top:8%;width:var(--card-width,220px);height:87%;padding:0;text-align:left;transform:perspective(1200px) rotateY(-25deg) rotateZ(-7deg);border-radius:18px;background:#666;border:1px solid #c5c0b5;box-shadow:8px 12px 24px #0004;overflow:hidden;transition:transform 300ms var(--ease)}.card-position{position:absolute;top:0;height:100%;width:var(--card-width,220px)}.project-card:before{content:'';position:absolute;inset:0;background:var(--orange);opacity:0;transition:opacity 180ms var(--ease);z-index:1}.project-card:hover:before,.project-card:focus-visible:before{opacity:.75}.project-card:hover,.project-card:focus-visible{transform:perspective(1200px) rotateY(-25deg) rotateZ(-7deg) translateY(-14px)}.card-cover{position:absolute;inset:0 0 26%;background-color:var(--cover);background-size:cover;background-position:center}.card-placeholder{position:absolute;left:20px;top:25px;font-size:10px;color:#fff8;letter-spacing:2px}.card-label{position:absolute;bottom:0;padding:20px 16px;width:100%;background:#242424de;z-index:2}.card-number{display:block;color:#d2c8be;font-size:10px;letter-spacing:1px;margin-bottom:12px}.card-title{display:block;font-size:20px;font-weight:500;letter-spacing:1px}.card-english{display:block;font-size:9px;color:#c0b6ab;letter-spacing:1px;margin-top:7px}.card-arrow{position:absolute;right:15px;bottom:35px;font-size:21px}.works-footer{position:absolute;bottom:4%;left:8.3%;right:5%;display:flex;align-items:center;justify-content:space-between;font-size:10px;letter-spacing:2px;color:#aaa}.works-footer div{display:flex;gap:16px;align-items:center}.works-footer button{font-size:11px;padding:10px}.works-footer button:first-child,.works-footer button:last-child{font-size:20px}.works-footer button:hover{color:var(--orange)}
dialog{width:min(880px,88vw);max-height:86svh;padding:0;border:1px solid #666;background:#252525;color:var(--white);overflow:auto;box-shadow:0 30px 100px #0008}dialog[open]{display:grid;grid-template-columns:1fr 1fr}dialog::backdrop{background:#000b;backdrop-filter:blur(7px)}.close-dialog{position:absolute;right:16px;top:10px;font-size:30px;z-index:3}.detail-image{background-color:var(--orange);min-height:420px;display:grid;place-items:center;font-size:12px;letter-spacing:3px;color:#38200d}.detail-copy{padding:65px 35px 40px}.detail-kicker{font-size:11px;color:var(--orange);letter-spacing:3px}.detail-copy h2{font-size:34px;margin:26px 0}.detail-copy p:not(.detail-kicker){font-size:14px;line-height:1.9;color:#ddd}.detail-copy .detail-note{font-size:11px!important;color:#999!important;margin-top:30px}.back-button{padding:16px 0;border-bottom:1px solid var(--orange);font-size:12px;margin-top:18px}.back-button span{margin-left:50px;color:var(--orange)}.noscript{position:fixed;bottom:0;background:#191919;padding:10px;z-index:60}
@media(min-width:1600px){.hero h1{font-size:7vw}.hero-intro p{font-size:18px}}
@media(max-width:760px){.page{min-height:620px}.site-header{left:8%;right:5%;height:72px}.site-header nav{display:none;position:absolute;right:0;top:65px;background:#242424;padding:25px;min-width:170px;margin:0;flex-direction:column;gap:16px;align-items:flex-start}.site-header.menu-open nav{display:flex}.page-dots{left:8px}.hero-image{top:14%;height:65%;width:70%;border-radius:160px 0 0 160px}.hero-intro{top:24%;left:8%;gap:20px;align-items:flex-start;flex-direction:column}.capsule{width:33vw;height:42px;min-height:42px;font-size:9px}.hero-intro p{font-size:12px;width:65vw;text-shadow:0 1px 5px #191919}.hero h1{top:44%;left:8%;font-size:clamp(39px,9.6vw,70px)}.capsule-bottom{top:67%;left:8%;width:43vw}.hero-footer{left:8%;bottom:7%;gap:25px}.hero-footer span{font-size:10px}.hero-footer small{font-size:9px}.scroll-prompt{bottom:2%;right:6%;color:#aaa;font-size:9px}.slot-caption{bottom:11%;font-size:10px}.slot-caption small{font-size:8px}.works-heading{top:17%;left:10%}.works h2{font-size:42px}.works-intro{left:10%;top:29%;right:5%;font-size:11px}.card-stage{top:43%;height:42%}.works-footer{left:10%;right:5%;bottom:4%;flex-wrap:wrap;gap:10px;font-size:9px}.works-footer>span:last-child{display:none}.card-title{font-size:17px}.card-label{padding:16px 12px}.card-arrow{right:10px}.card-english{font-size:8px}.detail-image{min-height:200px}dialog[open]{grid-template-columns:1fr;max-height:85svh}.detail-copy{padding:24px}.detail-copy h2{font-size:27px;margin:15px 0}}
@media(prefers-reduced-motion:reduce){#pages{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* 三组数据靠左紧凑排列，英文与数字共用底部文字基线。 */
.hero-stats{position:absolute;left:5.6%;right:5.6%;bottom:17%;display:flex;justify-content:flex-start;gap:clamp(28px,3vw,48px);z-index:3}
.hero-stat{display:flex;align-items:baseline;align-items:last baseline;gap:12px;min-width:0}
.hero-stat strong{flex:none;font-family:Bahnschrift,'DIN Alternate','Segoe UI',sans-serif;font-size:clamp(44px,4.7vw,72px);font-weight:600;font-variant-numeric:lining-nums tabular-nums;line-height:1;letter-spacing:0;color:var(--orange)}
.hero-stat>div{display:flex;flex-direction:column;gap:7px;min-width:0}
.hero-stat span{font-size:clamp(12px,1.05vw,16px);line-height:1.3;letter-spacing:.08em;white-space:nowrap}
.hero-stat small{font-family:Arial,sans-serif;font-size:clamp(9px,.9vw,13px);line-height:1.3;color:var(--white);white-space:nowrap}
@media(max-width:1050px) and (min-width:761px){.hero-stats{gap:28px}.hero-stat{gap:9px}.hero-stat small{font-size:10px}}
@media(max-width:760px){.hero-stats{left:8%;right:6%;bottom:9%;flex-wrap:wrap;gap:18px 24px}.hero-stat{gap:9px}.hero-stat strong{font-size:38px}.hero-stat>div{gap:4px}.hero-stat span{font-size:12px}.hero-stat small{font-size:9px;white-space:nowrap}}

/* 首屏与作品页共用灰色点阵；数字分组延迟入场。 */
.hero{background:radial-gradient(ellipse at 53% 68%,#70421c20,transparent 56%),#171717}
.hero .grid-lines{background:radial-gradient(#b9b9b9 .75px,transparent 1px);background-size:13px 13px;opacity:.18;z-index:-2}
.hero h1 em{font-size:.9em}
.hero-stats{bottom:9%}
.hero-stat strong{position:relative;font-size:clamp(54px,5.6vw,86px)}
.hero-stat strong span{font:inherit;letter-spacing:inherit;line-height:inherit;white-space:nowrap}
.hero-stat .stat-reserve{visibility:hidden}
.hero-stat .stat-value{position:absolute;left:0;top:0}
@media(max-width:760px){.hero-stats{bottom:7%;gap:16px 24px}.hero-stat strong{font-size:44px}}

/* 左侧为真正的半圆弧：水平/垂直圆角等半径，容器宽度至少为高度的一半。 */
.hero-image{width:max(57vw,43.25svh);height:86.5svh;border-radius:9999px 0 0 9999px;background:#ddb039}
.hero-image:after{display:none}
.hero-video{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;pointer-events:none}
@media(max-width:760px){.hero-image{width:max(70vw,32.5svh);height:65svh;border-radius:9999px 0 0 9999px}.hero-video{object-position:52% 50%}}

/* 主视觉留出呼吸空间；采样暖黄底色并柔化视频的细微压缩色差。 */
.hero-image{background-color:#d9a838;display:flex;align-items:center;justify-content:center}
.hero-video{flex:none;width:auto;height:80%;aspect-ratio:1;max-width:none;object-fit:contain;object-position:center;-webkit-mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(to right,transparent,#000 3%,#000 97%,transparent),linear-gradient(to bottom,transparent,#000 3%,#000 97%,transparent);-webkit-mask-composite:source-in;mask-composite:intersect}