:root{
  --bg:#12141A; --bg-2:#181B21; --bg-3:#1F2329; --warm:#1B1916;
  --ink:#ECE6DA; --ink-2:#B7B0A4; --ink-3:#7E786F; --line:#2B2F36; --line-2:#3A3F47;
  --amber:#F2B237; --amber-2:#D99A2B; --amber-soft:rgba(242,178,55,.10);
  --cn:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --en:"Jost","Noto Sans SC","Helvetica Neue",Arial,sans-serif;
  --max:1280px; --gut:clamp(18px,5vw,64px);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--cn);font-weight:300;font-size:16px;line-height:1.85;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px}
p{margin:0}
h1,h2,h3{margin:0;font-weight:300;line-height:1.25;letter-spacing:.02em;text-wrap:balance}
h1{font-size:clamp(40px,5.6vw,80px);line-height:1.1}
h1 .l1,h1 .l2{display:block}
h1 .l2{font-size:clamp(18px,1.9vw,27px);line-height:1.5;font-weight:300;color:var(--ink);letter-spacing:.04em}
h1 .l1+.l2{margin-top:22px}
body.en h1 .l2{font-size:clamp(17px,1.7vw,24px);letter-spacing:.01em}
h2{font-size:clamp(28px,3.4vw,46px)}
.split h2{font-size:clamp(24px,2.6vw,38px)}
h2 .ln{display:block;white-space:nowrap}
@media (max-width:420px){h2 .ln{white-space:normal}}
h3{font-size:20px;font-weight:400}
.en{font-family:var(--en)}
body.en h1,body.en h2,body.en h3{font-family:var(--en);font-weight:300;letter-spacing:.005em}
body.en h1{font-size:clamp(40px,5.2vw,72px);line-height:1.1}
body.en p,body.en .lede{font-family:var(--en);font-weight:300}
body.en .zh{display:none!important}
body:not(.en) .en{display:none!important}
.wrap{max-width:var(--max);margin:0 auto;padding-inline:var(--gut)}
.cap{font-family:var(--en);font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3);font-weight:400}
.cap b{color:var(--amber);font-weight:400}
.rule{display:flex;align-items:center;gap:14px;font-size:14px;color:var(--ink-2);font-weight:300}
.rule::before{content:"";width:34px;height:1px;background:var(--amber);flex:none}
.lede{font-size:clamp(15px,1.15vw,17px);color:var(--ink-2);max-width:34em;font-weight:300}
.num{font-family:var(--en);font-variant-numeric:tabular-nums}
section{padding-block:clamp(72px,9vw,136px)}
.hair{border-top:1px solid var(--line)}

/* nav */
nav.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:linear-gradient(180deg,rgba(18,20,26,.92),rgba(18,20,26,.72));backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
nav.site .wrap{display:flex;align-items:center;justify-content:space-between;min-height:76px;gap:20px}
.logo img{display:block;height:30px;width:auto;max-width:100%}
.links{display:flex;gap:32px;font-size:14px;color:var(--ink-2);font-weight:300}
.links a{position:relative;padding-block:6px}
.links a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:1px;background:var(--amber);transition:width .25s}
.links a:hover{color:var(--ink)}.links a:hover::after{width:100%}
.links .has-drop{position:relative;padding-block:6px}
.links .has-drop>a{padding-block:0}
.links .drop{position:absolute;top:100%;left:0;padding-top:14px;display:none;min-width:240px}
.links .has-drop:hover .drop,.links .has-drop:focus-within .drop{display:block}
.links .drop ul{list-style:none;margin:0;padding:10px 0;background:var(--bg-2);border:1px solid var(--line);display:grid}
.links .drop a{display:block;padding:11px 18px;font-size:13.5px;white-space:nowrap}
.links .drop a::after{display:none}
.links .drop a:hover{background:var(--bg-3);color:var(--amber)}
.right{display:flex;align-items:center;gap:16px}
.lang{display:flex;gap:2px;font-family:var(--en);font-size:12px;letter-spacing:.14em}
.lang button{all:unset;cursor:pointer;padding:6px 9px;color:var(--ink-3);border-bottom:1px solid transparent}
.lang button[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--amber)}
.btn{display:inline-flex;align-items:center;gap:12px;padding:13px 22px;font-size:14px;letter-spacing:.08em;border:1px solid var(--ink-2);color:var(--ink);background:transparent;cursor:pointer;font-family:var(--cn);font-weight:400;transition:all .2s}
body.en .btn{font-family:var(--en);letter-spacing:.12em;text-transform:uppercase;font-size:12.5px}
.btn:hover{border-color:var(--ink);background:var(--ink);color:var(--bg)}
.btn.amber{border-color:var(--amber);color:var(--amber)}
.btn.amber:hover{background:var(--amber);color:#16130C;border-color:var(--amber)}
.btn.solid{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.btn.solid:hover{background:var(--amber);border-color:var(--amber);color:#16130C}
.btn .ar{font-family:var(--en);font-size:17px;line-height:1}
@media (max-width:920px){.links{display:none}}

/* hero */
.hero{position:relative;min-height:min(88vh,860px);display:flex;align-items:flex-end;padding-block:clamp(96px,14vw,180px) clamp(48px,6vw,80px);overflow:hidden;background:var(--bg)}
.hero.sub{min-height:min(56vh,520px)}
.hero .bg{position:absolute;inset:0;background-size:cover;background-position:center right;background-repeat:no-repeat;opacity:.92}
.hero .veil{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(18,20,26,.94) 0%,rgba(18,20,26,.80) 38%,rgba(18,20,26,.28) 70%,rgba(18,20,26,.15) 100%),
  linear-gradient(0deg,rgba(18,20,26,1) 0%,rgba(18,20,26,.35) 30%,rgba(18,20,26,0) 60%)}
.hero .wrap{position:relative;width:100%}
.hero-grid{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:clamp(28px,5vw,80px);align-items:end}
.hero .cap{margin-bottom:28px;display:flex;gap:18px;flex-wrap:wrap}
.hero .rule{margin-top:26px;color:var(--ink-2)}
.hero .lede{margin-top:20px;color:var(--ink-2)}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:40px}
.facts{display:grid;gap:0;border-top:1px solid var(--line-2)}
.facts .r{display:grid;grid-template-columns:1fr auto;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--ink-2);align-items:baseline}
.facts .r strong{font-family:var(--en);font-weight:400;color:var(--ink);letter-spacing:.06em;font-size:14px}
.facts .r strong.big{font-size:22px;color:var(--amber);letter-spacing:.04em}
@media (max-width:900px){.hero-grid{grid-template-columns:1fr}.hero .bg{background-position:70% center}.hero .veil{background:linear-gradient(0deg,rgba(18,20,26,1) 0%,rgba(18,20,26,.85) 45%,rgba(18,20,26,.35) 100%)}}

