.city-media-surface{position:relative;isolation:isolate;--city-x:20%;--city-poster:url(/assets/images/city-poster.webp)}@supports ((background-image:-webkit-image-set(url("") type("image/avif"))) or (background-image:image-set(url("") type("image/avif")))){.city-media-surface{--city-poster:image-set(url("/assets/images/city-poster.avif") type("image/avif"),url("/assets/images/city-poster.webp") type("image/webp"))}}.city-media-surface.central-bg-1{--city-x:40%}.city-media-surface.central-bg-2{--city-x:60%}.city-media-surface.central-bg-3{--city-x:80%}.city-media-surface.central-bg-4{--city-x:100%}.city-animation{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;opacity:0}.city-animation[data-ready=true]{opacity:1}.city-animation video{position:absolute;inset:0;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:var(--city-x) 100%;object-position:var(--city-x) 100%}.city-animation__lighting{position:absolute;inset:0;background:url(/assets/images/ellipse.webp) 700% -75%/95% 70% no-repeat}.city-animation[data-fallback=true]{background:url(/assets/gifs/bg.gif) var(--city-x) 100% /cover no-repeat}.city-animation[data-fallback=true] video{display:none}@media (max-width:992px){.city-animation__lighting{background-image:linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),url(/assets/images/ellipse.webp);background-size:cover,95% 70%;background-position:100% 100%,700% -75%;background-repeat:no-repeat}}