/* JZD case studies — original project material, newly composed editorial pages. */
.case-page-v2{--case-paper:#f5f4ef;--case-ink:#272d29;--case-muted:#6d736d;--case-line:#d7d9d1;--case-accent:#19352c;--case-gutter:clamp(24px,4vw,76px);--opening-paper:#e9ebe3;--opening-ink:#19352c;--opening-muted:#526055;margin:0;background:var(--case-paper);color:var(--case-ink);font-family:"Helvetica Neue","Avenir Next",-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.75;-webkit-font-smoothing:antialiased}
.case-page-v2 *{box-sizing:border-box}.case-page-v2 :where(h1,h2,h3,p,figure,dl,dd,ul,ol){margin:0}.case-page-v2 :where(h1,h2,h3){font-weight:550;letter-spacing:-.04em;line-height:1.3}.case-page-v2 a{color:inherit;text-decoration:none}.case-page-v2 button{font:inherit}.case-page-v2 img{display:block;max-width:100%;height:auto}.case-page-v2 a:focus-visible,.case-page-v2 button:focus-visible{outline:2px solid var(--case-accent);outline-offset:6px}
.case-skip{position:fixed;top:-100px;left:24px;z-index:1000;background:#fff;padding:15px}.case-skip:focus{top:10px}
.case-header{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:28px;min-height:72px;padding:12px var(--case-gutter);background:#f5f4eff5;color:#19352c;backdrop-filter:blur(16px);border-bottom:1px solid var(--case-line)}
.case-brand{display:flex;align-items:baseline;gap:10px;line-height:1;flex:none}.case-brand>span{font-size:29px;font-weight:750;letter-spacing:-.07em}.case-brand sup{position:relative;top:-.3em;margin-left:2px;font-size:10px;letter-spacing:0}.case-brand small{font-size:10px;font-weight:600;letter-spacing:.08em}.case-header nav{display:flex;align-items:center;gap:35px;font-size:13px}.case-header nav a{padding-block:8px}.case-nav-contact{display:flex;align-items:center;gap:9px}.case-header a:hover{opacity:.65}.case-reading-progress{position:absolute;left:0;bottom:-1px;width:100%;height:2px;background:#19352c;transform:scaleX(0);transform-origin:left}
.case-content-stream,.case-next{width:min(100% - var(--case-gutter)*2,1440px);margin-inline:auto}.case-opening{padding:62px var(--case-gutter) 45px;background:var(--opening-paper);color:var(--opening-ink)}.case-opening-inner{max-width:1440px;margin-inline:auto}.case-opening-meta{display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.06em;color:var(--opening-muted);text-transform:uppercase;margin-bottom:42px}.case-opening h1{font-size:clamp(48px,6.1vw,98px);font-weight:500;max-width:1280px;line-height:1.16;letter-spacing:-.055em;text-wrap:balance}.case-opening-copy{display:grid;grid-template-columns:1fr 1fr;gap:8%;margin-top:42px;align-items:start}.case-claim{font-size:clamp(21px,2vw,29px);font-weight:450;line-height:1.65;letter-spacing:-.025em;max-width:620px}.case-lead{font-size:15px;line-height:1.95;max-width:650px;color:var(--opening-muted)}.case-project-qingke .case-opening-copy{display:block;margin-top:30px}.case-project-qingke .case-lead{font-size:16px;max-width:820px}.case-tags{display:flex;gap:10px 26px;flex-wrap:wrap;margin-top:30px;font-size:10px;color:var(--opening-muted)}.case-tag{display:inline-flex;align-items:center;gap:8px}.case-tag:before{content:"";width:3px;height:3px;border-radius:50%;background:currentColor}.case-scroll-cue{display:flex;justify-content:space-between;align-items:center;width:96px;margin-top:44px;font-size:11px}.case-scroll-cue span{font-size:20px}.case-content-stream{padding-top:56px;scroll-margin-top:94px}
.case-project-qingke{--opening-paper:#eae9e3;--opening-ink:#1c282b;--opening-muted:#566163}
.case-project-siqi{--opening-paper:#edcba2;--opening-ink:#573214;--opening-muted:#795637}
.case-project-ai-7-days{--opening-paper:#141416;--opening-ink:#f5f4ef;--opening-muted:#b6b6bc}
.case-project-ankole{--opening-paper:#dce5c5;--opening-ink:#263b28;--opening-muted:#56634b}
.case-project-tsingtong-concept{--opening-paper:#dde6e9;--opening-ink:#213e4a;--opening-muted:#576d76}
.case-project-black-sesame{--opening-paper:#e3dfbd;--opening-ink:#383c24;--opening-muted:#646548}
.case-project-beverage{--opening-paper:#eee9b5;--opening-ink:#4d5028;--opening-muted:#6a6d47}
.case-project-tsingtong-vi{--opening-paper:#dce8e3;--opening-ink:#26483e;--opening-muted:#526b62}
.case-project-visual-identity{--opening-paper:#e6dde3;--opening-ink:#423440;--opening-muted:#6c5d69}
.case-project-oriental-gift{--opening-paper:#dfe4d6;--opening-ink:#344734;--opening-muted:#62705b}
.case-project-bakery{--opening-paper:#e7e5df;--opening-ink:#414749;--opening-muted:#6a6e6b}
.case-content-stream>.case-figure:first-child{margin-top:0}.case-figure{position:relative;margin:0 0 28px;min-width:0}.case-image-link{position:relative;display:block;overflow:hidden;background:#eaeae5}.case-image-link>img,.case-image-link>picture,.case-image-link>picture>img{display:block;width:100%;height:auto;object-fit:contain}.case-image-open{position:absolute;right:20px;bottom:20px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#f5f4efe8;color:#19352c;font-size:20px;opacity:0;transform:translateY(5px);transition:opacity .2s,transform .2s}.case-image-link:hover .case-image-open,.case-image-link:focus-visible .case-image-open{opacity:1;transform:none}.case-figure figcaption{display:flex;gap:10px;font-size:11px;line-height:1.6;margin-top:12px;color:var(--case-muted)}.case-portrait{max-width:760px;margin-inline:auto}.case-portrait img{max-height:none}.case-media-pair{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}.case-media-pair .case-figure{margin-bottom:28px}.case-media-pair .case-image-link{height:100%}
.case-editorial{display:grid;grid-template-columns:.75fr 1.6fr;gap:8%;padding:56px 0;border-top:1px solid var(--case-line);max-width:1180px;margin:0 auto}.case-editorial-heading h2,.case-editorial-heading h3{font-size:clamp(22px,2.2vw,32px);font-weight:650;line-height:1.4}.case-editorial-body p{font-size:17px;line-height:1.95;color:var(--case-muted);max-width:760px}.case-editorial-body p+p{margin-top:22px}.case-text-pair{display:grid;grid-template-columns:1fr 1fr;gap:0 8%;max-width:1180px;margin:76px auto 0}.case-text-pair>.case-editorial{display:block;padding:38px 0 54px;border-top:1px solid var(--case-line)}.case-text-pair .case-editorial-heading{margin-bottom:19px}.case-text-pair .case-editorial-heading h2{font-size:22px}.case-text-pair .case-editorial-body p{font-size:17px}.case-points-grid{max-width:1180px;margin:15px auto 60px;display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--case-line)}.case-points-grid article{padding:24px 22px 27px 0}.case-points-grid article+article{padding-left:22px;border-left:1px solid var(--case-line)}.case-points-grid b{display:block;font-size:12px;font-weight:500;color:var(--case-muted);margin-bottom:15px}.case-points-grid strong{display:block;font-size:21px;font-weight:650;margin-bottom:10px}.case-points-grid p{font-size:14px;line-height:1.8;color:var(--case-muted)}
.case-section-intro{padding:42px 0 32px;max-width:850px}.case-section-intro>div,.case-section-intro>span{font-size:11px;letter-spacing:.08em;color:var(--case-muted);text-transform:uppercase}.case-section-intro h2{font-size:clamp(32px,4vw,58px);margin:18px 0}.case-section-intro p{max-width:690px;font-size:17px;line-height:1.9;color:var(--case-muted)}
.case-brand-chapter{margin-bottom:72px}.case-chapter-stage{position:relative;isolation:isolate;overflow:hidden;background:#101314}.case-chapter-stage>.case-figure{margin:0}.case-chapter-copy{position:absolute;z-index:2;left:5%;top:50%;transform:translateY(-50%);width:35%;color:#f4f4ed;pointer-events:none}.case-chapter-copy a{pointer-events:auto}.case-chapter-copy h2{font-size:clamp(25px,3.8vw,58px);font-weight:680;max-width:8.6em;margin:19px 0;line-height:1.27;letter-spacing:-.045em}.case-chapter-copy p{font-size:15px;line-height:1.85;max-width:390px}.case-chapter-copy p+p{margin-top:15px}.case-chapter-copy .case-kicker{display:flex;gap:12px;font-size:10px;letter-spacing:.06em;opacity:.75}.case-chapter-copy>div>p:nth-child(2){font-size:19px;font-weight:600}.case-chapter-copy a{display:inline-block;margin-top:18px;font-size:12px;border-bottom:1px solid currentColor}.case-chapter-01 .case-chapter-copy{color:#1c282b;width:39%;top:49%}.case-chapter-01 .case-chapter-copy h2{max-width:8em}.case-chapter-03 .case-chapter-copy,.case-chapter-04 .case-chapter-copy{width:34%}.case-chapter-05 .case-chapter-stage,.case-chapter-06 .case-chapter-stage{display:flex;flex-direction:column-reverse;background:transparent}.case-chapter-05 .case-chapter-copy,.case-chapter-06 .case-chapter-copy{position:static;width:auto;transform:none;color:var(--case-ink);padding:15px 0 30px}.case-chapter-05 .case-chapter-copy h2,.case-chapter-06 .case-chapter-copy h2{margin:12px 0 18px;max-width:none}.case-chapter-05 .case-chapter-copy p,.case-chapter-06 .case-chapter-copy p{max-width:720px}.case-chapter-supplement{padding:26px 30px;background:#e9eae5;border-bottom:1px solid var(--case-line)}.case-metadata{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.case-metadata dt{font-size:10px;letter-spacing:.08em;color:var(--case-muted);margin-bottom:6px}.case-metadata dd{font-size:14px;line-height:1.7}.case-rule-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.case-rule svg{display:block;width:100%;height:auto;max-height:120px}.case-rule>div{display:flex;justify-content:space-between;gap:15px;font-size:15px}.case-rule strong{font-weight:600}.case-rule span{color:var(--case-muted);font-size:13px}.case-identity{display:grid;gap:22px}.case-identity-row{display:grid;grid-template-columns:100px 1fr;align-items:center;gap:25px}.case-identity-row>span{font-size:11px;letter-spacing:.07em;color:var(--case-muted)}.case-logo-samples{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;max-width:820px}.case-logo-samples figure{background:#f7f8f3;padding:20px;display:grid;place-items:center;min-height:125px}.case-logo-samples img{width:100%;max-height:100px;object-fit:contain}.case-logo-samples .case-logo-dark{background:#0e0e10}.case-swatches{display:flex;gap:24px}.case-swatch{display:flex;align-items:center;gap:10px;font-size:13px}.case-swatch i{display:block;width:30px;height:30px;border:1px solid #ccd0c9}.case-swatch b{font-weight:500}.case-material-list{display:grid;grid-template-columns:repeat(4,1fr);list-style:none;padding:0;gap:18px}.case-material-list li{display:flex;gap:12px;align-items:center;font-size:14px}.case-material-list span{font-size:10px;color:var(--case-muted)}
.case-context{display:grid;grid-template-columns:.9fr 1.4fr;gap:8%;padding:75px 0 85px;border-top:1px solid var(--case-line)}.case-context h2{font-size:clamp(30px,3.5vw,52px);margin-top:20px;max-width:9em}.case-context h2 span{display:block}.case-context p{font-size:17px;line-height:1.95;color:var(--case-muted)}.case-context>div:first-child>p{font-size:10px;letter-spacing:.07em}.case-context p+p{margin-top:20px}.case-context .case-metadata{border-top:1px solid var(--case-line);padding-top:22px;margin-top:28px}.case-billboards{padding-top:15px;border-top:1px solid var(--case-line)}.case-billboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}.case-billboard-grid .case-featured-plate{grid-column:1/-1}.case-billboard-grid .case-figure{margin:0}
.case-long-strip{max-width:1050px;margin:0 auto 60px;line-height:0}.case-long-strip img{display:block;width:100%;height:auto}.case-video{margin:0 0 32px;background:#111a20;line-height:0}.case-video video{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}.case-concept{display:grid;grid-template-columns:.8fr 1.5fr;gap:7%;padding:28px 30px;border-left:3px solid #618b99;background:#e8edef;margin:35px 0;color:#35434b}.case-concept>div{display:flex;flex-direction:column;gap:15px}.case-concept img{max-width:180px;max-height:50px;object-fit:contain;object-position:left}.case-concept strong{font-size:15px;font-weight:600;line-height:1.65}.case-concept p{font-size:14px;line-height:1.9}.case-prototype{grid-column:1/-1;display:grid;grid-template-columns:.95fr 1.25fr;gap:6%;align-items:center;padding:35px 0 50px}.case-prototype h2{font-size:clamp(30px,3.2vw,48px);margin:19px 0}.case-prototype p{font-size:15px;line-height:1.9;color:var(--case-muted)}.case-prototype>div>span{font-size:10px;letter-spacing:.05em;color:var(--case-muted)}.case-prototype .case-action{margin-top:25px}.case-prototype .case-figure{margin:0}.case-action{display:inline-flex;align-items:center;justify-content:space-between;gap:36px;background:var(--case-ink);color:var(--case-paper)!important;padding:15px 24px;border-radius:40px;font-size:14px;line-height:1.5;transition:background .2s,transform .2s}.case-action:hover{background:#365447;transform:translateY(-2px)}
.case-mobile-board,.case-mobile-only,.case-mobile-story{display:none}.case-responsive-art{margin-bottom:28px}.case-responsive-art .case-figure{margin:0}.case-next{display:grid;grid-template-columns:1fr 1fr;gap:35px;border-top:1px solid var(--case-line);margin-top:75px;padding:35px 0}.case-next>a{position:relative;display:block;padding-right:35px;font-size:22px;font-weight:600;line-height:1.5;max-width:600px}.case-next>a:nth-child(2){justify-self:end}.case-next span{display:block;font-size:10px;font-weight:500;letter-spacing:.08em;color:var(--case-muted);margin-bottom:10px}.case-next b{position:absolute;right:0;bottom:0;font-size:30px;font-weight:400}.case-next a:hover{color:#526c5e}.case-closing{margin-top:25px;padding:65px var(--case-gutter) 75px;background:#dbe8b5;color:#19352c;text-align:center}.case-closing>p{font-size:10px;letter-spacing:.12em;color:#586c4e}.case-closing h2{font-size:clamp(34px,4.6vw,68px);font-weight:500;margin:25px 0 30px;line-height:1.3}.case-closing .case-action{background:#19352c;color:#f5f4ef!important}.case-footer{display:flex;justify-content:space-between;gap:25px;padding:25px var(--case-gutter);font-size:10px;color:var(--case-muted)}
@media(min-width:1600px){.case-chapter-copy h2{font-size:58px}}
@media(max-width:1000px){.case-opening h1{font-size:clamp(40px,6vw,65px)}.case-chapter-copy h2{font-size:34px}.case-chapter-copy p{font-size:12px}.case-rule-grid{gap:15px}.case-swatches{gap:14px}.case-swatch{font-size:11px}.case-points-grid{grid-template-columns:1fr 1fr}.case-points-grid article:nth-child(3){border-left:0;padding-left:0;border-top:1px solid var(--case-line)}.case-points-grid article:nth-child(4){border-top:1px solid var(--case-line)}.case-context{gap:5%}.case-context p{font-size:15px}}
@media(max-width:767px){
.case-page-v2{--case-gutter:24px}.case-header{min-height:72px;padding:12px 24px;gap:15px}.case-brand{gap:7px}.case-brand>span{font-size:26px}.case-brand small{font-size:8px}.case-header nav{gap:18px;font-size:11px}.case-nav-contact{gap:7px}.case-opening{padding:37px var(--case-gutter) 30px}.case-opening-meta{font-size:8px;line-height:1.6;margin-bottom:27px}.case-opening-meta>span:last-child{display:none}.case-project-tsingtong-concept .case-opening-meta{flex-direction:column;gap:7px}.case-project-tsingtong-concept .case-opening-meta>span:last-child{display:block}.case-opening h1{font-size:clamp(35px,10vw,60px);font-weight:500;line-height:1.28;letter-spacing:-.045em;text-wrap:balance}.case-opening-copy{display:block;margin-top:26px}.case-scroll-cue{margin-top:30px;font-size:10px}.case-content-stream{padding-top:30px}.case-claim{font-size:20px;line-height:1.55;max-width:none}.case-lead{font-size:14px;line-height:1.9;margin-top:16px;max-width:none}.case-project-qingke .case-lead{font-size:14px}.case-tags{gap:9px 18px;margin-top:22px;font-size:10px}
.case-figure{margin-bottom:16px}.case-figure figcaption{font-size:10px;margin-top:9px}.case-image-open{right:10px;bottom:10px;width:30px;height:30px;font-size:17px;opacity:1;transform:none}.case-media-pair{gap:16px}.case-media-pair .case-figure{margin-bottom:16px}.case-media-pair:has(.case-portrait){grid-template-columns:1fr}.case-text-pair{display:block;margin-top:35px}.case-text-pair>.case-editorial{padding:25px 0}.case-text-pair .case-editorial-heading{margin-bottom:12px}.case-text-pair .case-editorial-body p{font-size:15px;line-height:1.95}.case-editorial{display:block;padding:27px 0}.case-editorial-heading h2,.case-editorial-heading h3{font-size:24px}.case-editorial-heading{margin-bottom:14px}.case-editorial-body p{font-size:15px;line-height:1.95}.case-points-grid{margin:10px 0 35px;grid-template-columns:1fr 1fr}.case-points-grid article{padding:20px 15px 21px 0}.case-points-grid article+article{padding-left:15px}.case-points-grid article:nth-child(3){padding-left:0}.case-points-grid b{margin-bottom:9px;font-size:10px}.case-points-grid strong{font-size:18px}.case-points-grid p{font-size:12px;line-height:1.85}
.case-brand-chapter{margin-bottom:35px}.case-chapter-stage{display:flex;flex-direction:column-reverse;background:transparent}.case-chapter-copy,.case-chapter-01 .case-chapter-copy,.case-chapter-03 .case-chapter-copy,.case-chapter-04 .case-chapter-copy{position:static;transform:none;width:100%;color:var(--case-ink);padding:13px 0 24px}.case-chapter-copy h2,.case-chapter-01 .case-chapter-copy h2{font-size:32px;font-weight:680;line-height:1.3;max-width:none;margin:14px 0}.case-chapter-copy p{font-size:14px;line-height:1.85;max-width:none}.case-chapter-copy .case-kicker{font-size:9px}.case-chapter-copy>div>p:nth-child(2){font-size:15px}.case-chapter-stage>.case-figure{margin:0}.case-chapter-supplement{padding:22px 18px}.case-metadata{grid-template-columns:1fr 1fr;gap:20px}.case-metadata dt{font-size:8px}.case-metadata dd{font-size:12px}.case-rule-grid{grid-template-columns:1fr;gap:18px}.case-rule{padding-bottom:18px;border-bottom:1px solid var(--case-line)}.case-rule:last-child{border:0;padding-bottom:0}.case-rule svg{max-height:100px}.case-rule>div{font-size:14px}.case-identity-row{grid-template-columns:1fr;gap:14px}.case-identity-row>span{font-size:9px}.case-logo-samples{gap:7px}.case-logo-samples figure{min-height:75px;padding:10px}.case-logo-samples img{max-height:60px}.case-swatches{display:grid;grid-template-columns:1fr 1fr;gap:12px}.case-swatch i{width:22px;height:22px}.case-material-list{grid-template-columns:1fr 1fr;gap:17px}.case-material-list li{font-size:11px;gap:9px}.case-context{display:block;padding:35px 0}.case-context h2{font-size:32px;line-height:1.35;max-width:none;margin:15px 0 25px}.case-context p{font-size:15px;line-height:1.9}.case-context .case-metadata{grid-template-columns:1fr 1fr;margin-top:25px}.case-section-intro{padding:25px 0}.case-section-intro h2{font-size:32px}.case-section-intro p{font-size:14px}.case-billboard-grid{grid-template-columns:1fr;gap:23px}.case-billboard-grid .case-featured-plate{grid-column:auto}
.case-long-strip{margin:0 -24px 38px}.case-video{margin:0 -24px 25px}.case-concept{display:block;padding:22px;margin:28px 0}.case-concept>div{display:grid;grid-template-columns:1fr 1fr;gap:15px;align-items:center;margin-bottom:16px}.case-concept strong{font-size:12px}.case-concept p{font-size:12px}.case-concept img{max-width:115px}.case-prototype{display:block;padding:27px 0 35px}.case-prototype h2{font-size:31px}.case-prototype p{font-size:14px}.case-prototype .case-figure{margin-top:25px}.case-action{font-size:13px;padding:14px 22px;gap:28px}.case-next{gap:22px;margin-top:45px;padding:25px 0}.case-next>a{font-size:16px;padding-right:20px}.case-next span{font-size:8px}.case-next b{font-size:23px}.case-closing{padding:46px 24px 55px}.case-closing h2{font-size:35px}.case-footer{padding:22px 24px;font-size:8px}
.case-desktop-board,.case-desktop-only{display:none}.case-mobile-only,.case-mobile-story{display:block}.case-responsive-art{margin-bottom:16px}.case-mobile-board{display:block;padding:30px 22px;background:#0c0e10;color:#fff}.case-mobile-board h2{font-size:29px;line-height:1.3;margin:16px 0}.case-mobile-board p{font-size:13px;line-height:1.8;color:#bec3cb;margin-bottom:16px}.case-mobile-board .case-kicker{font-size:8px;letter-spacing:.055em;color:#ff82d0}.case-mobile-board .case-device-row{display:flex;align-items:flex-start;justify-content:center;gap:12px;margin-top:25px}.case-device-row img{min-width:0;max-width:calc(50% - 6px);max-height:360px;object-fit:contain}.case-device-row:has(img:nth-child(3)){gap:7px}.case-device-row:has(img:nth-child(3)) img{max-width:calc(33.333% - 5px)}.case-device-row img:only-child{max-width:70%}.case-board-details{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;padding:0;list-style:none;margin:19px 0;font-size:11px}.case-board-details strong,.case-board-details b{display:block;font-size:21px;font-weight:600}.case-board-details span{display:block;font-size:10px}.case-board-details li{font-size:12px}.case-board-details dt{color:#ff82d0;font-size:10px}.case-board-details dd{font-size:10px}.case-mobile-story>.case-figure{margin-inline:-24px}.case-mobile-board>div:last-child:not(.case-device-row){font-size:10px;margin-top:22px;color:#d1d4d9}.case-mobile-story .case-section-intro>span{font-size:9px}
}
@media(max-width:370px){.case-page-v2{--case-gutter:20px}.case-header{padding-inline:20px}.case-header nav{gap:11px}.case-nav-contact{gap:6px}.case-opening h1{font-size:36px}.case-media-pair{grid-template-columns:1fr}.case-long-strip,.case-video,.case-mobile-story>.case-figure{margin-inline:-20px}.case-logo-samples{grid-template-columns:1fr 1fr}.case-opening-meta{font-size:7px}}
@media(prefers-reduced-motion:reduce){.case-page-v2 *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* Keep product names and their disciplines intact at narrow reading widths. */
.case-opening h1>span{display:inline-block}.case-claim{text-wrap:balance}.case-page-v2 main{scroll-margin-top:72px}
@media(max-width:767px){.case-opening h1>span{display:block}.case-project-tsingtong-concept .case-opening h1{font-size:clamp(31px,8.5vw,42px)}.case-page-v2 main{scroll-margin-top:72px}}
@media(max-width:370px){.case-project-qingke .case-opening h1,.case-project-tsingtong-concept .case-opening h1{font-size:32px}}
.case-claim-unit{display:inline-block;max-width:100%;vertical-align:top}
@media(max-width:767px){.case-opening h1 wbr{display:none}}

/* 2026-09 · project-colour opening / image-led case narrative. */
.case-page-v3{--case-paper:#fff;--case-ink:#18201e;--case-muted:#616964;--case-line:#dce0dc;background:#07110e}
.case-page-v3 main{position:relative;z-index:1;scroll-margin-top:0}
.case-flow{position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 20% 50%,var(--case-glow),transparent 65%),var(--case-dark);transition:opacity .25s}
.case-flow canvas{display:block;width:100%;height:100%}
.case-flow::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#02090744,transparent 50%)}
.case-page-v3 .case-header{position:absolute;top:0;left:0;width:100%;height:96px;padding:25px var(--case-gutter);border:0;background:transparent;color:white;backdrop-filter:none}
.case-page-v3 .case-header nav{margin-right:85px;font-size:12px}
.case-nav-back{position:absolute;left:50%;transform:translateX(-50%)}
.case-motion-toggle{position:fixed;z-index:50;top:25px;right:var(--case-gutter);width:46px;height:46px;display:grid;place-items:center;border:1px solid #ffffff88;border-radius:50%;background:#05120d55;color:white;cursor:pointer;transition:background .25s,color .25s,border-color .25s;line-height:1}
.case-motion-toggle:hover{background:white;color:#15261c}
.case-on-paper .case-motion-toggle{background:#112018;color:#fff;border-color:#112018}
.case-page-v3 .case-reading-progress{position:fixed;top:0;bottom:auto;height:2px;z-index:51;background:var(--case-light);pointer-events:none}
.case-page-v3 a:focus-visible,.case-page-v3 button:focus-visible{outline-color:var(--case-glow)}
.case-page-v3 .case-opening{position:relative;padding:172px 0 112px;background:transparent;color:#fff}
.case-page-v3 .case-opening-inner{max-width:none}
.case-page-v3 .case-opening-meta{margin:0 var(--case-gutter) 22px;color:#e6eee0c2;font-size:10px}
.case-page-v3 .case-opening h1{margin:0 var(--case-gutter) 86px;max-width:84%;font-size:clamp(34px,3.6vw,62px);font-weight:450;line-height:1.27;letter-spacing:-.035em;text-wrap:initial}
.case-opening-grid{display:grid;grid-template-columns:31% 69%;align-items:start}
.case-project-facts{padding:0 16% 0 13%;font-size:12px;line-height:1.8}
.case-project-facts dl{display:grid;grid-template-columns:1fr 1fr;gap:36px 24px}
.case-project-facts dt{font-size:10px;line-height:1.8;letter-spacing:.04em;color:var(--case-light);margin-bottom:12px}
.case-project-facts dd{font-size:12px;color:#f3f7ed}
.case-project-facts .case-concept-label{grid-column:1/-1}
.case-project-facts .case-tags{display:flex;flex-direction:column;gap:6px;color:#e6ecdfbb;font-size:10px;margin-top:30px}
.case-project-facts .case-scroll-cue{margin-top:38px;width:118px;font-size:11px}
.case-lead-media{min-width:0;transform-origin:center;position:relative}
.case-lead-media>.case-figure,.case-lead-media .case-responsive-art,.case-lead-media .case-video{margin:0}
.case-lead-media .case-figure figcaption{color:#e1e9e0bb;padding-inline:20px}
.case-lead-media .case-image-link{background:#101915}
.case-lead-media .case-image-link img{width:100%;height:auto}
.case-lead-media .case-video video{display:block}
.case-lead-media .case-image-open{display:none}
.case-project-tsingtong-vi .case-lead-media{padding-right:var(--case-gutter)}
.case-project-tsingtong-vi .case-lead-media .case-figure{max-width:660px;margin-left:auto}
.case-story-surface{position:relative;background:var(--case-paper);padding:1px 0 50px;scroll-margin-top:0}
.case-story-intro{width:min(62%,1060px);margin:100px auto 72px}
.case-page-v3 .case-opening-copy{display:grid;grid-template-columns:1fr 1fr;gap:8%;margin:0;align-items:start}
.case-page-v3 .case-opening-copy>*{border-left:1px solid #17221b;padding-left:22px;max-width:none;color:var(--case-ink);font-size:clamp(17px,1.4vw,22px);line-height:1.65;font-weight:450}
.case-page-v3 .case-opening-copy>*:only-child{grid-column:1/-1;max-width:790px;font-size:clamp(20px,1.9vw,28px)}
.case-page-v3 .case-claim-unit{display:contents}
.case-page-v3 .case-content-stream{width:100%;padding:0}
.case-page-v3 .case-content-stream>:where(.case-figure,.case-responsive-art,.case-media-pair,.case-video){width:78%;max-width:1600px;margin:0 auto 55px}
.case-page-v3 .case-content-stream>.case-figure:nth-of-type(3n+2){width:100%;max-width:none}
.case-page-v3 .case-media-pair{gap:22px}
.case-page-v3 .case-media-pair .case-figure{margin:0}
.case-page-v3 .case-editorial,.case-page-v3 .case-context{width:62%;max-width:1060px;grid-template-columns:.9fr 1.1fr;gap:12%;padding:84px 0;margin:0 auto;border:0}
.case-page-v3 .case-editorial-heading h2,.case-page-v3 .case-editorial-heading h3{font-size:clamp(22px,1.85vw,30px);font-weight:550;line-height:1.4}
.case-page-v3 .case-editorial-body p{font-size:15px;line-height:1.95;color:#444d47}
.case-page-v3 .case-text-pair{width:62%;max-width:1060px;margin:0 auto 38px;gap:8%}
.case-page-v3 .case-text-pair>.case-editorial{width:100%;margin:0;padding:28px 0 40px;border:0}
.case-page-v3 .case-text-pair .case-editorial-body p{font-size:15px}
.case-page-v3 .case-points-grid{width:78%;margin:15px auto 55px}
.case-page-v3 .case-brand-chapter{margin-bottom:64px}
.case-page-v3 .case-chapter-stage{display:flex;flex-direction:column-reverse;overflow:visible;background:transparent;isolation:auto}
.case-page-v3 .case-chapter-copy{position:static;transform:none;pointer-events:auto;display:block;width:62%;max-width:1060px;margin:0 auto;padding:64px 0;color:var(--case-ink)}
.case-page-v3 .case-chapter-copy>div{display:grid;grid-template-columns:.9fr 1.1fr;column-gap:12%;align-items:start}
.case-page-v3 .case-chapter-copy .case-kicker{grid-column:1/-1;opacity:1;color:#64816b;font-size:10px;margin-bottom:20px;letter-spacing:.08em}
.case-page-v3 .case-chapter-copy h2{grid-column:1;grid-row:2 / span 5;align-self:start;max-width:none;margin:0;font-size:clamp(25px,2.25vw,38px);font-weight:550;line-height:1.4}
.case-page-v3 .case-chapter-copy p,.case-page-v3 .case-chapter-copy a{grid-column:2;font-size:15px;line-height:1.9;max-width:none}
.case-page-v3 .case-chapter-copy p+p{margin-top:14px}
.case-page-v3 .case-chapter-copy>div>p:nth-child(2){font-size:18px;font-weight:500}
.case-page-v3 .case-chapter-stage>.case-figure{width:100%;margin:0}
.case-page-v3 .case-brand-chapter:nth-child(even) .case-chapter-stage>.case-figure{width:78%;margin-inline:auto}
.case-page-v3 .case-chapter-supplement{width:78%;margin:0 auto;padding:35px 0;background:white;border-bottom:1px solid var(--case-line)}
.case-page-v3 .case-brand-chapter:first-child .case-chapter-copy{padding-top:0}
.case-page-v3 .case-context h2{font-size:32px;max-width:none}
.case-page-v3 .case-context p{font-size:15px}
.case-page-v3 .case-billboards{width:78%;margin:40px auto 0;border:0}
.case-page-v3 .case-section-intro{max-width:none;width:100%;padding:48px 0}
.case-page-v3 .case-section-intro h2{font-size:32px}
.case-page-v3 .case-billboard-grid{gap:22px}
.case-page-v3 .case-content-stream>.case-concept,.case-page-v3 .case-prototype{width:78%;max-width:1600px;margin:50px auto}
.case-page-v3 .case-long-strip{width:78%;max-width:1200px;margin:0 auto 60px}
.case-page-v3 .case-next{max-width:1060px;width:62%;padding:40px 0 20px;margin-top:90px}
.case-page-v3 .case-next>a{font-size:17px}
.case-related{position:relative;padding:94px var(--case-gutter) 70px;background:#07110e;color:#fff;overflow:hidden}
.case-related-heading{display:flex;align-items:baseline;justify-content:space-between;gap:25px;margin-bottom:48px}
.case-related-heading h2{font-size:clamp(28px,3vw,46px);font-weight:450}
.case-related-heading>span{font-size:10px;letter-spacing:.06em;color:#9baaa0}
.case-related-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.case-related-image{position:relative;overflow:hidden;aspect-ratio:1.5;background:#15221b}
.case-related-image img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.case-related-image>span{position:absolute;top:50%;left:50%;width:105px;height:105px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#15241c;font-size:11px;transform:translate(-50%,-50%) scale(.15);opacity:0;transition:transform .38s,opacity .3s}
.case-related-card:hover .case-related-image img{transform:scale(1.035)}
.case-related-card:hover .case-related-image>span,.case-related-card:focus-visible .case-related-image>span{transform:translate(-50%,-50%) scale(1);opacity:1}
.case-related-card p{display:flex;justify-content:space-between;gap:12px;margin:18px 0 9px;font-size:clamp(15px,1.35vw,22px);line-height:1.6}
.case-related-card small{font-size:9px;letter-spacing:.06em;color:#99aaa1}
.case-back-list{display:table;margin:58px auto 0;font-size:12px;border-bottom:1px solid #6b7b70;padding:10px 0}
.case-page-v3 .case-closing{margin:0;padding:105px var(--case-gutter) 100px;border-top:1px solid #e2ebdc22;background:#07110e;color:#fff}
.case-page-v3 .case-closing>p{color:#9fae9f}
.case-page-v3 .case-closing h2{font-weight:450;font-size:clamp(34px,4.8vw,72px);line-height:1.35;margin:30px 0 42px}
.case-page-v3 .case-closing .case-action{background:transparent;border:1px solid #d7e5c588;color:white!important}
.case-page-v3 .case-closing .case-action:hover{background:#d9e8c4;color:#17291e!important}
.case-page-v3 .case-footer{position:relative;z-index:1;background:#07110e;color:#94a198;border-top:1px solid #e2ebdc22;padding:25px var(--case-gutter)}
.case-page-v3 .case-image-link{transform-origin:center center}
/* One transparent surface bends visible artwork; the original image still
   owns its dimensions, link and accessible alternative text. */
.case-media-layer{position:fixed;inset:0;z-index:4;width:100%;height:100%;pointer-events:none;display:block}
.case-page-v3 .case-image-link.case-mesh-active{background:transparent}
.case-page-v3 .case-mesh-active>img,.case-page-v3 .case-mesh-active>picture{opacity:0}
.case-page-v3 .case-image-open{z-index:5}
.case-page-v3 .case-figure figcaption{position:relative;z-index:5}
.case-page-v3 .case-image-link:focus-visible{z-index:5}
@media(max-width:1000px) and (min-width:768px){
 .case-project-facts{padding-left:13%;padding-right:12%}.case-project-facts dl{grid-template-columns:1fr;gap:24px}
 .case-page-v3 .case-editorial,.case-page-v3 .case-context,.case-page-v3 .case-text-pair,.case-story-intro,.case-page-v3 .case-chapter-copy,.case-page-v3 .case-next{width:76%}
 .case-page-v3 .case-opening h1{font-size:42px}
}
@media(max-width:767px){
 .case-page-v3{--case-gutter:22px}
 .case-page-v3 .case-header{height:80px;padding:21px 22px}
 .case-page-v3 .case-header nav{margin-right:45px;gap:0}
 .case-nav-back{position:static;transform:none;font-size:11px}
 .case-page-v3 .case-nav-contact{display:none}
 .case-motion-toggle{width:36px;height:36px;top:22px;right:22px;font-size:13px}
 .case-page-v3 .case-opening{padding:125px 0 56px}
 .case-page-v3 .case-opening-meta{margin:0 22px 24px;font-size:8px}
 .case-page-v3 .case-opening h1{max-width:none;margin:0 22px 38px;font-size:clamp(29px,7.4vw,50px);line-height:1.32;letter-spacing:-.035em}
 .case-page-v3 .case-opening h1>span{display:block}
 .case-opening-grid{display:flex;flex-direction:column;gap:34px}
 .case-project-facts{width:100%;padding:0 22px}
 .case-project-facts dl{grid-template-columns:1.3fr 1fr;gap:20px}
 .case-project-facts dt{font-size:8px;margin-bottom:8px}.case-project-facts dd{font-size:11px}
 .case-project-facts .case-tags{flex-direction:row;gap:6px 13px;margin-top:18px;font-size:9px}
 .case-project-facts .case-scroll-cue{display:none}
 .case-lead-media{width:calc(100% - 22px);align-self:flex-end}
 .case-project-tsingtong-vi .case-lead-media{padding-right:22px}
 .case-lead-media .case-video{margin:0}
 .case-lead-media .case-mobile-board{padding:28px 22px}
 .case-lead-media .case-image-open{display:none}
 .case-story-intro{width:auto;margin:56px 22px 38px}
 .case-page-v3 .case-opening-copy{display:block}
 .case-page-v3 .case-opening-copy>*{font-size:18px;padding-left:16px;margin-top:22px;line-height:1.7}
 .case-page-v3 .case-opening-copy>*:only-child{font-size:20px}
 .case-page-v3 .case-content-stream>:where(.case-figure,.case-responsive-art,.case-media-pair,.case-video){width:calc(100% - 44px);margin:0 auto 24px}
 .case-page-v3 .case-content-stream>.case-figure:nth-of-type(3n+2){width:100%}
 .case-page-v3 .case-media-pair{gap:12px}
 .case-page-v3 .case-editorial,.case-page-v3 .case-context,.case-page-v3 .case-text-pair,.case-page-v3 .case-chapter-copy,.case-page-v3 .case-next{width:calc(100% - 44px)}
 .case-page-v3 .case-editorial,.case-page-v3 .case-context{padding:37px 0}
 .case-page-v3 .case-editorial-body p,.case-page-v3 .case-text-pair .case-editorial-body p{font-size:14px}
 .case-page-v3 .case-text-pair{margin-bottom:16px}
 .case-page-v3 .case-text-pair>.case-editorial{padding:18px 0 28px}
 .case-page-v3 .case-chapter-copy{padding:34px 0}
 .case-page-v3 .case-chapter-copy>div{display:block}
 .case-page-v3 .case-chapter-copy .case-kicker{margin-bottom:14px}
 .case-page-v3 .case-chapter-copy h2{font-size:29px;margin-bottom:20px}
 .case-page-v3 .case-chapter-copy p{font-size:14px}
 .case-page-v3 .case-brand-chapter{margin-bottom:28px}
 .case-page-v3 .case-brand-chapter:nth-child(even) .case-chapter-stage>.case-figure{width:100%}
 .case-page-v3 .case-chapter-supplement,.case-page-v3 .case-points-grid,.case-page-v3 .case-billboards,.case-page-v3 .case-content-stream>.case-concept,.case-page-v3 .case-prototype{width:calc(100% - 44px)}
 .case-page-v3 .case-chapter-supplement{padding:22px 0}
 .case-page-v3 .case-context h2,.case-page-v3 .case-section-intro h2{font-size:29px}
 .case-page-v3 .case-long-strip{width:100%;margin:0 0 35px}
 .case-page-v3 .case-mobile-story{margin:0 22px}
 .case-page-v3 .case-next{margin-top:50px;gap:25px}
 .case-page-v3 .case-next>a{font-size:15px}
 .case-related{padding:60px 22px 45px}
 .case-related-heading{margin-bottom:29px}.case-related-heading>span{font-size:8px}
 .case-related-track{display:flex;overflow-x:auto;gap:18px;scroll-snap-type:x mandatory;padding-bottom:15px}
 .case-related-card{flex:0 0 86%;scroll-snap-align:start}.case-related-card p{font-size:17px}
 .case-back-list{margin-top:32px}
 .case-page-v3 .case-closing{padding:70px 22px}
 .case-page-v3 .case-closing h2{font-size:34px}
 .case-page-v3 .case-footer{padding:22px;font-size:9px}
}
@media(prefers-reduced-motion:reduce){.case-page-v3 *, .case-page-v3 *::before,.case-page-v3 *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* All chapter copy uses the same two-column rhythm, including the nested hero copy. */
.case-page-v3 .case-chapter-copy{display:grid;grid-template-columns:.9fr 1.1fr;column-gap:12%;align-items:start}
.case-page-v3 .case-chapter-copy>div{display:contents}
.case-page-v3 .case-chapter-copy [aria-hidden="true"]{display:none}
@media(max-width:767px){.case-page-v3 .case-chapter-copy{display:block}.case-page-v3 .case-chapter-copy>div{display:block}}
/* The closing project index mirrors the reference's typographic browsing rhythm. */
@media(min-width:768px){
 .case-related{background:#fff;color:#15231b;padding:105px var(--case-gutter) 90px;overflow:visible}
 .case-related-heading{display:block;text-align:center;margin-bottom:35px}
 .case-related-heading h2{font-size:12px;font-weight:550;letter-spacing:.09em}
 .case-related-heading>span{display:none}
 .case-related-track{display:block;position:relative}
 .case-related-card{position:relative;display:block;padding:8px 0;text-align:center;color:#919b93!important}
 .case-related-card p{position:relative;z-index:2;display:block;margin:0;font-size:clamp(30px,3.7vw,60px);font-weight:400;letter-spacing:-.04em;line-height:1.4;transition:color .3s,transform .5s}
 .case-related-card p>span{display:inline-block;font-size:.6em;vertical-align:.15em}
 .case-related-card small{position:relative;z-index:2;display:block;margin-top:3px;font-size:9px;transition:color .3s}
 .case-related-image{position:absolute;z-index:1;left:50%;top:50%;width:clamp(240px,25vw,430px);height:auto;aspect-ratio:1.5;opacity:0;pointer-events:none;transform:translate(-50%,-50%) scale(.85) rotate(-4deg);transition:opacity .3s,transform .5s cubic-bezier(.2,.7,.2,1)}
 .case-related-image>span{display:none}
 .case-related-card:hover .case-related-image,.case-related-card:focus-visible .case-related-image{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-4deg)}
 .case-related-card:hover p,.case-related-card:focus-visible p{color:#15231b;transform:translateX(12px);text-shadow:0 1px 16px #ffffffcf}
 .case-related-card:hover small,.case-related-card:focus-visible small{color:#15231b}
 .case-back-list{border-color:#788779;margin-top:52px}
}
@media(max-width:767px){.case-page-v3 .case-mobile-story>.case-figure{margin-inline:-22px}}

/* Qingke: edited project story, with upright source artwork and readable proof boards. */
.case-project-qingke .qk-identity-cover{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;aspect-ratio:16/10;background:#0e0e10;color:#f5f5f3;overflow:hidden;padding:9%;border-bottom:2px solid #27cad5}
.case-project-qingke .qk-identity-cover>img{width:63%;height:auto;max-height:70%;object-fit:contain}
.qk-board-label,.qk-board-foot{font-size:10px;line-height:1.6;letter-spacing:.05em;color:#a5abab}
.qk-board-label{position:absolute;left:7%;top:8%}
.qk-board-foot{position:absolute;bottom:8%;left:7%;right:7%;display:flex;justify-content:space-between;gap:20px}
.qk-board-foot>span:last-child{color:#27cad5}
.case-project-qingke .case-story-intro{margin-bottom:15px}
.case-project-qingke .case-content-stream>.case-figure{width:78%;max-width:1600px;margin:0 auto 42px}
.case-project-qingke .case-content-stream>.case-figure:nth-of-type(4){width:100%;max-width:none}
.case-project-qingke .case-content-stream>.case-figure:nth-of-type(4) figcaption{width:78%;margin-inline:auto}
.case-project-qingke .case-editorial{padding:72px 0 45px}
.case-project-qingke .case-artboard{width:78%;max-width:1600px;margin:0 auto 65px}
.qk-logo-grid{display:grid;grid-template-columns:1fr 1fr;gap:0}
.qk-logo-grid figure{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12% 10% 6%;aspect-ratio:1.3}
.qk-logo-light{background:#f1f2f2;color:#161719}
.qk-logo-dark{background:#0e0e10;color:#f4f5f5}
.qk-logo-grid img{width:73%;height:auto;margin-block:auto}
.qk-logo-grid figcaption{display:flex;justify-content:space-between;width:100%;font-size:10px;line-height:1.6;margin-top:12%;gap:10px}
.qk-logo-grid figcaption>span:last-child{font-size:8px;letter-spacing:.07em;opacity:.55}
.qk-mark-row{display:grid;grid-template-columns:30% 1fr;gap:12%;align-items:center;border-bottom:1px solid #d6dada;padding:45px 9%}
.qk-mark-row>img{width:100%;max-width:132px;max-height:150px;object-fit:contain;justify-self:center}
.qk-mark-row h3{font-size:21px;line-height:1.5;font-weight:500;margin-bottom:12px}
.qk-mark-row p{font-size:14px;line-height:1.9;color:#56605c;max-width:460px}
.qk-palette-board{display:grid;grid-template-columns:2.2fr 1.35fr 1fr 1fr;border:1px solid #d9dcdd}
.qk-palette-board>div{min-height:285px;padding:28px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.qk-palette-board span{font-size:9px;letter-spacing:.05em;opacity:.7}
.qk-palette-board strong{font-size:23px;font-weight:450;margin-top:auto;line-height:1.5}
.qk-palette-board small{font-size:10px;letter-spacing:.06em}
.qk-color-black{background:#0e0e10;color:white}.qk-color-cyan{background:#27cad5;color:#0e0e10}.qk-color-gray{background:#a3a3a2;color:#0e0e10}.qk-color-white{background:#fff;color:#0e0e10}
@media(max-width:1000px){.qk-palette-board>div{min-height:215px;padding:20px}.qk-palette-board strong{font-size:19px}}
@media(max-width:767px){
 .case-project-qingke .qk-identity-cover{aspect-ratio:1.2}.case-project-qingke .qk-identity-cover>img{width:72%}.qk-board-label,.qk-board-foot{font-size:8px}.qk-board-foot{flex-direction:column;gap:2px}
 .case-project-qingke .case-editorial{padding:38px 0 26px}
 .case-project-qingke .case-content-stream>.case-figure,.case-project-qingke .case-artboard{width:calc(100% - 40px);margin-bottom:25px}.case-project-qingke .case-content-stream>.case-figure:nth-of-type(4){width:100%}.case-project-qingke .case-content-stream>.case-figure:nth-of-type(4) figcaption{width:calc(100% - 40px)}
 .qk-logo-grid{grid-template-columns:1fr}.qk-logo-grid figure{aspect-ratio:1.6;padding:9%}.qk-logo-grid img{width:63%;max-height:145px}.qk-logo-grid figcaption{margin-top:8%}.qk-mark-row{grid-template-columns:75px 1fr;gap:22px;padding:25px 5%}.qk-mark-row h3{font-size:17px}.qk-mark-row p{font-size:12px}.qk-mark-row>img{max-height:88px}
 .qk-palette-board{grid-template-columns:1fr 1fr}.qk-palette-board>div{min-height:180px;padding:20px}.qk-palette-board strong{font-size:21px}
}
@media(min-width:768px){
 .case-project-qingke .case-opening{padding-top:148px}
 .case-project-qingke .case-opening h1{margin-bottom:58px}
 .case-project-qingke .qk-identity-cover{aspect-ratio:2}
}

/* Curated case stories: original artwork stays intact; long documentation is optional. */
.case-page-v3 .story-study-plate{width:78%;max-width:1100px;margin:0 auto 55px}
.story-study-crop{aspect-ratio:1440/1485;overflow:hidden;background:#fff}
.story-study-crop>img{display:block;width:100%;height:auto}
.story-plate-caption{font-size:11px;line-height:1.6;margin-top:12px;color:var(--case-muted)}
.case-page-v3 .story-original{width:78%;max-width:1200px;margin:65px auto;border-top:1px solid #bac2bc;border-bottom:1px solid #bac2bc}
.story-original>summary{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:25px 0;cursor:pointer;font-size:16px;line-height:1.5;list-style:none}
.story-original>summary::-webkit-details-marker{display:none}
.story-original>summary::after{content:'＋';font-size:22px;font-weight:400}
.story-original[open]>summary::after{content:'−'}
.story-original>summary:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.case-page-v3 .story-original>.case-long-strip{width:100%;max-width:none;margin:0}
.case-page-v3 .case-concept>p:only-child{grid-column:1/-1}
@media(max-width:767px){
 .case-page-v3 .story-study-plate,.case-page-v3 .story-original{width:calc(100% - 44px);margin:35px auto}
 .story-plate-caption{font-size:10px}
 .story-original>summary{font-size:14px;padding:20px 0}
 .case-page-v3 .case-content-stream>.story-phone-figure{width:calc(100% - 44px);max-width:350px}
 .story-phone-figure .case-image-link{padding:30px;background:#ebe8f0}
 .story-phone-figure picture{max-width:260px;margin:auto}
 .story-phone-figure picture>img{border-radius:20px}
.case-page-v3 .case-media-pair{grid-template-columns:1fr;gap:24px}
}

/* Project-specific stories: scale follows the artwork's role, not its index. */
.case-page-v3:not(.case-project-qingke) .case-content-stream>.case-figure{width:78%;max-width:1600px}
.case-page-v3:not(.case-project-qingke) .case-content-stream>.story-wide{width:100%;max-width:none}
.case-page-v3:not(.case-project-qingke) .case-content-stream>.story-contained{width:62%;max-width:1150px}
.case-page-v3.case-project-tsingtong-vi .case-content-stream>.story-original-overview{max-width:1200px}
.case-content-stream>.story-wide>figcaption{width:78%;margin:12px auto 0}
.case-page-v3:not(.case-project-qingke) .case-artboard{width:78%;max-width:1600px;margin:0 auto 64px}
.story-board-head{display:flex;justify-content:space-between;align-items:start;gap:36px;margin-bottom:56px}
.story-board-head>span{font-size:11px;letter-spacing:.1em;line-height:1.8}
.story-board-head h2{font-size:clamp(25px,2.5vw,42px);font-weight:550;line-height:1.35;margin:0}
.story-ai-path{background:#0b0b0d;color:#fff;padding:5.5%}
.story-reading-steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:36px;padding:0;margin:0;counter-reset:reading}
.story-reading-steps li{border-top:1px solid #5e5e64;padding-top:26px;counter-increment:reading}
.story-reading-steps li::before{content:'0' counter(reading);display:block;color:#ff3b68;font-size:48px;line-height:1;margin-bottom:30px;font-variant-numeric:tabular-nums}
.story-reading-steps span{font-size:10px;letter-spacing:.12em;color:#b6b6be}
.story-reading-steps h3{font-size:19px;font-weight:500;margin:14px 0 12px}
.story-reading-steps p{font-size:13px;line-height:1.85;color:#b6b6be;margin:0}
.story-ai-language{display:grid;grid-template-columns:1.2fr 1fr;background:#eeeef2;color:#121216}
.story-language-type,.story-language-color{padding:12% 10%}
.story-ai-language span{font-size:10px;letter-spacing:.12em}
.story-type-headline{font-size:clamp(26px,3.2vw,50px);font-weight:650;line-height:1.3;margin:50px 0 20px}
.story-type-detail{font-size:20px;margin:0 0 30px}
.story-type-meta{font-size:12px;color:#727279}
.story-language-color{background:#fff}
.story-focus-sample{background:#fc3265;color:#fff;border-radius:100px;padding:20px 24px;margin:62px 0 24px;font-size:14px;text-align:center}
.story-language-color>p{font-size:13px;line-height:1.8;color:#5a5a63}
.story-procurement{background:#0a1b23;color:#f0f5f4;padding:5%}
.story-route{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);padding:0;margin:0;border-top:1px solid #5e737d}
.story-route li{position:relative;padding:32px 20px 0 0}
.story-route li:not(:last-child)::after{content:'→';position:absolute;right:12px;top:29px;color:#8fc0b2}
.story-route span{font-size:10px;letter-spacing:.06em;color:#8fc0b2}
.story-route h3{font-size:18px;margin:24px 0 12px;font-weight:500}
.story-route p{font-size:12px;line-height:1.8;color:#b0c2c5}
.case-project-tsingtong-concept .case-prototype{display:block;width:62%;max-width:1060px;padding:45px 0 70px}
.story-sesame-index{padding:4% 0 0;color:#233e2d}
.story-sesame-index .story-board-head{margin-bottom:35px}
.story-document-links{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #bbc6ba;border-bottom:1px solid #bbc6ba}
.story-document-links a{display:block;padding:25px 12px 25px 0;text-decoration:none;transition:color .2s}
.story-document-links a:hover{color:#a71924}
.story-document-links span{display:block;font-size:18px;margin-bottom:8px}
.story-document-links small{font-size:11px}
.story-document-links a:focus-visible{outline:2px solid #a71924;outline-offset:3px}
.story-sesame-document img[id]{scroll-margin-top:85px}
.story-board-sequence{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.story-board-sequence li{min-width:0}
.story-board-index{display:block;font-size:10px;letter-spacing:.08em;line-height:1.6}
.story-board-sequence strong{display:block;font-size:21px;font-weight:500;line-height:1.4;margin:22px 0 15px}
.story-board-sequence p{font-size:13px;line-height:1.85;margin:0;opacity:.8}
.story-identity-board{background:#143d74;color:#fff;padding:5%}
.story-identity-board .story-board-sequence{border-top:1px solid #7092bc;padding-top:30px}
.story-identity-board .story-board-index{color:#b6dccc}
.story-system-board{padding:5%;color:#401471;background:#f0e8f8}
.story-system-board .story-board-sequence{grid-template-columns:1fr 1fr;gap:0;border-top:1px solid #c4aad9}
.story-system-board .story-board-sequence li{padding:32px 28px 32px 0;border-bottom:1px solid #c4aad9}
.story-system-board .story-board-sequence li:nth-child(even){padding-left:32px;border-left:1px solid #c4aad9}
.story-system-board .story-board-sequence strong{font-size:clamp(25px,3vw,42px);margin-top:24px}
.story-opening-board{padding:5%;background:#e1ebe6;color:#264c40}
.story-opening-board .story-board-sequence{gap:24px}
.story-opening-board .story-board-sequence li{padding-top:25px;border-top:2px solid #648c78}
.story-opening-board .story-board-index{color:#426b59}
.story-ankole-system{color:#eee8d8;background:#183d37;padding:5%}
.story-ankole-system-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0}
.story-ankole-system-cell{padding:32px 25px;background:#224d44}
.story-ankole-system-cell:nth-child(2){background:#b54d36;color:#fff6e9}
.story-ankole-system-cell:nth-child(3){background:#e7e4d5;color:#22483e}
.story-ankole-system-cell>span{font-size:10px;letter-spacing:.08em}
.story-ankole-system-cell h3{font-size:clamp(23px,2.1vw,34px);line-height:1.4;font-weight:500;margin:55px 0 26px}
.story-ankole-system-cell p{font-size:13px;line-height:1.85;margin:0}
@media(max-width:1000px){
 .story-route{grid-template-columns:1fr 1fr;gap:25px}.story-route li:nth-child(2)::after{display:none}
 .story-reading-steps{gap:22px}.story-reading-steps h3{font-size:17px}
 .story-board-sequence{grid-template-columns:1fr 1fr;gap:30px}
}
@media(max-width:767px){
 .case-page-v3:not(.case-project-qingke) .case-content-stream>.case-figure,.case-page-v3:not(.case-project-qingke) .case-content-stream>.story-contained,.case-page-v3:not(.case-project-qingke) .case-artboard{width:calc(100% - 44px);margin-bottom:30px}
 .case-page-v3:not(.case-project-qingke) .case-content-stream>.story-wide{width:100%}
 .case-content-stream>.story-wide>figcaption{width:calc(100% - 44px)}
 .story-board-head{display:block;margin-bottom:32px}.story-board-head h2{margin-top:18px;font-size:25px}
 .story-ai-path,.story-procurement{padding:30px 24px}
 .story-reading-steps{grid-template-columns:1fr;gap:26px}.story-reading-steps li{padding-top:22px}.story-reading-steps li::before{font-size:32px;margin-bottom:18px}
 .story-ai-language{grid-template-columns:1fr}.story-language-type,.story-language-color{padding:30px 24px}
 .story-type-headline{margin-top:36px}.story-focus-sample{margin-top:35px;padding:16px 10px;font-size:12px}
 .story-route{grid-template-columns:1fr;gap:5px}.story-route li{border-bottom:1px solid #33464e;padding:22px 0}.story-route li::after{display:none}.story-route h3{margin-top:16px}
 .story-document-links{grid-template-columns:1fr 1fr}.story-document-links a{padding:18px 10px 18px 0}.story-document-links span{font-size:16px}.story-document-links small{font-size:10px}
 .case-project-tsingtong-concept .case-prototype{width:calc(100% - 44px);padding:24px 0 45px}
 .story-identity-board,.story-system-board,.story-opening-board,.story-ankole-system{padding:30px 24px}
 .story-board-sequence,.story-system-board .story-board-sequence{grid-template-columns:1fr;gap:26px}
 .story-board-sequence strong{font-size:21px;margin:16px 0 10px}
 .story-system-board .story-board-sequence{gap:0}.story-system-board .story-board-sequence li,.story-system-board .story-board-sequence li:nth-child(even){padding:24px 0;border-left:0}
 .story-system-board .story-board-sequence strong{font-size:28px}
 .story-ankole-system-grid{grid-template-columns:1fr}.story-ankole-system-cell{padding:26px 22px}.story-ankole-system-cell h3{margin:32px 0 18px}
}