/* Entry sequence and full-screen film landing. */
#lex-montage .loader{
 position:fixed;inset:0;z-index:80;display:flex;flex-direction:column;
 align-items:center;justify-content:center;gap:32px;
 background:var(--lex-yellow);color:#000;opacity:1;
 padding:max(30px,env(safe-area-inset-top)) 5% max(30px,env(safe-area-inset-bottom));
 overflow:hidden;
}
#lex-montage .loader-mark{position:relative;width:min(100%,1260px);aspect-ratio:1606/229}
#lex-montage .loader-logo{position:absolute;inset:0;display:block;width:100%;height:100%;transform-origin:50% 50%}
#lex-montage .loader-logo-top{clip-path:inset(0 0 48% 0);animation:lex-logo-top-in .65s cubic-bezier(.16,.85,.18,1) both}
#lex-montage .loader-logo-bottom{clip-path:inset(52% 0 0 0);animation:lex-logo-bottom-in .72s cubic-bezier(.16,.85,.18,1) .07s both}
#lex-montage .loader-status{
 position:absolute;bottom:max(36px,env(safe-area-inset-bottom));left:5%;right:5%;
 margin:0;text-align:center;font:400 16px/1.4 LEXAlpina,Georgia,serif;
}
#lex-montage .loader.is-leaving{pointer-events:none;animation:lex-loader-out .42s cubic-bezier(.65,0,.25,1) both}
#lex-montage .loader.is-leaving .loader-logo-top{animation:lex-logo-top-out .32s cubic-bezier(.65,0,.3,1) both}
#lex-montage .loader.is-leaving .loader-logo-bottom{animation:lex-logo-bottom-out .32s cubic-bezier(.65,0,.3,1) .04s both}
#lex-montage .loader.is-leaving .loader-status{opacity:0;transition:opacity .12s}
#lex-montage .loader-retry{position:absolute;bottom:max(70px,env(safe-area-inset-bottom));padding:12px 16px;text-align:center;font-size:16px}
#lex-montage.is-loading .chrome,
#lex-montage.is-intro .chrome{visibility:hidden;pointer-events:none}
#lex-montage.is-intro .art{
 left:max(2.2vw,env(safe-area-inset-left));right:max(2.2vw,env(safe-area-inset-right));
 top:max(2.2dvh,env(safe-area-inset-top));bottom:max(2.2dvh,env(safe-area-inset-bottom));
}
#lex-montage .art-question-pair .word:first-child{top:0;height:61%}
#lex-montage .art-question-pair .word:last-child{bottom:0;height:32%}
#lex-montage .art-question-print .word:nth-child(1){top:0;left:0;right:22%;height:23%}
#lex-montage .art-question-print .word:nth-child(2){top:0;left:82%;right:0;height:23%}
#lex-montage .art-question-print .word:nth-child(3){top:29%;bottom:0}
#lex-montage.is-intro .scene.enter{animation:none}

#lex-montage.is-landing{--lex-fg:var(--lex-paper);--lex-bg:#000}
#lex-montage.is-landing .chrome{color:var(--lex-paper)}

#lex-montage.is-landing .scene.enter{animation:lex-landing-reveal .5s ease both}
#lex-montage.is-landing .scene.enter .landing-wordmark{animation:lex-home-logo-in .65s cubic-bezier(.16,.85,.18,1) both}
#lex-montage .trailer-backdrop{position:absolute;inset:0;overflow:hidden;pointer-events:none}
#lex-montage .hero-trailer-poster,
#lex-montage .hero-trailer-video{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
#lex-montage .hero-trailer-video{opacity:0}
#lex-montage .hero-trailer-video.has-frame{opacity:1}
#lex-montage.is-landing .shade{
 background:linear-gradient(180deg,rgba(0,0,0,.44) 0%,rgba(0,0,0,.06) 24%,rgba(0,0,0,.08) 44%,rgba(0,0,0,.62) 77%,rgba(0,0,0,.76) 100%);
}
#lex-montage .landing{
 position:absolute;inset:0;color:var(--lex-paper);display:flex;flex-direction:column;
 padding:clamp(105px,14vh,170px) 5% max(23px,env(safe-area-inset-bottom));
}
#lex-montage .landing-identity{width:100%;margin-top:clamp(12px,8vh,110px)}
#lex-montage .landing-wordmark{
 display:block;width:100%;aspect-ratio:1606/229;margin:0;background:var(--lex-yellow);
 -webkit-mask:url('assets/logo-horizontal.svg') center/contain no-repeat;
 mask:url('assets/logo-horizontal.svg') center/contain no-repeat;
}
#lex-montage .landing-credits{display:grid;grid-template-columns:.8fr 1.3fr;gap:clamp(24px,6vw,90px);margin-top:clamp(20px,2.4vw,38px);color:var(--lex-yellow);font:400 clamp(12px,1.5vw,23px)/1.14 LEXMontage,Arial,sans-serif;letter-spacing:.02em;text-align:left;text-shadow:0 1px 3px #0002}
#lex-montage .landing-credits p{margin:0;min-width:0}
#lex-montage .landing-credits span{display:block}
#lex-montage .landing-credit-director{text-align:right}
#lex-montage .landing-choices{
 display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:26px;
 width:100%;margin-top:auto;padding-top:35px;
}
#lex-montage .landing-choices :is(button,a){
 display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:10px;
 padding:16px 0 15px;border-top:1px solid rgba(241,238,231,.6);
 min-height:95px;min-width:0;text-align:left;
 transition:color .2s,border-color .2s;
}
#lex-montage .landing-choices :is(button,a) span{font-size:clamp(17px,1.55vw,24px);line-height:1.3;letter-spacing:.065em;overflow-wrap:normal}
#lex-montage .landing-choices :is(button,a) small{font-size:12px;line-height:1.3;opacity:.7;text-transform:none}
#lex-montage .landing-choices :is(button,a):hover,
#lex-montage .landing-choices :is(button,a):focus-visible{color:var(--lex-yellow);border-color:var(--lex-yellow)}
#lex-montage.is-landing .chrome button:hover{color:var(--lex-yellow)}