/* breadcrumb */
.crumb{font-family:var(--en);font-size:12px;letter-spacing:.1em;color:var(--ink-3);display:flex;gap:8px;align-items:center;margin-bottom:18px}
.crumb a:hover{color:var(--amber)}
.crumb span{color:var(--line-2)}

/* hooks */
.hooks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0}
.hooks.n4{grid-template-columns:repeat(4,minmax(0,1fr))}
.hooks.n3{grid-template-columns:repeat(3,minmax(0,1fr))}
.hook{padding:26px 24px 30px 0;margin-right:24px;border-top:1px solid var(--line-2);display:flex;flex-direction:column;gap:14px;position:relative}
.hook::before{content:"";position:absolute;top:-1px;left:0;width:34px;height:1px;background:var(--amber)}
.hook .k{font-family:var(--en);font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3)}
.hook h3{font-size:21px;font-weight:300;letter-spacing:.03em}
.hook p{font-size:13.5px;color:var(--ink-2);font-weight:300;line-height:1.8}
@media (max-width:1000px){.hooks{grid-template-columns:repeat(2,minmax(0,1fr))}.hook:last-child{grid-column:1/-1}}
@media (max-width:520px){.hooks{grid-template-columns:1fr}.hook{margin-right:0}}

/* typologies */
.split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,6vw,96px);align-items:start}
@media (max-width:900px){.split{grid-template-columns:1fr}}
.types{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.type{position:relative;aspect-ratio:3/4;max-width:100%;overflow:hidden;background:var(--bg-3);display:flex;align-items:flex-end;padding:18px}
.type img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.85;transition:transform .6s,opacity .3s}
.type:hover img{transform:scale(1.03);opacity:1}
.type::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(18,20,26,.92) 0%,rgba(18,20,26,.25) 45%,rgba(18,20,26,0) 70%)}
.type .tx{position:relative;z-index:1;display:grid;gap:2px}
.type .tx strong{font-weight:400;font-size:16px;letter-spacing:.04em}
.type .tx span{font-family:var(--en);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.type.ph{background:linear-gradient(160deg,#20242B,#171A20 60%,#1C1F25)}
.type.ph::before{content:"";position:absolute;inset:18% 16% auto auto;width:40%;height:52%;border:1px solid var(--line-2)}
.type.ph .pc{position:absolute;top:16px;left:18px;font-family:var(--en);font-size:10.5px;letter-spacing:.16em;color:var(--ink-3);text-transform:uppercase}
@media (max-width:900px){.types{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* qualifications */
.qual{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,6vw,96px);align-items:start}
.grade{font-family:var(--en);font-weight:300;font-size:clamp(72px,9vw,128px);line-height:1;letter-spacing:-.01em;color:var(--ink);display:flex;align-items:baseline;gap:18px}
.grade small{font-size:.22em;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);font-weight:400}
body:not(.en) .grade .zh{font-family:var(--cn);font-weight:300}
.qlist{border-top:1px solid var(--line-2)}
.qrow{display:grid;grid-template-columns:1fr auto;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14.5px;align-items:baseline;color:var(--ink-2)}
.qrow .g{font-family:var(--en);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);white-space:nowrap}
.qrow.hi{color:var(--ink);font-weight:400}.qrow.hi .g{color:var(--amber)}
.certs{margin-top:26px;display:flex;flex-wrap:wrap;gap:10px 22px;font-family:var(--en);font-size:12px;letter-spacing:.14em;color:var(--ink-3)}
.certs span::before{content:"";display:inline-block;width:8px;height:1px;background:var(--amber);margin-right:10px;vertical-align:middle}
@media (max-width:900px){.qual{grid-template-columns:1fr}}

/* clients */
.clients{columns:4;column-gap:36px;font-size:15px;line-height:2.2;font-weight:300;color:var(--ink-2)}
.clients div{break-inside:avoid;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:10px}
.clients div em{font-family:var(--en);font-style:normal;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
body.en .clients{font-family:var(--en)}
body.en .clients div em{font-family:var(--cn);text-transform:none;letter-spacing:.04em;font-size:12px}
@media (max-width:1000px){.clients{columns:3}}@media (max-width:700px){.clients{columns:2}}@media (max-width:440px){.clients{columns:1}}

/* logo wall */
.logowall{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:44px}
.logowall .lg{background:var(--bg-2);aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;padding:18px}
.logowall .lg img{max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(1) brightness(1.6) contrast(.9);opacity:.72;transition:opacity .2s,filter .2s}
.logowall .lg:hover img{opacity:1;filter:grayscale(0) brightness(1) contrast(1)}
@media (max-width:900px){.logowall{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:560px){.logowall{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* method */
.method{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin-top:48px}
.method.n7{grid-template-columns:repeat(7,minmax(0,1fr))}
.method::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,var(--amber) 0,var(--amber) 55%,var(--line-2) 100%)}
.m{padding:26px 24px 0 0;display:grid;gap:10px;position:relative}
.m::before{content:"";position:absolute;top:-3px;left:0;width:7px;height:7px;border-radius:50%;background:var(--amber)}
.m .i{font-family:var(--en);font-size:11.5px;letter-spacing:.2em;color:var(--ink-3)}
.m h3{font-size:18px;font-weight:400}
.m p{font-size:13.5px;color:var(--ink-2)}
@media (max-width:1000px){.method{grid-template-columns:1fr!important;margin-top:32px}.method::before{width:1px;height:100%;right:auto;background:linear-gradient(180deg,var(--amber),var(--line-2))}.m{padding:0 0 26px 26px}.m::before{top:10px;left:-3px}}

/* case cards */
.cases{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:48px}
.case{background:var(--bg-2);padding:30px 26px;display:grid;gap:16px}
.case .tag{font-family:var(--en);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--amber)}
.case h3{font-size:19px;font-weight:400}
.case dl{margin:0;display:grid;gap:8px;font-size:13.5px;color:var(--ink-2)}
.case dl div{display:grid;grid-template-columns:5.5em 1fr;gap:10px}
.case dl dt{color:var(--ink-3);font-size:12px;letter-spacing:.04em}
.case dl dd{margin:0}
@media (max-width:1000px){.cases{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.cases{grid-template-columns:1fr}}
.case.ph{background:repeating-linear-gradient(135deg,var(--bg-2) 0 14px,var(--bg-3) 14px 28px)}
.case.ph h3{color:var(--ink-2)}
.case.ph dd{color:var(--ink-3)}

/* placeholder banner */
.ph-note{display:flex;gap:12px;align-items:baseline;border:1px dashed var(--line-2);background:var(--bg-2);padding:14px 18px;font-size:12.5px;color:var(--ink-3);margin-bottom:28px}
.ph-note b{color:var(--amber);font-weight:400;font-family:var(--en);letter-spacing:.06em;text-transform:uppercase;font-size:11px}

/* CTA band */
.cta{position:relative;overflow:hidden;background:var(--bg)}
.cta .bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.55}
.cta .veil{position:absolute;inset:0;background:linear-gradient(180deg,var(--bg) 0%,rgba(18,20,26,.55) 30%,rgba(18,20,26,.75) 100%)}
.cta .wrap{position:relative}
.exits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:48px}
.exit{background:rgba(24,27,33,.82);backdrop-filter:blur(8px);border:1px solid var(--line);padding:30px 28px 28px;display:flex;flex-direction:column;gap:14px;min-height:300px}
.exit .d{font-family:var(--en);font-size:11.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--amber)}
.exit h3{font-size:24px;font-weight:300}
.exit p{font-size:14px;color:var(--ink-2);flex:1}
.qr{width:100px;height:100px;border:1px solid var(--line-2);position:relative;opacity:.6;background:repeating-linear-gradient(90deg,var(--ink-2) 0 6px,transparent 6px 12px),repeating-linear-gradient(0deg,var(--ink-2) 0 6px,transparent 6px 12px);background-blend-mode:multiply}
.qr::after{content:"QR";position:absolute;inset:auto 0 -20px 0;font-family:var(--en);font-size:10px;letter-spacing:.2em;text-align:center;color:var(--ink-3)}
.qr img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#fff}
@media (max-width:900px){.exits{grid-template-columns:1fr}.exit{min-height:0}}

/* form */
form{display:grid;grid-template-columns:1fr 1fr;gap:18px 26px;margin-top:64px;padding-top:40px;border-top:1px solid var(--line-2)}
.f{display:flex;flex-direction:column;gap:6px}.f.full{grid-column:1/-1}
label.l{font-size:13px;color:var(--ink-2)}
input[type=text],input[type=email],select,textarea{font:inherit;font-size:15px;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--line-2);padding:10px 0;width:100%;border-radius:0}
input:focus,select:focus,textarea:focus{outline:none;border-bottom-color:var(--amber)}
textarea{min-height:80px;resize:vertical}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 50%);background-position:calc(100% - 10px) 55%,calc(100% - 5px) 55%;background-size:5px 5px;background-repeat:no-repeat}
select option{background:var(--bg-2);color:var(--ink)}
.f-foot{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:8px}
.f-foot small{font-size:12.5px;color:var(--ink-3);max-width:40em}
.done{grid-column:1/-1;border:1px solid var(--amber);padding:18px 20px;display:flex;gap:12px;align-items:baseline;font-size:14px;background:var(--amber-soft)}
.done[hidden]{display:none}
.done strong{color:var(--amber);font-weight:400}
@media (max-width:640px){form{grid-template-columns:1fr}}

