/* A 1.2-second brand reveal, including the fade. Independent of app loading. */
html[data-lagos-logo-reveal] body::before,
html[data-lagos-logo-reveal] body::after{
 content:"";position:fixed;inset:0;pointer-events:none;
 animation-duration:1.2s;animation-fill-mode:both;animation-iteration-count:1;
}
html[data-lagos-logo-reveal] body::before{
 z-index:70;background:#fbfcfe;
 animation-name:lagos-brand-veil;animation-timing-function:cubic-bezier(.22,.61,.36,1);
}
html[data-lagos-logo-reveal] body::after{
 z-index:71;
 background:url('/images/brand/lagos-logo.png') center center/clamp(155px,18vw,205px) auto no-repeat;
 animation-name:lagos-brand-mark;animation-timing-function:cubic-bezier(.22,.61,.36,1);
}
@keyframes lagos-brand-veil{
 0%,30%{opacity:1;visibility:visible}
 100%{opacity:0;visibility:hidden}
}
@keyframes lagos-brand-mark{
 0%{opacity:0;transform:translateY(4px) scale(.975);visibility:visible}
 18%,36%{opacity:1;transform:translateY(0) scale(1);visibility:visible}
 100%{opacity:0;transform:translateY(-3px) scale(1.015);visibility:hidden}
}
@media(max-height:500px){
 html[data-lagos-logo-reveal] body::after{background-size:auto 44svh}
}
@media(prefers-reduced-motion:reduce){
 html[data-lagos-logo-reveal] body::before,
 html[data-lagos-logo-reveal] body::after{display:none;animation:none}
}