:root{color-scheme:light;--ink:#242424;--muted:#777;--line:#e5e5e2;--paper:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible{outline:2px solid #333;outline-offset:6px}.wrap{width:min(1320px,calc(100% - 112px));margin-inline:auto}.skip{position:absolute;left:20px;top:-80px;background:white;padding:15px;z-index:9}.skip:focus{top:10px}.header{min-height:116px;display:flex;align-items:center;justify-content:space-between;gap:40px;border-bottom:1px solid var(--line)}.logo{width:130px;flex-shrink:0}.logo img{width:100%;height:70px;object-fit:contain}nav{display:flex;flex-wrap:wrap;align-items:center;gap:28px;font-size:13px}nav a{position:relative;padding:12px 0;color:#666}nav a:hover,nav a[aria-current]{color:#111}nav a[aria-current]:after{content:"";position:absolute;height:2px;bottom:3px;background:#222;left:0;right:0}.language{border-left:1px solid var(--line);padding-left:25px}.intro{padding:80px 0 62px}.eyebrow{font-size:10px;letter-spacing:2.3px;font-weight:600;color:var(--muted)}h1{font-size:clamp(36px,4.8vw,68px);font-weight:500;letter-spacing:-2px;line-height:1.25;margin:25px 0}.count{font-size:13px;letter-spacing:0;color:var(--muted);vertical-align:top;display:inline-block;margin:10px 0 0 20px}.lead{color:var(--muted);font-size:15px;line-height:1.9}.home-intro{display:flex;justify-content:space-between;align-items:flex-end;padding:85px 0 75px}.home-intro h1{margin-bottom:0}.home-intro>.lead{padding-bottom:4px;font-size:13px}.section-heading{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:24px 0 32px;font-size:12px}.section-heading h2{font-size:14px;font-weight:400;margin:0}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:55px 32px}.picture{position:relative;overflow:hidden;background:#f3f3f1;aspect-ratio:16/9}.picture img{width:100%;height:100%;object-fit:cover;transition:transform .65s cubic-bezier(.2,.7,.3,1),filter .65s}.card a:hover img{transform:scale(1.035);filter:brightness(.94)}.play{position:absolute;bottom:18px;right:18px;border-radius:50%;background:white;width:38px;height:38px;display:grid;place-items:center;transition:transform .3s}.card a:hover .play{transform:rotate(45deg)}.card-meta{display:flex;justify-content:space-between;gap:15px;font-size:11px;color:var(--muted);margin:20px 0 10px;line-height:1.5}.card h2{font-size:18px;font-weight:400;line-height:1.65;margin:0;letter-spacing:.1px}.tags{font-size:11px;line-height:1.8;color:#858585;margin:10px 0 0}.project-intro{padding:70px 0 40px;max-width:950px}.project-intro h1{font-size:clamp(27px,3.2vw,46px);line-height:1.5;letter-spacing:-.6px;margin:12px 0}.client-name{font-size:13px;color:var(--muted);margin-top:40px}.video{aspect-ratio:16/9;background:#f5f5f3}.video iframe{width:100%;height:100%;border:0}.video-note{font-size:12px;color:var(--muted);text-align:right;margin-top:18px}.watch{display:inline-block;padding:24px;border:1px solid var(--line)}.notice{padding:60px;background:#f5f5f3}.about{max-width:940px;font-size:16px;line-height:2;color:#555}.about section{margin-bottom:65px}.about p{margin:0 0 24px}.about img{margin-top:35px;max-height:600px;object-fit:contain}.about h2,.about h3{font-size:25px;font-weight:400;color:var(--ink);margin:30px 0 20px}.two-column{display:grid;grid-template-columns:1.2fr 1fr;gap:50px;font-size:14px;line-height:1.8}.two-column .title{font-weight:600;margin-bottom:5px}.two-column p{margin-top:0}.two-column .text>div{margin-bottom:28px}.clients{max-width:1000px;margin:auto}.contact{display:flex;justify-content:space-between;align-items:center;gap:60px;padding:25px 0 60px}.email{font-size:clamp(20px,3.3vw,42px);display:inline-block;border-bottom:1px solid var(--ink);padding-bottom:10px;margin:18px 0 30px;overflow-wrap:anywhere}.contact p:last-child{font-size:12px;color:var(--muted)}.contact figure{margin:0;min-width:140px;text-align:center}.contact figure img{width:160px}.contact figcaption{font-size:12px;color:var(--muted);margin-top:16px}footer{padding:70px 0 28px;margin-top:100px!important;border-top:1px solid var(--line)}.footer-top,.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px}.footer-top>a{font-size:clamp(20px,2.6vw,32px)}.footer-top>span{font-size:10px;letter-spacing:1px;color:var(--muted)}.footer-bottom{font-size:10px;color:var(--muted);margin-top:70px}.footer-bottom a:last-child{margin-left:auto}@media(min-width:1600px){.wrap{max-width:1400px}}@media(max-width:950px){.wrap{width:calc(100% - 56px)}.header{gap:25px}nav{gap:18px;font-size:12px}.logo{width:105px}.language{padding-left:15px}.home-intro{gap:25px}.home-intro>.lead{max-width:180px}.grid{gap:40px 24px}}@media(max-width:650px){.wrap{width:calc(100% - 36px)}.header{display:block;padding-top:20px;min-height:auto}.logo{display:block;width:100px}.logo img{height:42px;object-position:left}nav{gap:5px 20px;padding:12px 0 14px;font-size:11px}.language{padding-left:0;border:0}.intro{padding:45px 0 35px}.home-intro{display:block}.home-intro>.lead{max-width:none;margin-top:25px}h1{letter-spacing:-1px}.grid{grid-template-columns:1fr;gap:35px}.card h2{font-size:17px}.card-meta{margin-top:15px}.play{width:32px;height:32px;bottom:12px;right:12px}.contact{display:block;padding-bottom:0}.contact figure{width:140px;margin-top:30px}.two-column{grid-template-columns:1fr;gap:20px}.about{font-size:15px}.project-intro{padding:40px 0 30px}.footer-top{display:block}.footer-top>span{display:block;margin-top:25px}.footer-bottom{flex-wrap:wrap;margin-top:40px;gap:15px}footer{margin-top:65px!important;padding-top:40px}.video{width:calc(100% + 36px);margin-left:-18px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

.home-heading{border-top:0;padding-top:40px}.home-heading h1{font-size:14px;font-weight:400;letter-spacing:0;margin:0;line-height:1.5}.compact-footer{padding-top:28px}.compact-footer .footer-bottom{margin-top:0}

.portfolio{padding-top:40px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}@media(max-width:650px){.portfolio{padding-top:24px}}

/* Compact five-column portfolio on desktop. */
@media(min-width:651px){
  .grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:36px 20px}
  .card h2{font-size:14px;line-height:1.65}
  .card-meta{font-size:10px;margin:14px 0 8px;gap:8px}
  .tags{font-size:10px}
  .play{width:28px;height:28px;right:10px;bottom:10px}
}

