/* Product-led pacing, native scroll, and ZAOZ's own sunrise and applications. */
.brand-cinema .brand-header{position:sticky;top:0;z-index:50;background:#f7f5f1ed;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);padding-block:18px}
.brand-cinema .brand-ambient{opacity:.25}
.brand-cinema .sunrise-hero{display:flex;flex-direction:column;justify-content:center;gap:0;text-align:center;background:#faf9f6;min-height:calc(100svh -77px);padding:62px 40px 24px;overflow:hidden}
.brand-cinema .hero-copy{padding:0;width:100%;max-width:900px}.brand-cinema .hero-eyebrow{margin-bottom:20px;font-size:10px;letter-spacing:1.7px}
body.brand-cinema .sunrise-hero h1{font-family:var(--font-sans);font-size:clamp(55px,5.5vw,80px);font-weight:500;line-height:1.12;letter-spacing:-3px;margin-bottom:22px}
body.brand-cinema .sunrise-hero h1 span:first-child{color:#171717}body.brand-cinema .sunrise-hero h1 span:last-child{color:#07566a}
body.brand-cinema:lang(zh-CN) .sunrise-hero h1{font-size:clamp(45px,4.8vw,68px);line-height:1.25;letter-spacing:-1.7px}
.brand-cinema .hero-description{margin-inline:auto;max-width:460px;font-size:14px}.brand-cinema .hero-actions{justify-content:center;margin-top:24px;gap:28px}.brand-cinema .brand-button{border-radius:28px;padding-inline:22px;gap:24px}
.brand-cinema .hero-art-wrap{width:min(840px,100%);max-width:none;margin:10px auto 0;align-self:center}.brand-cinema .dawn-art{aspect-ratio:900/550}.brand-cinema .art-caption{margin:-18px 72px 0}.brand-cinema .hero-currents{opacity:.025}
.brand-cinema .collection-index{max-width:1000px;margin:auto}.brand-cinema .collection-index>a{padding-block:22px}.brand-cinema .collection-index strong{font-size:14px}.brand-cinema .collection-index small{font-size:10px}
.brand-cinema #brand-main .product-heading h2{font-family:var(--font-sans);font-weight:500;letter-spacing:-1.3px;font-size:clamp(35px,3.6vw,48px);line-height:1.3}
.brand-cinema .brand-section{scroll-margin-top:105px}.brand-cinema .product-scenes{scroll-margin-top:105px}.brand-cinema .product-chapter{padding-top:100px}
.brand-film{margin:70px -64px 0;background:#f0f1ed;--film-progress:0;--film-bg:#f0f1ed;--film-text:#171717;--film-muted:#52646c}
.film-stage{padding:64px 40px 70px;background:var(--film-bg);position:relative;overflow:hidden}
.film-scenes{display:grid;grid-template-columns:1fr 1fr;gap:50px;max-width:1160px;margin:auto}.film-scene{min-width:0;text-align:center;color:var(--film-text)}
.film-kicker{font:10px var(--font-mono);letter-spacing:1.4px;color:var(--film-muted);margin:0 0 16px}.film-scene h2{font:500 43px/1.2 var(--font-sans);letter-spacing:-1.5px;margin:0 0 14px}.film-description{font-size:14px;line-height:1.8;color:var(--film-muted);margin:0 auto 14px;max-width:500px}.film-explore{display:inline-flex;align-items:center;gap:12px;font-size:12px;color:var(--film-text);min-height:40px;margin-bottom:24px;text-decoration:underline;text-underline-offset:5px}
.film-screen{position:relative;border:1px solid #ffffffb3;border-radius:14px;background:#faf9f6;box-shadow:0 18px 65px #142b3220;overflow:hidden;max-width:820px;margin:auto;transform:perspective(1400px) rotateX(3deg);transform-origin:center}
.film-screen-bar{height:28px;display:flex;align-items:center;justify-content:center;font-size:9px;letter-spacing:.3px;color:#657274;background:#f9faf8;border-bottom:1px solid #e1e4df}.film-screen-bar:before{content:'•••';position:absolute;left:12px;letter-spacing:3px;color:#bcc5bf;font-size:12px}.film-screen img{width:100%;height:340px;object-fit:cover;object-position:top;display:block}
.film-controls{display:none;justify-content:center;gap:5px;align-items:center;position:absolute;bottom:22px;left:50%;transform:translateX(-50%);z-index:5;padding:5px;border:1px solid #ffffff33;border-radius:28px;background:#ffffffdb;backdrop-filter:blur(12px);white-space:nowrap}
.film-controls button{position:relative;border:0;border-radius:20px;min-height:36px;padding:8px 18px;background:none;color:#52646c;font-size:11px}.film-controls button[aria-pressed=true]{color:#171717;background:#e7eeeb}.film-controls button:focus-visible{outline:2px solid #bc5f6a;outline-offset:3px}.film-controls button:after{content:'';height:2px;position:absolute;left:18px;right:18px;bottom:5px;background:#bc5f6a;transform:scaleX(0);transform-origin:left}
.brand-film[data-motion=true]{height:200svh}.brand-film[data-motion=true] .film-stage{position:sticky;top:var(--film-top,76px);height:calc(100svh - var(--film-top,76px));min-height:600px;max-height:900px;padding:0}
.brand-film[data-motion=true] .film-scenes{display:block;max-width:none;margin:0;position:absolute;inset:0}.brand-film[data-motion=true] .film-scene{position:absolute;width:min(880px,83%);top:clamp(32px,5svh,60px);left:50%;margin-left:calc(min(880px,83%) / -2);will-change:transform,opacity}
.brand-film[data-motion=true] .film-scene:first-child{transform:translate3d(calc(var(--film-progress) * -32%),calc(var(--film-progress) * -28px),0) scale(calc(1 - var(--film-progress) * .12));opacity:var(--film-first,1)}
.brand-film[data-motion=true] .film-scene:nth-child(2){transform:translate3d(calc((1 - var(--film-progress)) * 42%),calc((1 - var(--film-progress)) * 70px),0) scale(calc(.88 + var(--film-progress) * .12));opacity:var(--film-second,0)}
.brand-film[data-motion=true] .film-screen img{height:clamp(270px,40svh,440px)}.brand-film[data-motion=true] .film-controls{display:flex}
.brand-film[data-motion=true] .film-controls button:first-child:after{transform:scaleX(calc(1 - var(--film-progress)))}.brand-film[data-motion=true] .film-controls button:last-child:after{transform:scaleX(var(--film-progress))}
@media(min-width:1600px){.brand-cinema .sunrise-hero{padding-top:74px}.brand-cinema .hero-art-wrap{width:920px}}
@media(max-width:1150px){.brand-film{margin-inline:-38px}.film-scenes{gap:30px}.film-stage{padding-inline:38px}.film-scene h2{font-size:38px}}
@media(max-width:780px){.brand-cinema .brand-header{padding-block:16px}.brand-cinema .sunrise-hero{padding:45px 24px 25px;min-height:calc(100svh -120px)}body.brand-cinema .sunrise-hero h1{font-size:54px;letter-spacing:-2px}body.brand-cinema:lang(zh-CN) .sunrise-hero h1{font-size:43px;letter-spacing:-1px}.brand-cinema .hero-eyebrow{margin-bottom:20px}.brand-cinema .hero-description{font-size:13px;max-width:330px}.brand-cinema .hero-actions{margin-top:22px;gap:22px}.brand-cinema .hero-art-wrap{margin:20px -24px 0;width:calc(100% + 48px);align-self:center}.brand-cinema .art-caption{margin:-10px 50px 0}.brand-cinema .collection-index>a{padding-block:22px}.brand-cinema .brand-section,.brand-cinema .product-scenes{scroll-margin-top:150px}.brand-cinema .product-chapter{padding-top:74px}.brand-film{margin:46px -24px 0}.film-stage{padding:48px 24px}.film-scenes{display:block}.film-scene+.film-scene{margin-top:65px}.film-scene h2{font-size:33px;letter-spacing:-.7px}.film-description{font-size:12px;max-width:310px}.film-kicker{font-size:9px;letter-spacing:1px;margin-bottom:14px}.film-explore{font-size:11px;margin-bottom:22px}.film-screen{border-radius:10px}.film-screen img{height:260px}.brand-film[data-motion=true]{height:180svh}.brand-film[data-motion=true] .film-stage{min-height:520px}.brand-film[data-motion=true] .film-scene{width:88%;margin-left:-44%;top:38px}.brand-film[data-motion=true] .film-scene+.film-scene{margin-top:0}.brand-film[data-motion=true] .film-screen img{height:clamp(230px,34svh,350px)}.film-controls{bottom:20px}.film-controls button{font-size:10px;padding-inline:15px}.film-screen-bar{height:25px;font-size:8px}}
@media(max-width:370px){.brand-film{margin-inline:-18px}.brand-cinema .hero-art-wrap{margin-inline:-18px;width:calc(100% + 36px)}body.brand-cinema .sunrise-hero h1{font-size:45px}body.brand-cinema:lang(zh-CN) .sunrise-hero h1{font-size:37px}.brand-cinema .sunrise-hero{padding-inline:18px}.film-scene h2{font-size:29px}.film-description{font-size:11px}.film-controls button{padding-inline:11px}.film-screen-bar:before{left:8px}}
@media(prefers-reduced-motion:reduce){.brand-film .film-screen{transform:none}.brand-film .film-scene{will-change:auto}.brand-cinema .brand-header{backdrop-filter:none}}

.brand-film[data-motion=true] .film-scene:first-child>:not(.film-screen){opacity:var(--film-copy-first,1)}
.brand-film[data-motion=true] .film-scene:nth-child(2)>:not(.film-screen){opacity:var(--film-copy-second,0)}
