/* The opening uses original footage plus two cached, composited surfaces. */
:root{--film-length:19.2}
.experience-on #haruka{top:780svh}.experience-on #luna{top:900svh}.experience-on #sol{top:1280svh}.experience-on #work{top:1780svh}
.origin-warp{position:absolute;inset:0;overflow:hidden;pointer-events:none;visibility:hidden;contain:layout paint}
.warp-rays{position:absolute;inset:0;width:100%;height:100%;transform-origin:50% 50%;opacity:0}
.warp-ring{position:absolute;left:50%;top:50%;width:28vmin;height:28vmin;margin:-14vmin 0 0 -14vmin;border:1px solid #d1bb884d;border-radius:50%;box-shadow:0 0 28px #d9c9a41a,inset 0 0 18px #d9c9a412;opacity:0}
.origin-cue{position:absolute;bottom:36px;left:var(--gutter);display:flex;gap:24px;align-items:center;z-index:4;color:#d4cbb9}
.origin-cue>span{font-size:10px;letter-spacing:.15em}.origin-cue button{display:flex;align-items:center;gap:28px;min-height:44px;padding:0 15px;background:#0a0b0c88;border:1px solid #c9b79455;font-size:12px;transition:background .2s,border-color .2s}
.origin-cue button:hover{background:#343028;border-color:#dbccac}.origin-cue button:active{transform:translateY(1px)}
.origin-cue[hidden]{display:none}
.brand-introduction{padding:90px var(--gutter);background:#080b10;color:#f3f1e9}
.experience-on .brand-introduction{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;visibility:hidden;padding:clamp(72px,10svh,110px) var(--gutter) 55px;pointer-events:auto;contain:layout paint;background:radial-gradient(ellipse at 5% 60%,#34516824,transparent 50%),#080b10}
.brand-intro-heading,.brand-intro-bottom{display:flex;justify-content:space-between;align-items:center;gap:24px}.brand-intro-heading{margin-bottom:clamp(30px,5svh,65px)}
.brand-intro-heading .eyebrow{font-size:10px;letter-spacing:.16em;color:#aebdc5}.brand-intro-index{font-size:10px;letter-spacing:.12em;color:#75818e}
.brand-intro-grid{display:grid;grid-template-columns:1fr 1.08fr;gap:8vw;align-items:center;max-width:1600px;width:100%;margin:0 auto}
.brand-intro-copy h2{font-size:clamp(45px,5.7vw,98px);line-height:1.02;font-weight:400;letter-spacing:-.052em}.brand-intro-copy h2 em{font-family:Dream,serif;font-weight:400;color:#dfcfad}
.brand-intro-copy>p{font-size:clamp(12px,1.05vw,16px);line-height:1.8;color:#b0bbc6;margin-top:26px}.brand-intro-copy>p[lang=ko]{font-family:system-ui,sans-serif;font-size:12px;margin-top:12px;color:#8e9aa6;word-break:keep-all}
.brand-intro-copy .text-link{margin-top:12px;min-height:44px}.brand-feature{display:block;min-width:0}.brand-feature figure{position:relative;margin:0;aspect-ratio:16/9;overflow:hidden;background:#171a1d}.brand-feature img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.brand-feature figure>span{position:absolute;right:16px;bottom:14px;background:#080b10d9;border:1px solid #ffffff33;width:44px;height:44px;display:grid;place-items:center;font-size:23px}.brand-feature:hover img{transform:scale(1.035)}
.brand-feature-label{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:20px}.brand-feature-label .eyebrow{font-size:9px;letter-spacing:.12em}.brand-feature-label>span[lang=ko]{font:11px/1.6 system-ui,sans-serif;color:#bcac87}.brand-feature h3{font:400 clamp(20px,2vw,32px)/1.5 system-ui,sans-serif;letter-spacing:-.04em;margin-top:10px}
.brand-intro-bottom{border-top:1px solid #aab9c12b;padding-top:20px;margin-top:clamp(25px,5svh,70px);font-size:12px;color:#b1bec9}.brand-intro-bottom a{display:flex;align-items:center;gap:32px;min-height:44px}.brand-intro-bottom a:hover,.brand-intro-copy a:hover{color:#fff}
html:not(.experience-on) .origin-warp,html:not(.experience-on) .origin-cue{display:none}
@media(max-width:700px){.origin-cue{left:25px;bottom:22px;gap:14px}.origin-cue>span{font-size:8px;letter-spacing:.1em}.origin-cue~.film-bottom{display:none}.experience-on .brand-introduction{padding:70px 25px 22px}.brand-intro-heading{margin-bottom:24px}.brand-intro-heading .eyebrow{font-size:8px;letter-spacing:.1em}.brand-intro-index{display:none}.brand-intro-grid{grid-template-columns:1fr;gap:25px}.brand-intro-copy h2{font-size:clamp(40px,11vw,57px)}.brand-intro-copy>p{font-size:12px;margin-top:14px}.brand-intro-copy>p[lang=ko]{font-size:11px;margin-top:8px}.brand-intro-copy .text-link{display:none}.brand-feature-label{margin-top:12px;gap:10px}.brand-feature-label>span[lang=ko]{font-size:9px}.brand-feature h3{font-size:22px;margin-top:5px}.brand-intro-bottom{margin-top:20px;padding-top:9px;gap:15px;font-size:10px}.brand-intro-bottom a{gap:12px}.brand-intro-bottom a:last-child{max-width:185px;text-align:right}.brand-introduction{padding:60px 25px}}
@media(max-height:720px) and (max-width:700px){.experience-on .brand-introduction{padding-top:55px}.brand-intro-heading{margin-bottom:14px}.brand-intro-copy h2{font-size:37px}.brand-intro-copy>p[lang=ko]{display:none}.brand-intro-grid{gap:16px}.brand-feature figure{max-height:24svh}.brand-feature-label>span[lang=ko]{display:none}.brand-feature h3{font-size:19px}.brand-intro-bottom{margin-top:12px}}
@media(max-height:600px) and (min-width:701px){.experience-on .brand-introduction{padding:65px var(--gutter) 20px}.brand-intro-heading{margin-bottom:20px}.brand-intro-copy h2{font-size:48px}.brand-intro-copy>p{margin-top:14px}.brand-intro-bottom{margin-top:18px;padding-top:5px}.brand-feature figure{max-height:43svh}}
@media(prefers-reduced-motion:reduce){.brand-feature img{transition:none}}
@media(max-height:500px) and (min-width:701px){.experience-on .brand-introduction{padding:58px var(--gutter) 14px}.brand-intro-heading{margin-bottom:12px}.brand-intro-copy h2{font-size:38px}.brand-intro-copy>p{font-size:11px;margin-top:12px}.brand-intro-copy>p[lang=ko],.brand-intro-copy .text-link{display:none}.brand-feature figure{max-height:34svh}.brand-feature-label{margin-top:10px}.brand-feature-label>span[lang=ko]{font-size:9px}.brand-feature h3{font-size:22px;margin-top:6px}.brand-intro-bottom{margin-top:10px;padding-top:4px;font-size:10px}}

/* Reading stops retain native refresh-rate animation; only media time is capped. */
.experience-on .film-stage{touch-action:pan-x pinch-zoom}
.chapter-pause-hint{position:absolute;z-index:12;bottom:28px;left:50%;transform:translateX(-50%);margin:0;padding:8px 14px;border:1px solid #ffffff20;border-radius:30px;background:#080b1073;color:#fff9;font:400 10px/1.5 Manrope,system-ui,sans-serif;letter-spacing:.07em;white-space:nowrap;pointer-events:none}
.chapter-pause-hint[hidden],.premiere-playing .chapter-pause-hint{display:none}
@media(max-width:600px){.chapter-pause-hint{bottom:58px;max-width:90%;font-size:9px;white-space:normal;text-align:center}}
