.ma-how-it-works{padding-top:var(--ma-pt, 0);padding-bottom:var(--ma-pb, 0);position:relative;overflow:hidden;--hiw-panel: var(--ma-hiw-panel, #fceae0);--hiw-track-bg: #fcfcfc}.ma-how-it-works>.ma-wave{z-index:3}.ma-how-it-works__layout{display:flex;flex-direction:column}.ma-how-it-works__copy{background:var(--hiw-panel);display:flex;align-items:center;justify-content:center;padding:72px var(--ma-gutter, 20px) 40px}.ma-how-it-works__copy-inner{max-width:408px;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}.ma-how-it-works__spark{width:40px;height:40px;color:var(--ma-terracotta);display:block}.ma-how-it-works__spark svg{width:100%;height:100%;display:block}.ma-how-it-works__heading{font-family:var(--ma-font-display);font-size:32px;line-height:1.2;color:var(--ma-ink);margin:0}.ma-how-it-works__body{font-family:var(--ma-font-body);font-size:16px;line-height:var(--ma-lh-body);color:var(--ma-ink);text-transform:none}.ma-how-it-works__body p{margin:0}.ma-how-it-works__carousel{position:relative;display:block;background:var(--hiw-track-bg);padding:24px 0 32px}.ma-how-it-works__track{list-style:none;margin:0;padding:0 var(--ma-gutter, 20px);scroll-padding:0 var(--ma-gutter, 20px);display:flex;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}.ma-how-it-works__track::-webkit-scrollbar{display:none}.ma-how-it-works__carousel.is-ready .ma-how-it-works__track{cursor:grab}.ma-how-it-works__carousel.is-dragging .ma-how-it-works__track{scroll-snap-type:none;cursor:grabbing;-webkit-user-select:none;user-select:none}.ma-how-it-works__card{flex:0 0 min(86vw,340px);aspect-ratio:1;scroll-snap-align:start;padding:11% 9.25%;container-type:inline-size}.ma-how-it-works__card-body{position:relative;width:100%;height:100%}.ma-how-it-works__blob{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:0;overflow:visible}.ma-how-it-works__img{position:absolute;z-index:1;left:var(--ix, 38.5%);top:var(--iy, 11.5%);width:var(--iw, 49.5%);height:var(--ih, 76.9%);object-fit:contain;object-position:center bottom;pointer-events:none;-webkit-user-drag:none}.ma-how-it-works__img--placeholder{opacity:.25}.ma-how-it-works__name{position:relative;z-index:2;margin:0;font-family:var(--ma-font-display);font-size:9.8cqw;line-height:.95;color:var(--ma-olive);text-transform:uppercase;max-width:62%;word-break:keep-all;overflow-wrap:normal;-webkit-hyphens:none;hyphens:none}.is-text-only .ma-how-it-works__name{max-width:100%}.is-wide .ma-how-it-works__img{object-position:center}.ma-how-it-works__tags{position:absolute;z-index:2;left:0;bottom:0;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;align-items:flex-start;gap:2.45cqw}.ma-how-it-works__tags li{font-family:var(--ma-font-body);font-size:max(11px,3.98cqw);line-height:1.6;color:var(--ma-ink);background:var(--hiw-panel);border:1px solid var(--ma-terracotta);border-radius:var(--ma-r-pill);padding:.3em .92em;white-space:nowrap}.ma-how-it-works__arrow,.ma-how-it-works__dots{display:none}.ma-how-it-works__carousel.is-ready .ma-how-it-works__arrow{display:grid;place-items:center;position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:0;background:var(--ma-terracotta);color:#fff;cursor:pointer;z-index:4;transition:background .2s ease,transform .2s ease}.ma-how-it-works__carousel.is-ready .ma-how-it-works__arrow:hover{background:var(--ma-terracotta-dark, #d4733b)}.ma-how-it-works__arrow svg{width:22px;height:22px}.ma-how-it-works__arrow--prev{left:8px}.ma-how-it-works__arrow--next{right:8px}.ma-how-it-works__arrow:focus-visible{outline:2px solid var(--ma-olive);outline-offset:3px}.ma-how-it-works__carousel.is-ready .ma-how-it-works__dots{display:flex;justify-content:center;gap:8px;margin-top:16px}.ma-how-it-works__dot{width:6px;height:6px;padding:0;border:0;border-radius:12px;background:var(--ma-terracotta);opacity:.45;cursor:pointer;transition:width .3s ease,opacity .3s ease}.ma-how-it-works__dot[aria-selected=true]{width:60px;opacity:1}.ma-how-it-works__dot[hidden]{display:none}@media screen and (min-width:990px){.ma-how-it-works__layout{flex-direction:row;min-height:586px}.ma-how-it-works__copy{flex:0 0 40.28%;justify-content:flex-start;padding:60px 40px 60px 8.33vw}.ma-how-it-works__copy-inner{align-items:flex-start;text-align:left;gap:28px}.ma-how-it-works__title-group{display:inline-flex;flex-direction:column;align-items:center;gap:28px}.ma-how-it-works__spark{width:56px;height:56px}.ma-how-it-works__heading{font-size:40px;line-height:48px}.ma-how-it-works__body{font-size:20px;line-height:var(--ma-lh-body-lg)}.ma-how-it-works__carousel{flex:1 1 auto;min-width:0;padding:100px 0 40px;position:static}.ma-how-it-works__carousel-inner{position:relative}.ma-how-it-works__track{padding:0 0 0 100px;scroll-padding:0 0 0 100px}.ma-how-it-works__card{flex-basis:400px}.ma-how-it-works__carousel.is-ready .ma-how-it-works__arrow{width:48px;height:48px;top:293px}.ma-how-it-works__arrow svg{width:24px;height:24px}.ma-how-it-works__arrow--prev{left:calc(40.28% - 24px)}.ma-how-it-works__arrow--next{right:0}.ma-how-it-works__carousel.is-ready .ma-how-it-works__dots{margin-top:40px}}@media screen and (min-width:990px){.ma-how-it-works__layout{position:relative}}@media(prefers-reduced-motion:reduce){.ma-how-it-works__track{scroll-behavior:auto}.ma-how-it-works__dot,.ma-how-it-works__arrow{transition:none}}@media screen and (max-width:749px){.ma-how-it-works__carousel.is-ready .ma-how-it-works__arrow{display:none}}@media screen and (max-width:989px){.ma-how-it-works{--hiw-track-bg: var(--hiw-panel);background:var(--hiw-panel)}}@media screen and (max-width:989px){.ma-how-it-works__spark{margin-inline:auto}}@media screen and (min-width:750px)and (max-width:989px){.ma-how-it-works__card{--hiw-w: calc((100vw - 2 * var(--ma-gutter, 20px)) / 2 - 12px);aspect-ratio:1 / .88;padding-block:calc(var(--hiw-w) * .04)}}.ma-how-it-works__card{--hiw-w: min(86vw, 340px);flex-basis:var(--hiw-w);padding:calc(var(--hiw-w) * .11) calc(var(--hiw-w) * .0925)}@media screen and (min-width:750px)and (max-width:989px){.ma-how-it-works__card{--hiw-w: calc((100vw - 2 * var(--ma-gutter, 20px)) / 2 - 12px);padding-block:calc(var(--hiw-w) * .04)}}@media screen and (min-width:990px){.ma-how-it-works__card{--hiw-w: 400px}}
/*# sourceMappingURL=/cdn/shop/t/37/assets/section-ma-how-it-works-v2.css.map */