/* The supplied 16:9 film is the opening scene; copy and controls stay in HTML above it. */
.melli-hero-film{position:absolute;inset:0;z-index:3;overflow:hidden;pointer-events:none;opacity:var(--hero-film-opacity,0);visibility:hidden;background:#f7ecdd}
.has-hero-film .melli-hero-film{visibility:visible}
.melli-hero-film__media{position:absolute;left:var(--hero-band-left,15%);top:var(--hero-band-top,20%);width:var(--hero-band-width,70vw);height:var(--hero-band-height,55%);overflow:hidden;transition:opacity .25s ease;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-composite:source-in;mask-composite:intersect}
.melli-hero-film__poster,.melli-hero-film__video,.melli-hero-film__point,.melli-hero-film__idle{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center;user-select:none;-webkit-user-drag:none}
.melli-hero-film__video{opacity:0;transition:opacity .25s ease}
.melli-hero-film.has-video-frame .melli-hero-film__video{opacity:1}
.melli-hero-film__point{opacity:0;transition:opacity .22s ease}
.melli-hero-film.has-point-frame .melli-hero-film__point{opacity:1}
.melli-hero-film__idle{opacity:0;transition:opacity .22s ease}
.melli-hero-film.has-idle-frame .melli-hero-film__idle{opacity:1}
.melli-hero-film__exit-poster,.melli-hero-film__exit-video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none;user-select:none;-webkit-user-drag:none;opacity:0}
.melli-hero-film__exit-video{transition:opacity .12s ease}
.melli-hero-film__media::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#f7ecdd55,transparent 36%);pointer-events:none}
.melli-hero-film__ending{position:absolute;left:var(--hero-band-left,15%);top:var(--hero-band-top,20%);width:var(--hero-band-width,70vw);height:var(--hero-band-height,55%);object-fit:cover;object-position:center;opacity:0;transition:opacity .42s ease;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-composite:source-in;mask-composite:intersect;user-select:none;-webkit-user-drag:none}
.melli-hero-film.has-ending-pose .melli-hero-film__media{opacity:0}
.melli-hero-film.has-ending-pose .melli-hero-film__ending{opacity:1;transition-delay:.2s}
.has-hero-film>#world{opacity:var(--hero-film-world-opacity,1)}
.navigation{height:88px}
.stage .intro{padding-top:clamp(115px,15vh,170px)}
.stage .shot-label{top:15%}
@media(min-width:761px){.stage.has-hero-film .intro-bottom{bottom:var(--hero-copy-bottom,17vh)}}
.hero-film-opening>.melli-greet{display:none}
.hero-film-opening>.yarn-caption.character-caption{visibility:hidden}
.hero-film-copy-pending .intro>.eyebrow,.hero-film-copy-pending .intro h1>span,.hero-film-copy-pending .intro h1>em,.hero-film-copy-pending .intro-bottom{opacity:0}
.hero-film-copy-active .intro>.eyebrow{animation:melli-copy-reveal .7s .1s both}
.hero-film-copy-active .intro h1>span{display:inline-block;animation:melli-copy-reveal .85s .42s both}
.hero-film-copy-active .intro h1>em{display:inline-block;animation:melli-copy-reveal .9s 1.12s both}
.hero-film-copy-active .intro-bottom{animation:melli-copy-reveal .9s 1.78s both}
@keyframes melli-copy-reveal{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.melli-hero-film__greet{position:absolute;z-index:6;right:5%;top:25%;width:36%;height:54%;padding:0;border:0;border-radius:50%;background:transparent;visibility:hidden;pointer-events:none;cursor:pointer}
.melli-hero-film__greet.is-active{visibility:visible;pointer-events:auto}
.melli-hero-film__greet:focus-visible{outline:2px dashed #b82b3880;outline-offset:5px}
@media(max-width:760px){
  .navigation{height:72px}
  .stage .intro{padding-top:clamp(98px,14vh,135px)}
  .melli-hero-film__media{left:auto;right:0;top:47%;width:100%;height:auto;aspect-ratio:16/9;-webkit-mask-image:linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent)}
  .melli-hero-film__media::after{display:none}
  .melli-hero-film__ending{left:auto;right:0;top:47%;width:100%;height:auto;aspect-ratio:16/9;-webkit-mask-image:linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(180deg,transparent,#000 8%,#000 92%,transparent)}
  .melli-hero-film__greet{top:34%;right:15%;width:70%;height:27%}
}
@media(prefers-reduced-motion:reduce){.melli-hero-film__video,.melli-hero-film__point,.melli-hero-film__idle,.melli-hero-film__exit-video{display:none}.melli-hero-film__media,.melli-hero-film__ending{transition:none}.hero-film-copy-pending .intro>.eyebrow,.hero-film-copy-pending .intro h1>span,.hero-film-copy-pending .intro h1>em,.hero-film-copy-pending .intro-bottom{opacity:1}.hero-film-copy-active .intro>.eyebrow,.hero-film-copy-active .intro h1>span,.hero-film-copy-active .intro h1>em,.hero-film-copy-active .intro-bottom{animation:none}}
