.shape-hero{--sh-accent: #dd1d1d;--sh-ease: cubic-bezier(.22, 1, .36, 1);--sh-fade: 1.1s;--sh-pad-inline: clamp(20px, 5vw, 72px);--sh-ui-height: 96px;position:relative;display:block;height:var(--sh-height);min-height:540px;overflow:hidden;background:#0a0a0c;color:#fff;isolation:isolate;touch-action:pan-y}.shape-hero--full{--sh-height: 100svh}.shape-hero--large{--sh-height: min(88svh, 960px)}.shape-hero--medium{--sh-height: min(70svh, 760px)}.shape-hero--compact{--sh-height: clamp(460px, calc(100svh - 230px) , 780px);min-height:460px}.shape-hero--compact .shape-hero__title{font-size:clamp(52px,7.4vw,118px)}.shape-hero__slides{position:absolute;top:0;right:0;bottom:0;left:0}.shape-hero__slide{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;visibility:hidden;transition:opacity var(--sh-fade) var(--sh-ease),visibility 0s linear var(--sh-fade)}.shape-hero__slide.is-active{z-index:1;opacity:1;visibility:visible;transition:opacity var(--sh-fade) var(--sh-ease),visibility 0s}.shape-hero__media{position:absolute;top:0;right:0;bottom:0;left:0;transform:scale(1.1);transition:transform 0s linear var(--sh-fade);will-change:transform}.shape-hero__slide.is-active .shape-hero__media{transform:scale(1);transition:transform calc(var(--shape-hero-duration, 7s) + var(--sh-fade)) cubic-bezier(.25,.1,.25,1)}.shape-hero__media :is(picture,img,video,svg){position:absolute;top:0;right:0;bottom:0;left:0;display:block;width:100%;height:100%;object-fit:cover}@media screen and (max-width:749px){.shape-hero__media img[style*=--mobile-x]{object-position:var(--mobile-x) 50%!important}}.shape-hero__placeholder{background:#1a1a1e;fill:#ffffff1f}.shape-hero__shade{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(to top,rgb(0 0 0 / calc(var(--overlay) * 1.1)) 0%,rgb(0 0 0 / calc(var(--overlay) * .35)) 42%,transparent 70%),linear-gradient(to right,rgb(0 0 0 / calc(var(--overlay) * .6)) 0%,transparent 55%)}.shape-hero__content{position:absolute;left:var(--sh-pad-inline);right:var(--sh-pad-inline);bottom:calc(var(--sh-ui-height, 96px) + clamp(24px,4vh,48px));display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:820px}.shape-hero__reveal{margin:0;overflow:hidden;padding-block:.06em}.shape-hero__reveal>span{display:inline-block;transform:translateY(110%);opacity:0;transition:transform .7s var(--sh-ease),opacity .4s ease}.shape-hero__slide.is-active .shape-hero__reveal>span{transform:none;opacity:1;transition:transform 1s var(--sh-ease) calc(.35s + var(--d) * .11s),opacity .7s ease calc(.35s + var(--d) * .11s)}.shape-hero__eyebrow{font-family:var(--font-heading--family);font-weight:700;font-size:13px;letter-spacing:.18em;text-transform:uppercase}.shape-hero__eyebrow>span{display:inline-flex;align-items:center;gap:10px}.shape-hero__eyebrow>span:before{content:"";width:22px;height:2px;background:var(--sh-accent)}.shape-hero__title{font-family:var(--shape-hero-title-font);font-weight:var(--shape-hero-title-weight);font-size:clamp(56px,9vw,148px);line-height:.88;letter-spacing:.005em;text-transform:uppercase;color:#fff;text-wrap:balance}.shape-hero__text{max-width:520px;font-size:clamp(15px,1.2vw,18px);line-height:1.5;color:#ffffffd1;text-wrap:pretty}.shape-hero__actions.shape-hero__reveal{margin-top:10px;overflow:visible}.shape-hero .shape-hero__cta{display:inline-flex;align-items:center;gap:12px;padding:16px 26px 16px 28px;border-radius:999px;font-family:var(--font-heading--family);font-weight:700;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:#fff;text-decoration:none;background:var(--sh-accent);box-shadow:0 10px 30px -10px #dd1d1db3;transition:background-color .3s ease,box-shadow .4s var(--sh-ease),transform .4s var(--sh-ease)}.shape-hero .shape-hero__cta svg{transition:transform .4s var(--sh-ease)}.shape-hero .shape-hero__cta:hover{background:#f02a2a;box-shadow:0 14px 36px -10px #dd1d1de6;transform:translateY(-2px)}.shape-hero .shape-hero__cta:hover svg{transform:translate(4px)}.shape-hero__ui{position:absolute;left:var(--sh-pad-inline);right:var(--sh-pad-inline);bottom:0;z-index:2;display:flex;align-items:flex-end;gap:32px;height:var(--sh-ui-height);padding-bottom:32px}.shape-hero__progress{flex:1;display:grid;grid-template-columns:repeat(var(--slide-count),minmax(0,1fr));gap:16px}.shape-hero__step{display:flex;flex-direction:column;gap:12px;min-width:0;padding:8px 0 0;border:0;background:none;color:#ffffff80;text-align:left;cursor:pointer;transition:color .3s ease}.shape-hero__step:hover,.shape-hero__step[aria-selected=true]{color:#fff}.shape-hero__step-head{display:flex;align-items:baseline;gap:10px;min-width:0;font-family:var(--font-heading--family);font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase}.shape-hero__step-num{flex:none;font-variant-numeric:tabular-nums}.shape-hero__step[aria-selected=true] .shape-hero__step-num{color:var(--sh-accent)}.shape-hero__step-label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.shape-hero__step-bar{position:relative;display:block;height:2px;overflow:hidden;border-radius:2px;background:#ffffff38}.shape-hero__step-bar i{position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;transform:scaleX(0);transform-origin:left}.shape-hero__step.is-done .shape-hero__step-bar i{transform:scaleX(1);background:#ffffff8c}.shape-hero__step[aria-selected=true] .shape-hero__step-bar i{animation:shape-hero-progress var(--shape-hero-duration, 7s) linear forwards}.shape-hero:not([data-autoplay]) .shape-hero__step[aria-selected=true] .shape-hero__step-bar i{animation:none;transform:scaleX(1)}.shape-hero.is-paused .shape-hero__step-bar i{animation-play-state:paused}@keyframes shape-hero-progress{to{transform:scaleX(1)}}.shape-hero__controls{display:flex;gap:8px}.shape-hero__button{display:grid;place-items:center;width:46px;height:46px;padding:0;border-radius:50%;border:1px solid rgb(255 255 255 / .28);background:#ffffff0f;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff;cursor:pointer;transition:background-color .25s ease,border-color .25s ease,transform .35s var(--sh-ease)}.shape-hero__button:hover{background:#ffffff29;border-color:#ffffff80}.shape-hero__button:active{transform:scale(.94)}.shape-hero__toggle .icon-play,.shape-hero.is-user-paused .shape-hero__toggle .icon-pause{display:none}.shape-hero.is-user-paused .shape-hero__toggle .icon-play{display:block}.shape-hero :focus-visible{outline:2px solid #fff;outline-offset:3px}@media screen and (max-width:749px){.shape-hero--large,.shape-hero--full{--sh-height: 86svh}.shape-hero--compact{--sh-height: 68svh;min-height:440px}.shape-hero{--sh-ui-height: 72px}.shape-hero__ui{gap:16px;padding-bottom:24px}.shape-hero__progress{gap:6px}.shape-hero__step{gap:0}.shape-hero__step-head,.shape-hero__controls [data-action=prev],.shape-hero__controls [data-action=next]{display:none}.shape-hero__button{width:40px;height:40px}.shape-hero__content{gap:10px}.shape-hero__title{font-size:clamp(52px,15vw,80px)}.shape-hero .shape-hero__cta{padding:14px 22px 14px 24px}}@media(prefers-reduced-motion:reduce){.shape-hero__media,.shape-hero__slide.is-active .shape-hero__media{transform:none;transition:none}.shape-hero__reveal>span,.shape-hero__slide.is-active .shape-hero__reveal>span{transform:none;transition:opacity .3s ease}}
/*# sourceMappingURL=/cdn/shop/t/4/assets/shape-hero.css.map */