.immersive-home{--accent:#8a5038}.immersive-home .immersive-hero{display:block;position:relative;isolation:isolate;overflow:hidden;padding:0;min-height:730px;height:calc(100svh - 86px);max-height:1100px;background:#222;color:#fff}.hero-scenes,.hero-shade{position:absolute;inset:0;z-index:-1}.hero-scene{position:absolute;inset:0;width:100%;height:100%;opacity:0;object-fit:cover;transform:scale(1.04);transition:opacity 1s ease,transform 5s ease}.hero-scene.is-active{opacity:1;transform:scale(1)}.hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.64),rgba(0,0,0,.06)),linear-gradient(0deg,rgba(0,0,0,.65),transparent 45%)}.immersive-copy{padding:9vh 5vw 150px;max-width:1150px}.immersive-copy .eyebrow{color:#eee;font-size:11px;letter-spacing:.2em}.immersive-home .immersive-copy h1{font-size:clamp(55px,7.7vw,120px);line-height:1.04;letter-spacing:-.055em;color:#fff;max-width:100%;font-weight:500}.immersive-home .hero-desc{color:#efefeb;max-width:46ch;font-size:17px;line-height:1.8;margin-top:30px}.hero-explore{display:inline-flex;align-items:center;gap:55px;border-bottom:1px solid #ffffff80;padding:12px 0;margin-top:24px;font-size:14px}.hero-explore span{transition:transform .3s}.hero-explore:hover span{transform:translateY(6px)}.scene-controls{position:absolute;bottom:35px;left:5vw;right:5vw;display:flex;gap:26px;align-items:center}.scene-button{background:none;color:#fff9;border:0;border-top:1px solid #fff5;text-align:left;padding:16px 0;cursor:pointer;flex:1;font-size:11px;letter-spacing:.06em;transition:color .3s,border-color .3s}.scene-button span{display:block;margin-bottom:5px;font-size:10px}.scene-button.is-active,.scene-button:hover{color:white;border-color:white}.scene-project{font-size:12px;padding-left:20px}.emotional-intro{padding-block:110px;display:grid;grid-template-columns:1fr 2fr;gap:25px 7vw;border-bottom:1px solid var(--line)}.emotional-intro h2{font-size:clamp(36px,4.5vw,68px);line-height:1.18}.emotional-intro h2 span{color:var(--accent)}.emotional-intro>p:last-child{grid-column:2;max-width:47ch;font-size:17px}.immersive-home .project-image img{transition:transform 1.2s cubic-bezier(.2,.65,.3,1)}.immersive-home .project:hover img{transform:scale(1.055)}.immersive-home .circle{transition:transform .4s,background .4s}.immersive-home .project:hover .circle{transform:rotate(45deg);background:#e7dfd3}.motion-ready .home-reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}.motion-ready .home-reveal.in-view{opacity:1;transform:none}.immersive-home .challenges{background:#242620;color:white}.immersive-home .challenges p{color:#c3c5bd}.immersive-home .challenges .number{color:#c6a28c}.immersive-home .challenges article{transition:transform .35s}.immersive-home .challenges article:hover{transform:translateY(-8px)}
@media(max-width:800px){.immersive-home .immersive-hero{height:calc(100svh - 70px);min-height:650px}.immersive-copy{padding:65px 6vw 175px}.immersive-home .immersive-copy h1{font-size:clamp(44px,9vw,70px);line-height:1.12}.immersive-home .hero-desc{font-size:15px;max-width:30ch}.scene-controls{left:6vw;right:6vw;gap:15px;bottom:25px;flex-wrap:wrap}.scene-button{font-size:9px;min-width:25%;padding-top:10px}.scene-project{padding-left:0;width:100%}.hero-shade{background:linear-gradient(90deg,#0009,#0003),linear-gradient(0deg,#0009,transparent)}.emotional-intro{padding-block:60px;grid-template-columns:1fr;gap:18px}.emotional-intro>p:last-child{grid-column:1;font-size:15px}.emotional-intro .eyebrow{margin-bottom:5px}}
@media(prefers-reduced-motion:reduce){.hero-scene,.motion-ready .home-reveal,.immersive-home .project-image img{transition:none;transform:none}.motion-ready .home-reveal{opacity:1}}
.immersive-home .immersive-copy h1 br{display:block}.immersive-home .immersive-copy h1{max-width:13ch}html[lang="zh-CN"] .immersive-home .immersive-copy h1{max-width:11ch;line-height:1.2}

/* Four-scene opening: the brand proposition precedes the project stories. */
.immersive-home .is-concept .immersive-copy{max-width:none;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:50px 5vw 150px;box-sizing:border-box}
.immersive-home .is-concept .immersive-copy h1{max-width:19ch;font-size:clamp(48px,6.4vw,102px);line-height:1.08;letter-spacing:-.045em;margin:20px 0}
html[lang="zh-CN"] .immersive-home .is-concept .immersive-copy h1{max-width:15ch;font-size:clamp(40px,5.6vw,88px);line-height:1.3;letter-spacing:-.025em}
.immersive-home .is-concept .hero-desc{max-width:48ch;margin-top:12px;text-wrap:balance}
.is-concept .hero-shade{background:linear-gradient(0deg,rgba(0,0,0,.7),rgba(0,0,0,.12) 45%,rgba(0,0,0,.2))}
.is-concept .hero-explore{margin-top:16px}
.scene-button{min-width:0}
@media(max-width:800px){
.scene-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.scene-button{min-width:0;font-size:8px;letter-spacing:0;line-height:1.6}
.scene-project{grid-column:1/-1;text-align:right;font-size:11px}
.immersive-home .is-concept .immersive-copy{padding:35px 6vw 155px}
.immersive-home .is-concept .immersive-copy h1{font-size:clamp(36px,7.8vw,62px)}
html[lang="zh-CN"] .immersive-home .is-concept .immersive-copy h1{font-size:clamp(29px,6.5vw,52px)}
.immersive-home .is-concept .hero-desc{font-size:14px;max-width:29ch}
}
html[lang="zh-CN"] .immersive-home .is-concept .immersive-copy h1{max-width:none;width:100%;word-break:keep-all}

.hero-video-toggle{position:absolute;right:5vw;top:25px;border:1px solid #ffffff70;border-radius:50%;width:38px;height:38px;background:#0003;color:white;cursor:pointer;font-size:13px;z-index:2}.hero-video-toggle[hidden]{display:none}
/* Center the core philosophy as one unified statement. */
.immersive-home .emotional-intro{display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px}
.immersive-home .emotional-intro .eyebrow{margin:0}
.immersive-home .emotional-intro h2{max-width:1100px;margin:0;text-wrap:balance}
.immersive-home .emotional-intro>p:last-child{max-width:64ch;margin:0;text-wrap:balance}
@media(max-width:800px){.immersive-home .emotional-intro{gap:20px}.immersive-home .emotional-intro h2{font-size:clamp(30px,6vw,48px)}}
/* Separate the business challenges from the dark framework chapter. */
.immersive-home .challenges{background:#e9e7e0;color:#242620;border-top:1px solid #d6d3c9;border-bottom:1px solid #d6d3c9}
.immersive-home .challenges h2,.immersive-home .challenges h3{color:#242620}
.immersive-home .challenges p{color:#64665e}
.immersive-home .challenges .number{color:#8a5038}
.immersive-home .challenges .three article{border-color:#b8b9ad}
/* Stable four-column switcher; project links belong with the story. */
.immersive-home .scene-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;align-items:start}
.immersive-home .scene-button{width:100%;min-width:0;min-height:64px;margin:0}
.hero-project-link{display:inline-block;width:max-content;margin-top:25px;padding-bottom:8px;border-bottom:1px solid #ffffff80;font-size:16px;color:white}
.hero-project-link[hidden]{display:none}
@media(max-width:800px){.immersive-home .scene-controls{gap:12px}.immersive-home .scene-button{min-height:65px}.hero-project-link{font-size:14px;margin-top:18px}}
.immersive-home .immersive-hero{overflow-anchor:none}
.immersive-home .immersive-hero .immersive-copy{position:absolute;inset:0;overflow-anchor:none}

/* Homepage invitation and footer form one continuous closing section. */
.immersive-home .footer-invitation{width:100%;max-width:none;margin:0;padding:30px 0 70px;border:0;border-bottom:1px solid #ffffff26}
.immersive-home .footer-invitation .eyebrow{color:#c0c4b8}
.immersive-home .footer-invitation h2{color:#f6f5f1}
.immersive-home .footer-invitation .button{background:#f6f5f1;color:#242620;right:0;bottom:80px}
.immersive-home .footer-top{padding-top:48px}
@media(max-width:800px){.immersive-home .footer-invitation{padding:10px 0 40px}.immersive-home .footer-invitation .button{position:static;margin-top:28px}.immersive-home .footer-top{padding-top:36px}}
