@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Noto+Sans+KR:wght@400;500;600;700&display=swap');
:root{color-scheme:light;--ink:#08070c;--paper:#f5f5f5;--p:0;font-family:'DM Sans','Noto Sans KR',sans-serif;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #a285ff;outline-offset:5px}button{border:0}button:disabled{cursor:default}button,a{touch-action:manipulation}.skip{position:fixed;left:12px;top:-100px;z-index:100;background:white;padding:12px}.skip:focus{top:12px}
.navigation{position:fixed;z-index:20;top:21px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:2px;padding:4px;background:#e6e6e6ee;border:1px solid #ffffff80;border-radius:10px;backdrop-filter:blur(16px);box-shadow:0 3px 15px #00000008;white-space:nowrap;font-size:14px}
.navigation>a,.navigation>button{padding:12px 20px;border-radius:7px;background:#fbfbfb;color:#101013;transition:background .2s}.navigation>a:hover,.navigation>button:hover{background:#eee}.navigation .mark{background:transparent;font-size:25px;font-weight:650;padding:4px 13px;letter-spacing:-3px}.mark span{font-size:14px;vertical-align:top;letter-spacing:0}.navigation .nav-action{background:#0d0d0f;color:white;padding-inline:23px}.navigation .nav-action:hover{background:#413954}.languages{padding:0 13px;display:flex;gap:5px;align-items:center;color:#8b8990}.languages button{padding:7px 3px;background:transparent;font-size:12px;color:#85818b}.languages button[aria-pressed=true]{color:#161318;font-weight:700}
.journey{height:520vh;padding:15px}.stage{height:calc(100svh - 30px);position:sticky;top:15px;border-radius:30px;overflow:hidden;background:#090612;color:#fff;isolation:isolate;--intro-opacity:1;--collection-opacity:0;--outro-opacity:0}.light-wash{position:absolute;inset:0;background:radial-gradient(ellipse at 46% 100%,#dcafff88 0,transparent 22%),radial-gradient(ellipse at 42% 83%,#6e2bff 0,transparent 49%),radial-gradient(ellipse at 89% 20%,#30205b55,transparent 58%);opacity:calc(1 - var(--p)*.75);transition:opacity .15s}.grain{position:absolute;inset:0;z-index:8;pointer-events:none;opacity:.075;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.4' filter='url(%23n)'/%3E%3C/svg%3E");mix-blend-mode:soft-light}#world{position:absolute;width:100%;height:100%;inset:0;z-index:3;pointer-events:none}
.intro{position:absolute;inset:0;z-index:5;padding:11vh 4vw 0;opacity:var(--intro-opacity);transform:translateY(calc(var(--p)*-200px));pointer-events:var(--intro-events,auto)}.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:500}.intro>.eyebrow{margin:12px 0 23px;color:#c8b9e5}.intro h1{font-weight:450;font-size:clamp(60px,7.3vw,135px);letter-spacing:-.075em;line-height:1.02;margin:0;max-width:62vw}.dim{color:#a48cc1}.intro-bottom{position:absolute;bottom:100px;left:4vw;right:4vw;display:flex;align-items:flex-end;justify-content:space-between}.intro-copy{max-width:355px}.intro-copy p{color:#d3c4e4;line-height:1.65;font-size:16px;max-width:330px;margin:0 0 24px}.primary{background:#f1edf6;color:#211330;border-radius:6px;padding:16px 23px;font-size:14px;font-weight:550;display:inline-flex;gap:32px;align-items:center;transition:background .2s,transform .2s}.primary:hover{background:white;transform:translateY(-2px)}.side-note{font-size:14px;text-align:right;color:#c5b3d9;line-height:1.5;max-width:190px}.stage-footer{position:absolute;bottom:26px;left:4vw;right:4vw;z-index:7;border-top:1px solid #ffffff25;padding-top:20px;display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--footer-color,#d0c4df)}.wordmark{font-size:20px;font-weight:650;letter-spacing:-.05em}.scroll-hint{letter-spacing:.11em}.frame-index{font-variant-numeric:tabular-nums}
.collection{position:absolute;inset:0;z-index:2;color:#0c0910;opacity:var(--collection-opacity);pointer-events:none;perspective:1400px}.collection-caption{position:absolute;width:100%;top:12vh;text-align:center;font-size:12px;letter-spacing:.2em}.wide-type{position:absolute;top:45%;left:50%;white-space:nowrap;font-size:clamp(60px,9.8vw,180px);font-weight:450;letter-spacing:-.075em;transform:translate(-50%,-50%)}.orbit{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--tilt,0deg));}.film-card{position:absolute;top:50%;left:50%;width:min(27vw,370px);height:min(58vh,520px);margin:0;border-radius:24px;overflow:hidden;padding:28px;box-shadow:0 26px 70px #22002e20;backface-visibility:hidden;transform-style:preserve-3d;color:white;will-change:transform;background:#110922}.card-top{display:flex;align-items:center;justify-content:space-between;font-size:12px;letter-spacing:.07em;position:relative;z-index:2}.card-top span:last-child{font-size:25px}.film-card h2{position:absolute;bottom:56px;margin:0;font-size:clamp(28px,3.4vw,54px);font-weight:400;line-height:1.03;letter-spacing:-.065em;z-index:2}.film-card>p{position:absolute;bottom:23px;font-size:13px;margin:0;z-index:2;color:#fffd}.card-surface{position:absolute;inset:0;background:radial-gradient(ellipse at 110% 95%,#cbaaed 0,transparent 28%),radial-gradient(ellipse at 55% 70%,#753cee,transparent 75%);opacity:.95}.card-one{background:linear-gradient(135deg,#c5aaff,#421691 50%,#a064f5)}.card-two{background:linear-gradient(140deg,#131215,#0c0c0e 55%,#293601)}.card-two .card-surface{background:radial-gradient(ellipse at 0 5%,#d4ff44,transparent 55%)}.card-three{background:linear-gradient(145deg,#111, #152a37 55%,#c2d5e1)}.card-three .card-surface{background:radial-gradient(ellipse at 0 90%,#598ca2,transparent 70%)}.collection-bottom{position:absolute;bottom:13vh;left:0;width:100%;text-align:center;font-size:14px;letter-spacing:-.02em}
.outro{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;z-index:6;opacity:var(--outro-opacity);pointer-events:var(--outro-events,none);padding:35px}.outro .eyebrow{color:#c0a7e6}.outro h2{font-size:clamp(56px,8.5vw,140px);line-height:.98;letter-spacing:-.075em;font-weight:450;margin:25px 0;color:#f8f4ff}.outro>p:not(.eyebrow){color:#c7b2dd;font-size:17px;margin:0 0 30px}.outro .primary{margin-top:10px}.ending{display:grid;grid-template-columns:1.2fr 1fr;gap:28px 80px;align-items:center;padding:90px max(5vw,24px) 110px}.ending h2{font-size:clamp(30px,4vw,62px);letter-spacing:-.06em;font-weight:450;margin:12px 0}.ending>p{font-size:16px;line-height:1.7;color:#64606b;max-width:440px}.ending .eyebrow{color:#6f667a}.text-button{background:transparent;text-align:left;padding:0;font-size:14px;text-decoration:underline;text-underline-offset:5px;justify-self:start}.motion-controls{position:fixed;bottom:0;right:0;z-index:25;background:#f5f5f5;color:#312c37;display:flex;align-items:center;gap:14px;padding:7px 16px;border-radius:10px 0 0 0}.motion-controls button{background:none;font-size:12px;color:inherit;padding:0}.progress-track{width:60px;height:2px;background:#d6d1dd}#progress{height:100%;width:0;display:block;background:#6737bc}.webgl-fallback{position:fixed;z-index:12;right:35px;bottom:70px;width:260px;color:#eee;background:#181025;padding:14px;font-size:13px}.webgl-fallback[hidden]{display:none}
html[lang=ko] .intro h1{font-size:clamp(44px,5.8vw,100px);letter-spacing:-.07em;line-height:1.2}html[lang=ko] .outro h2{font-size:clamp(45px,7vw,112px);line-height:1.2}html[lang=ko] .film-card h2{font-size:clamp(26px,2.7vw,44px);line-height:1.2;letter-spacing:-.05em}html[lang=ko] .wide-type{font-size:clamp(55px,8vw,140px)}
@media(min-width:1600px){.intro{padding-top:13vh}.intro-bottom{bottom:125px}.intro-copy{max-width:410px}.intro-copy p{font-size:18px;max-width:400px}}
@media(max-width:760px){.navigation{top:16px;max-width:calc(100vw - 28px);gap:1px;padding:3px;font-size:12px}.navigation>a,.navigation>button{padding:11px 12px}.navigation .mark{padding:4px 10px}.navigation .nav-action{display:none}.languages{padding:0 8px}.journey{padding:8px;height:440vh}.stage{top:8px;height:calc(100svh - 16px);border-radius:22px}.intro{padding:100px 23px 0}.intro>.eyebrow{font-size:10px;letter-spacing:.1em;margin:0 0 20px}.intro h1{font-size:clamp(48px,11vw,75px);max-width:100%;letter-spacing:-.06em}.intro-bottom{left:23px;right:23px;bottom:77px}.intro-copy{max-width:255px}.intro-copy p{font-size:14px;line-height:1.5;max-width:245px;margin-bottom:17px}.side-note{display:none}.primary{padding:13px 16px;font-size:13px;gap:24px}.stage-footer{bottom:22px;left:23px;right:23px;padding-top:15px}.wordmark{font-size:16px}.scroll-hint{font-size:9px;letter-spacing:.07em}.frame-index{font-size:10px}.film-card{width:56vw;height:min(50vh,450px);border-radius:18px;padding:18px}.card-top{font-size:9px}.film-card h2{font-size:36px;bottom:55px}.film-card>p{font-size:12px}.collection-caption{top:15vh;font-size:10px}.collection-bottom{bottom:17vh;font-size:11px}.wide-type{font-size:18vw}.outro{padding:22px}.outro h2{font-size:14vw}.outro>p:not(.eyebrow){font-size:14px}.ending{display:block;padding:55px 26px 100px}.ending>p{margin:24px 0}.ending h2{font-size:40px}html[lang=ko] .intro h1{font-size:10vw}html[lang=ko] .film-card h2{font-size:8vw}html[lang=ko] .outro h2{font-size:11vw}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.primary{transition:none}.grain{display:none}}
.card-video,.video-shade{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.card-video{object-fit:cover;display:none}.video-shade{display:none;background:linear-gradient(180deg,#0007 0%,transparent 30%,transparent 45%,#000b 100%)}.has-film .card-video,.has-film .video-shade{display:block}.has-film .card-surface{opacity:0}.has-film .card-top{z-index:2}.has-film h2{font-size:clamp(25px,2.5vw,38px);bottom:70px;max-width:calc(100% - 56px);line-height:1.12;letter-spacing:-.04em}.has-film>p{bottom:44px;max-width:calc(100% - 56px)}.watch-film{position:absolute;inset:0;z-index:4;width:100%;height:100%;border-radius:inherit;background:transparent;color:white;text-align:left;padding:0}.watch-film[hidden]{display:none}.watch-film:focus-visible{outline:3px solid white;outline-offset:-7px}.play-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:58px;height:58px;background:#0004;border:1px solid #fff9;border-radius:50%;font-size:17px;padding-left:3px;backdrop-filter:blur(8px);transition:background .2s,transform .2s}.watch-film:hover .play-icon{background:#fff4;transform:translate(-50%,-50%) scale(1.08)}.watch-label{position:absolute;bottom:17px;left:28px;font-size:12px;letter-spacing:.01em;color:#fffd}.film-open{overflow:hidden}.film-dialog{width:min(1100px,calc(100vw - 36px));max-height:calc(100svh - 36px);padding:24px;border:1px solid #ffffff20;border-radius:18px;background:#111015;color:#fff;box-shadow:0 20px 100px #0009}.film-dialog::backdrop{background:#06040ae8;backdrop-filter:blur(14px)}.player-heading{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:22px}.player-heading h2{font-size:clamp(20px,3vw,30px);font-weight:500;margin:8px 0 0;letter-spacing:-.03em}.player-heading p{margin:0;color:#b9a9cc;font-size:13px}.close-film{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#ffffff10;color:#fff;font-size:28px}.close-film:hover{background:#ffffff20}#full-film{display:block;width:100%;max-height:calc(100svh - 190px);object-fit:contain;background:black;border-radius:7px}.film-error{padding:15px;border:1px solid #ffffff20;font-size:14px;line-height:1.5}.film-error[hidden]{display:none}html[lang=ko] .has-film h2{font-size:clamp(23px,2.5vw,36px)}
@media(max-width:760px){.has-film h2,html[lang=ko] .has-film h2{font-size:25px;max-width:calc(100% - 36px);bottom:71px}.has-film>p{font-size:12px;bottom:44px;max-width:calc(100% - 36px)}.watch-label{left:18px}.play-icon{width:48px;height:48px;font-size:15px}.film-dialog{padding:16px;width:calc(100vw - 20px);border-radius:12px}.player-heading{margin-bottom:16px}.player-heading h2{font-size:22px}}
.film-credit{margin:15px 0 0;font-size:12px;color:#c0b3cf}.film-credit a{text-decoration:underline;text-underline-offset:3px}.film-credit[hidden]{display:none}
.card-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}.card-image[hidden]{display:none}.has-image .card-surface{opacity:0}.has-image .video-shade{display:block;background:linear-gradient(180deg,#0005,transparent 25%,transparent 50%,#000b 100%)}.has-image h2{font-size:clamp(27px,3vw,43px);bottom:62px;max-width:calc(100% - 56px);line-height:1.04;letter-spacing:-.05em;text-wrap:balance}.has-image>p{font-size:13px;bottom:30px;max-width:calc(100% - 56px)}html[lang=ko] .has-image h2{font-size:clamp(25px,2.6vw,38px);line-height:1.2}.has-image.has-film h2{bottom:80px}.has-image.has-film>p{bottom:51px}
@media(max-width:760px){.has-image h2,html[lang=ko] .has-image h2{font-size:29px;bottom:60px;max-width:calc(100% - 36px)}.has-image>p{font-size:11px;bottom:28px;max-width:calc(100% - 36px)}.collection-bottom{font-size:10px;padding:0 20px;line-height:1.5}}
