.how__inner{display:grid;gap:3rem;align-items:center;max-width:var(--page-width);margin-inline:auto;padding-inline:var(--page-margin)}.how__frame{position:relative;overflow:hidden;min-height:27.5rem;border-radius:var(--style-border-radius-card);background-color:var(--color-accent)}.how__image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:70% center}.how__caption{position:absolute;bottom:1.5rem;left:1.5rem;padding:.75rem 1.25rem;border-radius:999px;background-color:var(--color-background);color:var(--color-foreground);font-weight:var(--font-weight-bold);font-size:var(--type-label-sm)}.how__content{--how-align: var(--align-mobile, start);display:flex;flex-direction:column;align-items:var(--how-align);text-align:var(--how-align)}.how__steps{width:100%}.how__content .heading{margin-block-start:1rem}.how__steps{margin:2rem 0 0;padding:0;list-style:none}.how__step{--how-divider-start: 3.125rem ;--how-divider-end: var(--how-divider-start);display:grid;position:relative;grid-template-columns:2.125rem 1fr;gap:1rem}.how__step+.how__step{margin-block-start:1.25rem;padding-block-start:1.25rem}.how__step+.how__step:before{position:absolute;top:0;inset-inline:var(--how-divider-start) var(--how-divider-end);border-block-start:1px solid var(--color-border);content:""}.how__step-number{display:grid;place-items:center;width:2.125rem;height:2.125rem;border-radius:50%;background-color:color-mix(in srgb,var(--color-accent) 18%,transparent);color:var(--color-accent-text);font-weight:var(--font-weight-bold);font-size:var(--type-label);line-height:1}.how__step-title{font-weight:var(--font-weight-bold);font-size:1rem}.how__step-text{margin-block-start:.25rem;color:var(--color-muted);font-size:var(--type-label);line-height:1.625}.how__button{margin-block-start:2rem}@media screen and (max-width:749px){.how--align-mobile-center .how__step{--how-divider-start: 0;grid-template-columns:1fr;justify-items:center;gap:.5rem}.how--align-mobile-end .how__step{grid-template-columns:1fr 2.125rem}.how--align-mobile-end .how__step-number{order:2;text-align:end}}@media screen and (min-width:750px){.how__content{--how-align: var(--align-desktop, start);justify-self:var(--how-content-position, start);width:100%;max-width:var(--how-content-width, none)}.how--align-desktop-center .how__step{--how-divider-start: 0;--how-divider-end: 0;grid-template-columns:1fr;justify-items:center;gap:.5rem}.how--align-desktop-end .how__step{grid-template-columns:1fr 2.125rem}.how--align-desktop-end .how__step-number{order:2;text-align:end}.how__inner{grid-template-columns:1fr .9fr;gap:3rem;min-height:800px}.how__media{order:-1}.how__frame{min-height:46rem}}.how--ratio-portrait .how__frame,.how--ratio-tall .how__frame,.how--ratio-square .how__frame,.how--ratio-landscape .how__frame{min-height:0}.how--ratio-portrait .how__frame{aspect-ratio:4 / 5}.how--ratio-tall .how__frame{aspect-ratio:2 / 3}.how--ratio-square .how__frame{aspect-ratio:1 / 1}.how--ratio-landscape .how__frame{aspect-ratio:4 / 3}@media screen and (min-width:750px){.how:not(.how--ratio-auto) .how__inner,.how:not(.how--ratio-auto) .how__frame{min-height:0}.how--bleed{overflow-x:clip}.how--bleed .how__inner{container-type:inline-size}.how--bleed .how__media{margin-inline:calc((100cqi - 100vw)/2) 0}.how--bleed .how__frame{border-radius:0}.how--bleed.how--ratio-auto .how__inner{align-items:stretch}.how--bleed.how--ratio-auto .how__content{align-self:center}.how--bleed.how--ratio-auto .how__media{margin-block:calc(var(--padding-top, 0px) * -1) calc(var(--padding-bottom, 0px) * -1)}.how--bleed.how--ratio-auto .how__frame{height:100%}}
/*# sourceMappingURL=/cdn/shop/t/58/assets/section-how-it-works.css.map */