.how{position:relative;isolation:isolate}.how__pattern{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none}.how__text{margin:var(--space-xs) 0 0}.how__steps{display:grid;margin:0;border-top:var(--border-width) solid var(--color-line)}.how__step{position:relative;padding:var(--space-lg) 0}.how__step+.how__step{border-top:var(--border-width) solid var(--color-line)}.how__media{--media-ratio: 4 / 3;margin-block-end:var(--space-md);border:var(--border-width) solid var(--color-line)}.how__step-head{display:flex;align-items:flex-end;gap:var(--space-sm);margin-block-end:var(--space-md)}.how__number{flex:none;font-family:var(--font-heading-family);text-transform:uppercase;font-size:clamp(4.5rem,3.5rem + 4vw,8rem);font-weight:var(--font-heading-weight);font-variant-numeric:tabular-nums;line-height:.78;letter-spacing:0;color:transparent;-webkit-text-stroke:1.5px var(--color-ink);transition:color var(--duration) var(--ease-snap),-webkit-text-stroke-color var(--duration) var(--ease-snap)}.how__step:hover .how__number{color:var(--color-accent-text);-webkit-text-stroke-color:var(--color-accent)}@supports not (-webkit-text-stroke: 1px black){.how__number{color:var(--color-muted)}}.how__rule{flex:1;height:0;margin-block-end:.4rem;border-top:var(--border-width) dashed var(--color-line-strong)}.how__step:last-child .how__rule{border-top-style:solid;border-top-color:var(--color-accent)}.how__title{margin-block-end:var(--space-2xs);font-family:var(--font-heading-family);font-size:var(--text-h3);font-weight:var(--font-heading-weight);line-height:1.02;letter-spacing:var(--tracking-heading);text-transform:uppercase}.how__step-text{max-width:34ch;color:var(--color-muted)}.how__step-text p:last-child{margin-block-end:0}@media(min-width:750px){.how__steps{grid-template-columns:repeat(var(--steps, 3),minmax(0,1fr));border-bottom:var(--border-width) solid var(--color-line)}.how__step{padding:var(--space-lg) var(--space-lg) var(--space-xl)}.how__step:first-child{padding-inline-start:0}.how__step+.how__step{border-top:0;border-inline-start:var(--border-width) solid var(--color-line)}}@media(min-width:750px)and (max-width:1099px){.how__steps--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
/*# sourceMappingURL=/cdn/shop/t/6/assets/section-how-it-works.css.map */
