:root{--black:#10100e;--muted:#6f6f67;--soft:#f6f5ef;--line:#e8e6dc;--accent:#dfff00;--sidebar:3.1rem;--gutter:.6rem;--max:13.2rem;--hero:clamp(5.2rem,29vw,5.9rem)}html{font-size:clamp(72px,5.2083333333vw,100px);scroll-behavior:smooth;min-width:1080px}*{margin:0;padding:0}body{font-family:Inter,"PingFang SC","Source Han Sans CN","Microsoft YaHei",Arial,sans-serif;font-size:.19rem;color:var(--black);background:#fff;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}ul,li{list-style:none}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.leftnav{position:fixed;top:0;left:0;box-sizing:border-box;width:var(--sidebar);height:100vh;padding-left:var(--gutter);background:#fff;transition:top .7s;z-index:30}.leftnav-logo{height:auto;z-index:32}.logo{display:block;background:#fff}.logo img{width:2rem;padding-top:.8rem;padding-bottom:.3rem}.nav-spacer{height:2.2rem}.nav li a,.nav li span{display:inline-block;color:#000;font-size:.19rem;line-height:.4rem}.subnav li a{color:#999}.mark{position:relative;z-index:1}.mark:before{content:"";position:absolute;left:0;bottom:.02rem;width:0;height:.13rem;background:var(--accent);transition:width .35s;z-index:-1}.mark:hover:before{width:100%}.search input{display:block;width:2.05rem;height:.4rem;margin:.4rem 0;border:0;outline:0;background:transparent;color:#999;font:inherit;font-size:.19rem}.leftnav-bottom{top:100vh;padding-top:5vh;padding-bottom:5vh;height:90vh}.leftnav-bottom.visible{top:0}.leftnav-main.hidden{top:-100vh}.insight-nav{margin-bottom:.5rem;max-width:2.05rem}.insight-nav a{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.info-nav{margin-top:.45rem;padding-top:.24rem;border-top:1px solid var(--line);max-width:2rem}.info-nav li span{font-size:.15rem;line-height:.3rem}.rightbox{width:min(var(--max),calc(100vw - var(--sidebar) - var(--gutter)*2));max-width:var(--max);margin-left:calc(var(--sidebar) + max(var(--gutter),(100vw - var(--sidebar) - var(--max))/2));margin-right:auto;overflow-x:hidden}.eyebrow{margin-bottom:.18rem;color:var(--muted);font-size:.16rem;line-height:1;text-transform:uppercase;letter-spacing:.045rem}.studio-hero{display:grid;grid-template-columns:minmax(4.6rem,.92fr) minmax(0,1.08fr);gap:clamp(.44rem,3vw,.64rem);align-items:stretch;min-height:var(--hero);margin-top:clamp(.5rem,4.8vh,.78rem);padding-bottom:clamp(.56rem,4.8vh,.76rem);border-bottom:1px solid var(--line)}.studio-hero-copy{display:flex;min-height:var(--hero);padding:.06rem 0 .1rem;flex-direction:column;justify-content:space-between}.studio-hero h1{max-width:6.8rem;margin-top:clamp(.28rem,3vh,.44rem);font-weight:700}.studio-hero h1 strong{display:block;font-size:.46rem;line-height:1.32;font-weight:700}.studio-hero h1 span{display:block;margin-top:clamp(.22rem,2.2vh,.34rem);color:var(--muted);font-size:clamp(.18rem,1.08vw,.22rem);line-height:1.35;font-weight:600;letter-spacing:.02rem}.studio-hero-meta{display:grid;max-width:5.9rem;gap:.34rem;color:var(--muted);font-size:clamp(.17rem,1.04vw,.2rem);line-height:1.9}.studio-hero-meta div{display:flex;gap:.46rem}.studio-hero-meta a{color:var(--black);font-size:.19rem;line-height:.34rem}.hero-slider{position:relative;min-width:0;width:100%;height:var(--hero);overflow:hidden;background:#fff}.hero-track,.hero-slide{position:absolute;inset:0}.hero-slide{display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .65s}.hero-slide.active{opacity:1}.hero-slide img{width:100%;height:100%;object-fit:contain;object-position:center}.hero-dots{position:absolute;left:0;right:0;bottom:.2rem;display:flex;justify-content:center;gap:.11rem;z-index:2}.hero-dots button{width:.1rem;height:.1rem;border:0;border-radius:50%;background:#ccc;cursor:pointer}.hero-dots button.active{background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.12)}.studio-service-band{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:.7rem;margin-top:.86rem;padding-bottom:.58rem;border-bottom:1px solid var(--line)}.studio-service-band h2,.studio-method h2{font-size:.36rem;line-height:.52rem;font-weight:500}.studio-service-band ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.18rem .34rem}.studio-service-band li{min-width:0;border-top:1px solid var(--line)}.studio-service-band li:nth-child(-n+2){border-top:0}.studio-service-band a{display:grid;grid-template-columns:.44rem minmax(0,1fr);gap:.18rem;padding:.2rem 0 .24rem}.studio-service-band span{grid-column:1;grid-row:1/span 2;color:var(--muted);font-size:.15rem;line-height:.28rem}.studio-service-band strong{grid-column:2;font-size:.22rem;line-height:.32rem;font-weight:500}.studio-service-band em{grid-column:2;margin-top:.06rem;color:var(--muted);font-size:.16rem;line-height:.28rem;font-style:normal}.home-case-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.5rem;align-items:end;margin-top:.72rem}.home-case-head .eyebrow{grid-column:1/-1;margin-bottom:-.28rem}.home-case-head h2{font-size:.4rem;line-height:.56rem;font-weight:500}.home-case-head>a{font-size:.18rem;line-height:.34rem}.work-grid{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:.34rem .28rem;margin-top:.46rem}.work-grid li{width:calc(33.333% - .19rem);margin-bottom:.46rem;background:#fff}.work-grid li>a{display:block;height:100%}.work-image{aspect-ratio:1/1;overflow:hidden;background:#fff}.work-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.work-grid li:hover img{transform:scale(1.055)}.work-grid li:first-child{width:calc(66.666% - .1rem)}.work-grid li:first-child>a{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto 1fr;column-gap:.52rem;padding-bottom:.42rem}.work-grid li:first-child .work-image{grid-column:1/-1;grid-row:1;aspect-ratio:16/9}.case-copy{position:relative;padding:.22rem 0 0;background:#fff}.work-grid li:first-child .case-copy{grid-column:1;grid-row:2}.case-kicker{color:#777;font-size:.15rem;line-height:.22rem}.case-copy h2{margin-top:.06rem;font-size:.24rem;line-height:.34rem;font-weight:500}.work-grid li:first-child .case-copy h2{font-size:.34rem;line-height:.46rem}.case-copy b{display:block;width:.28rem;height:1px;margin:.14rem 0;background:#000}.case-right{padding:.22rem 0 .28rem;background:#fff}.work-grid li:first-child .case-right{grid-column:1;grid-row:3;display:flex;flex-direction:column;align-items:flex-start;align-self:stretch}.work-grid li:first-child .case-link{margin-top:auto}.case-tags{display:flex;flex-wrap:wrap;gap:.06rem .1rem;min-height:.28rem}.case-tags span{color:#555;font-size:.14rem;font-weight:600;line-height:.24rem}.case-desc{max-width:5.7rem;margin-top:.14rem;color:#666;font-size:.16rem;line-height:.28rem}.case-link{display:inline-block;margin-top:.18rem;padding:.05rem .18rem;border:1px solid #000;font-size:.15rem;line-height:.26rem;transition:.22s}.work-grid li:hover .case-link{background:#000;color:#fff}.case-date{padding:.2rem 0 0;color:#777;font-size:.15rem;line-height:.24rem;background:#fff}.work-grid li:first-child .case-date{display:none}.studio-method{display:grid;grid-template-columns:calc(28% + .56rem) minmax(0,1fr);gap:.56rem;align-items:start;margin-top:.58rem;padding:.98rem 0;border-top:1px solid #e8e8e1}.studio-method p:not(.eyebrow){margin-top:.22rem;color:#5f5f58;font-size:.2rem;line-height:.4rem}.studio-news{display:flex;justify-content:space-between;margin-top:.58rem;padding-top:.56rem;border-top:1px solid var(--line)}.studio-news ul{width:28%}.studio-news h3{margin-bottom:.15rem}.studio-news h3 a{font-size:.3rem;font-weight:500}.studio-news li a{display:block;width:100%;overflow:hidden;color:#666;font-size:.17rem;font-weight:500;line-height:2;white-space:nowrap;text-overflow:ellipsis;transition:.2s}.studio-news li a:hover{color:#000;transform:translateX(.04rem)}.page-bottom-action{display:flex;justify-content:space-between;align-items:center;margin-top:1.15rem;padding:.45rem 0;border-top:1px solid var(--line);font-size:.19rem}.page-bottom-action a{font-size:.26rem}.page-bottom-action span{display:inline-grid;width:.68rem;height:.68rem;margin-left:.2rem;place-items:center;border-radius:50%;background:var(--accent);transition:.3s}.page-bottom-action a:hover span{transform:rotate(45deg)}.copyright{padding:.42rem 0 .65rem;border-top:1px solid var(--line);color:#777;font-size:.15rem}.float-contact{--size:clamp(44px,2.35vw,51px);--panel:calc(var(--size)*5.6);position:fixed;right:0;top:50%;width:var(--size);margin-top:calc(var(--size)*-1.6);z-index:40;border:1px solid #e0e0e0;border-bottom:0;background:#fff}.float-contact>div{position:relative;width:var(--size);height:var(--size);margin-bottom:2px;background:#000;display:flex;align-items:center;justify-content:center;transition:.25s}.float-contact>div:hover{background:var(--accent)}.float-contact>div>a{display:grid;width:100%;height:100%;place-items:center}.contact-icon{display:block;width:62%;height:62%;background:#fff;mask-repeat:no-repeat;mask-position:center;mask-size:70%;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:70%}.phone-icon{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='M5 4l3 4-2 2c2 4 4 6 8 8l2-2 4 3c-1 3-3 4-6 3C7 20 2 14 2 7c0-2 1-3 3-3z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='M5 4l3 4-2 2c2 4 4 6 8 8l2-2 4 3c-1 3-3 4-6 3C7 20 2 14 2 7c0-2 1-3 3-3z'/%3E%3C/svg%3E")}.chat-icon{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='M3 4h18v13H8l-5 4z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='M3 4h18v13H8l-5 4z'/%3E%3C/svg%3E")}.wechat-icon{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Ccircle cx='9' cy='10' r='7'/%3E%3Ccircle cx='16' cy='15' r='6'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='black'%3E%3Ccircle cx='9' cy='10' r='7'/%3E%3Ccircle cx='16' cy='15' r='6'/%3E%3C/svg%3E")}.float-contact>div:hover .contact-icon{background:#000}.float-contact p{display:none;position:absolute;right:calc(var(--size) + 2px);top:0;width:var(--panel);height:var(--size);padding:0 .18rem;border:1px solid #e0e0e0;background:#fff;align-items:center;justify-content:center;font-size:.17rem;white-space:nowrap}.float-contact>div:hover p{display:flex}.float-contact p.qr{width:var(--panel);height:var(--panel);padding:.45rem}.float-contact p.qr img{max-width:100%}.mobile-menu{display:none}.reveal{opacity:0;transform:translateY(0);transition:opacity .7s,transform .7s}.reveal.is-visible{opacity:1;transform:none}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}*{animation-duration:.01ms!important;transition-duration:.01ms!important}}@media(min-width:2560px){html{font-size:clamp(100px,4.1666666667vw,112px)}}@media(max-width:900px){html{min-width:0;font-size:100px}.leftnav,.float-contact{display:none}.mobile-menu{position:fixed;display:grid;right:.18rem;top:.18rem;z-index:60;width:.46rem;height:.46rem;border:0;background:#000;place-content:center;gap:.08rem}.mobile-menu i{display:block;width:.22rem;height:1px;background:#fff;transition:.3s}.mobile-menu.open i:first-child{transform:translateY(.045rem) rotate(45deg)}.mobile-menu.open i:last-child{transform:translateY(-.045rem) rotate(-45deg)}.leftnav-main.mobile-open{display:block;top:0;width:100%;padding:.35rem;background:#fff;z-index:55}.leftnav-main.mobile-open .nav-spacer{height:.55rem}.leftnav-main.mobile-open .search input{width:100%}.rightbox{width:auto;max-width:none;margin:0;padding:0 .2rem}.studio-hero{grid-template-columns:1fr;gap:.38rem;min-height:0;margin-top:.85rem;padding-bottom:.56rem}.studio-hero-copy{min-height:5.2rem}.studio-hero h1 strong{font-size:.42rem}.hero-slider{height:auto;aspect-ratio:1/1}.studio-service-band{grid-template-columns:1fr;gap:.42rem}.work-grid{gap:.42rem .18rem}.work-grid li,.work-grid li:first-child{width:calc(50% - .09rem)}.work-grid li:first-child>a{display:block;padding-bottom:0}.work-grid li:first-child .work-image{aspect-ratio:1/1}.work-grid li:first-child .case-copy h2{font-size:.24rem;line-height:.34rem}.work-grid li:first-child .case-date{display:block}.studio-method{grid-template-columns:1fr;gap:.2rem}.studio-news{flex-wrap:wrap;gap:.5rem}.studio-news ul{width:46%}}@media(max-width:560px){html{font-size:100px}.studio-hero-copy{min-height:4.9rem}.studio-hero h1 strong{font-size:.38rem}.studio-service-band ul{grid-template-columns:1fr}.studio-service-band li:nth-child(2){border-top:1px solid var(--line)}.work-grid{display:block}.work-grid li,.work-grid li:first-child{width:100%;margin-bottom:.6rem}.work-grid li:first-child .work-image{aspect-ratio:16/10}.studio-news{display:block}.studio-news ul{width:100%;margin-bottom:.48rem}.home-case-head{gap:.2rem}.home-case-head h2{font-size:.34rem}.page-bottom-action{margin-top:.6rem}}
/* Office information in the lower navigation follows the reference site's compact vertical rhythm. */
.office-nav{max-width:2.18rem}
.leftnav-bottom{height:100vh;overflow-y:auto}
.office-nav .office-item+.office-item{margin-top:.42rem}
.office-nav .office-name,.office-nav .office-line{display:block;color:#000;font-size:.17rem;line-height:.34rem;font-weight:400;overflow-wrap:anywhere}
.copyright{display:flex;align-items:center;flex-wrap:wrap;gap:.16rem .55rem;line-height:.28rem}.copyright .icp-link{color:inherit;transition:color .2s}.copyright .icp-link:hover{color:#000}
.mark:before{background:#e71619}
:root{--accent:#e71619}
.float-contact{margin-top:calc(var(--size)*-2.1)}
.top-icon{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20V5M6 11l6-6 6 6'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20V5M6 11l6-6 6 6'/%3E%3C/svg%3E")}
/* Keep every floating contact popup close to its actual content. */
.float-contact p{box-sizing:border-box;width:max-content;min-width:0;padding-right:.12rem;padding-left:.12rem}
.float-contact p.qr{box-sizing:border-box;width:1.72rem;height:1.72rem;padding:.12rem}

/* Floating actions use the logo red rather than a heavy black block. */
.float-contact>div{background:#e71619}
.float-contact>div:hover{background:#f7d3d5}
.float-contact>div:hover .contact-icon{background:#e71619}

/* Mobile header and full-screen navigation follow the compact reference rhythm. */
@media (max-width:900px){
  body{padding-top:.54rem}
  body.mobile-nav-open{overflow:hidden}
  .leftnav-logo{position:fixed;top:0;right:0;left:0;display:block;box-sizing:border-box;width:100%;height:.54rem;padding:0 .2rem;background:rgba(255,255,255,.97);box-shadow:0 1px 0 rgba(0,0,0,.06);z-index:54}
  .leftnav-logo .logo{display:flex;height:100%;align-items:center;background:transparent}
  .leftnav-logo .logo img{width:1.08rem;padding:0}
  .mobile-menu{top:.06rem;right:.12rem;width:.42rem;height:.42rem;gap:.065rem;background:transparent;z-index:61}
  .mobile-menu i{width:.22rem;background:#111}
  .mobile-menu.open{background:transparent}
  .mobile-menu.open i{background:#fff}
  .mobile-menu.open i:first-child{transform:translateY(.04rem) rotate(45deg)}
  .mobile-menu.open i:last-child{transform:translateY(-.04rem) rotate(-45deg)}
  .leftnav-main.mobile-open{position:fixed;inset:0;display:flex;box-sizing:border-box;width:100%;height:100dvh;padding:.9rem .45rem .4rem;flex-direction:column;justify-content:center;overflow-y:auto;background:#111;z-index:55}
  .leftnav-main.mobile-open .nav-spacer{display:none}
  .leftnav-main.mobile-open .nav{width:100%}
  .leftnav-main.mobile-open .nav li a,.leftnav-main.mobile-open .nav li span{color:#fff;font-size:.27rem;line-height:.54rem;font-weight:500}
  .leftnav-main.mobile-open .nav:first-of-type li a{position:relative;display:inline-block}
  .leftnav-main.mobile-open .nav:first-of-type li a:before{bottom:.06rem;height:2px;background:var(--accent);opacity:.9}
  .leftnav-main.mobile-open .search{margin:.14rem 0}
  .leftnav-main.mobile-open .search input{width:100%;height:.42rem;margin:0;border-bottom:1px solid rgba(255,255,255,.25);color:#fff;font-size:.16rem}
  .leftnav-main.mobile-open .search input::placeholder{color:rgba(255,255,255,.48)}
  .leftnav-main.mobile-open .nav.subnav{margin-top:.08rem}
  .leftnav-main.mobile-open .nav.subnav li a{color:rgba(255,255,255,.58);font-size:.17rem;line-height:.34rem;font-weight:400}
}

/* A soft brand-tint marker keeps navigation labels readable. */
.mark:before{bottom:.035rem;height:.095rem;background:#f7d3d5;opacity:1;transition:width .32s cubic-bezier(.22,1,.36,1)}

/* A small Chinese label makes the mobile navigation affordance explicit. */
@media (max-width:900px){
  .mobile-menu{display:block;right:.1rem;width:.78rem}
  .mobile-menu-label{position:absolute;top:.15rem;left:0;color:#111;font-size:.12rem;line-height:1;letter-spacing:.02rem;white-space:nowrap;font-style:normal;font-weight:400;transition:color .2s}
  .mobile-menu i{position:absolute;right:0;width:.22rem}
  .mobile-menu i:first-of-type{top:.145rem}
  .mobile-menu i:last-of-type{top:.255rem}
  .mobile-menu.open .mobile-menu-label{color:#fff}
}