/* The product story occupies the viewport; the page becomes a sequence of scenes. */
.product-experience{--scene-nav:86px;background:#fff;scroll-padding-top:var(--scene-nav)}
.cinema-header{height:var(--scene-nav);position:sticky;top:0;background:linear-gradient(#ffffffed,#ffffffb8 70%,#ffffff00);backdrop-filter:none;padding:0 4vw;z-index:12}
.cinema-header>div{display:flex;gap:24px;align-items:center}
.cinema-header button{font-size:12px;font-weight:700}
.cinema-header .cinema-motion{font-size:10px;font-weight:400;color:#666}
.cinema-hero{position:relative;isolation:isolate;height:100svh;min-height:650px;margin-top:calc(-1 * var(--scene-nav));overflow:hidden;background:#fff}
.cinema-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-3}
.cinema-wash{position:absolute;inset:0;background:linear-gradient(90deg,#ffffffd6 0%,#ffffff80 30%,#ffffff00 57%);z-index:-2;pointer-events:none}
.cinema-world{position:absolute;inset:0;z-index:-1;pointer-events:none}
.cinema-world canvas{display:block;width:100%;height:100%}
.cinema-hero-copy{position:absolute;left:6vw;top:50%;transform:translateY(-55%);max-width:48%;pointer-events:none}
.cinema-kicker{color:#bd1728;font-size:13px;font-weight:700;margin-bottom:30px;letter-spacing:0}
.cinema-hero-copy h1{font-size:clamp(60px,7vw,116px);line-height:1.15;letter-spacing:-.075em;font-weight:700;white-space:nowrap;word-break:keep-all}
.product-experience[data-product-id=express] .cinema-hero-copy h1{font-size:clamp(38px,4.1vw,74px);letter-spacing:-.065em}
.cinema-subject{font-size:clamp(20px,2vw,31px);line-height:1.65;font-weight:700;letter-spacing:-.04em;margin-top:30px}
.cinema-music-link{pointer-events:auto;font-size:12px;border-bottom:1px solid currentColor;padding:0 0 7px;margin-top:32px;font-weight:700}
.cinema-hero-bottom{position:absolute;bottom:72px;left:6vw;right:6vw;display:flex;align-items:center;justify-content:space-between;gap:20px}
.cinema-hero-bottom>p{font-size:12px;font-weight:700}
.cinema-hero-bottom>p span{margin:0 6px;color:#888}
.cinema-buy{background:#171719;color:white;padding:15px 28px;font-size:12px;font-weight:700;min-width:165px}
.cinema-buy:hover{background:var(--red)}
.cinema-scroll-note{position:absolute;bottom:24px;left:6vw;font-size:10px;color:#777}
.cinema-fallback{position:absolute;right:8%;top:20%;width:35%;height:65%;object-fit:contain;mix-blend-mode:multiply}
.cinema-narrative{display:grid;grid-template-columns:1fr 1.55fr;gap:8vw;padding:110px 8vw;max-width:1600px;margin:auto}
.cinema-narrative>p{color:var(--red);font-size:12px;font-weight:700;padding-top:12px}
.cinema-narrative h2{font-size:clamp(31px,3vw,52px);line-height:1.45;letter-spacing:-.06em;font-weight:700}
.cinema-narrative>div>p{font-size:15px;line-height:2.15;max-width:700px;margin-top:28px;color:#67676d}
.cinema-section-title{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;margin-bottom:48px}
.cinema-section-title>p{color:var(--red);font-size:12px;font-weight:700;order:2}
.cinema-section-title h2{font-size:clamp(34px,3.5vw,57px);line-height:1.35;letter-spacing:-.06em;font-weight:700}
.cinema-storyboard{padding:75px 5vw 90px;border-top:1px solid #dedee1;background:#fcfcfc}
.storyboard-frames{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.storyboard-frames figure{margin:0;min-width:0}
.board-frame{aspect-ratio:16/11;border:1px solid #b5b6b8;position:relative;overflow:hidden;background:#fff}
.board-frame>img{width:100%;height:100%;object-fit:cover;filter:contrast(1.03)}
.board-frame.frame-0>img{object-position:68% center}
.board-frame.frame-1>img{transform:scale(1.65);transform-origin:72% 72%}
.board-frame.frame-2>img{transform:scale(1.3);transform-origin:70% center;opacity:.7}
.board-mark{position:absolute;inset:10px;border:1px solid #7575752e;pointer-events:none}
.board-bottle{position:absolute;right:8%;bottom:0;width:48%;height:90%;filter:drop-shadow(3px 4px 0 #fff6)}
.board-wheel{position:absolute;right:10%;bottom:5%;width:51%;height:88%}
.frame-1 .board-wheel{transform:scale(1.25);transform-origin:center 70%}
.storyboard-frames figcaption{font-size:13px;line-height:1.9;padding-top:19px;letter-spacing:-.025em}
.storyboard-credit{font-size:10px;color:#8c8c90;margin-top:30px}
.cinema-film-chapter{background:#151517;color:white;padding:50px 0 25px}
.film-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin:0 5vw 35px}
.film-heading>div>p{font-size:10px;color:#bdbdc2;margin-bottom:13px;letter-spacing:.03em}
.film-heading h2{font-size:clamp(28px,3vw,46px);letter-spacing:-.06em;line-height:1.4;font-weight:700}
.film-heading>a{font-size:12px;border-bottom:1px solid #999;padding-bottom:6px;white-space:nowrap}
.music-stage{height:calc(100svh - var(--scene-nav) - 80px);min-height:360px;position:relative;background:#0b0b0c}
.music-stage>img{width:100%;height:100%;object-fit:cover;filter:brightness(.52)}
.music-stage iframe{position:absolute;inset:0;border:0;display:block;width:100%;height:100%;min-height:200px}
.music-stage.is-loading iframe{opacity:0;pointer-events:none}
.video-loading{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;padding:20px;color:#fff;font-size:13px}
.cinema-film-chapter.is-playing{padding-top:0}
.cinema-film-chapter.is-playing .film-heading{display:none}
.cinema-film-chapter.is-playing .music-stage{height:calc(100svh - var(--scene-nav))}
.music-start{position:absolute;inset:0;width:100%;height:100%;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:30px}
.play-symbol{font-size:27px;width:84px;height:84px;border:1px solid #ffffffaa;border-radius:50%;display:grid;place-content:center;padding-left:5px}
.music-start>span:not(.play-symbol){font-size:24px;font-weight:700;letter-spacing:-.03em}
.music-start>small{font-size:12px;color:#ddd}
.music-start:hover .play-symbol{background:#df252d;border-color:#df252d}
.music-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;color:white;padding:30px;text-align:center}
.music-fallback p{font-size:17px}
.music-fallback a{font-size:13px;font-weight:700;border-bottom:1px solid white;padding-bottom:8px}
.film-credit{font-size:11px;color:#a1a1a7;margin:23px 5vw 0;display:flex;justify-content:space-between;gap:20px;line-height:1.9}
.film-credit>span{font-size:10px}
.native-film-stage{height:calc(100svh - 160px);min-height:400px;background:white}
.native-film-stage>video{width:100%;height:100%;display:block;object-fit:contain}
.native-film-stage>img{width:100%;height:100%;display:block;object-fit:contain}
.cinema-moments{padding:95px 0 0}
.cinema-moments>.cinema-section-title{margin:0 6vw 55px}
.cinema-moments figure{margin:0;position:relative}
.cinema-moments figure>img{width:100%;height:90svh;min-height:500px;object-fit:cover}
.cinema-moments figcaption{position:absolute;bottom:0;left:0;right:0;color:white;padding:90px 6vw 45px;background:linear-gradient(transparent,#0a1010bb);display:flex;justify-content:space-between;align-items:end;gap:30px}
.cinema-moments figcaption>span{font-size:clamp(26px,3vw,48px);font-weight:700;line-height:1.5;letter-spacing:-.055em}
.cinema-moments figcaption>b{font-size:13px;font-weight:400}
.cinema-related{margin-top:0}
@media(max-width:1100px){.cinema-hero-copy{left:5vw;max-width:48%}.cinema-kicker{font-size:11px}.cinema-hero-copy h1{font-size:70px}.product-experience[data-product-id=express] .cinema-hero-copy h1{font-size:39px}.cinema-subject{font-size:23px}.cinema-narrative{padding:85px 6vw;gap:6vw}.storyboard-frames{gap:18px}.storyboard-frames figcaption{font-size:12px}.film-credit{display:block}.film-credit>span{display:block;margin-top:7px}}
@media(max-width:800px){
  .product-experience{--scene-nav:76px}.cinema-header{padding:0 6vw}.cinema-header>div{gap:20px}.cinema-header button{font-size:11px}.cinema-header .cinema-motion{font-size:9px}.cinema-hero{min-height:720px}.cinema-backdrop{object-position:65% center}.cinema-wash{background:linear-gradient(#ffffffdf 0%,#ffffffb5 25%,#ffffff00 55%)}.cinema-hero-copy{left:6vw;right:6vw;top:calc(var(--scene-nav) + 37px);max-width:none;transform:none}.cinema-kicker{font-size:11px;margin-bottom:18px}.cinema-hero-copy h1{font-size:clamp(42px,8vw,68px)}.product-experience[data-product-id=express] .cinema-hero-copy h1{font-size:clamp(28px,6vw,44px)}.cinema-subject{font-size:20px;line-height:1.6;margin-top:17px}.cinema-subject br{display:none}.cinema-music-link{font-size:11px;margin-top:19px}.cinema-hero-bottom{bottom:59px;left:6vw;right:6vw;gap:14px}.cinema-hero-bottom>p{font-size:11px}.cinema-buy{font-size:11px;padding:13px 18px;min-width:145px}.cinema-scroll-note{font-size:9px;bottom:21px}.cinema-narrative{grid-template-columns:1fr;gap:23px;padding:65px 6vw}.cinema-narrative>p{padding:0;font-size:11px}.cinema-narrative h2{font-size:35px}.cinema-narrative>div>p{font-size:14px;line-height:2.05;margin-top:24px}.cinema-section-title{display:block;margin-bottom:30px}.cinema-section-title>p{font-size:11px;margin-bottom:19px}.cinema-section-title h2{font-size:38px}.cinema-storyboard{padding:55px 6vw 60px}.storyboard-frames{grid-template-columns:1fr;gap:32px}.board-frame{aspect-ratio:16/10}.storyboard-frames figcaption{font-size:13px;padding-top:14px}.board-bottle{width:40%;right:15%}.cinema-film-chapter{padding-top:38px}.film-heading{display:block;margin:0 6vw 30px}.film-heading h2{font-size:32px}.film-heading>a{display:inline-block;font-size:11px;margin-top:22px}.film-heading>div>p{font-size:9px}.music-stage{height:64svh;min-height:300px}.music-start>span:not(.play-symbol){font-size:21px}.music-start>small{font-size:11px}.play-symbol{width:72px;height:72px;font-size:25px}.film-credit{font-size:10px;margin-left:6vw;margin-right:6vw}.film-credit>span{font-size:9px}.native-film-stage{height:72svh;min-height:350px}.cinema-moments{padding-top:60px}.cinema-moments>.cinema-section-title{margin-bottom:35px}.cinema-moments figure>img{height:75svh;min-height:430px}.cinema-moments figcaption{padding:80px 6vw 30px;display:block}.cinema-moments figcaption>span{font-size:30px;display:block;max-width:320px}.cinema-moments figcaption>b{display:block;margin-top:18px;font-size:11px}.cinema-fallback{right:12%;width:48%;top:32%;height:55%}
}
@media(max-width:520px){
  .cinema-header .cinema-motion{max-width:42px;line-height:1.6}.cinema-header>div{gap:15px}.cinema-hero{min-height:650px}.cinema-hero-copy{top:108px}.cinema-kicker{font-size:10px;margin-bottom:16px}.cinema-hero-copy h1{font-size:44px}.product-experience[data-product-id=express] .cinema-hero-copy h1{font-size:clamp(27px,7vw,35px)}.cinema-subject{font-size:16px;line-height:1.8;max-width:300px;margin-top:16px}.cinema-music-link{font-size:10px;margin-top:13px}.cinema-hero-bottom{left:22px;right:22px;bottom:57px;gap:10px}.cinema-hero-bottom>p{font-size:10px;max-width:130px;line-height:1.9}.cinema-hero-bottom>p span{margin:0 3px}.cinema-buy{font-size:10px;min-width:133px;padding:13px 14px}.cinema-scroll-note{left:22px;font-size:8px}.cinema-narrative{padding:50px 22px;gap:20px}.cinema-narrative h2{font-size:29px}.cinema-narrative>div>p{font-size:13px;line-height:2.05;margin-top:22px}.cinema-narrative .plain-link{font-size:12px}.cinema-section-title h2{font-size:31px}.cinema-storyboard{padding:45px 22px 50px}.cinema-section-title>p{font-size:10px;margin-bottom:16px}.storyboard-frames{gap:28px}.storyboard-frames figcaption{font-size:11px;line-height:1.9;padding-top:13px}.storyboard-credit{font-size:9px;margin-top:25px}.film-heading{margin-left:22px;margin-right:22px}.film-heading h2{font-size:28px}.music-stage{height:61svh;min-height:300px}.music-start{gap:20px}.music-start>span:not(.play-symbol){font-size:18px;line-height:1.6}.film-credit{margin-left:22px;margin-right:22px;font-size:9px}.native-film-stage{height:65svh;min-height:320px}.cinema-moments>.cinema-section-title{margin-left:22px;margin-right:22px}.cinema-moments figcaption>span{font-size:26px;max-width:260px}.cinema-moments figure>img{object-position:52% center}
}
@media(max-height:600px) and (min-width:801px){.cinema-hero{min-height:560px}.cinema-hero-copy{top:46%}.cinema-hero-copy h1{font-size:64px}.cinema-kicker{margin-bottom:18px}.cinema-subject{font-size:22px;margin-top:20px}.cinema-hero-bottom{bottom:55px}}
@media(prefers-reduced-motion:reduce){.cinema-world{will-change:auto}}
