.hero{position:relative;height:100svh;min-height:560px;overflow:hidden;color:var(--violet-02)}.hero{perspective:2200px}.hero__media,.hero__image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.hero__image{object-fit:cover}.hero__content{position:absolute;left:var(--gutter);right:var(--gutter);bottom:40px;display:flex;flex-direction:column;align-items:flex-start;gap:24px}.hero__title{max-width:12em}.hero__scroll,.hero__vignette{display:none}@media screen and (min-width:990px){.hero{height:min(calc(963 * var(--u)),100svh);min-height:calc(620 * var(--u))}.hero__content{left:calc(79 * var(--u));right:auto;bottom:calc(72 * var(--u));width:calc(824 * var(--u));gap:calc(34 * var(--u))}.hero__title{max-width:none}.hero__scroll{position:absolute;left:calc(732 * var(--u));bottom:calc(77 * var(--u));display:block;width:calc(47 * var(--u));height:calc(47 * var(--u));color:var(--violet-02);transform:rotate(-90deg) scaleY(-1)}.hero__scroll .icon{width:100%;height:100%}.hero__scroll:hover .icon{animation:hero-scroll-nudge 1s var(--ease) infinite}.hero__vignette{position:absolute;right:calc(14 * var(--u));bottom:calc(77 * var(--u));display:block;width:calc(273.359 * var(--u));height:calc(317 * var(--u));border-radius:var(--radius);overflow:hidden}.hero__vignette img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}.hero__vignette:hover img{transform:scale(1.04)}}@keyframes hero-scroll-nudge{50%{transform:translate(-4px)}}.js .hero__image{animation:hero-zoom 1.6s var(--ease) both}.js .hero__title{animation:hero-unveil .9s var(--ease) .15s both}.js .hero__content .button,.js .hero__vignette,.js .hero__scroll{animation:hero-fade .8s var(--ease) both}.js .hero__content .button{animation-delay:.45s}.js .hero__vignette{animation-delay:.55s}.js .hero__scroll{animation-delay:.65s}@keyframes hero-zoom{0%{transform:scale(1.03)}}@keyframes hero-unveil{0%{opacity:0;transform:translateY(12px);clip-path:inset(0 0 100% 0)}to{opacity:1;transform:none;clip-path:inset(0 0 -20% 0)}}@keyframes hero-fade{0%{opacity:0}}@media(prefers-reduced-motion:reduce){.js .hero__image,.js .hero__title,.js .hero__content .button,.js .hero__vignette,.js .hero__scroll{animation:none}}.hero__cover{display:none}.has-intro .hero__cover{position:absolute;z-index:5;top:0;right:0;bottom:0;left:0;display:block;background:radial-gradient(120% 90% at 30% 20%,rgba(255,255,255,.07),transparent 60%),radial-gradient(90% 80% at 80% 90%,rgba(0,0,0,.35),transparent 70%),var(--violet-04);transform-origin:left center;backface-visibility:hidden;pointer-events:none;animation:hero-cover-open 1.25s cubic-bezier(.65,0,.25,1) 1.85s both}.has-intro .hero__cover:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,rgba(0,0,0,.45),transparent 70%);opacity:0;animation:hero-cover-shade 1.25s cubic-bezier(.65,0,.25,1) 1.85s both}.hero__cover-stitch{position:absolute;top:18px;right:18px;bottom:18px;left:18px;border:1.5px dashed rgba(189,151,242,.45);border-radius:6px}.hero__cover-logo{position:absolute;top:50%;left:50%;width:min(42vw,420px);color:var(--violet-02);transform:translate(-50%,-50%)}.hero__cover-logo .logo-hw__strokes path{stroke-dasharray:1 1;stroke-dashoffset:1;animation:logo-hw-draw var(--t, .3s) cubic-bezier(.45,0,.55,1) calc(var(--d, 0s) + .2s) forwards}@keyframes logo-hw-draw{to{stroke-dashoffset:0}}.hero__cover-logo .logo{width:100%;height:auto}@keyframes hero-cover-open{0%{transform:rotateY(0)}85%{opacity:1}to{transform:rotateY(-105deg);opacity:0;visibility:hidden}}@keyframes hero-cover-shade{0%{opacity:0}60%{opacity:1}to{opacity:1}}.has-intro .hero__image{animation:hero-zoom 1.8s var(--ease) 2s both}.has-intro .hero__title{animation-delay:2.6s}.has-intro .hero__content .button{animation-delay:2.85s}.has-intro .hero__vignette{animation-delay:2.95s}.has-intro .hero__scroll{animation-delay:3.05s}.site-header{transition:transform .4s var(--ease),opacity .6s var(--ease)}.has-intro:not(.intro-done) .site-header{opacity:0;pointer-events:none}@media(prefers-reduced-motion:reduce){.has-intro .hero__cover{display:none}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/section-hero.css.map */