/* Consistent full-width sections for the studio profile. */
.about-page .about{max-width:none;width:100%}
.about-page .about>section{margin:0 0 64px}
.about-page .about>section+section{border-top:1px solid var(--line);padding-top:36px}
.about-page .about h2{margin:0 0 24px;font-size:23px}
.about-page .about>section>img{width:100%;height:auto;max-height:none;margin-top:32px}
.about-page .about .two-column{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:start;gap:48px}
.about-page .two-column .image img{width:100%;height:auto;max-height:none;margin:0}
.about-page .two-column .text>div{margin:0;padding:20px 0;border-bottom:1px solid var(--line)}
.about-page .two-column .text>div:first-child{padding-top:0}
.about-page .two-column p{margin:0 0 8px}
.about-page .about>section:last-child{margin-bottom:0}
@media(max-width:650px){.about-page .about>section{margin-bottom:40px}.about-page .about>section+section{padding-top:28px}.about-page .about .two-column{grid-template-columns:1fr;gap:28px}.about-page .about h2{font-size:21px}}

.about-logo{width:200px;height:auto;margin:0 0 36px}@media(max-width:650px){.about-logo{width:160px;margin-bottom:28px}}

.contact-page{padding-top:40px}@media(max-width:650px){.contact-page{padding-top:24px}}

/* Two balanced contact sections, matching the site's minimal layout. */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;margin-top:48px;padding-bottom:44px}
.contact-panel{min-width:0;padding:0 40px 0 0}
.contact-panel+ .contact-panel{border-left:1px solid var(--line);padding:0 0 0 40px}
.contact-panel h2{font-size:13px;font-weight:400;color:var(--muted);margin:0 0 36px}
.contact-email{font-size:clamp(20px,2.4vw,32px);letter-spacing:-.5px;line-height:1.5;overflow-wrap:anywhere;display:inline-block;border-bottom:1px solid var(--ink);padding-bottom:8px}
.contact-email span{display:inline-block;margin-left:6px;font-size:.75em}
.contact-hint,.contact-wechat figcaption{font-size:12px;line-height:1.8;color:var(--muted);margin:16px 0 0}
.contact-location{margin-top:64px;font-size:13px}
.contact-location span{color:var(--muted);font-size:11px}
.contact-location p{margin:10px 0 0}
.contact-wechat{margin:0;display:flex;align-items:center;gap:26px}
.contact-wechat img{width:160px;height:auto;flex-shrink:0}
.contact-wechat figcaption{margin:0}
@media(max-width:950px){.contact-panel{padding-right:24px}.contact-panel+ .contact-panel{padding-left:24px}.contact-wechat{display:block}.contact-wechat figcaption{margin-top:16px}}
@media(max-width:650px){.contact-grid{grid-template-columns:1fr;margin-top:28px;padding-bottom:28px;gap:32px}.contact-panel{padding:0}.contact-panel+ .contact-panel{border-left:0;border-top:1px solid var(--line);padding:28px 0 0}.contact-panel h2{margin-bottom:24px}.contact-location{margin-top:32px}.contact-wechat{display:flex;flex-wrap:wrap}.contact-wechat figcaption{margin:0}}
