/* Studio hero: light Chinese statement, reference-led BEILUO / circled Ai. */
@font-face{font-family:Studio Light;src:local('HONOR Sans CN Light'),local('HONORSansCN-Light'),local('HarmonyOS Sans SC Light'),local('HarmonyOS_Sans_SC_Light');font-style:normal;font-weight:300;font-display:swap}
@font-face{font-family:Studio Thin;src:local('HONOR Sans CN Thin'),local('HONORSansCN-Thin'),local('HarmonyOS Sans SC Thin'),local('HarmonyOS_Sans_SC_Thin');font-style:normal;font-weight:100;font-display:swap}
.site-header.studio-header{top:0;left:0;right:0;transform:none;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);width:auto;max-width:none;min-height:98px;height:auto;padding:25px clamp(24px,3.35vw,72px);gap:24px;border:0;border-radius:0;background:transparent;backdrop-filter:none;box-shadow:none;transition:background .25s,padding .25s,min-height .25s}
.studio-header .brand{grid-column:3;grid-row:1;justify-self:end;gap:10px;font-size:21px;font-weight:500;letter-spacing:.035em;color:#fff}
.brand-separator{font-weight:300}
.studio-header-note{grid-column:1;grid-row:1;justify-self:start;font:400 10px/1.5 Arial,sans-serif;letter-spacing:.17em;color:#fff;white-space:nowrap}
.brand-role{font:inherit;color:inherit;letter-spacing:inherit}
.site-header.studio-header nav{grid-column:2;grid-row:1;justify-self:center;gap:34px;font-size:13px;letter-spacing:.045em}
.site-header.studio-header nav a,.studio-header .nav-contact{padding:10px 0;border-radius:0;background:transparent;color:#fff}
.site-header.studio-header nav a:hover,.studio-header .nav-contact:hover{background:transparent;color:#c2d6e2}
.site-header.studio-header nav a[aria-current]{background:none;text-decoration:underline;text-underline-offset:7px}
.studio-header .nav-contact{margin-left:18px}
.site-header.studio-header.scrolled{min-height:72px;padding-top:12px;padding-bottom:12px;background:#0e1217ed;backdrop-filter:blur(16px);box-shadow:0 1px 0 #ffffff15}
.studio-hero{--studio-pad:clamp(24px,3.35vw,72px);height:100svh;min-height:720px;max-height:1400px;display:block;color:#f2f3ef}
.studio-hero .hero-backdrop{background:#10151b}
.studio-lab-mark{position:absolute;z-index:2;top:calc(max(14px,env(safe-area-inset-top)) + 60px);right:var(--studio-pad);margin:0;color:#fff;font-family:'Studio Light','Microsoft YaHei',sans-serif;font-size:20px;font-weight:300;line-height:28px;letter-spacing:.045em;white-space:nowrap}
@media(max-width:1200px){.studio-lab-mark{top:max(20px,env(safe-area-inset-top));font-size:17px;line-height:26px}}
.studio-hero .hero-backdrop img,.studio-hero .hero-backdrop video{object-position:50% 50%;filter:none}
.cosmic-hero.studio-hero:before{background:linear-gradient(180deg,#080d12ad 0%,#080d128a 18%,#080d128a 48%,transparent 68%,#0a0a0c33 100%)}
.studio-copy{position:absolute;top:25%;left:var(--studio-pad);right:var(--studio-pad);display:grid;grid-template-columns:minmax(0,1fr) 236px;column-gap:7vw;align-items:start}
.studio-statement,.studio-practice{mix-blend-mode:normal;color:#fff}
.studio-signature{mix-blend-mode:difference;color:#fff}
.studio-statement h1{font-family:'Studio Thin','Studio Light','DengXian Light','PingFang SC','Microsoft YaHei',sans-serif;font-weight:100;font-style:normal;font-size:clamp(48px,min(5.4vw,8.4vh),96px);line-height:1.38;letter-spacing:-.045em;text-shadow:none}
.studio-line{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.studio-line>span{display:block}
.studio-practice{padding-top:11px;font-family:'Studio Light','Microsoft YaHei',sans-serif;font-weight:300;font-size:15px;line-height:2.2;text-shadow:none}
.studio-practice ul{list-style:none;margin:0;padding:0}
.studio-practice .studio-ai-practice{margin-top:22px}
.studio-signature{position:absolute;left:calc(var(--studio-pad) - .025em);bottom:104px;display:flex;align-items:flex-start;gap:.025em;font-size:clamp(88px,min(10.6vw,18vh),190px);line-height:.82;white-space:nowrap}
.studio-wordmark{display:flex;align-items:baseline;font:600 1em/.82 Arial,Helvetica,sans-serif;letter-spacing:-.065em}
.studio-initial{font-size:1em;letter-spacing:-.055em}
.studio-rest{font-size:.78em;letter-spacing:-.065em}
svg.studio-ai{width:.43em;height:.43em;flex:none;margin-top:0;fill:none;stroke:currentColor;stroke-width:5.7}
.studio-ai text{font:600 45px Arial,Helvetica,sans-serif;letter-spacing:-3px;fill:currentColor;stroke:none}
.studio-hero .hero-bottom{bottom:25px;left:var(--studio-pad);right:var(--studio-pad);height:44px;font-size:11px;letter-spacing:.03em;color:#d2d7d8}
.studio-hero .scroll-link{position:absolute;left:50%;transform:translateX(-50%);border:0;border-radius:0;background:transparent;color:#fff}
.studio-hero .scroll-link:hover{background:transparent}
.studio-hero .scroll-link svg{width:27px;height:34px;stroke-width:1.4;animation:studio-arrow-drift 2.2s cubic-bezier(.45,0,.55,1) infinite}
.studio-hero.motion-paused .scroll-link svg,.studio-hero.motion-offscreen .scroll-link svg{animation-play-state:paused}
@keyframes studio-arrow-drift{0%,100%{transform:translateY(-4px)}50%{transform:translateY(5px)}}
.studio-hero:focus-visible{outline:2px solid #d1e5f4;outline-offset:-4px}
.studio-hero a:focus-visible,.studio-hero button:focus-visible,.studio-header a:focus-visible,.studio-header button:focus-visible{outline:2px solid #d1e5f4;outline-offset:6px}
@media(min-width:1800px){.studio-copy{grid-template-columns:minmax(0,1fr) 290px}.studio-practice{font-size:17px}}
@media(max-width:1050px){.studio-copy{grid-template-columns:minmax(0,1fr) 210px;column-gap:30px}.studio-statement h1{font-size:clamp(42px,6.2vw,64px)}.studio-practice{font-size:13px}.site-header.studio-header nav{gap:23px}.studio-signature{font-size:clamp(88px,min(11vw,18vh),135px)}}
@media(max-width:950px){.site-header.studio-header{grid-template-columns:1fr 1fr;min-height:112px;row-gap:2px;padding:16px 24px}.site-header.studio-header nav{grid-column:1/-1;grid-row:2}.studio-header .brand{grid-column:2;grid-row:1}.site-header.studio-header.scrolled{min-height:100px;padding-top:10px;padding-bottom:10px}}
@media(max-width:700px){
 .site-header.studio-header{min-height:98px;padding:14px 24px;column-gap:18px;row-gap:0}.studio-header .brand{grid-column:1/-1;font-size:17px;gap:8px;letter-spacing:.025em}.studio-header-note{display:none}.brand-role{display:inline;font-size:inherit;letter-spacing:inherit}.site-header.studio-header nav{gap:24px;font-size:12px;letter-spacing:.035em}.site-header.studio-header nav a{padding:10px 0}.site-header.studio-header nav a[href='#archive']{display:none}.studio-header .nav-contact{margin:0;padding:10px 0}.studio-header .nav-contact span{display:inline;margin-left:3px}
 .site-header.studio-header.scrolled{min-height:88px;padding:9px 24px}
 .studio-hero{--studio-pad:24px;min-height:700px;height:100svh;max-height:1100px}
 .studio-hero .hero-backdrop img{object-position:48% 50%}
 .cosmic-hero.studio-hero:before{background:linear-gradient(180deg,#080d1266 0%,#080d1266 18%,#080d1266 55%,transparent 73%,#0a0a0c66 100%)}
 .studio-copy{top:24%;display:block}.studio-statement h1{font-size:clamp(37px,min(10.5vw,7.2vh),65px);line-height:1.42;letter-spacing:-.05em}
 .studio-practice{margin-top:31px;padding-top:0;font-size:13px;line-height:2;max-width:240px}
 .studio-signature{bottom:105px;font-size:min(17.8vw,108px);left:var(--studio-pad)}
 .studio-hero .hero-bottom{bottom:23px;font-size:11px}
}
@media(max-width:360px){.site-header.studio-header,.site-header.studio-header.scrolled{padding-left:20px;padding-right:20px}.site-header.studio-header nav{gap:17px;font-size:12px}.studio-hero{--studio-pad:20px}.studio-practice{font-size:12px}}
@media(min-width:500px) and (max-width:700px) and (max-height:800px){.studio-copy{top:17%}}
@media(max-width:700px) and (max-height:650px){.studio-hero{min-height:560px}.studio-copy{top:128px}.studio-statement h1{font-size:clamp(32px,min(10vw,6.8vh),44px)}.studio-practice{margin-top:18px;font-size:12px;line-height:1.9}.studio-practice .studio-ai-practice{margin-top:14px}.studio-signature{bottom:90px;font-size:min(16vw,92px)}.studio-hero .hero-bottom{bottom:15px}}
@media(min-width:701px) and (max-height:760px){.studio-hero{min-height:650px}.studio-copy{top:23%}.studio-statement h1{font-size:clamp(42px,8vh,62px)}.studio-signature{font-size:clamp(88px,min(10.6vw,17vh),128px);bottom:92px}.studio-practice{font-size:13px}}
@media(prefers-reduced-motion:reduce){.studio-hero .scroll-link svg{animation:none;transform:none}.studio-hero .hero-backdrop video{display:none}}

/* Scroll island: the glass shell stretches independently so type stays crisp. */
.site-header.studio-header,.site-header.studio-header.scrolled{top:max(14px,env(safe-area-inset-top));left:50%;right:auto;display:flex;justify-content:center;width:620px;max-width:calc(100% - max(40px,10vw));min-height:0;height:64px;padding:7px;gap:0;border:0;border-radius:999px;background:transparent;backdrop-filter:none;box-shadow:none;isolation:isolate;transform:translateX(-50%) translateY(42px);transition:transform .95s cubic-bezier(.16,1.5,.3,1)}
.site-header.studio-header:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border:1px solid #ffffff26;border-radius:inherit;background:linear-gradient(155deg,#25272bd9,#0c0d10ed 65%);backdrop-filter:blur(24px) saturate(135%);-webkit-backdrop-filter:blur(24px) saturate(135%);box-shadow:0 14px 40px #0005,inset 0 1px 1px #ffffff1a;opacity:0;transform:scale(.24,.55);transition:transform 1.05s cubic-bezier(.16,1.65,.3,1),opacity .18s ease}
.site-header.studio-header.scrolled{transform:translateX(-50%) translateY(0)}
.site-header.studio-header.scrolled:before{opacity:1;transform:scale(1)}
.site-header.studio-header nav{position:relative;display:flex;width:100%;height:100%;gap:6px;overflow:hidden;border-radius:999px;font-size:14px;letter-spacing:.045em;align-items:stretch}
.site-header.studio-header nav a,.studio-header .nav-contact{position:relative;z-index:1;display:flex;flex:1;align-items:center;justify-content:center;white-space:nowrap;padding:0 10px;border-radius:999px;background:transparent;color:#fff;transition:color .18s ease,transform .16s ease}
.studio-header .nav-contact{margin:0}
.site-header.studio-header nav a:hover,.studio-header .nav-contact:hover,.site-header.studio-header nav a[aria-current]{background:transparent;color:#fff;text-decoration:none}
.site-header.studio-header nav a:active,.studio-header .nav-contact:active{transform:scale(.96)}
.site-header.studio-header nav :focus-visible{outline:2px solid #fff;outline-offset:-3px}
.island-marker{position:absolute;top:0;left:0;height:100%;width:0;pointer-events:none;border:1px solid #ffffff24;border-radius:999px;background:linear-gradient(155deg,#ffffff24,#ffffff0b);box-shadow:inset 0 1px 1px #ffffff1a,0 3px 10px #0002;opacity:0}
.site-header.studio-header nav a[href='#archive']{display:flex}
@media(max-width:600px){.site-header.studio-header,.site-header.studio-header.scrolled{height:58px;padding:5px;max-width:calc(100% - max(40px,10vw))}.site-header.studio-header nav{gap:2px;font-size:12px;letter-spacing:0}.site-header.studio-header nav a,.studio-header .nav-contact{padding:0 5px}.studio-header .nav-contact span{display:inline;margin-left:2px}}
@media(prefers-reduced-motion:reduce){.site-header.studio-header,.site-header.studio-header.scrolled,.site-header.studio-header:before,.site-header.studio-header nav a,.studio-header .nav-contact{transition:none}}