@keyframes lex-landing-reveal{from{opacity:0}to{opacity:1}}
@keyframes lex-logo-top-in{from{transform:translateY(-38%) scaleX(1.35) scaleY(.2);opacity:0}to{transform:none;opacity:1}}
@keyframes lex-logo-bottom-in{from{transform:translateY(44%) scaleX(.64) scaleY(.2);opacity:0}to{transform:none;opacity:1}}
@keyframes lex-logo-top-out{to{transform:translateY(-55%) scaleX(1.45) scaleY(.06);opacity:0}}
@keyframes lex-logo-bottom-out{to{transform:translateY(55%) scaleX(.72) scaleY(.06);opacity:0}}
@keyframes lex-loader-out{0%,40%{clip-path:inset(0)}100%{clip-path:inset(0 0 100% 0)}}
@keyframes lex-home-logo-in{from{transform:translateY(20px) scaleY(.25);opacity:0}to{transform:none;opacity:1}}
@media(max-width:900px) and (min-width:621px){
 #lex-montage .landing-choices{gap:18px}
 #lex-montage .landing-choices :is(button,a) span{font-size:17px}
}
@media(max-width:620px){
 #lex-montage .loader-logo{width:100%}
 #lex-montage .loader-status{bottom:max(26px,env(safe-area-inset-bottom));font-size:15px}

 #lex-montage .landing{padding-top:100px;padding-bottom:max(12px,env(safe-area-inset-bottom))}
 #lex-montage .landing-identity{margin-top:clamp(12px,8vh,75px)}
 #lex-montage .landing-credits{grid-template-columns:.85fr 1.15fr;gap:14px;margin-top:20px;font-size:clamp(9px,2.65vw,14px);line-height:1.22}
 #lex-montage .landing-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;padding-top:30px}
 #lex-montage .landing-choices :is(button,a){min-height:82px;padding:14px 0 12px;gap:7px}
 #lex-montage .landing-choices :is(button,a) span{font-size:18px;line-height:1.3}
 #lex-montage .landing-choices :is(button,a) small{font-size:11px}
 #lex-montage .landing-choices :is(button,a):last-child{grid-column:1/-1;min-height:62px;flex-direction:row;align-items:center;gap:15px;padding:10px 0}
 #lex-montage .landing-choices :is(button,a):last-child small{white-space:nowrap}
}
@media(max-width:370px){
 #lex-montage.is-landing .chrome{gap:12px}
 #lex-montage.is-landing .brand{width:115px}
 #lex-montage.is-landing .header-right{gap:8px;font-size:12px}
 #lex-montage .landing-choices{gap:0 18px}
 #lex-montage .landing-choices :is(button,a) span{font-size:16px}
}
@media(max-height:600px) and (max-width:620px){
 #lex-montage .landing{padding-top:85px}
 #lex-montage .landing-identity{margin-top:12px}
 #lex-montage .landing-choices{padding-top:20px}
 #lex-montage .landing-choices :is(button,a){min-height:74px;padding-top:10px;padding-bottom:10px}
 #lex-montage .landing-choices :is(button,a):last-child{min-height:54px}
}
@media(max-height:540px) and (min-width:621px){
 #lex-montage .landing{padding-top:72px;padding-bottom:max(7px,env(safe-area-inset-bottom))}
 #lex-montage .landing-identity{margin-top:0;width:72%}
 #lex-montage .landing-credits{font-size:12px;margin-top:14px;gap:25px}
 #lex-montage .landing-choices{padding-top:20px;gap:22px}
 #lex-montage .landing-choices :is(button,a){min-height:66px;padding-top:10px;padding-bottom:8px;gap:8px}
 #lex-montage .landing-choices :is(button,a) span{font-size:16px}
 #lex-montage .landing-choices :is(button,a) small{font-size:12px}

}
@media(prefers-reduced-motion:reduce){
 #lex-montage .loader,
 #lex-montage .landing-choices :is(button,a){transition:none}
 #lex-montage.is-intro .scene.enter,
 #lex-montage.is-landing .scene.enter{animation:none}
}

/* The three-line master belongs to the mobile landing only. */
@media(max-width:620px){
 #lex-montage .landing-wordmark{aspect-ratio:2282/972;-webkit-mask-image:url('assets/logo-stacked.png');mask-image:url('assets/logo-stacked.png')}
 #lex-montage .landing-identity{margin-top:clamp(0px,3vh,26px)}
}
@media(max-width:620px) and (max-height:660px){
 #lex-montage .landing{padding-top:78px}
 #lex-montage .landing-identity{margin-top:0}
 #lex-montage .landing-wordmark{width:min(100%,calc((100dvh - 390px)*2.3477));min-width:200px;margin-inline:auto}
 #lex-montage .landing-credits{margin-top:14px}
 #lex-montage .landing-choices{padding-top:20px}
}

#lex-montage .landing-choices a{text-decoration:none}
