:root { --bg:#151816; --ink:#f0efe5; font-family:'Jushan Sans','Microsoft YaHei',sans-serif; color:var(--ink); background:var(--bg); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); }
::selection { color:var(--bg); background:var(--ink); }
body::-webkit-scrollbar { width:7px; }
body::-webkit-scrollbar-thumb { background:#8e9785; }
a { color:inherit; text-decoration:none; text-underline-offset:7px; }
button { font:inherit; color:inherit; cursor:pointer; }
a:focus-visible,button:focus-visible { outline:2px solid currentColor; outline-offset:7px; }
.header { position:absolute; top:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between; z-index:20; padding:30px 5vw; }
.logo { display:flex; align-items:center; gap:12px; font-weight:800; letter-spacing:-.04em; font-size:31px; }
.logo span { font-size:12px; font-weight:500; letter-spacing:.08em; width:32px; line-height:1.5; }
nav { display:flex; gap:35px; align-items:center; font-size:14px; }
nav a { padding:12px 0; }
nav a:hover { text-decoration:underline; }
.hero { min-height:760px; height:100svh; position:relative; overflow:hidden; }
.terrain-stage { position:absolute; inset:0; }
.terrain-stage canvas { display:block; width:100%; height:100%; }
.render-fallback { position:absolute; inset:0; display:grid; place-items:center; opacity:.1; font-size:clamp(90px,20vw,260px); font-weight:800; }
.terrain-stage[data-render="webgl"] .render-fallback { display:none; }
.hero-copy { position:absolute; z-index:5; top:24%; left:7%; max-width:580px; pointer-events:none; }
.hero-copy a { pointer-events:auto; }
h1,h2,h3,p { margin:0; }
.hero h1 { font-size:clamp(48px,5.7vw,88px); letter-spacing:-.04em; line-height:1.18; font-weight:800; text-wrap:balance; }
.hero-copy p { margin-top:29px; font-size:16px; line-height:1.9; opacity:.78; }
.primary-link { display:inline-flex; align-items:center; gap:16px; margin-top:30px; font-size:14px; padding:14px 23px; background:var(--ink); color:var(--bg); border-radius:30px; font-weight:600; transition:transform .18s; }
.primary-link:hover { transform:translateY(-3px); }
.hero-signature { position:absolute; left:7%; right:7%; bottom:9%; display:flex; align-items:end; justify-content:space-between; z-index:5; }
.hero-signature>span { font-weight:750; font-size:clamp(36px,5vw,76px); letter-spacing:-.04em; }
.hero-signature p { font-size:13px; opacity:.64; line-height:1.8; }
.stage-legend { position:absolute; right:5vw; top:48%; display:flex; align-items:center; gap:12px; font-size:11px; writing-mode:vertical-rl; opacity:.5; }
.stage-legend i { width:2px; height:65px; background:currentColor; transform:scaleY(var(--progress,0)); transform-origin:top; }
.review-dock { position:fixed; left:50%; bottom:19px; transform:translateX(-50%); z-index:50; display:flex; align-items:center; gap:18px; padding:12px 20px; border-radius:30px; background:#f2f2e9; color:#283126; font-size:12px; box-shadow:0 8px 30px #0002; white-space:nowrap; }
.review-dock span { font-weight:650; }
.review-dock button { border:0; background:none; padding:4px 0; font-size:12px; }
.review-dock button:hover,.review-dock a:hover { text-decoration:underline; }
.review-dock button:disabled { opacity:.4; cursor:default; text-decoration:none; }
.services { padding:140px 7vw 120px; background:var(--bg); position:relative; z-index:2; }
.services h2 { font-size:clamp(32px,4.5vw,66px); line-height:1.25; font-weight:600; letter-spacing:-.03em; }
.service-list { margin-top:80px; display:grid; grid-template-columns:repeat(3,1fr); gap:7vw; }
.service-list h3 { font-size:25px; font-weight:600; margin-bottom:20px; }
.service-list p { font-size:15px; line-height:1.95; opacity:.72; max-width:25em; }
footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:35px 7vw 110px; font-size:12px; }
.footer-brand { font-size:30px; font-weight:750; letter-spacing:-.04em; }
footer p { opacity:.62; }

.theme-obsidian .terrain-stage { left:19%; right:-2%; }
.theme-obsidian .hero-copy { top:25%; }
.theme-obsidian .hero h1 { max-width:4.4em; font-size:clamp(64px,7vw,108px); }
.theme-obsidian .hero-signature>span { font-size:clamp(44px,7vw,105px); }
.theme-obsidian .hero-copy p { max-width:25em; }

.theme-paper { font-family:'Jushan Sans',sans-serif; }
.theme-paper .header { padding-top:35px; }
.theme-paper .hero-copy { top:26%; left:7%; }
.theme-paper .hero h1 { font-family:'Jushan Serif',serif; font-weight:650; font-size:clamp(43px,4.8vw,72px); line-height:1.4; letter-spacing:-.04em; }
.theme-paper .terrain-stage { left:24%; right:-5%; top:3%; }
.theme-paper .hero-signature { bottom:11%; }
.theme-paper .hero-signature>span { font-size:35px; font-weight:500; letter-spacing:.09em; }
.theme-paper .primary-link { background:transparent; color:var(--ink); border:1px solid #687064; }
.theme-paper .hero-signature p,.theme-minimal .hero-signature p { opacity:.78; }
.theme-paper .stage-legend { opacity:.75; }

.theme-midnight .hero-copy { top:17%; left:0; right:0; text-align:center; max-width:none; }
.theme-midnight .hero h1 { font-weight:600; font-size:clamp(48px,5.2vw,80px); line-height:1.22; }
.theme-midnight .hero-copy p { margin-top:24px; font-size:14px; letter-spacing:.08em; }
.theme-midnight .hero-copy .primary-link { margin-top:20px; background:#c3d9e4; color:#0c1824; }
.theme-midnight .terrain-stage { top:30%; bottom:0; }
.theme-midnight .hero-signature { bottom:8%; }
.theme-midnight .hero-signature>span { font-size:35px; font-weight:500; }

.theme-minimal .header { padding:38px 7vw; }
.theme-minimal nav { gap:28px; font-size:12px; }
.theme-minimal .hero { min-height:760px; }
.theme-minimal .hero-copy { top:19%; left:0; right:0; max-width:none; text-align:center; }
.theme-minimal .hero h1 { font-family:'Jushan Serif',serif; font-size:clamp(86px,10vw,150px); font-weight:500; line-height:1.25; letter-spacing:.08em; }
.theme-minimal .hero-copy p { margin-top:23px; font-size:13px; letter-spacing:.05em; }
.theme-minimal .primary-link { background:none; color:var(--ink); padding:8px 0; font-size:12px; text-decoration:underline; text-underline-offset:8px; }
.theme-minimal .terrain-stage { top:31%; bottom:7%; }
.theme-minimal .hero-signature { bottom:9%; }
.theme-minimal .hero-signature>span { font-family:'Jushan Latin',sans-serif; font-size:15px; letter-spacing:0; font-weight:500; }
.theme-minimal .stage-legend { display:none; }
.theme-minimal .services { padding-top:100px; }
.theme-minimal .services h2 { font-family:'Jushan Serif',serif; font-weight:500; }

.theme-maximal { color:var(--ink); }
.theme-maximal .header { padding:24px 4vw; }
.theme-maximal .logo { font-size:37px; font-weight:900; }
.theme-maximal nav { font-weight:700; }
.theme-maximal .hero { isolation:isolate; }
.theme-maximal .poster-type { position:absolute; left:2vw; top:11%; line-height:.83; font-family:'Jushan Latin',sans-serif; font-size:clamp(140px,20vw,320px); font-weight:900; letter-spacing:-.035em; color:#f1e4ba; z-index:-1; }
.theme-maximal .terrain-stage { left:7%; right:-14%; top:4%; z-index:0; mix-blend-mode:normal; }
.theme-maximal .terrain-stage canvas { mix-blend-mode:normal; }
.theme-maximal .hero-copy { left:auto; right:5vw; top:19%; max-width:none; writing-mode:vertical-rl; }
.theme-maximal .hero h1 { font-size:clamp(40px,5vw,76px); font-weight:900; letter-spacing:.02em; }
.theme-maximal .hero-copy p { font-weight:700; font-size:16px; margin-top:0; margin-right:25px; }
.theme-maximal .hero-copy a { display:none; }
.theme-maximal .poster-tape { position:absolute; bottom:15%; left:-5%; width:110%; padding:18px 0; background:#263dd8; color:#eeefc7; transform:rotate(-5deg); z-index:4; font-size:clamp(20px,3vw,45px); font-weight:800; white-space:nowrap; text-align:center; }
.theme-maximal .hero-signature { bottom:5%; left:4%; right:4%; align-items:center; }
.theme-maximal .hero-signature>span { font-size:36px; font-weight:900; }
.theme-maximal .hero-signature p { font-weight:700; opacity:1; }
.theme-maximal .stage-legend { display:none; }
.theme-maximal .services { background:#eeedce; color:#18243b; }
.theme-maximal footer { background:#eeedce; }

.story { position:relative; height:300svh; }
.story-sticky { position:sticky; top:0; height:100svh; overflow:clip; }
.story .terrain-stage { left:13%; right:-7%; }
.story-panels { position:absolute; inset:0; }
.story-panel { height:100svh; padding:0 7vw; display:flex; flex-direction:column; justify-content:center; pointer-events:none; }
.story-panel h1,.story-panel h2 { font-family:'Jushan Serif',serif; font-size:clamp(38px,4.8vw,72px); line-height:1.35; letter-spacing:-.025em; font-weight:600; }
.story-panel p { margin-top:28px; font-size:16px; line-height:1.95; max-width:22em; }
.story-panel .primary-link { align-self:start; pointer-events:auto; }
.story-caption { position:absolute; left:7vw; top:88svh; font-size:13px; }
.theme-story .header { position:absolute; }
.theme-story .services { background:#d7ddce; }
.theme-story footer { background:#d7ddce; }
.no-webgl { padding:160px 7vw; font-size:25px; }
.webgl-unavailable .render-fallback { opacity:.17; }

@media(max-width:760px) {
  .header { padding:22px 22px; }
  .logo { font-size:27px; }
  .logo span { font-size:10px; }
  nav { gap:18px; font-size:12px; }
  nav a:nth-child(1) { display:none; }
  .hero { min-height:760px; height:100svh; }
  .hero-copy { left:24px; right:24px; top:18%; max-width:none; }
  .hero h1 { font-size:46px; line-height:1.2; }
  .hero-copy p { font-size:14px; margin-top:22px; }
  .primary-link { margin-top:22px; font-size:12px; padding:12px 20px; }
  .hero-signature { left:24px; right:24px; bottom:10%; display:block; }
  .hero-signature>span { font-size:34px; }
  .hero-signature p { margin-top:13px; font-size:11px; }
  .stage-legend { display:none; }
  .review-dock { bottom:15px; width:calc(100% - 32px); justify-content:space-between; padding:13px 16px; gap:12px; font-size:11px; }
  .review-dock span { max-width:90px; overflow:hidden; text-overflow:ellipsis; }
  .review-dock button,.review-dock a { font-size:11px; }
  .services { padding:85px 24px; }
  .services h2 { font-size:34px; }
  .service-list { margin-top:45px; display:block; }
  .service-list article+article { margin-top:35px; }
  .service-list h3 { font-size:22px; margin-bottom:12px; }
  .service-list p { font-size:14px; }
  footer { display:block; padding:12px 24px 100px; }
  footer p { margin:19px 0; }
  .theme-obsidian .hero-copy { top:19%; }
  .theme-obsidian .hero h1 { font-size:62px; }
  .theme-obsidian .terrain-stage { left:-15%; right:-35%; top:30%; bottom:13%; }
  .theme-obsidian .hero-signature>span { font-size:36px; }
  .theme-paper .hero-copy { top:20%; left:24px; }
  .theme-paper .hero h1 { font-size:37px; }
  .theme-paper .terrain-stage { left:-25%; right:-30%; top:23%; bottom:7%; }
  .theme-paper .hero-signature { bottom:11%; }
  .theme-paper .hero-signature>span { font-size:26px; }
  .theme-midnight .hero-copy { top:17%; left:10px; right:10px; }
  .theme-midnight .hero h1 { font-size:46px; }
  .theme-midnight .hero-copy p { font-size:11px; }
  .theme-midnight .terrain-stage { left:-25%; right:-25%; top:29%; bottom:4%; }
  .theme-midnight .hero-signature { bottom:11%; }
  .theme-midnight .hero-signature>span { font-size:27px; }
  .theme-minimal .header { padding:24px; }
  .theme-minimal .hero-copy { top:21%; }
  .theme-minimal .hero h1 { font-size:102px; }
  .theme-minimal .hero-copy p { font-size:11px; }
  .theme-minimal .terrain-stage { top:33%; bottom:12%; left:-20%; right:-20%; }
  .theme-minimal .hero-signature { bottom:12%; }
  .theme-minimal .hero-signature>span { font-size:13px; }
  .theme-maximal .header { padding:20px; }
  .theme-maximal .logo { font-size:29px; }
  .theme-maximal .poster-type { top:19%; left:2%; font-size:31vw; line-height:.92; }
  .theme-maximal .hero-copy { top:24%; right:17px; left:auto; }
  .theme-maximal .hero h1 { font-size:40px; }
  .theme-maximal .hero-copy p { font-size:12px; margin-right:12px; }
  .theme-maximal .terrain-stage { left:-15%; right:-35%; top:14%; bottom:8%; }
  .theme-maximal .poster-tape { bottom:21%; font-size:20px; padding:16px 0; }
  .theme-maximal .hero-signature { left:22px; bottom:11%; }
  .theme-maximal .hero-signature>span { font-size:31px; }
  .theme-maximal .hero-signature p { font-size:10px; }
  .story .terrain-stage { left:-30%; right:-35%; top:24%; bottom:8%; }
  .story-panel { justify-content:start; padding:22svh 24px 0; }
  .story-panel h1,.story-panel h2 { font-size:36px; }
  .story-panel p { font-size:13px; margin-top:20px; }
  .story-caption { left:24px; top:88svh; font-size:11px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { animation:none!important; transition:none!important; } }