:root{--vh:100dvh}@supports not (height:100dvh){:root{--vh:100vh}}:root{--progress:0;--overlay:0;--scale:1}*{box-sizing:border-box}html,body{margin:0}.cover{display:grid}.hero{grid-area:1 / 1;position:sticky;top:0;height:var(--vh);overflow:hidden;z-index:0}.hero__bg{position:absolute;inset:0;background:var(--hero-bg) center / cover no-repeat;transform:scale(var(--scale));will-change:transform;transition:transform 0.1s cubic-bezier(.25,.1,.25,1)}.hero__overlay{position:absolute;inset:0;background:rgba(0,0,0,var(--overlay));pointer-events:none;transition:background 0.1s linear}.content{grid-area:1 / 1;z-index:1;margin-top:var(--vh);background:linear-gradient(rgb(244 240 238) 0%,rgb(255 255 255) 80%);padding:0;position:relative}.content::before{content:"";position:sticky;top:0;height:96px;margin-top:-96px;background:linear-gradient(to bottom,rgb(255 255 255),#fff0);pointer-events:none}@media screen and (max-width:1000px){:root{--vh:50dvh}@supports not (height:50dvh){:root{--vh:50vh}}}@media screen and (max-width:767px){.no-hero-js .hero{position:static;height:auto;overflow:visible}.no-hero-js .content{margin-top:0}.no-hero-js .hero__bg{transform:none}.no-hero-js .hero__overlay{background:rgb(0 0 0 / .25)}}