.hero-frame{--hf-inset: 2.4rem;--hf-corner: 2.8rem;position:relative;color:#fff}.hero-frame__link{position:relative;display:block;color:inherit;text-decoration:none}.hero-frame__media img,.hero-frame__media .placeholder-svg{display:block;width:100%;height:auto}.hero-frame__corner{position:absolute;width:var(--hf-corner);height:var(--hf-corner);border:0 solid rgba(255,255,255,.85);pointer-events:none}.hero-frame__corner--tl{top:var(--hf-inset);left:var(--hf-inset);border-top-width:1px;border-left-width:1px}.hero-frame__corner--tr{top:var(--hf-inset);right:var(--hf-inset);border-top-width:1px;border-right-width:1px}.hero-frame__corner--bl{bottom:var(--hf-inset);left:var(--hf-inset);border-bottom-width:1px;border-left-width:1px}.hero-frame__corner--br{bottom:var(--hf-inset);right:var(--hf-inset);border-bottom-width:1px;border-right-width:1px}.hero-frame__label{position:absolute;display:inline-flex;align-items:center;gap:.8rem;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:1.2rem;letter-spacing:.14em;text-transform:uppercase;text-shadow:0 1px 6px rgba(0,0,0,.35)}.hero-frame__label--tl{top:calc(var(--hf-inset) + 1.2rem);left:calc(var(--hf-inset) + 1.4rem)}.hero-frame__label--tr{top:calc(var(--hf-inset) + 1.2rem);right:calc(var(--hf-inset) + 1.4rem)}.hero-frame__label--bl{bottom:calc(var(--hf-inset) + 1.2rem);left:calc(var(--hf-inset) + 1.4rem)}.hero-frame__label--br{bottom:calc(var(--hf-inset) + 1.2rem);right:calc(var(--hf-inset) + 1.4rem)}.hero-frame__rec{width:.8rem;height:.8rem;background:#e0321f;border-radius:50%;animation:hero-frame-rec 1.6s steps(1,end) infinite}@keyframes hero-frame-rec{0%,60%{opacity:1}61%,to{opacity:0}}.hero-frame__cta span{transition:transform .3s ease}.hero-frame__link:hover .hero-frame__cta span{transform:translate(.4rem)}.hero-frame__link:hover .hero-frame__corner{border-color:#fff}.hero-frame__link:focus-visible{outline:2px solid #fff;outline-offset:-6px}@media screen and (min-width:990px){.hero-frame{--hf-inset: 4rem;--hf-corner: 4rem}.hero-frame__corner--tl,.hero-frame__corner--tr{top:calc(var(--hf-inset) + 9rem)}.hero-frame__label--tl,.hero-frame__label--tr{top:calc(var(--hf-inset) + 10.2rem)}.hero-frame__label{font-size:1.3rem}}@media screen and (max-width:989px){.hero-frame{--hf-inset: 1.4rem;--hf-corner: 2rem}.hero-frame__corner--tl,.hero-frame__corner--tr{top:calc(var(--hf-inset) + 6.4rem)}.hero-frame__label--tl,.hero-frame__label--tr{top:calc(var(--hf-inset) + 7.4rem)}.hero-frame__label{font-size:1.05rem;letter-spacing:.1em}.hero-frame__label--tl,.hero-frame__label--bl{left:calc(var(--hf-inset) + 1rem)}.hero-frame__label--tr,.hero-frame__label--br{right:calc(var(--hf-inset) + 1rem)}}@media(prefers-reduced-motion:reduce){.hero-frame__rec{animation:none}}.hero-frame__line{display:none}.hero-frame--line .hero-frame__line{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:clamp(3.2rem,8vw,16rem);font-family:Archivo,sans-serif;font-stretch:68%;font-weight:600;font-size:clamp(3.2rem,4.4vw,8.8rem);line-height:1;letter-spacing:-.01em;text-transform:uppercase;color:#fff;text-shadow:0 0 2.4rem rgba(0,0,0,.15);pointer-events:none}.hero-frame--line .hero-frame__corner,.hero-frame--line .hero-frame__label--tl,.hero-frame--line .hero-frame__label--tr{display:none}.hero-frame--line .hero-frame__label{font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:1.3rem;letter-spacing:.04em}.hero-frame--line .hero-frame__label--bl{left:1.6rem;bottom:1.6rem}.hero-frame--line .hero-frame__label--br{right:1.6rem;bottom:1.6rem;text-decoration:underline;text-underline-offset:.3rem}@media screen and (max-width:749px){.hero-frame--line .hero-frame__line{gap:2.4rem;font-size:3.4rem}.hero-frame--line .hero-frame__label{font-size:1.1rem}}.hero-frame--banner .hero-frame__media{position:relative;height:var(--hf-height, 100vh);min-height:56rem;overflow:hidden}.hero-frame--banner .hero-frame__media img,.hero-frame--banner .hero-frame__media .placeholder-svg{position:absolute;top:0;left:var(--hf-box-left, 0%);width:var(--hf-box-w, 100%);max-width:none;height:100%;object-fit:cover;object-position:50% var(--hf-focus-y, 30%)}@media screen and (max-width:749px){.hero-frame--banner .hero-frame__media{height:95vh;min-height:48rem}.hero-frame--banner .hero-frame__media img{left:0;width:100%;object-position:54% var(--hf-focus-y, 30%)}}
/*# sourceMappingURL=/cdn/shop/t/5/assets/custom-hero-frame.css.map */