.vb{pointer-events:none;isolation:isolate;--sat:.65;--tint:.38;--scrim:.56;--scrimD:.42;--tc:#4a4fa6;overflow:hidden}.vb .po,.vb .mv{object-fit:cover;width:100%;height:100%;filter:saturate(var(--sat));position:absolute;inset:0}.vb .mv{opacity:0;transition:opacity 1.6s linear}.vb .mv.on{opacity:1}.vb .tn{background:var(--tc);mix-blend-mode:multiply;opacity:var(--tint);position:absolute;inset:0}.vb .sc{background:var(--bg);opacity:var(--scrim);position:absolute;inset:0}:root[data-theme=dark] .vb .sc{opacity:var(--scrimD)}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .vb .sc{opacity:var(--scrimD)}}.vb[data-slot=morning]{--tc:#7c8ccf;--tint:.32}.vb[data-slot=day]{--tc:#6f74b8;--tint:.24}.vb[data-slot=dusk]{--tc:#c4854f;--tint:.34;--sat:.75}.vb[data-slot=night]{--tc:#383c8c;--tint:.45}.vb[data-slot=rain]{--tc:#4f5d80;--tint:.4}.lp .hero{isolation:isolate;position:relative}.lp .hero>.vb{z-index:-1;position:absolute;inset:0 0 -40px;-webkit-mask-image:linear-gradient(#000 0 38%,#00000059 75%,#0000 100%);mask-image:linear-gradient(#000 0 38%,#00000059 75%,#0000 100%)}:root[data-theme=light] .lp .hero>.vb{--sat:.92;bottom:0;-webkit-mask-image:linear-gradient(#000 0 60%,#0000 100%);mask-image:linear-gradient(#000 0 60%,#0000 100%)}:root[data-theme=light] .lp .hero>.vb .tn{opacity:calc(var(--tint) * .4)}:root[data-theme=light] .lp .hero>.vb .sc{opacity:0}:root[data-theme=light] .lp .hero>.vb :is(.po,.mv){object-position:50% 22%}:root[data-theme=light] .lp .hero>.vb:after{content:"";background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 95%,transparent) 0,color-mix(in srgb,var(--bg) 95%,transparent) calc(50% + 150px),color-mix(in srgb,var(--bg) 70%,transparent) calc(50% + 340px),transparent calc(50% + 540px));position:absolute;inset:0}:root[data-theme=light] .lp .hero>.vb:is([data-slot=rain],[data-slot=night]) .sc{opacity:.72}@container lp (max-width:640px){:root[data-theme=light] .lp .hero>.vb{-webkit-mask-image:linear-gradient(#000 0 72%,#0000 100%);mask-image:linear-gradient(#000 0 72%,#0000 100%)}:root[data-theme=light] .lp .hero>.vb:after{background:linear-gradient(180deg,transparent 0,color-mix(in srgb,var(--bg) 10%,transparent) 64px,color-mix(in srgb,var(--bg) 78%,transparent) 150px,color-mix(in srgb,var(--bg) 95%,transparent) 185px)}:root[data-theme=light] .lp .hero>.vb[data-slot=dusk] .sc{opacity:.4}}@media (prefers-color-scheme:light){:root:not([data-theme=dark]) .lp .hero>.vb{--sat:.92;bottom:0;-webkit-mask-image:linear-gradient(#000 0 60%,#0000 100%);mask-image:linear-gradient(#000 0 60%,#0000 100%)}:root:not([data-theme=dark]) .lp .hero>.vb .tn{opacity:calc(var(--tint) * .4)}:root:not([data-theme=dark]) .lp .hero>.vb .sc{opacity:0}:root:not([data-theme=dark]) .lp .hero>.vb :is(.po,.mv){object-position:50% 22%}:root:not([data-theme=dark]) .lp .hero>.vb:after{content:"";background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 95%,transparent) 0,color-mix(in srgb,var(--bg) 95%,transparent) calc(50% + 150px),color-mix(in srgb,var(--bg) 70%,transparent) calc(50% + 340px),transparent calc(50% + 540px));position:absolute;inset:0}:root:not([data-theme=dark]) .lp .hero>.vb:is([data-slot=rain],[data-slot=night]) .sc{opacity:.72}@container lp (max-width:640px){:root:not([data-theme=dark]) .lp .hero>.vb{-webkit-mask-image:linear-gradient(#000 0 72%,#0000 100%);mask-image:linear-gradient(#000 0 72%,#0000 100%)}:root:not([data-theme=dark]) .lp .hero>.vb:after{background:linear-gradient(180deg,transparent 0,color-mix(in srgb,var(--bg) 10%,transparent) 64px,color-mix(in srgb,var(--bg) 78%,transparent) 150px,color-mix(in srgb,var(--bg) 95%,transparent) 185px)}:root:not([data-theme=dark]) .lp .hero>.vb[data-slot=dusk] .sc{opacity:.4}}}@container lp (min-width:641px) and (max-width:1060px){:root[data-theme=light] .lp .hero>.vb:after{background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 95%,transparent) 0,color-mix(in srgb,var(--bg) 95%,transparent) 74%,color-mix(in srgb,var(--bg) 60%,transparent) 88%,transparent 100%)}}@media (prefers-color-scheme:light){@container lp (min-width:641px) and (max-width:1060px){:root:not([data-theme=dark]) .lp .hero>.vb:after{background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 95%,transparent) 0,color-mix(in srgb,var(--bg) 95%,transparent) 74%,color-mix(in srgb,var(--bg) 60%,transparent) 88%,transparent 100%)}}}
