@charset "UTF-8";
/* Reading layer: shared type relationships, project-specific compositions. */
body{font-kerning:normal}
body .text-phrase,.casebook .text-phrase{display:inline-block;width:max-content;max-width:100%;vertical-align:baseline;font:inherit;color:inherit;letter-spacing:inherit;margin:0;padding:0;border:0;background:none;box-shadow:none;text-decoration:inherit}
main p,main li{line-break:strict;word-break:normal}
.hero-copy,.about-copy>p,.job-content>p,.job-highlights li{overflow-wrap:normal;text-wrap:pretty}
.hero-content .intro-name{margin-bottom:16px}
.hero h1{line-height:1.3}
.hero-content .hero-copy{margin-top:20px;max-width:33em;line-height:1.8}
.hero-facts{column-gap:20px}
.section-heading h2{align-items:baseline;line-height:1.3}
.heading-count{display:inline-block;margin-top:0;line-height:1;flex-shrink:0}
.work .portfolio-project .card-info h3{line-height:1.35}
.project-subtitle{display:block;margin-top:5px;font-size:.72em;line-height:1.55;font-weight:400;color:var(--muted)}
.work-pair{margin-bottom:48px}
.work .portfolio-project .card-info{padding-bottom:24px}
.about h2{margin-top:12px;line-height:1.4}
.about-copy>p{margin-bottom:0;line-height:1.85}
.about-copy>p+p{margin-top:16px}
.timeline article{grid-template-columns:minmax(160px,.75fr) minmax(0,2.5fr);gap:48px;padding-block:32px}
.timeline-date{padding-top:4px}
.timeline-date>span{margin-top:7px}
.job-content h3{margin:0 0 6px;line-height:1.5;overflow-wrap:normal;text-wrap:balance}
.job-content .job-role{margin:0 0 16px;font-size:.875rem;line-height:1.6}
.job-content>p:last-of-type{max-width:45em;line-height:1.8}
.job-highlights{margin-top:14px;gap:12px;max-width:45em}
.job-highlights li{line-height:1.8}
.contact-kicker{margin-bottom:14px}
.all-cases-entry p{margin-top:6px}
.directory-heading h1{align-items:baseline}
.directory-heading .heading-count{margin-top:0}
.directory-grid h2{line-height:1.35}
.directory-grid .card-info{padding-bottom:24px}

/* The opening ends with its content, not with the viewport's leftover height. */
@media(min-width:761px){
 .hero{min-height:0}
 .hero-grid{min-height:0;flex:none;padding-block:48px 0}
 .hero .motion-orbit{width:min(48vw,560px)}
}

