:root{--ink:#111;--muted:#797979;--hair:#dedede;--paper:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:Arial,"Helvetica Neue","Noto Sans CJK SC","PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit}body:not(.ready) main{opacity:0}main{transition:opacity .25s}::selection{background:#111;color:white}.header{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:1rem;padding:27px 2.5vw 10px;align-items:start;z-index:3}.logo{font-size:19px;line-height:.96;letter-spacing:-.06em;font-weight:500;display:inline-block;max-width:245px}.header-right{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.nav{display:flex;gap:24px;flex-wrap:wrap;font-size:13px;line-height:1.1}.nav a{position:relative}.nav a.active:after,.nav a:hover:after{content:'';height:1px;background:currentColor;position:absolute;left:0;right:0;bottom:-4px}.language{display:flex;gap:7px;align-items:center;font-size:12px}.language button{background:none;border:0;cursor:pointer;color:#999;padding:0}.language button.active,.language button:hover{color:#111}.language button:not(:last-child):after{content:'/';color:#aaa;margin-left:7px}.site-inner{padding:0 2.5vw}.work-intro{display:flex;justify-content:space-between;margin:26px 0 10px;font-size:11px;color:#8a8a8a;letter-spacing:.035em}.works-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:clamp(260px,31vw,465px);column-gap:3.4vw;row-gap:25px}.work-tile{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;cursor:pointer;overflow:visible}.work-media{height:71%;width:78%;display:flex;align-items:center;justify-content:center;transition:transform .45s cubic-bezier(.2,.75,.2,1);position:relative}.work-media img{max-width:100%;max-height:100%;object-fit:contain;display:block;box-shadow:none}.work-tile:nth-child(4n+1) .work-media{height:80%;width:80%}.work-tile:nth-child(4n+2) .work-media{height:61%;width:76%}.work-tile:nth-child(4n+3) .work-media{height:70%;width:66%}.work-tile:nth-child(4n) .work-media{height:74%;width:82%}.work-tile:nth-child(7n) .work-media{height:58%;width:75%}.work-tile:hover .work-media{transform:translateY(-6px) scale(1.035)}.tile-meta{position:absolute;top:calc(50% + 37%);left:5%;right:5%;text-align:center;font-size:11px;line-height:1.45;opacity:0;transform:translateY(5px);transition:all .25s}.work-tile:hover .tile-meta,.work-tile:focus-visible .tile-meta{opacity:1;transform:none}.tile-category{display:block;color:#888;margin-top:3px}.footer{margin:65px 2.5vw 0;padding:19px 0 28px;border-top:1px solid #ddd;display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#444}.eyebrow{font-size:11px;color:var(--muted);letter-spacing:.06em}.about-grid{display:grid;grid-template-columns:23% 1fr;column-gap:12px;row-gap:74px;margin-top:47px;max-width:1600px}.about-key{font-size:15px;line-height:1.3}.about-val{font-size:16px;line-height:1.55;max-width:1100px}.about-val p{margin:0 0 19px}.about-val p:last-child{margin-bottom:0}.about-val .entry{margin-bottom:22px}.about-val strong{font-weight:500}.about-val .subtle{color:#777}.project-top{display:grid;grid-template-columns:23% 1fr;gap:12px;margin-top:45px}.project-data{font-size:12px;line-height:1.8}.project-data p{margin:0 0 14px}.project-title{font-size:clamp(27px,4vw,62px);line-height:1.05;letter-spacing:-.055em;font-weight:400;margin:-7px 0 26px;max-width:1000px}.project-summary{max-width:740px;font-size:15px;line-height:1.65}.project-images{display:flex;align-items:center;flex-direction:column;gap:90px;padding:70px 0 45px}.project-images img{max-width:min(80vw,1100px);max-height:85vh;width:auto;height:auto;object-fit:contain;display:block}.project-images img.wide{max-width:min(89vw,1350px)}.project-bottom{border-top:1px solid #ddd;padding:20px 0;display:flex;justify-content:space-between;font-size:13px}.back-link:hover{text-decoration:underline}.contact-grid{display:grid;grid-template-columns:23% 1fr;gap:12px;margin-top:47px;min-height:55vh}.contact-line{font-size:clamp(26px,4vw,64px);letter-spacing:-.055em;margin:0 0 18px;line-height:1.05;font-weight:400}.contact-small{font-size:15px;line-height:1.6;max-width:580px}.notice{font-size:11px;color:#888;margin-top:24px}.mobile-hint{display:none}@media(max-width:900px){.header{grid-template-columns:1fr;gap:22px;padding:22px 4vw 8px}.header-right{justify-content:space-between}.site-inner{padding:0 4vw}.works-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:clamp(230px,60vw,420px);column-gap:12px;row-gap:9px}.work-media{width:86%!important;height:73%!important}.work-tile:nth-child(4n+2) .work-media{height:64%!important}.tile-meta{opacity:1;top:auto;bottom:7px;font-size:10px;transform:none}.about-grid,.project-top,.contact-grid{grid-template-columns:1fr;row-gap:16px;margin-top:40px}.about-grid{row-gap:18px}.about-key{border-top:1px solid #ddd;padding-top:16px;margin-top:18px;font-size:12px}.about-val{font-size:14px}.project-title{font-size:clamp(32px,9vw,64px)}.project-images{gap:48px;padding-top:50px}.project-images img{max-width:96%;max-height:none}.project-images img.wide{max-width:100%}.footer{margin:65px 4vw 0}.contact-grid{min-height:65vh}.mobile-hint{display:block}}@media(max-width:450px){.nav{gap:15px;font-size:12px}.logo{font-size:18px}.work-intro{margin:25px 0 0}.works-grid{grid-auto-rows:240px}.work-media{height:66%!important}.tile-meta{bottom:10px;font-size:10px}.footer{flex-direction:column;gap:9px}}


/* Studioparty editorial navigation and oversized bilingual logotypes */
.header.header-editorial {
  display: grid;
  grid-template-columns: 21% 12% minmax(0, 1fr) auto;
  column-gap: 2.2vw;
  align-items: start;
  padding: 12px 2.5vw 14px;
  font-size: 14px;
  line-height: 1.18;
}
.header-column { min-width: 0; }
.header-heading { display: block; font-size: 15px; font-weight: 400; line-height: 1.15; letter-spacing: 0; }
.header-small { font-size: 14px; margin: 13px 0 0; max-width: 510px; line-height: 1.3; }
.header-menu .nav { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; font-size: 14px; margin-top: 12px; line-height: 1.16; }
.header-menu .nav a { display: inline-block; }
.header-menu .nav a.active::after, .header-menu .nav a:hover::after { bottom: -1px; }
.header-end { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 15px; }
.header-end .language { gap: 7px; }
.header-end .header-home { white-space: nowrap; }
.about-page .about-lead { display: grid; grid-template-columns: 23% minmax(0, 1fr); column-gap: 12px; margin-top: 30px; }
.about-page .about-lead .about-val { max-width: 1000px; }
.brand-hero { width: 100%; margin: 45px 0 78px; }
.brand-hero img { display: block; width: 100%; max-width: 100%; height: auto; object-fit: contain; }
.brand-hero-zh { margin-top: 20px; }
.about-grid--details { margin-top: 0; padding-bottom: 25px; }

@media (max-width: 900px) {
  .header.header-editorial { grid-template-columns: 1fr 1fr; gap: 18px 20px; padding: 15px 4vw 10px; }
  .header-description { grid-column: 1; }
  .header-end { grid-column: 2; grid-row: 2; }
  .header-small, .header-heading, .header-menu .nav { font-size: 12px; }
  .header-menu .nav { margin-top: 10px; }
  .header-small { margin-top: 10px; }
  .about-page .about-lead { grid-template-columns: 1fr; row-gap: 12px; margin-top: 25px; }
  .about-page .about-lead .about-key { margin: 0; }
  .brand-hero { margin: 30px 0 55px; }
  .brand-hero-zh { margin-top: 15px; }
}
@media (max-width: 450px) {
  .header.header-editorial { gap: 14px 12px; }
  .header-heading, .header-small, .header-menu .nav { font-size: 11px; }
  .header-end { gap: 12px; }
  .brand-hero { margin: 26px 0 42px; }
  .brand-hero-zh { margin-top: 11px; }
}