:root{--hero-padding:theme("variables.padding.x.default");--hero-background:var(--color-transparent);--hero-color:var(--color-black);--hero-min-height:max(40rem,55vh);--hero-max-height:55rem;--hero-max-width:58rem;--hero-margin-overlap:clamp(4.7rem,6vw,9.4rem)}.hero{background:var(--hero-background);color:var(--hero-color);display:flex;flex-direction:column;z-index:0;&.hero-large{margin-bottom:calc(var(--hero-margin-overlap)*-1);padding-bottom:calc(var(--padding-y)*1 + var(--hero-margin-overlap));padding-top:calc(var(--padding-y)*4);@media (min-width:768px){padding-bottom:calc(var(--padding-y)*2);padding-top:calc(var(--padding-y)*3)}}&.hero-small{padding-bottom:calc(var(--padding-y)*1);padding-top:calc(var(--padding-y)*3);@media (min-width:768px){padding-bottom:calc(var(--padding-y)*1);padding-top:calc(var(--padding-y)*2)}}}.hero-wrapper{display:flex;grid-gap:1rem;height:100%}.hero-content{position:relative}.hero-content-wrapper{.hero-small &{display:flex;flex-direction:column;gap:2rem;@media (min-width:768px){align-items:flex-start;flex-direction:row}&>*{flex:1 1 0}}}.hero-title{max-width:1000px}.hero-text{max-width:800px}.hero-media{inset:0;position:absolute;z-index:-1;& img,& video{height:100%;object-fit:cover;width:100%}}