/* A caption sits with its picture; a chapter keeps its own breathing space. */
.casebook .cb-prose{line-height:1.8;text-wrap:pretty;overflow-wrap:normal}
.casebook main h2{letter-spacing:-.01em}
.casebook .cb-picture figcaption{margin-top:8px;line-height:1.65}
.casebook .pc-gallery-item figcaption{margin-top:10px;line-height:1.6;row-gap:4px;column-gap:8px}
.casebook .pc-gallery-item figcaption small{line-height:1.5}
.casebook .cb-archive-head{max-width:46em}
.comic-brand-page h2{margin-bottom:16px}
.theater-feedback h2{margin-bottom:16px}
.winter-title .cb-prose{margin-top:16px}
.page-theater{--muted:#526c70}
.page-cockpit{--muted:#596d82}
.page-seasons{--muted:#746357}
.page-xianlian{--muted:#586e8e}
.page-luo{--muted:#766252}

@media(min-width:761px) and (max-width:1050px){
 .hero-facts{grid-template-columns:minmax(0,1fr);row-gap:6px}
 .hero-intent{grid-column:1;grid-row:3;border:0;padding:0}
 .timeline article{grid-template-columns:minmax(140px,.65fr) minmax(0,2.5fr);gap:32px}
 .screen-scale article h3{font-size:21px;text-wrap:balance}
 .datang-text-line{grid-template-columns:1fr;gap:14px}
 .datang-text-line h3{max-width:28em;text-wrap:balance}
 .hmi-zone-heading{align-items:start;gap:20px}
 .comic-two-choices{gap:22px}
 .comic-two-choices article{padding:24px}
 .casebook .comic-two-choices h2{font-size:26px;line-height:1.4;text-wrap:balance}
}

@media(max-width:760px){
 .nav-inner{column-gap:16px}
 .wordmark{font-size:.875rem}
 .hero-top{gap:10px;flex-wrap:wrap}
 .hero-top .eyebrow{max-width:none;font-size:.6875rem;letter-spacing:.035em;line-height:1.7}
 .hero .location{font-size:.6875rem;line-height:1.7}
 .hero-grid{padding-top:26px;padding-bottom:0}
 .hero h1{font-size:clamp(2rem,9vw,2.4rem);line-height:1.3}
 .hero-content .intro-name{font-size:.875rem;margin-bottom:12px}
 .hero-content .hero-copy{font-size:.9375rem;margin-top:18px;line-height:1.85}
 .hero-actions{margin-top:22px}
 .hero-facts{margin-top:20px;gap:5px}
 .hero-motion{height:190px;margin-top:12px;margin-bottom:4px}
 .hero-motion::before{height:160px}
 .section-heading{gap:12px;margin-bottom:26px}
 .section-heading h2{font-size:1.875rem;margin-top:8px;gap:14px}
 .section-heading>p{font-size:.9375rem;line-height:1.8;padding:0;text-wrap:pretty}
 .work{padding-top:38px}
 .work-pair{gap:30px;margin-bottom:30px}
 .work .portfolio-project .card-info{padding-block:16px 20px;gap:12px}
 .work .portfolio-project .card-info h3,.directory-grid h2{font-size:1.5rem;margin-top:8px;line-height:1.35}
 .project-subtitle{font-size:.8333em;margin-top:4px;line-height:1.5}
 .work .portfolio-project .project-index{font-size:.75rem;gap:10px}
 .work .portfolio-project .project-type{font-size:.75rem;line-height:1.7}
 .about-grid{gap:24px}
 .about h2{font-size:1.875rem;margin-top:10px;line-height:1.4}
 .about h2 span{font-size:.8em}
 .about-copy>p{font-size:.9375rem;line-height:1.85}
 .about-copy>.about-lead{font-size:1.0625rem;line-height:1.8}
 .about-copy>p+p{margin-top:14px}
 .expertise{margin-top:24px;gap:8px}
 .timeline article{grid-template-columns:1fr;gap:10px;padding-block:26px}
 .timeline-date{padding-top:0;flex-wrap:wrap;gap:4px 16px;font-size:.8125rem;line-height:1.6}
 .timeline-date time,.timeline-date>span{font-size:.8125rem;line-height:1.6}
 .job-content h3{font-size:1.125rem;line-height:1.5;margin-bottom:6px}
 .job-content .job-role{font-size:.8125rem;margin:0 0 14px;line-height:1.6}
 .job-content>p:last-of-type,.job-highlights li{font-size:.9375rem;line-height:1.85}
 .job-highlights{margin-top:12px;gap:10px}
 .resume .section-heading{margin-bottom:26px}
 .contact-kicker{font-size:.875rem;line-height:1.8;margin-bottom:12px}
 .contact h2{line-height:1.35}
 .all-cases-entry p{font-size:.8125rem;margin-top:6px}
 .directory-heading h1{font-size:clamp(2rem,9.5vw,2.8rem);line-height:1.3}
 .directory-toolbar{margin-block:26px;gap:12px}
 .directory-grid{gap:30px}
 .directory-grid .card-info{padding-block:16px 20px}

 .casebook main h2{font-size:clamp(25px,7.2vw,29px);line-height:1.4;letter-spacing:0}
 .casebook .cb-prose{font-size:15px;line-height:1.85}
 .casebook .cb-label{margin-bottom:10px!important;letter-spacing:.07em}
 .casebook .cb-nav a b{font-size:13px}
 .casebook .cb-picture figcaption{font-size:13px;margin-top:8px;line-height:1.6}
 .casebook .pc-gallery-item figcaption{font-size:13px;margin-top:9px;grid-template-columns:17px 1fr;gap:4px 7px;line-height:1.6}
 .casebook .pc-gallery-item figcaption small{font-size:11px}
 .casebook .pc-filters button{font-size:13px;min-height:44px}
 .casebook .cb-archive-head{margin-bottom:20px}
 .casebook .cb-archive-head h2{margin-bottom:10px}
 .act-title{gap:10px}
 .act-title p{line-height:1.85}
 .theater-screen-strip{margin-top:30px}
 .management-intro{gap:14px;margin-bottom:28px}
 .management-board>div{grid-template-columns:1fr;gap:20px}
 .management-board>div>article{padding-top:16px}
 .management-board>div>article p{font-size:15px;line-height:1.85}
 .management-board h3{font-size:20px;margin-block:7px 10px}
 .management-board>div .cb-picture{grid-column:1}
 .comic-spread h2{margin-bottom:16px}
 .comic-brand-page h2{margin-bottom:14px}
 .casebook .comic-two-choices h2{font-size:25px;margin-block:12px}
 .comic-two-choices article{padding:22px}
 .comic-colophon .cb-prose{font-size:15px}
 .casebook .workbench-title h2{font-size:clamp(20px,5.7vw,23px);line-height:1.45;text-wrap:balance}
 .workbench-title{padding:18px}
 .cockpit-role-panel aside h3{margin-block:6px 10px}
 .cockpit-role-panel aside p,.data-rule-ledger p{font-size:15px;line-height:1.85}
 .screen-opening h1{font-size:clamp(33px,9.2vw,40px);line-height:1.35}
 .screen-reading-heading{gap:14px;margin-bottom:26px}
 .screen-scale article h3{font-size:20px;text-wrap:balance}
 .screen-scale article p{margin-top:10px}
 .screen-scale-title{margin-bottom:26px}
 .casebook .hmi-zone-heading h2{font-size:clamp(24px,6.5vw,27px)}
 .hmi-zone-heading p{margin-top:10px}
 .hmi-scenario p,.hmi-zone-readout p{font-size:15px;line-height:1.85}
 .hmi-zone-readout{padding-top:22px}
 .season-section-title{row-gap:12px}
 .season-autumn-wall aside{grid-template-columns:1fr;gap:12px;padding-block:26px}
 .season-autumn-wall aside h3{font-size:24px;line-height:1.5}
 .season-autumn-wall aside p{font-size:15px;line-height:1.85}
 .winter-title h2{margin-block:14px}
 .winter-title .cb-prose{margin-top:12px}
 .datang-opening h1{font-size:clamp(36px,10vw,44px);line-height:1.35;margin-block:26px}
 .datang-opening h1 span{font-size:25px;line-height:1.5;margin-top:16px}
 .datang-project-brief{gap:16px;padding-bottom:24px}
 .datang-project-brief>p{line-height:1.85}
 .datang-side-heading{gap:8px 15px;align-items:start}
 .datang-side-heading p{margin:0;font-size:15px;line-height:1.85}
 .datang-text-line{gap:12px}
 .datang-text-line h3{font-size:20px;line-height:1.5;text-wrap:balance}
 .datang-text-line p{line-height:1.85}
 .tree-branches p{font-size:14px;line-height:1.8}
 .xianlian-opening h1{font-size:clamp(32px,9.2vw,40px);line-height:1.35;margin-block:28px 18px}
 .xianlian-entry h2{margin-bottom:20px}
 .xianlian-solution-title{gap:12px}
 .xianlian-evidence>div{gap:12px;margin-bottom:22px}
 .xianlian-evidence h2{margin-bottom:0}
 .xianlian-evidence p{line-height:1.85}
 .luo-tone{column-gap:18px}
 .luo-tone-copy h2{margin-bottom:16px}
 .luo-reading-heading{gap:12px}
 .luo-craft-text article{column-gap:14px}
 .luo-colophon .cb-prose{line-height:1.85}
}
@media(max-width:560px){
 .data-rule-ledger{grid-template-columns:1fr}
}
@media(max-width:430px){
 .cockpit-archive .pc-gallery{grid-template-columns:1fr;gap:26px}
 .cockpit-archive .pc-image-open{height:auto;aspect-ratio:4/3;padding:12px}
 .cockpit-archive .pc-gallery-item figcaption{font-size:14px}
 .tree-branches{grid-template-columns:1fr;gap:16px}
 .tree-branches article{padding:18px 16px}
 .tree-branches article:nth-child(even):before{display:block}
 .tree-branches h3{font-size:20px}
 .tree-branches p{font-size:14px}
}
@media(max-width:370px){
 .hmi-scenario{grid-template-columns:1fr;gap:18px}
 .hmi-scenario article+article{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:18px}
 .luo-tone{column-gap:14px}
 .comic-colophon{grid-template-columns:1fr}
}