.hero{align-items:flex-end;background:#000;background-position:50%;background-size:cover;clip-path:inset(0 0 0 0);color:#fff;display:flex;height:calc(100vh - 40px);position:relative;width:100%}.hero__content{padding-bottom:80px}.hero__content h1{margin:0;opacity:1;transform:translateY(0);transition:transform .5s ease-in-out,opacity .4s ease-in-out}.hero__video{height:100%;left:0;-o-object-fit:cover;object-fit:cover;position:absolute;top:0;width:100%;z-index:-1}.hero--stories{font-family:Saol Text,serif}.hero--stories .hero__content{left:50%;padding-bottom:0;position:absolute;top:50%;transform:translate(-50%,-50%);width:var(--container-width)}.hero--stories .hero__content h1{font-size:115px;line-height:1;text-align:center}.transitioning .hero{transition:all 1s cubic-bezier(.83,0,.17,1)}.before-enter .hero{clip-path:inset(0 0 100% 0);transform:translateY(-60px)}.before-enter .hero h1{opacity:0;transform:translateY(40px)}.leave .hero{clip-path:inset(100% 0 0 0);transform:translateY(60px)}.leave .hero h1{opacity:0;transform:translateY(40px)}.page-enter-active .hero,.page-leave-active .hero{clip-path:inset(0 0 0 0);transition:all .5s ease-in-out}.page-enter-from .hero,.page-leave-to .hero{clip-path:inset(100% 0 0 0);transform:translateY(50px)}.page-enter-from .hero h1,.page-leave-to .hero h1{opacity:0;transform:translateY(50px)}@media (max-width:1200px){.hero{height:94vh}}
