/* One type scale for all published pages. Content, colours and image layouts stay intact. */
:root{--type-body:19px;--type-small:16px;--type-h1:clamp(34px,3.3vw,48px);--type-h2:clamp(28px,2.7vw,38px);--type-h3:clamp(22px,2vw,27px);--body-leading:1.8}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-size:var(--type-body);line-height:var(--body-leading)}
main{min-width:0}
:is(h1,h2,h3){word-break:normal;overflow-wrap:break-word;line-break:strict;white-space:normal;letter-spacing:0;text-wrap:pretty}
.hero .intro h1,.page-hero h1{font-size:var(--type-h1);line-height:1.38;letter-spacing:-.015em;white-space:normal;margin:0 0 22px;font-weight:400;max-width:24em}
.hero .intro h1 :is(span,font,p,div),.page-hero h1 :is(span,font,p,div){font-size:inherit!important;line-height:inherit!important}
.offer h2,#approach h2,.about h2,.reading h2,.situation h2,.service-projects>h2,.feedback-contact h2,.end h2{font-size:var(--type-h2);line-height:1.42;letter-spacing:0;margin-bottom:24px;white-space:normal}
.split h2,.guide h2{font-size:clamp(26px,2.35vw,34px)!important;line-height:1.45;letter-spacing:0;white-space:normal}
.page-section h2{font-size:clamp(26px,2.3vw,32px);line-height:1.5;margin:0 0 22px}
.work-item h3,.project-card h3,#reading .article h3,.article h3{font-size:var(--type-h3);line-height:1.5;white-space:normal;margin:18px 0}
:is(h2,h3) :is(span,font,p,div){font-size:inherit!important;line-height:inherit!important}
.hero .intro p,.page-hero p,.offer p,#approach [data-content-key="index.p.5"],#approach .offer-layout>div>p,.about-head p,.about-head .rich-published,.split p,.page-section p,.page-section .rich-published,.service-projects>p,.end p{font-size:var(--type-body);line-height:var(--body-leading);margin-top:0;margin-bottom:1.1em}
.guide-intro{font-size:var(--type-body)!important}
.work-item p,.project-card>p,#reading .article p,.article p,.feedback-area>p,.contact-area>p,.aside .note{font-size:var(--type-small);line-height:1.75}
.value-card h3{font-size:21px;line-height:1.45}.value-card p{font-size:var(--type-small);line-height:1.75}
.aside blockquote,#approach .aside blockquote,.feedback-entry blockquote{font-size:20px;line-height:1.8}
.article-body,.article-page .article-body{font-size:var(--type-body);line-height:var(--body-leading);max-width:960px}
.article-body :is(p,div,li,blockquote){font-size:inherit;line-height:inherit}
.article-body :is(p,div):has(>br:only-child){line-height:.7;height:.7em;min-height:0}
.article-body [style*="font-size: 22px"],.article-body [style*="font-size:22px"]{font-size:calc(var(--type-body)*1.12)!important;line-height:1.65!important}
.page-section ul,.page-section ol,.article-body ul,.article-body ol{font-size:inherit;line-height:var(--body-leading);padding-inline-start:1.5em}
.article-body li+li{margin-top:.35em}
.article-page .page-hero,.article-page .page-section:has(.article-body){padding-left:max(5%,calc((100% - 960px)/2));padding-right:max(5%,calc((100% - 960px)/2))}
.page-hero{padding-top:48px;padding-bottom:42px}.page-hero:has(h1+ .section-link) h1{margin-bottom:16px}
.section-label{font-size:12px;line-height:1.6;margin-bottom:18px}
.eyebrow{line-height:1.6}.hero .intro{padding-top:26px;padding-bottom:30px}
.section-link,.outline,.pill,.links button{line-height:1.5}
.page-section{padding-top:48px;padding-bottom:48px}
@media(max-width:1000px) and (min-width:761px){nav{gap:18px;font-size:16px}.wordmark{gap:9px}}
@media(max-width:760px){
 :root{--type-body:17px;--type-small:16px;--type-h1:clamp(27px,6.8vw,32px);--type-h2:clamp(25px,6.2vw,29px);--type-h3:22px;--body-leading:1.78}
 header{min-height:0;padding:19px 20px 17px;gap:15px}
 nav{gap:11px 16px;font-size:14px;line-height:1.5}
 .wordmark strong{font-size:27px}.wordmark span{font-size:10px}
 .hero .intro{padding:22px 0 25px}
 .hero .intro h1{font-size:clamp(27px,6.8vw,30px);line-height:1.42;margin-bottom:18px;max-width:none}
 .hero .intro h1 .title-phrase{display:inline-block;white-space:nowrap}
 .page-hero h1{font-size:var(--type-h1);line-height:1.42;max-width:none;margin-bottom:18px}
 .page-hero h1 .title-phrase{display:inline-block;max-width:100%;vertical-align:top}
 .hero .eyebrow{margin-bottom:12px}
 .page-hero{padding:30px 22px 32px}
 .page-section,.article-page .page-hero,.article-page .page-section:has(.article-body){padding-left:22px;padding-right:22px}
 .page-section{padding-top:36px;padding-bottom:36px}
 .page-section h2{font-size:24px;line-height:1.5;margin-bottom:18px}
 .split h2,.guide h2{font-size:25px!important;line-height:1.45;margin-bottom:18px}
 .offer h2,#approach h2,.about h2,.reading h2,.situation h2,.service-projects>h2,.feedback-contact h2,.end h2{margin-bottom:20px}
 #reading .article h3,.work-item h3,.project-card h3{font-size:22px;line-height:1.5;margin:16px 0}
 #approach [data-content-key="index.p.5"]{margin-bottom:26px}
 .value-card h3{font-size:20px}.aside blockquote,#approach .aside blockquote,.feedback-entry blockquote{font-size:18px;line-height:1.78}
 .article-body,.article-page .article-body{font-size:17px;line-height:1.8}
 .split-copy,.guide .split-copy{padding:28px 24px 34px}
 .hero .intro .pill,.section-link,.outline,.project-card .section-link{font-size:16px}
 .identity{font-size:24px;line-height:1.5}.identity small{font-size:13px;line-height:1.7}
 .end-bottom,footer{font-size:12px;line-height:1.65}
}

