.wm-howto{padding:var(--spacing-10xl) var(--container-padding);background:transparent}.wm-howto__title{text-align:center;margin:0 0 var(--spacing-3xl);font-family:var(--font-family-display);font-weight:var(--font-weight-black);font-size:var(--font-size-display-section-sm);line-height:var(--line-height-display-section-sm);letter-spacing:var(--tracking-display-tight);color:var(--color-text-primary)}.wm-howto__card{max-width:var(--width-xl, 768px);border:var(--border-width-thin) solid var(--color-border-subtle);border-radius:var(--radius-sm);overflow:hidden}.wm-howto__steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0}.wm-howto__step{display:flex;flex-direction:column}.wm-howto__step+.wm-howto__step{border-left:var(--border-width-thin) solid var(--color-border-subtle)}.wm-howto__step .wm-howto__media{display:block;width:auto;margin-inline:var(--spacing-3xl);overflow:hidden;border-radius:var(--radius-2xl);aspect-ratio:5 / 4;background:var(--color-surface-subtle)}.wm-howto__media img{width:100%;height:100%;object-fit:cover}.wm-howto__step-body{display:flex;gap:var(--spacing-lg);align-items:flex-start;padding:var(--spacing-xl) var(--spacing-3xl);border-top:var(--border-width-thin) solid var(--color-border-subtle)}.wm-howto__num{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:var(--size-3xl);height:var(--size-3xl);background:var(--color-surface-inverse);color:var(--color-text-on-brand);font-family:var(--font-family-body);font-weight:var(--font-weight-bold);font-size:var(--font-size-xs);border-radius:var(--radius-xxs)}.wm-howto__step p{margin:0;font-family:var(--font-family-body);font-weight:var(--font-weight-light);font-size:var(--font-size-sm);line-height:var(--line-height-sm);color:var(--color-text-primary)}.wm-howto__footer{display:flex;align-items:center;justify-content:flex-end;margin-top:var(--spacing-xl)}.wm-howto__controls{display:none;align-items:center;gap:0}.wm-howto__nav{display:inline-flex;align-items:center;justify-content:center;padding:var(--spacing-md);background:none;border:0;cursor:pointer;color:var(--color-text-primary);border-radius:var(--radius-xxs);transition:opacity .2s ease,transform .2s ease}@media(hover:hover){.wm-howto__nav:hover i{font-family:Phosphor-Bold!important}}.wm-howto__nav:active{transform:scale(.8)}.wm-howto__nav i{font-size:var(--size-2xl)}.wm-howto__link{font-family:var(--font-family-accent);font-weight:var(--font-weight-regular);font-size:var(--font-size-md);color:var(--color-text-primary);text-decoration:underline}@media(hover:hover){.wm-howto__link:not([data-wm-sweep]):hover{font-weight:var(--font-weight-medium)}.wm-howto__link[data-wm-sweep]:hover .wm-bsw{font-weight:var(--font-weight-medium)}}.wm-howto--flavoured{margin-left:var(--container-padding);margin-right:var(--container-padding);border-radius:var(--radius-6xl);overflow:hidden;background:linear-gradient(180deg,var(--flavour-bg) 0%,var(--flavour-bg-2) 100%)}.wm-howto--flavoured .wm-howto__title{color:var(--color-text-on-brand)}.wm-howto--flavoured .wm-howto__card{border:0;border-radius:var(--radius-5xl);background:color-mix(in srgb,var(--flavour-bg) 32%,white);padding:var(--spacing-8xl) var(--spacing-9xl);max-width:1024px}.wm-howto--flavoured .wm-howto__steps{gap:var(--spacing-6xl)}.wm-howto--flavoured .wm-howto__step+.wm-howto__step{border-left:0}.wm-howto--flavoured .wm-howto__step-body{border-top:0;padding:var(--spacing-xl) var(--spacing-3xl) 0}.wm-howto--flavoured .wm-howto__step .wm-howto__media{border-radius:var(--radius-2xl);background:color-mix(in srgb,var(--flavour-bg) 18%,white)}.wm-howto--flavoured .wm-howto__nav,.wm-howto--flavoured .wm-howto__link{color:var(--color-text-on-brand)}@media(hover:hover){.wm-howto--flavoured .wm-howto__link:hover{color:var(--color-text-on-brand);font-weight:var(--font-weight-medium)}}@media(max-width:768px){.wm-howto{padding:var(--spacing-8xl) var(--container-padding)}.wm-howto--flavoured{margin-left:0;margin-right:0}.wm-howto__card{max-width:none}.wm-howto__steps{display:flex;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none}.wm-howto__steps::-webkit-scrollbar{display:none}.wm-howto__step{flex:0 0 78vw;scroll-snap-align:start}.wm-howto__step+.wm-howto__step{border-left:var(--border-width-thin) solid var(--color-border-subtle);border-top:0}.wm-howto__media{aspect-ratio:5 / 4}.wm-howto__footer{justify-content:flex-start;gap:0}.wm-howto__nav[data-howto-prev]{margin-left:calc(-1 * var(--spacing-lg))}.wm-howto__controls{display:contents}.wm-howto__nav[data-howto-prev]{order:0}.wm-howto__link{order:1;margin:0 var(--spacing-md)}.wm-howto__nav[data-howto-next]{order:2}.wm-howto--flavoured .wm-howto__card{border-radius:var(--radius-4xl);padding:var(--spacing-5xl) var(--spacing-3xl)}.wm-howto--flavoured .wm-howto__steps{gap:var(--spacing-3xl);margin-left:calc(-1 * var(--spacing-3xl));margin-right:calc(-1 * var(--spacing-3xl));padding-left:var(--spacing-3xl);padding-right:var(--spacing-3xl);scroll-padding-left:var(--spacing-3xl)}.wm-howto--flavoured .wm-howto__step{flex:0 0 100%}}.wm-howto--nested{padding:var(--spacing-9xl) 0 0;background:none!important;margin-left:0;margin-right:0;border-radius:0;overflow:visible}.wm-howto--nested .wm-howto__title{color:var(--color-text-primary);margin-bottom:var(--spacing-4xl)}.wm-howto--nested .wm-howto__card{position:relative;max-width:none;border:0;border-radius:var(--radius-5xl);padding:var(--spacing-4xl) var(--spacing-9xl);background:none;overflow:hidden;display:flex;flex-direction:column;gap:var(--spacing-4xl);align-items:center}.wm-howto--nested .wm-howto__card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:color-mix(in srgb,var(--wm-page-accent, var(--flavour-bg, #e8443a)) 6%,white);pointer-events:none}.wm-howto--nested .wm-howto__card>*{position:relative}.wm-howto--nested .wm-howto__steps{display:flex;gap:var(--spacing-6xl);width:100%}.wm-howto--nested .wm-howto__step{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:var(--spacing-3xl);border:0}.wm-howto--nested .wm-howto__step+.wm-howto__step{border-left:0}.wm-howto--nested .wm-howto__step .wm-howto__media{aspect-ratio:854 / 961;height:auto;width:100%;border-radius:var(--radius-2xl);background:none}.wm-howto--nested .wm-howto__media img{width:100%;height:100%;object-fit:cover;object-position:center}.wm-howto--nested .wm-howto__step-body{border-top:0;padding:0;gap:var(--spacing-lg)}.wm-howto--nested .wm-howto__step .wm-howto__media{margin-inline:0}.wm-howto--nested .wm-howto__step p{font-size:var(--font-size-md);line-height:var(--line-height-md);color:var(--color-text-primary)}.wm-howto--nested .wm-howto__num{width:var(--size-3xl);height:var(--size-3xl);background:none;color:var(--color-text-primary);border:var(--border-width-thin) solid var(--color-border-default);border-radius:var(--radius-sm);font-family:var(--font-family-accent);font-weight:var(--font-weight-medium);font-size:var(--font-size-sm)}.wm-howto--nested .wm-howto__footer{margin:0;justify-content:center;width:100%}.wm-howto--nested .wm-howto__controls{display:none}.wm-howto--nested .wm-howto__link{font-size:var(--font-size-md);line-height:var(--line-height-md);color:var(--color-text-primary)}@media(max-width:768px){.wm-howto--nested{padding:calc(var(--spacing-11xl) * 1.5) 0 0}.wm-howto--nested .wm-howto__card{border-radius:var(--radius-4xl);padding:var(--spacing-3xl)}.wm-howto--nested .wm-howto__steps{flex-direction:row;gap:var(--spacing-4xl);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;width:calc(100% + 2 * var(--spacing-3xl));margin-left:calc(-1 * var(--spacing-3xl));margin-right:calc(-1 * var(--spacing-3xl));padding-left:var(--spacing-3xl);padding-right:var(--spacing-3xl);scroll-padding-left:var(--spacing-3xl)}.wm-howto--nested .wm-howto__steps::-webkit-scrollbar{display:none}.wm-howto--nested .wm-howto__step{flex:0 0 100%;scroll-snap-align:start}}@media(max-width:768px){.wm-howto__nav{padding:var(--spacing-xs)}}
/*# sourceMappingURL=/cdn/shop/t/21/assets/wm-product-how-to-use.css.map */