.how-it-works{display:grid;background-color:var(--how-it-works-bg)}.shopify-section--how-it-works{overflow:hidden}.how-it-works__media{min-height:280px;overflow:hidden}.how-it-works__media img,.how-it-works__media svg{display:block;width:100%;height:100%;object-fit:cover}.how-it-works__media svg{background-color:#e8e2d8}.how-it-works__content{display:flex;flex-direction:column;justify-content:center;padding-top:var(--how-it-works-padding-top-mobile);padding-bottom:var(--how-it-works-padding-bottom-mobile);padding-left:20px;padding-right:20px}.how-it-works__eyebrow{margin:0 0 32px;color:var(--how-it-works-eyebrow-color);font-family:var(--text-font-family);font-size:12px;line-height:16px;font-weight:500;letter-spacing:.02em;text-transform:uppercase}.how-it-works__heading{margin:0 0 48px;color:var(--how-it-works-heading-color);font-family:Sofia Pro,sans-serif;font-size:26px;line-height:32px;font-weight:500;letter-spacing:0;text-transform:uppercase}.how-it-works__list{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}.how-it-works__item{display:block;width:100%;margin:0;border:0;border-radius:0;background:transparent;text-align:left;cursor:pointer;-webkit-appearance:none;appearance:none;font:inherit;color:inherit}.how-it-works__item:focus-visible{outline:2px solid var(--how-it-works-title-active-color);outline-offset:4px}.how-it-works__item-header{display:flex;align-items:center;gap:12px}.how-it-works__icon{flex-shrink:0;width:30px;height:30px;opacity:.4;filter:grayscale(1)}.how-it-works__icon img,.how-it-works__icon svg{display:block;width:100%;height:100%;object-fit:contain}.how-it-works__item-title{margin:0;color:var(--how-it-works-title-color);font-size:16px;line-height:30px;font-weight:500;letter-spacing:.02em;text-transform:uppercase}.how-it-works__item-body{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .4s ease,opacity .3s ease}.how-it-works__item-body-inner{min-height:0;overflow:hidden;margin-left:30px}.how-it-works__item-text{display:block;margin:12px 0 0;color:var(--how-it-works-text-color);font-family:var(--text-font-family);font-size:16px;line-height:24px}.how-it-works__progress{position:relative;height:3px;background:transparent;display:block;margin-top:20px;margin-bottom:20px;max-width:calc(100% - 30px);margin-left:30px}.how-it-works__progress:before{content:"";position:absolute;inset-inline:0;top:50%;height:1px;background-color:var(--how-it-works-progress-track);transform:translateY(-50%)}.how-it-works__content-inner{max-width:426px}.how-it-works__progress-rail{display:block;position:relative;z-index:1;width:calc(100% - 42px);height:3px;transform:translate(0)}.how-it-works__progress-fill{display:block;width:42px;height:3px;background-color:var(--how-it-works-progress-fill);opacity:0}.how-it-works__item.is-active .how-it-works__icon{opacity:1;filter:none}.how-it-works__item.is-active .how-it-works__item-title{color:var(--how-it-works-title-active-color)}.how-it-works__item.is-active .how-it-works__item-body{grid-template-rows:1fr;opacity:1}.how-it-works__item.is-active .how-it-works__progress-fill{opacity:1}.how-it-works__item.is-active .how-it-works__progress-rail{animation:how-it-works-progress var(--how-it-works-duration) linear forwards}.how-it-works__list.is-manual .how-it-works__item.is-active .how-it-works__progress-rail{animation:none;transform:translate(100%)}@keyframes how-it-works-progress{0%{transform:translate(0)}to{transform:translate(100%)}}@media screen and (min-width:768px){.how-it-works{grid-template-columns:1fr 1fr;min-height:560px}.how-it-works--image-right .how-it-works__media{order:2}.how-it-works__media{min-height:100%}.how-it-works__content{padding-top:var(--how-it-works-padding-top);padding-bottom:var(--how-it-works-padding-bottom);padding-left:56px;padding-right:56px}}@media screen and (min-width:1024px){.how-it-works__content{padding-left:72px;padding-right:72px}}@media screen and (min-width:1224px){.how-it-works__content{padding-left:127px;padding-right:72px}}@media screen and (max-width:750px){.how-it-works__heading{font-size:24px}.how-it-works__heading{margin-bottom:24px}.how-it-works__progress{margin-left:0;max-width:100%}}
/*# sourceMappingURL=/cdn/shop/t/22/assets/custom-how-it-works.css.map */