@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400;1,500&family=Nanum+Myeongjo:wght@400&family=Noto+Sans+KR:wght@300;400;500&display=swap');
.service-labels{display:flex;flex-direction:column;gap:10px}.hero-kicker .service-labels span{display:block}.service-labels span+span{font-size:12px;letter-spacing:1.2px;opacity:.85}nav a{font-size:14px;padding:14px 0;display:inline-block}nav a:hover{opacity:.65}
.film-rail{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:28px;scrollbar-width:thin}.film-rail .feature{flex:0 0 min(72vw,860px);scroll-snap-align:start}.film-rail .film-image{aspect-ratio:1.55}@media(max-width:700px){.film-rail{gap:14px;margin-right:-6vw;padding-right:6vw}.film-rail .feature{flex-basis:87vw}.film-rail .film-image{aspect-ratio:1.08}}
.feature .film-image{border-radius:24px}.feature .view-pill{border:1px solid #fff9;border-radius:999px;padding:13px 23px;background:#10140c26;backdrop-filter:blur(5px)}.feature .film-image:hover .view-pill{background:#f2f0e9;color:#272c25}.study-player{border-radius:16px}.film-rail{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 0 28px;scrollbar-width:thin;scrollbar-color:#9aa08f transparent}.film-rail .feature{flex:0 0 min(72vw,860px);scroll-snap-align:start}.film-rail .film-image{aspect-ratio:1.55}.film-rail .feature:first-child{flex-basis:min(78vw,980px)}
:root{--paper:#f2f0e9;--ink:#272c25;--rule:#d1d1c6;--serif:'Cormorant Garamond',Georgia,serif;--sans:'Noto Sans KR',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px}body:has(dialog[open]){overflow:hidden}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button{border:0;background:none}button:focus-visible,a:focus-visible{outline:2px solid currentColor;outline-offset:7px}img{display:block;width:100%;object-fit:cover}::selection{background:#777b5a;color:white}.nav{position:absolute;z-index:5;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:25px 3.7%;color:#fffdf4}.wordmark{font:italic 52px/.85 var(--serif);letter-spacing:-5px;padding-right:7px}.wordmark span{font-size:36px;letter-spacing:-3px}nav{display:flex;gap:34px}nav button{font-size:14px;padding:14px 0}nav button:hover{opacity:.65}.hero{height:100svh;min-height:650px;max-height:1300px;position:relative;overflow:hidden;background:#424a3a;color:#fffdf4}.image-layer,.shade{position:absolute;inset:0}.image-layer{animation:drift 24s ease-in-out infinite alternate}.image-layer img{height:100%;object-position:center 54%}.shade{background:linear-gradient(180deg,#0c120b55,#0f160f12 35%,#0a110a33 65%,#0a110a8c)}.hero-kicker{position:absolute;top:150px;left:3.7%;right:3.7%;display:flex;justify-content:space-between;font:12px/1.5 var(--sans);letter-spacing:1.8px}.title-wrap{position:absolute;left:0;right:0;top:46%;transform:translateY(-30%);text-align:center;animation:title-in 2.4s .8s both}.title-wrap h1{font:400 clamp(95px,15.2vw,260px)/.9 var(--serif);letter-spacing:-.06em;margin:0;padding:0 20px;white-space:nowrap;text-shadow:0 2px 30px #12221122}.title-wrap em{font-weight:400;letter-spacing:-.075em}.title-period{font-size:.6em;margin-left:.04em}.hero-bottom{position:absolute;bottom:32px;left:3.7%;right:3.7%;display:flex;align-items:center;justify-content:space-between}.film-link{display:flex;align-items:center;gap:14px;font-size:14px}.circle{width:48px;height:48px;border:1px solid #ffffff88;border-radius:50%;display:grid;place-items:center;font-size:21px;transition:background .2s}.film-link:hover .circle{background:#ffffff22}.study-label{font-size:12px;letter-spacing:1px;position:absolute;left:50%;transform:translateX(-50%);opacity:.8}.motion-toggle{border:1px solid #ffffff66;border-radius:50%;width:44px;height:44px;font-size:16px}.motion-paused .image-layer{animation-play-state:paused}.films{padding:110px 7% 0}.section-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:42px}.section-top h2{font:400 clamp(44px,5.2vw,80px)/1.1 var(--serif);letter-spacing:-2px;margin:0}.section-top h2 em{font-weight:400}.section-top sup{font:12px var(--sans);vertical-align:top;letter-spacing:0;display:inline-block;margin:12px 0 0 14px}.section-top p{font-size:14px;font-weight:300}.feature{max-width:1100px;margin:0 auto}.film-image{display:block;position:relative;overflow:hidden;padding:0;width:100%;aspect-ratio:1.93;background:#45503b;text-align:left;color:white}.film-image img{height:100%;object-position:center 60%;transition:transform 1.5s;filter:brightness(.8)}.film-image:hover img{transform:scale(1.035)}.image-caption{position:absolute;left:5%;bottom:12%;font:400 clamp(25px,4vw,64px)/.95 var(--serif);letter-spacing:-1px}.view-pill{position:absolute;right:4%;bottom:10%;font-size:14px;border-bottom:1px solid #ffffff99;padding:12px 0}.film-meta{display:flex;align-items:baseline;justify-content:space-between;padding-top:20px}.film-meta h3{font-size:16px;font-weight:400;margin:0}.film-meta p{font-size:12px;letter-spacing:1px}.film-meta p span{margin-left:24px;color:#686d61}.quiet-line{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--rule);margin-top:100px;padding:34px 0 55px}.quiet-line>span:first-child{font:italic 38px var(--serif)}.quiet-line p{font-size:14px;font-weight:300}.tempo{font:italic 20px var(--serif)}footer{background:var(--ink);color:var(--paper);padding:65px 7% 22px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}.footer-logo{font:400 60px var(--serif);letter-spacing:-3px}footer>button{font-size:16px;border-bottom:1px solid #b9bfb266;padding:15px 0}.footer-bottom{width:100%;display:flex;justify-content:space-between;font-size:12px;letter-spacing:.5px;color:#b7bcaf;border-top:1px solid #ffffff22;margin-top:60px;padding-top:20px;gap:16px}dialog{border:0;padding:0;width:min(640px,calc(100% - 32px));max-height:90svh;background:var(--paper);color:var(--ink);box-shadow:0 25px 100px #0004}dialog::backdrop{background:#121a14a8;backdrop-filter:blur(7px)}.dialog-inner{padding:56px;position:relative}.close{position:absolute;top:15px;right:18px;width:44px;height:44px;font-size:22px}.eyebrow{font-size:12px;letter-spacing:1.5px;margin:0 0 30px}.dialog-inner h2{font:400 55px/1.08 var(--serif);letter-spacing:-1.5px;margin:0 0 25px}.dialog-inner h2 em{font-weight:400}.dialog-copy{font-size:16px;line-height:1.9;font-weight:300}.collection-row{display:flex;gap:24px;align-items:center;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:22px 0;margin:36px 0 20px}.collection-row>span{font-size:12px}.collection-row h3{font:400 34px var(--serif);margin:0}.collection-row p{font-size:14px;margin:7px 0}.pending{font-size:13px;line-height:1.8;color:#616859}.solid{background:var(--ink);color:var(--paper);padding:18px 20px;width:100%;font-size:14px;margin-top:16px;text-align:left}.solid:hover{background:#424c39}form label{display:block;font-size:14px;margin-top:22px}input,textarea{display:block;background:transparent;border:0;border-bottom:1px solid #aab09e;color:var(--ink);padding:13px 0;width:100%;min-width:0;border-radius:0;font:16px var(--sans)}input:focus,textarea:focus{outline:0;border-color:var(--ink);box-shadow:0 1px var(--ink)}textarea{resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}#form-status{font-size:14px;line-height:1.7}.film-dialog{padding:50px 30px 30px}.film-dialog img{margin-bottom:28px}.film-dialog h2{font-family:var(--sans);font-size:28px;letter-spacing:-1px}.film-dialog .eyebrow{padding-right:30px;font-size:12px}@keyframes drift{from{transform:scale(1.02)}to{transform:scale(1.1) translateX(-.8%)}}@keyframes title-in{from{opacity:0;translate:0 16px}to{opacity:1;translate:0 0}}@media(min-width:1800px){.title-wrap h1{font-size:270px}}@media(max-width:700px){.nav{padding:22px 6%}.wordmark{font-size:44px}nav{gap:23px}nav button{font-size:14px}.hero{min-height:600px;max-height:1000px}.hero-kicker{top:125px;left:6%;right:6%;font-size:12px;letter-spacing:1px}.hero-kicker span:last-child{display:none}.title-wrap{top:40%}.title-wrap h1{font-size:18.6vw;letter-spacing:-.06em;padding:0 12px}.image-layer img{object-position:58% center}.hero-bottom{bottom:28px;left:6%;right:6%}.study-label{display:none}.films{padding:65px 6% 0}.section-top{display:block;margin-bottom:28px}.section-top h2{font-size:48px}.section-top p{margin-top:16px}.film-image{aspect-ratio:1.12}.image-caption{font-size:38px;bottom:25%;left:6%}.view-pill{bottom:7%;right:6%}.film-meta{align-items:flex-start;gap:12px}.film-meta h3{font-size:15px}.film-meta p{font-size:12px;margin-top:5px;text-align:right;line-height:1.8;letter-spacing:0}.film-meta p span{display:block;margin:0}.quiet-line{margin-top:55px;flex-wrap:wrap;padding:22px 0 35px;gap:8px}.quiet-line>span:first-child{font-size:32px}.quiet-line p{font-size:13px}.tempo{display:none}footer{padding:42px 6% 22px;display:block}.footer-logo{font-size:52px}footer>button{display:block;margin-top:23px;font-size:14px}.footer-bottom{margin-top:38px;flex-wrap:wrap;font-size:12px}.footer-bottom span:last-child{width:100%}.dialog-inner{padding:50px 25px 28px}.dialog-inner h2{font-size:45px}.film-dialog h2{font-size:26px}.form-row{grid-template-columns:1fr}.form-row label{margin-top:20px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.motion-toggle{display:none}}

/* Three-shot film and identity previews */
.motion-background{animation:none}.motion-background video{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.study-player{width:100%;display:block;margin-bottom:28px;background:#10130f}.study-label #scene-counter{margin-left:20px;font-variant-numeric:tabular-nums}.title-wrap.identity-preview{top:40%;transform:translateY(-25%)}.title-wrap .identity-logo{width:min(85vw,1250px);height:auto;margin:auto;filter:brightness(0) invert(1)}.logo-preview-toolbar{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:10;background:#f3f0e8;color:#252a24;display:flex;align-items:center;gap:18px;padding:12px 20px;box-shadow:0 5px 30px #0003;font-size:14px;max-width:calc(100vw - 30px);white-space:nowrap}.logo-preview-toolbar a{border-bottom:1px solid}.logo-preview-toolbar span{font-size:12px;color:#5a6356}.footer-bottom a{border-bottom:1px solid;padding-bottom:3px}@media(max-width:700px){.title-wrap.identity-preview{top:42%}.title-wrap .identity-logo{width:94vw}.motion-background video{object-position:58% center}.logo-preview-toolbar{gap:12px;padding:10px 14px}.logo-preview-toolbar span{display:none}}

.motion-background{background:url('assets/hero.png') center/cover no-repeat!important;animation:drift 24s ease-in-out infinite alternate!important}.motion-background video{display:none!important}.hero-bottom .motion-toggle{visibility:visible;display:grid;place-items:center;background:#10140c26;backdrop-filter:blur(5px)}.hero.motion-paused .motion-background{animation-play-state:paused!important}

footer.minimal-footer{display:flex;justify-content:center;align-items:center;text-align:center;padding:40px 6%;margin-top:70px;font-size:14px;letter-spacing:.04em}

.closing-message{text-align:center;margin-top:70px;padding:40px 0;border-top:1px solid var(--rule)}.closing-message p{margin:0;font-family:'Nanum Myeongjo',serif;font-size:clamp(17px,1.6vw,24px);font-weight:400;line-height:2.2;letter-spacing:.025em;word-break:keep-all}

.section-top .films-mark{display:inline-block;margin-left:10px;font-size:22px;line-height:1;vertical-align:super;transform:rotate(-12deg)}

.hero-bottom .motion-toggle{width:48px;height:48px;border:1px solid #fff9;background:#fff1;box-shadow:0 2px 16px #0001;transition:transform .2s,background .2s}.hero-bottom .motion-toggle:hover{background:#fff3;transform:rotate(-6deg) scale(1.06)}.hero-bottom .motion-toggle:active{transform:scale(.92)}.pause-glyph{display:flex;gap:5px;align-items:center;justify-content:center}.pause-glyph i{display:block;width:4px;height:15px;background:currentColor;border-radius:3px}.play-glyph{display:block;width:0;height:0;margin-left:3px;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid currentColor}

.closing-message{display:grid;grid-template-columns:80px 1fr 80px;align-items:center;gap:24px}.closing-message .closing-logo{justify-self:start}.closing-message p{grid-column:2}@media(max-width:700px){.closing-message{grid-template-columns:48px 1fr;gap:18px;text-align:left}.closing-message .closing-logo{font-size:44px}.closing-message p{font-size:16px}.closing-message p br{display:none}}

.closing-message p{font-size:clamp(14px,1.15vw,17px);line-height:1.6;color:#85877f;letter-spacing:.015em}@media(max-width:700px){.closing-message p{font-size:14px;line-height:1.6}}

.section-top .films-mark{font-family:var(--serif);font-size:.43em;font-weight:400;line-height:1;margin:0 0 0 .2em;vertical-align:super;transform:none;color:#92958b;letter-spacing:0}

.section-top .films-mark{color:var(--ink)}.closing-message p{font-size:13px;line-height:1.6}@media(max-width:700px){.closing-message{grid-template-columns:1fr;gap:16px;text-align:center}.closing-message .closing-logo{justify-self:center}.closing-message p{grid-column:1;font-size:clamp(10px,2.55vw,13px);white-space:nowrap;letter-spacing:0}}

/* Center the closing row between the film rail and footer. */
.closing-message{margin-top:0;padding:0;min-height:180px;border-top:0;align-items:center}.closing-message .closing-logo{display:flex;align-items:center;line-height:1;padding:0;transform:translateY(-2px)}.closing-message p{margin:0;align-self:center}footer.minimal-footer{margin-top:0}@media(max-width:700px){.closing-message{min-height:150px;grid-template-columns:44px 1fr;gap:14px;text-align:center}.closing-message .closing-logo{justify-self:start}.closing-message p{grid-column:2;white-space:normal;font-size:12px}}

/* Keep scroll geometry stable while the centered film grows. */
.film-rail{--film-width:min(78vw,980px);align-items:flex-start;scroll-snap-type:x mandatory;padding-inline:max(0px,calc((100% - var(--film-width))/2));scroll-padding-inline:0}
.film-rail .feature,.film-rail .feature:first-child{flex:0 0 var(--film-width);max-width:none;margin:0;scroll-snap-align:center;transform:scale(.88);transform-origin:center top;transition:transform .4s ease}
.film-rail .feature.is-active{transform:scale(1)}
@media(max-width:700px){.film-rail{--film-width:87vw;margin-right:0;padding-inline:0}.film-rail .feature,.film-rail .feature:first-child{flex-basis:var(--film-width)}}
@media(prefers-reduced-motion:reduce){.film-rail .feature{transition:none}}

/* A left-third activation point, with a glimpse of the previous film. */
.film-rail{position:relative;padding-inline:0;scroll-padding-left:10%;overflow-anchor:none}
.film-rail .feature,.film-rail .feature:first-child{scroll-snap-align:start}
.film-rail.is-recentering{scroll-behavior:auto;scroll-snap-type:none}
.film-rail{scroll-padding-left:16%}

/* Slim navigation stays visible, with a quiet surface after the hero begins scrolling. */
.nav{position:fixed;box-sizing:border-box;transition:padding .3s ease,background-color .3s ease,box-shadow .3s ease;color:#fffdf4}
.nav.is-scrolled{padding:10px 3.7%;background:rgba(39,44,37,.78);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 #fff2}
.nav.is-scrolled .wordmark{font-size:38px}
.nav.is-scrolled .wordmark span{font-size:28px}
.nav.is-scrolled nav a,.nav.is-scrolled nav button{padding:9px 0}
.nav .wordmark,.nav .wordmark span{transition:font-size .3s ease}
html{scroll-padding-top:76px}
@media(max-width:700px){.nav.is-scrolled{padding:8px 6%}.nav.is-scrolled .wordmark{font-size:34px}.nav.is-scrolled .wordmark span{font-size:25px}.nav.is-scrolled nav{gap:20px}.nav.is-scrolled nav a,.nav.is-scrolled nav button{font-size:12px;padding:9px 0}}
@media(prefers-reduced-motion:reduce){.nav,.nav .wordmark,.nav .wordmark span{transition:none}}

/* A slower, neutral glass transition and subtle menu hover feedback. */
.nav{transition:padding .65s cubic-bezier(.22,1,.36,1),background-color .8s ease,backdrop-filter .8s ease}
.nav.is-scrolled{background:rgba(48,48,48,.52);box-shadow:none;border-bottom:0;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
.nav .wordmark,.nav .wordmark span{transition:font-size .65s cubic-bezier(.22,1,.36,1)}
.nav nav a,.nav nav button{display:inline-block;transition:transform .3s ease,opacity .3s ease;transform-origin:center}
@media(hover:hover){.nav nav a:hover,.nav nav button:hover{transform:scale(1.045);opacity:.78}}
.nav nav a:focus-visible,.nav nav button:focus-visible{transform:scale(1.045)}
@media(prefers-reduced-motion:reduce){.nav,.nav .wordmark,.nav .wordmark span,.nav nav a,.nav nav button{transition:none}.nav nav a:hover,.nav nav button:hover,.nav nav a:focus-visible,.nav nav button:focus-visible{transform:none}}

/* Warm paper glass belongs to the site's editorial palette. */
.nav.is-scrolled{background:rgba(242,240,233,.86);color:#34382f;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:none;border:0;padding:9px 3.7%}
.nav{transition:padding .7s ease,background-color .8s ease,color .65s ease,backdrop-filter .8s ease}
.nav nav{align-items:center;gap:32px}
.nav nav a,.nav nav button{font-size:13px;letter-spacing:.025em}
.film-gallery{position:relative;margin-bottom:64px}
.film-arrow{position:absolute;top:calc(min(78vw,980px) / 1.55 / 2);transform:translateY(-50%);z-index:2;width:44px;height:52px;padding:0;border:0;background:none;color:#777b70;font:300 34px/1 Georgia,serif;transition:color .25s,scale .25s}
.film-prev{right:calc(100% + 12px)}.film-next{left:calc(100% + 12px)}
.film-arrow:hover{color:var(--ink);scale:1.08}
@media(max-width:700px){.nav.is-scrolled{padding:8px 6%}.nav nav{gap:18px}.nav nav a,.nav nav button{font-size:12px}.films{padding-inline:34px}.film-arrow{top:calc(87vw / 1.08 / 2);width:30px;font-size:27px}.film-prev{right:calc(100% + 2px)}.film-next{left:calc(100% + 2px)}.film-gallery{margin-bottom:40px}}
@media(prefers-reduced-motion:reduce){.nav,.film-arrow{transition:none}}

/* Narrow, tall chevrons without a surrounding button shape. */
.film-arrow{font-size:0;display:grid;place-items:center}
.film-arrow::before{content:'';display:block;width:10px;height:30px;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%,0 92%,76% 50%,0 8%)}
.film-prev::before{transform:rotate(180deg)}
.nav.is-scrolled{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.nav.is-scrolled>.wordmark{opacity:0;visibility:hidden;pointer-events:none}
.nav>.wordmark{transition:opacity .45s ease,visibility .45s ease,font-size .65s ease}
.nav.is-scrolled nav{color:#fffdf4;text-shadow:none}
.nav.is-scrolled{mix-blend-mode:difference}
@media(max-width:700px){.film-arrow{font-size:0}.film-arrow::before{width:8px;height:26px}}
@media(prefers-reduced-motion:reduce){.nav>.wordmark{transition:none}}

/* The small signature belongs to the hero; only the menu follows scrolling. */
.nav{justify-content:flex-end}
.hero-wordmark{position:absolute;z-index:3;top:25px;left:3.7%;color:#fffdf4}
.title-wrap h1{animation:wordmark-breathe 16s ease-in-out infinite;transform-origin:center center;will-change:transform}
@keyframes wordmark-breathe{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
@media(max-width:700px){.hero-wordmark{top:22px;left:6%}}
@media(prefers-reduced-motion:reduce){.title-wrap h1{animation:none;transform:none;will-change:auto}}

/* Center the main title in both axes at every viewport size. */
.title-wrap,.title-wrap.identity-preview{top:50%;transform:translateY(-50%)}

/* Reveal the centered title without movement or repeating scale. */
.title-wrap{animation:title-fade-in 3s ease .3s both}
.title-wrap h1{animation:none;transform:none;will-change:auto}
@keyframes title-fade-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.title-wrap{animation:none;opacity:1}}

/* Static title and a stable menu position; scrolling changes color only. */
.title-wrap,.title-wrap h1{animation:none;opacity:1;translate:none;will-change:auto}
.nav,.nav.is-scrolled{padding:25px 3.7%;transition:color .65s ease;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.nav nav a,.nav nav button,.nav.is-scrolled nav a,.nav.is-scrolled nav button{padding:14px 0;font-size:13px}
.nav nav,.nav.is-scrolled nav{gap:32px}
@media(max-width:700px){.nav,.nav.is-scrolled{padding:22px 6%}.nav nav,.nav.is-scrolled nav{gap:18px}.nav nav a,.nav nav button,.nav.is-scrolled nav a,.nav.is-scrolled nav button{padding:14px 0;font-size:12px}}
@media(prefers-reduced-motion:reduce){.nav{transition:none}}

/* Small optical correction for the italic wordmark. */
.title-wrap h1{position:relative;left:-.6vw}

/* Leave room for italic ascenders and descenders inside the fade mask. */
.title-wrap{padding-block:3vw}

/* Extra bleed protects the long italic descender from the mask boundary. */
.title-wrap{padding-block:5vw;mask-image:url('assets/title-dissolve-patches.svg');-webkit-mask-image:url('assets/title-dissolve-patches.svg');mask-size:100% 400%;-webkit-mask-size:100% 400%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;mask-position:0 100%;-webkit-mask-position:0 100%}

.title-wrap{mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-position:0 0;-webkit-mask-position:0 0;mask-composite:intersect;-webkit-mask-composite:source-in}

.title-wrap{mask-composite:add;-webkit-mask-composite:source-over}

.title-wrap{mask-image:url('assets/title-frontier.svg');-webkit-mask-image:url('assets/title-frontier.svg');mask-size:100% 400%;-webkit-mask-size:100% 400%;mask-position:0 100%;-webkit-mask-position:0 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat}

.film-image.scroll-reveal{
 --film-alpha-mask:radial-gradient(ellipse 58% 78% at var(--film-patch-left,17%) 24%,rgba(0,0,0,var(--film-alpha-patch-a,0)),transparent),radial-gradient(ellipse 72% 95% at var(--film-patch-right,82%) 68%,rgba(0,0,0,var(--film-alpha-patch-b,0)),transparent),linear-gradient(var(--film-reveal-angle,110deg),rgba(0,0,0,var(--film-alpha-top,.18)),rgba(0,0,0,var(--film-alpha-middle,.18)) 48%,rgba(0,0,0,var(--film-alpha-bottom,.18)));
 mask-image:var(--film-alpha-mask);-webkit-mask-image:var(--film-alpha-mask);
 mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat;
 mask-mode:alpha;mask-composite:add;-webkit-mask-composite:source-over;
}
.film-image.scroll-reveal:focus-visible{mask-image:none;-webkit-mask-image:none}
@media(prefers-reduced-motion:reduce){.film-image.scroll-reveal{mask-image:none;-webkit-mask-image:none}}