/* Refinement: a bundled variable Chinese sans, compact principles and reading rhythm. */
@font-face{font-family:WILL Sans;src:url('noto-sans-sc.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap}
body,button,input,textarea,select{font-family:WILL Sans,"PingFang SC","Microsoft YaHei",sans-serif}
h1,h2,h3{font-weight:500}
.hero .intro h1,.page-hero h1{font-weight:450}
.hero [data-content-key="index.p.1"],.hero [data-content-key="index.p.1"] *{font-weight:400!important}
.values-grid{grid-auto-rows:auto;margin-top:30px}
.value-card{padding:17px 18px 19px}
.value-number{padding-bottom:9px;margin-bottom:12px}
.value-card h3{font-size:20px;margin:0 0 8px}
.value-card p{line-height:1.65}
.about{padding-bottom:38px}
.about-head{margin-bottom:0}
#reading{padding-top:44px;padding-bottom:64px}
#reading .reading-top{margin-bottom:27px}
#reading .article-track{gap:24px 36px;align-items:start}
#reading .article{min-height:0;padding-top:17px}
#reading .article h3{margin:12px 0 16px}
#reading .article p{margin-bottom:14px}
#reading .article .section-link{margin-top:0}
@media(max-width:1000px){.value-card{padding:16px 22px;gap:8px 14px}.value-number{padding:4px 0 0;margin:0}.value-card h3{margin:0}}
@media(max-width:760px){
 .value-card{padding:15px 18px;gap:4px 10px}.values-grid{margin-top:24px}.value-card h3{font-size:19px}
 .about{padding-bottom:30px}.about-head{margin-bottom:0}
 #reading{padding-top:32px;padding-bottom:44px}
 #reading .reading-top{margin-bottom:24px;gap:12px}
 #reading .reading-top h2{margin-bottom:0}
 #reading .article-track{gap:22px}
 #reading .article{min-height:0;padding-top:15px}
 #reading .article h3{margin:10px 0 14px}
}