/* footer */
footer{border-top:1px solid var(--line);padding-block:44px 64px;background:var(--bg)}
footer .top{display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap;align-items:flex-start}
footer .top img{height:26px;width:auto;opacity:.9}
footer .cols{display:flex;gap:26px;flex-wrap:wrap;font-size:13.5px;color:var(--ink-2)}
footer .cols a:hover{color:var(--ink)}
footer .addr{margin-top:22px;font-size:13px;color:var(--ink-3);display:grid;gap:4px}
footer .legal{margin-top:28px;padding-top:18px;border-top:1px solid var(--line);font-family:var(--en);font-size:11.5px;letter-spacing:.06em;color:var(--ink-3);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* contact */
.people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:44px}
.person{border:1px solid var(--line);background:var(--bg-2);padding:30px 28px;display:grid;gap:10px;position:relative}
.person::before{content:"";position:absolute;top:-1px;left:28px;width:34px;height:1px;background:var(--amber)}
.person .nm{font-family:var(--en);font-size:24px;font-weight:300;letter-spacing:.04em;color:var(--ink)}
.person .role{font-size:14px;color:var(--ink-2);max-width:30em}
.person .yrs{font-family:var(--en);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3)}
.person a{font-family:var(--en);font-size:13.5px;letter-spacing:.04em;color:var(--amber);border-bottom:1px solid transparent}
.person a:hover{border-bottom-color:var(--amber)}
.offices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;margin-top:48px;border-top:1px solid var(--line-2)}
.office{padding:22px 24px 0 0;margin-right:24px;display:grid;gap:8px;align-content:start;font-size:13.5px;color:var(--ink-2)}
.office .city{font-size:17px;font-weight:400;color:var(--ink);letter-spacing:.03em}
.office .city small{display:block;font-family:var(--en);font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);font-weight:400;margin-top:2px}
.office .adr{line-height:1.7}
.office .who{font-family:var(--en);font-size:12.5px;letter-spacing:.04em;color:var(--ink-3)}
.office .who a{color:var(--amber)}
.office.hq .city{color:var(--amber)}
@media (max-width:1000px){.offices{grid-template-columns:repeat(2,minmax(0,1fr))}.office{padding-bottom:22px;border-bottom:1px solid var(--line)}.office:last-child{grid-column:1/-1}}
@media (max-width:700px){.people{grid-template-columns:1fr}}
@media (max-width:520px){.offices{grid-template-columns:1fr}.office{margin-right:0}}

.float{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:70}
.float .btn{background:rgba(18,20,26,.85);backdrop-filter:blur(8px);box-shadow:0 12px 36px rgba(0,0,0,.45)}