@font-face{font-family:Space Grotesk;src:url('/assets/space-grotesk.ttf') format('truetype');font-weight:300 700;font-display:swap}
@font-face{font-family:WenKai;src:url('/assets/wenkai-studio.woff2') format('woff2');font-weight:400;font-display:swap}
:root{color-scheme:dark;--navy:#03112d;--ivory:#fbf7ed;--yellow:#ffc52a;--muted:#b7c6df;--line:#283854;--ink:#142845;--cream:#f7f2e7;--ease:cubic-bezier(.16,1,.3,1)}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:40px;scrollbar-color:#4a5e7e var(--navy)}
body{margin:0;background:var(--navy);color:var(--ivory);font-family:'Space Grotesk','PingFang SC','Microsoft YaHei',sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none;text-underline-offset:.22em}
a:focus-visible{outline:3px solid var(--yellow);outline-offset:5px}
::selection{background:var(--yellow);color:var(--navy)}
.wrap{width:min(1184px,calc(100% - 80px));margin-inline:auto}
.site-header{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.wordmark{font-size:22px;line-height:1.2;font-weight:700;letter-spacing:-.02em;display:inline-flex;align-items:center;min-height:44px}
:lang(zh-Hans) .wordmark{font-family:WenKai,serif;font-size:25px;font-weight:400;letter-spacing:.08em}
nav{display:flex;align-items:center;gap:40px;font-size:14px}
.nav-products{display:inline-flex;align-items:center;min-height:44px;color:var(--muted);transition:color .18s}
.nav-products:hover{color:var(--ivory)}
.language-switch{display:flex;border:1px solid var(--line);border-radius:9px;padding:3px;gap:2px}
.language-switch a{display:grid;place-items:center;min-width:48px;min-height:44px;border-radius:6px;color:var(--muted);font-size:13px;transition:background .18s,color .18s}
.language-switch a[aria-current]{background:var(--ivory);color:var(--navy)}
.language-switch a:not([aria-current]):hover{color:var(--ivory);background:#14233e}
.intro{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px;padding-block:64px 88px;min-height:620px}
h1{font-size:clamp(50px,5.2vw,76px);font-weight:500;line-height:1.08;letter-spacing:-.04em;margin:0 0 40px;text-wrap:balance}
:lang(zh-Hans) h1{font-family:WenKai,serif;font-size:clamp(58px,6.2vw,88px);font-weight:400;line-height:1.18;letter-spacing:0}
.studio-logo{display:block;width:100%;height:auto;max-width:520px;justify-self:end;view-transition-name:studio-logo;animation:logo-arrival .85s var(--ease) both}
.button{display:inline-flex;align-items:center;justify-content:center;gap:30px;min-height:54px;padding:15px 24px;border-radius:9px;font-size:15px;font-weight:600;line-height:1.4;transition:background .2s,transform .2s var(--ease)}
.button-primary{background:var(--yellow);color:var(--navy)}
.button-primary:hover{background:#ffd459;transform:translateY(-2px)}
.button-primary:active{transform:translateY(0)}
.button svg{flex:none}
.products{padding-bottom:96px;scroll-margin-top:40px}
.section-title{font-size:20px;font-weight:500;letter-spacing:0;margin:0 0 28px;color:var(--muted)}
.product{display:grid;grid-template-columns:1.06fr 1fr;background:var(--cream);color:var(--ink);border-radius:16px;overflow:hidden}
.product-art{display:flex;align-items:center;justify-content:center;padding:48px;background:#0d54a0;min-height:600px}
.product-art img{display:block;height:520px;width:auto;max-width:100%;object-fit:contain;border-radius:24px;box-shadow:0 20px 46px rgb(0 22 58 / .3)}
.product-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:64px 56px}
.product h3{font-size:clamp(44px,4.4vw,62px);line-height:1.1;letter-spacing:-.03em;font-weight:500;margin:0}
:lang(zh-Hans) .product h3{font-family:WenKai,serif;font-weight:400;letter-spacing:.02em;font-size:68px}
.product-name-en{margin:10px 0 0;font-size:17px;letter-spacing:.01em;color:#4a5a6f}
.product-description{font-size:20px;line-height:1.8;margin:28px 0 20px;max-width:24ch;text-wrap:pretty}
.features{list-style:none;display:flex;flex-wrap:wrap;gap:8px 20px;padding:0;margin:0 0 24px;font-size:13px;line-height:1.6;color:#405470}
.features li{white-space:nowrap}
.platform{display:inline-block;font-size:12px;font-weight:600;line-height:1;padding:8px 11px;border:1px solid #bcc4cd;border-radius:6px;margin-bottom:42px;letter-spacing:.04em}
.product .button:focus-visible{outline-color:var(--ink)}
.site-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-block:28px 36px;gap:20px}
.site-footer p{color:var(--muted);font-size:12px;margin:0}
.not-found{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center}
.error-code{font-size:clamp(80px,20vw,180px);margin:0 0 40px;letter-spacing:-.04em}
@keyframes logo-arrival{from{transform:translateY(12px)}to{transform:translateY(0)}}
@view-transition{navigation:auto}
::view-transition-old(studio-logo),::view-transition-new(studio-logo){animation-duration:.28s}
@media(max-width:900px){.wrap{width:calc(100% - 48px)}.intro{gap:24px;min-height:540px;padding-block:56px 72px}h1{font-size:54px}.product-copy{padding:42px 32px}.product-art{padding:36px 24px;min-height:550px}.product-art img{height:470px}.product-description{font-size:18px}.features{gap:8px 16px}}
@media(max-width:640px){.site-header{height:80px}.wordmark{font-size:19px}:lang(zh-Hans) .wordmark{font-size:22px}nav{gap:16px}.nav-products{display:none}.language-switch a{min-width:44px;min-height:44px}.intro{grid-template-columns:1fr;gap:8px;padding-block:52px 44px;min-height:0}.intro-copy{position:relative;z-index:1}h1{font-size:52px;max-width:10ch;margin-bottom:28px}:lang(zh-Hans) h1{font-size:58px;max-width:none}.studio-logo{max-width:360px;justify-self:center;margin-top:8px}.button{min-height:52px;padding:14px 20px;gap:28px}.products{padding-bottom:56px;scroll-margin-top:24px}.section-title{font-size:18px;margin-bottom:20px}.product{grid-template-columns:1fr}.product-art{padding:32px 24px;min-height:0}.product-art img{height:420px}.product-copy{padding:36px 28px 40px}.product h3{font-size:48px}:lang(zh-Hans) .product h3{font-size:58px}.product-description{max-width:28ch;margin-top:24px}.platform{margin-bottom:28px}.site-footer{padding-block:24px 30px}.site-footer .wordmark{font-size:18px}.site-footer p{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.studio-logo{animation:none}*,*::before,*::after{transition:none!important;animation-duration:0s!important}::view-transition-old(*),::view-transition-new(*){animation:none!important}}
