.hn-howto{background:var(--pdp-bg);color:var(--pdp-ink)}.hn-howto__inner{display:flex;flex-direction:column}.hn-howto__steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.8rem,2.4vw,2.8rem)}.hn-howto__step{position:relative;display:flex;flex-direction:column;min-width:0;background:var(--pdp-panel);border:1px solid var(--pdp-border);color:inherit;overflow:hidden}.hn-howto__step:after{content:"";position:absolute;right:1.8rem;bottom:1.8rem;width:3.2rem;height:3px;background:var(--hn-red)}.hn-howto__media{position:relative;aspect-ratio:16 / 10;overflow:hidden;background:var(--pdp-soft);border-bottom:1px solid var(--pdp-border)}.hn-howto__image{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.22,1,.36,1)}.hn-howto__step:hover .hn-howto__image{transform:scale(1.035)}.hn-howto__fallback{position:relative;width:100%;height:100%;background:radial-gradient(circle at 12% 18%,rgba(238,31,42,.2),transparent 28%),linear-gradient(135deg,var(--pdp-panel-strong),var(--pdp-soft))}.hn-howto__fallback:before{content:"";position:absolute;top:1.6rem;right:1.6rem;bottom:1.6rem;left:1.6rem;border:1px solid var(--pdp-border)}.hn-howto__fallback:after{content:"";position:absolute;left:1.8rem;bottom:1.8rem;width:4rem;height:3px;background:var(--hn-red)}.hn-howto__fallback-num{position:absolute;right:1.8rem;top:1.4rem;font-family:var(--hn-font-display);font-size:clamp(7rem,8vw,10rem);letter-spacing:var(--hn-ls-display);line-height:.8;color:var(--pdp-ink);opacity:.12}.hn-howto__num{position:absolute;left:1.6rem;top:1.6rem;display:inline-flex;align-items:center;justify-content:center;width:4.8rem;height:4.8rem;font-family:var(--hn-font-display);font-size:2.8rem;letter-spacing:0;line-height:1;color:#fff;background:var(--hn-red);border:1px solid var(--hn-red);z-index:2}.hn-howto__text{display:flex;flex-direction:column;gap:1rem;min-width:0;padding:clamp(2rem,2.8vw,2.8rem);padding-bottom:clamp(2.8rem,3.4vw,3.6rem)}.hn-howto__title{margin:0;font-family:var(--hn-font-display);font-size:clamp(3rem,3.5vw,4rem);font-weight:var(--hn-regular);letter-spacing:var(--hn-ls-display);line-height:.92;text-transform:uppercase;color:var(--pdp-ink)}.hn-howto__body{margin:0;font-family:var(--hn-font-body);font-size:1.45rem;line-height:1.58;color:var(--pdp-muted);max-width:36rem}@media screen and (max-width:989px){.hn-howto__steps{grid-template-columns:1fr}.hn-howto__step{display:grid;grid-template-columns:minmax(14rem,.42fr) 1fr}.hn-howto__media{aspect-ratio:auto;min-height:18rem;border-right:1px solid var(--pdp-border);border-bottom:0}}@media screen and (max-width:749px){.hn-howto__step{display:flex}.hn-howto__media{aspect-ratio:16 / 10;min-height:0;border-right:0;border-bottom:1px solid var(--pdp-border)}.hn-howto__num{width:4.2rem;height:4.2rem;font-size:2.4rem}}@media(prefers-reduced-motion:reduce){.hn-howto__image{transition:none}.hn-howto__step:hover .hn-howto__image{transform:none}}@media(forced-colors:active){.hn-howto__step{border:2px solid ButtonText}}
/*# sourceMappingURL=/cdn/shop/t/87/assets/hn-pdp-how-to-use.css.map */