.hero{position:relative;height:100svh;min-height:560px;overflow:hidden;color:var(--violet-02)}.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:120px;display:flex;flex-direction:column;align-items:flex-start;gap:34px}.hero__title{max-width:9em}.hero__scroll{position:absolute;left:50%;bottom:39px;display:block;width:34px;height:34px;margin-left:-17px;color:var(--violet-02);transform:rotate(-90deg) scaleY(-1)}.hero__scroll .icon{width:100%;height:100%}.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));margin-left:0;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}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/section-hero.css.map */
