/* Existing official landing navigation and typography, scoped to review prototypes. */
body.homepage{--nav-h:0px}
.homepage .site-nav,.site-nav.official-nav{position:fixed;top:1.4rem;left:50%;transform:translateX(-50%);display:grid;grid-template-columns:auto 1fr auto;align-items:center;width:min(78vw,64rem);height:auto;min-height:3.25rem;padding:.4rem .45rem .4rem .85rem;background:rgba(248,247,243,.8);color:#0a0b0b;border:0;border-radius:1.1rem;box-shadow:inset 0 1px 0 #ffffffe0,0 1.2rem 3.8rem #413a2e1a;backdrop-filter:blur(22px);z-index:30;transition:background .6s,color .6s,box-shadow .6s}
.official-nav .brand{font-size:1.05rem;gap:.65rem;letter-spacing:-.03em}
.official-nav .brand img{width:30px;height:30px}
.official-nav nav{display:flex;justify-content:center;gap:clamp(1.2rem,3vw,3.5rem);font-size:.83rem;color:#0a0b0b8c}
.official-nav nav a.current::after{content:"";display:block;width:1rem;height:1px;margin:.32rem auto 0;background:currentColor;opacity:.58}
.official-nav .nav-cta{font-size:.82rem;padding:.6rem 1.15rem;border-color:#0a0b0b38}
.official-nav.is-on-dark{color:#f3efe6;background:rgba(15,16,16,.72);box-shadow:inset 0 1px 0 #ffffff14,0 1.2rem 3.8rem #00000029}
.official-nav.is-on-dark nav{color:#f3efe6ad}
.official-nav.is-on-dark .nav-cta{border-color:#f3efe652}
.detail-back{display:none}
.detail-deck .official-nav{grid-template-columns:auto auto 1fr auto}
.detail-deck .detail-back{display:block;margin-right:22px;padding-right:18px;border-right:1px solid #8885;font-size:12px;white-space:nowrap}
.nav-menu{display:none}
.homepage .screen-inner{max-height:calc(100% - 180px);margin-top:45px}
.homepage .screen-rail{right:clamp(.8rem,1.45vw,1.65rem);top:50%;transform:translateY(-50%);gap:.68rem;padding:.75rem .58rem;background:#f8f7f375;box-shadow:inset 0 1px 0 #ffffff85,0 .9rem 2.8rem #302b2214;border-radius:999px;backdrop-filter:blur(14px);color:#0a0b0b;z-index:31}
.homepage .screen-rail button{width:.42rem;height:.42rem;min-width:0;padding:0;display:block;position:relative}
.homepage .screen-rail i{display:block;width:.42rem;height:.42rem;border-radius:50%;background:#0a0b0b38;opacity:1;transition:background .5s,box-shadow .5s,transform .5s}
.homepage .screen-rail button[aria-current="true"] i{height:.42rem;background:#0a0b0b;box-shadow:0 0 0 .26rem #0a0b0b14;transform:scale(1.3)}
.homepage .screen-rail.is-on-dark{background:#0a0b0b57;box-shadow:inset 0 1px 0 #ffffff12,0 .9rem 2.8rem #0000001f}
.homepage .screen-rail.is-on-dark i{background:#f3efe640}
.homepage .screen-rail.is-on-dark button[aria-current="true"] i{background:#f3efe6;box-shadow:0 0 0 .26rem #f3efe617}
.homepage .rail-title{right:24px;top:-9px;border-radius:5px;background:#f8f7f3;color:#30362e}
.homepage .home-hero,.homepage .home-outro{background:#0a0b0b;color:#f3efe6}
.homepage .hero-inner{width:min(92vw,90rem);max-width:90rem;padding-top:4rem;margin:0;overflow:visible}
.homepage .hero-kicker{font-size:.69rem;letter-spacing:.26em;color:#667c67;font-weight:600;margin:0 0 1.35rem}
.homepage .home-hero .hero-word{font-family:"Segoe UI",sans-serif;font-size:clamp(5.2rem,14.5vw,14rem);font-weight:650;letter-spacing:-.075em;line-height:.8}
.homepage .home-hero .hero-copy .hero-en{font-size:clamp(1rem,1.3vw,1.3rem);color:#f3efe6b8;margin:clamp(2rem,5vh,3.4rem) auto 0;letter-spacing:.01em}
.homepage .home-hero .hero-copy .hero-cn{font-size:clamp(.92rem,1.05vw,1.08rem);max-width:48rem;color:#f3efe694;line-height:1.8;margin:.85rem auto 0}
.hero-actions{display:flex;align-items:center;justify-content:center;gap:1.5rem;margin-top:2.25rem}
.hero-actions .button{padding:6px 7px 6px 24px;border-radius:40px;font-size:13px;gap:20px}
.button-arrow{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#dedbd3}
.homepage .hero-scroll{border:none;color:#a4a6a2;font-size:14px}
.hero-index{position:absolute;bottom:32px;left:3.5%;right:3.5%;display:flex;justify-content:space-between;font-size:11px;color:#63655f}
.home-hero .screen-corner{display:none}
.home-hero .motion-replay{bottom:57px;left:3.5%;font-size:9px;opacity:.55}
.homepage .outro-inner{margin:0}
.homepage .detail-screen{background:#f2f0eb}
.homepage .detail-screen:nth-child(2n){background:#eae7df}
.homepage .detail-inner{width:min(calc(100% - 180px),1256px);padding:0;max-height:calc(100dvh - 185px);margin:40px 0 0;overflow:auto;border:none;min-height:0}
.homepage .detail-inner.role-hero{display:grid;grid-template-columns:1.07fr 1fr;gap:70px;align-items:center}
.detail-inner .role-intro h1{font-size:clamp(38px,4.1vw,64px)}
.detail-inner .role-art{margin:0}
.detail-inner .role-art>img{max-height:62vh;width:100%;object-fit:contain;mix-blend-mode:darken}
.detail-inner .role-art figcaption{font-size:11px}
.homepage .detail-inner.example-section{padding:0;background:none}
.homepage .detail-inner.handoff{display:grid;grid-template-columns:1fr 1fr;gap:70px}
.detail-inner .product-frame{margin:20px 0}
.detail-inner .product-frame img{width:100%;max-height:calc(100dvh - 300px);object-fit:contain}
.detail-inner .product-frame figcaption{padding-top:8px}
.detail-inner .capability-note{font-size:11px}
.detail-screen-label{position:absolute;left:5%;bottom:24px;color:#7e8277;font-size:10px;letter-spacing:1px}
.screen-review-link{position:absolute;right:5%;bottom:22px;font-size:10px;color:#767c6c}
.page-review-mode .screen-rail,.page-review-mode .motion-replay,.page-review-mode .screen-review-link{display:none}
.page-review-mode .screen-inner{scrollbar-width:thin}
@media(max-width:1050px){.official-nav nav{gap:20px}.detail-deck .official-nav{width:90vw}.detail-deck .official-nav nav{gap:12px;font-size:11px}}
@media(max-width:760px){
.homepage .site-nav,.site-nav.official-nav{width:calc(100% - 32px);top:16px;padding:8px 12px;grid-template-columns:1fr auto auto;gap:12px}
.official-nav .brand{font-size:16px;gap:7px}
.official-nav .brand img{width:25px;height:25px}
.official-nav .nav-cta{font-size:10px;padding:7px 11px}
.official-nav .nav-menu{display:block;background:none;border:0;font-size:10px;padding:5px}
.official-nav nav{display:none;position:absolute;left:0;right:0;top:calc(100% + 8px);padding:20px;border-radius:16px;background:#f8f7f3;color:#111;box-shadow:0 10px 30px #0002}
.official-nav.is-on-dark nav{background:#151615;color:#f3efe6}
.official-nav.nav-expanded nav{display:flex;flex-wrap:wrap;gap:22px}
.homepage .site-nav nav>a,.site-nav nav>a{display:block!important}
.detail-deck .official-nav{grid-template-columns:auto 1fr auto;width:calc(100% - 24px)}
.detail-deck .detail-back{margin:0 8px 0 0;padding-right:12px;font-size:10px}
.detail-deck .official-nav>.nav-cta{display:none}
.homepage .screen-inner{max-height:calc(100% - 145px);margin-top:48px}
.homepage .hero-inner{width:calc(100% - 50px);margin:0;padding-top:30px}
.homepage .home-hero .hero-word{font-size:16vw;letter-spacing:-.075em}
.homepage .hero-kicker{font-size:8px;margin-bottom:25px}
.homepage .home-hero .hero-copy .hero-en{font-size:14px;line-height:1.65;margin-top:28px}
.homepage .home-hero .hero-copy .hero-cn{font-size:12px;margin-top:18px;line-height:1.9}
.hero-actions{gap:20px;margin-top:30px}
.homepage .hero-scroll{font-size:11px}
.hero-actions .button{font-size:11px;gap:10px;padding-left:16px}
.button-arrow{width:32px;height:32px}
.hero-index{font-size:7px;bottom:23px;left:6%;right:6%}
.home-hero .motion-replay{left:6%;bottom:46px}
.homepage .detail-inner{width:calc(100% - 66px);max-height:calc(100dvh - 155px);margin-top:42px}
.homepage .detail-inner.role-hero{grid-template-columns:1fr;gap:16px}
.detail-inner .role-intro h1{font-size:31px}
.detail-inner .role-intro .lead{font-size:12px;margin:15px 0}
.detail-inner .role-intro blockquote{font-size:11px;margin:12px 0}
.detail-inner .role-art>img{height:26vh;max-height:240px}
.detail-inner .role-art figcaption{font-size:9px}
.detail-inner .role-intro .text-link{font-size:10px}
.homepage .detail-inner.handoff{grid-template-columns:1fr;gap:25px}
.detail-inner h2{font-size:28px}
.detail-inner .step-grid h3{font-size:19px}
.detail-inner .step-grid p{font-size:12px}
.detail-inner .example-text{font-size:17px}
.detail-screen-label{font-size:8px;bottom:19px}
.screen-review-link{font-size:9px;bottom:17px}
.homepage .screen-rail{right:9px}
}
@media(prefers-reduced-motion:no-preference){.homepage .home-hero.scene-playing .hero-kicker{animation:deck-word-in .7s 1.15s both}}

.homepage .home-value{background:#f2f0eb;display:block;padding-top:clamp(105px,13vh,140px)}
.value-copy{text-align:center;width:90%;margin:0 auto}
.value-copy .eyebrow{font-size:10px;color:#667c67;letter-spacing:4px;margin-bottom:26px}
.value-copy h2{font-size:clamp(48px,6vw,112px);font-weight:750;line-height:1.05;letter-spacing:-.065em}
.value-copy>p:last-child{font-size:clamp(14px,1.2vw,21px);color:#777d73;margin:28px auto 0;max-width:1100px}
.value-gallery{width:min(74vw,1400px);margin:50px auto 0;border:8px solid #e5e4dd;border-radius:36px;overflow:hidden;box-shadow:0 20px 70px #403a271c}
.value-gallery img{display:block;width:100%}
@media(max-height:760px) and (min-width:761px){.value-copy h2{font-size:clamp(44px,5vw,76px)}.value-gallery{margin-top:30px;width:72vw}.value-copy>p:last-child{margin-top:20px}}
@media(max-width:760px){.homepage .home-value{padding-top:140px}.value-copy h2{font-size:36px;line-height:1.2;letter-spacing:-.06em}.value-copy>p:last-child{font-size:12px;line-height:1.9;width:88%;margin-top:25px}.value-gallery{width:90%;margin-top:45px;border-width:4px;border-radius:18px}}

.value-copy h2{text-wrap:balance}@media(max-width:760px){.value-copy h2{font-size:clamp(26px,8.6vw,36px)}}
