@font-face{font-family:CaseOPPO;src:url("/assets/selected-cases/opposans-cn.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
body{background:#222;color:#fff;font-family:CaseOPPO,"PingFang SC","Microsoft YaHei",sans-serif;font-weight:400}.case-subnav{background:#222;border-color:#555;color:#fff;padding:24px max(20px,calc((100vw - 1100px)/2));font-size:14px}.story-hero{max-width:1100px;padding:70px 0 60px}.story-hero h1{font-family:inherit;font-size:44px;font-weight:400;line-height:1.3}.story-hero .story-title{font-size:28px;font-weight:400;line-height:1.5;color:#fff;max-width:900px}.story-hero .story-context{font-size:16px;line-height:1.65;color:#bdbdbd;max-width:760px}.eyebrow{color:#bdbdbd;letter-spacing:0}
.case-social{width:calc(100% - 40px);max-width:1100px;margin:0 auto;grid-template-columns:61.363636% 38.636364%;border:0;border-radius:28px;background:#1d1d1f;align-items:stretch}.social-gallery{position:relative}.social-slides{aspect-ratio:3/4}.gallery-controls{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);width:max-content;max-width:94%;gap:16px;padding:8px 14px;border:0;border-radius:40px;background:#111d;color:white;z-index:2}.gallery-controls button{color:white;padding:7px;font-size:12px}.gallery-controls button:disabled{opacity:.4}.social-notes{border:0}.social-author{height:88px;padding:20px 36px;border-color:#ffffff1a;gap:12px}.social-author img{width:42px;height:42px;background:white;border-radius:50%;padding:4px}.social-author b{font-size:16px;font-weight:400}.social-author small{color:#aaa;font-size:11px}.social-author>a{background:#f00;font-size:14px;padding:8px 18px}.social-notes-body{top:88px;bottom:0;padding:28px 38px 40px 36px;scrollbar-width:thin;scrollbar-color:#3f3f3f transparent}.social-notes-body h2{font-size:22px;font-weight:400;line-height:1.5;margin:0 0 27px}.social-notes-body h3{font-size:18px;font-weight:400;line-height:1.5;margin:30px 0 6px}.social-notes-body p{font-size:16px;font-weight:400;line-height:1.65;color:#b8b8b9;margin:0 0 10px}.social-notes-body b,.social-notes-body strong{font-weight:400;color:white}
.case-article{width:calc(100% - 40px);max-width:1100px;margin:110px auto 0}.story-section{margin:0 0 80px;scroll-margin-top:100px}.story-section h2{font-size:24px;line-height:1.5;font-weight:400;margin:0 0 17px}.story-section .chapter-kicker{font-size:14px;color:#aaa;margin:0 0 10px;letter-spacing:0}.story-section p,.detail-copy p{font-size:16px;line-height:1.65;color:#b8b8b9;max-width:none;margin:0 0 14px}.story-section>p:not(.chapter-kicker){max-width:none}.story-section figure{margin:28px 0 0}.detail-copy{max-width:none;margin-top:30px}.detail-copy h3{font-weight:400;font-size:20px;line-height:1.5;margin:30px 0 14px}.image-button,.static-viewport{border:0;border-radius:14px}.browser-bar{background:#303030;color:#bbb;border-color:#444}.demo-viewport{border-color:#444}.demo-controls{color:#bbb}.demo-controls button,.mobile-enlarge{background:#292929;color:#ddd;border-color:#555}.demo-controls button:hover{background:#444}.phone-pair figcaption,figcaption{color:#bbb}.page-navigation{border-color:#444}.page-navigation small{color:#aaa}.next-step{background:#1d1d1f;color:white;margin-top:100px}.next-step h2{font-weight:400}.next-step a{background:#f00}.next-step p{color:#bbb}footer{max-width:1100px;color:#aaa}.project-cover,.cover{color:#29232d}.project-cover-title h2,.cover-heading h2{font-family:CaseOPPO,sans-serif}.booking-sequence{border-color:#444}.sequence-controls{background:#1d1d1f}.sequence-controls button{background:#333;color:#ddd}.sequence-controls button[aria-pressed=true]{background:#eee;color:#222}
@media(min-width:1600px){.case-social,.case-article,.story-hero,footer{max-width:1320px}.social-notes-body{padding:30px 51px 50px 49px}.social-author{padding-left:47px;padding-right:41px;height:104px}.social-notes-body{top:104px}.social-notes-body h3{margin-top:35px}.social-notes-body p,.story-section p{font-size:18px}.social-notes-body h3{font-size:20px}.story-section h2{font-size:28px}}
@media(max-width:1100px) and (min-width:701px){.social-author{padding:18px}.social-author>a{padding:8px 12px}.social-notes-body{padding:24px}.social-notes-body p{font-size:15px}.social-notes-body h2{font-size:20px}}
@media(max-width:700px){.case-subnav{padding:16px 20px}.story-hero{width:calc(100% - 40px);padding:36px 0 32px}.story-hero h1{font-size:30px}.story-hero .story-title{font-size:22px}.story-hero .story-context{font-size:14px;line-height:1.65}.case-social{display:block;border-radius:12px}.social-slides{aspect-ratio:3/4}.gallery-controls{bottom:12px;padding:5px 12px}.social-author{height:96px;padding:24px 16px}.social-author b{font-size:15px}.social-author>a{font-size:14px}.social-notes-body{position:static;max-height:none;overflow:visible;padding:24px 16px 28px}.social-notes-body h2{font-size:20px;line-height:1.5;margin-bottom:22px}.social-notes-body h3{font-size:16px;line-height:1.5;margin:24px 0 6px}.social-notes-body p{font-size:14px;line-height:1.65;margin-bottom:10px}.case-article{margin:60px auto 0}.story-section{margin-bottom:48px}.story-section h2{font-size:20px;line-height:1.5;margin-bottom:14px}.story-section p,.detail-copy p{font-size:14px;line-height:1.65}.story-section .chapter-kicker{font-size:12px}.detail-copy h3{font-size:18px}.story-section figure{margin-top:24px}.next-step{margin-top:60px}.next-step h2{font-size:24px}footer{margin:0 20px}.phone-pair{gap:18px}}

.site-header{background:#222;color:white;border-color:#555;max-width:1100px;margin:auto}.site-header a{color:white}.site-header img{background:white;border-radius:50%;padding:4px}.case-subnav{padding:0;background:#222;border-color:#555}.case-subnav>.container{width:calc(100% - 40px);max-width:1100px;margin:auto}.container{max-width:1100px}.case-social.container{width:calc(100% - 40px);max-width:1100px}.social-author strong{font-weight:400}.social-author span{color:#aaa}.social-notes-body b{color:white}.project-story-summary,.project-tags{color:#b8b8b9}.case-article .story-section{margin-bottom:80px}.story-section h2,.feature-copy h2{font-size:24px;font-weight:400;line-height:1.5}.story-section p,.feature-copy p{font-size:16px;line-height:1.65;color:#b8b8b9}.supporting-views img{border-radius:14px}.next-step{border-color:#444}.next-step p{color:#bbb}.next-step button{color:white;border-color:#777}.next-step .contact{background:#f00;color:white}.hrh-mobile{display:flex;justify-content:center;align-items:start;gap:30px}.hrh-mobile img{width:100%;border-radius:22px}.hrh-mobile figure{width:300px;max-width:45%;margin:0}@media(max-width:700px){.site-header{padding:16px 20px}.site-header nav{gap:14px}.case-social.container{width:calc(100% - 40px)}.story-section h2,.feature-copy h2{font-size:20px}.story-section p,.feature-copy p{font-size:14px;line-height:1.65}.social-notes-body{max-height:none;overflow:visible}.case-article .story-section{margin-bottom:48px}.project-story-summary{font-size:14px;line-height:1.65}.hrh-mobile{gap:16px}.hrh-mobile img{border-radius:12px}}