.how-it-works{--hiw-bg: var(--color-background, #ffffff);--hiw-ink: var(--color-headings-text, #111111);--hiw-stone: #b5b3b0;--hiw-gap: 10px;--hiw-radius: 5px;--hiw-collapsed-width: 220px;--hiw-panel-height: 644px;--hiw-mobile-collapsed-height: 96px;--hiw-mobile-open-height: 520px;--hiw-transition-duration: .5s;--hiw-transition-easing: cubic-bezier(.4, 0, .2, 1);background:var(--hiw-bg);color:var(--hiw-ink)}.how-it-works__header{max-width:var(--site-max-width, 1600px);padding-left:calc(var(--gap, 8px) * 2);padding-right:calc(var(--gap, 8px) * 2);margin:0 auto 24px;box-sizing:border-box}@media(min-width:1200px){.how-it-works__header{padding-left:calc(calc(var(--gap, 8px) * 2) + calc(var(--gap, 8px) * 2));padding-right:calc(calc(var(--gap, 8px) * 2) + calc(var(--gap, 8px) * 2))}}@media(min-width:1800px){.how-it-works__header{max-width:var(--site-max-width-big, 1600px)}}.how-it-works__heading{font-family:BentonModDisp,serif;font-weight:400;font-size:30px;line-height:24px;margin:0}.how-it-works__panels{display:flex;align-items:stretch;gap:var(--hiw-gap);max-width:var(--site-max-width, 1600px);padding-left:calc(var(--gap, 8px) * 2);padding-right:calc(var(--gap, 8px) * 2);margin:0 auto;box-sizing:border-box}@media(min-width:1200px){.how-it-works__panels{padding-left:calc(calc(var(--gap, 8px) * 2) + calc(var(--gap, 8px) * 2));padding-right:calc(calc(var(--gap, 8px) * 2) + calc(var(--gap, 8px) * 2))}}@media(min-width:1800px){.how-it-works__panels{max-width:var(--site-max-width-big, 1600px)}}.how-it-works__panel{position:relative;border-radius:var(--hiw-radius);overflow:hidden;background:var(--hiw-stone);height:var(--hiw-panel-height);flex-grow:0;flex-shrink:0;transition:flex-basis var(--hiw-transition-duration) var(--hiw-transition-easing)}.how-it-works__panel.is-open{flex-basis:var(--hiw-panel-height)}.how-it-works__panel.is-collapsed{flex-basis:calc((100% - var(--hiw-panel-height) - (var(--hiw-panel-count, 4) - 1) * var(--hiw-gap)) / (var(--hiw-panel-count, 4) - 1))}.how-it-works__media{position:absolute;top:0;right:0;bottom:0;left:0;cursor:pointer;display:block;width:100%;height:100%;border:0;padding:0;background:none}.how-it-works__image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;display:none}.how-it-works__image--placeholder{display:none;align-items:center;justify-content:center;background:var(--hiw-stone)}.how-it-works__placeholder-svg{width:100%;height:100%;opacity:.5}.how-it-works__panel.is-open .how-it-works__image--open,.how-it-works__panel.is-open .how-it-works__image--open.how-it-works__image--placeholder,.how-it-works__panel.is-collapsed .how-it-works__image--collapsed-desktop,.how-it-works__panel.is-collapsed .how-it-works__image--collapsed-desktop.how-it-works__image--placeholder{display:block}.how-it-works__content-wrap{max-width:var(--site-max-width, 1600px);padding-left:calc(var(--gap, 8px) * 2);padding-right:calc(var(--gap, 8px) * 2);margin:24px auto 0;box-sizing:border-box}@media(min-width:1200px){.how-it-works__content-wrap{padding-left:calc(calc(var(--gap, 8px) * 2) + calc(var(--gap, 8px) * 2));padding-right:calc(calc(var(--gap, 8px) * 2) + calc(var(--gap, 8px) * 2))}}@media(min-width:1800px){.how-it-works__content-wrap{max-width:var(--site-max-width-big, 1600px)}}.how-it-works__content{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding-left:20px;box-sizing:border-box;transition:width var(--hiw-transition-duration) var(--hiw-transition-easing),margin-left var(--hiw-transition-duration) var(--hiw-transition-easing)}.how-it-works__content-text{min-width:0;flex:1 1 auto;max-width:482px;display:flex;flex-direction:column;gap:10px}.how-it-works__title{font-family:Inter,sans-serif;font-weight:500;font-size:20px;line-height:24px;margin:0;color:var(--hiw-ink)}.how-it-works__description{font-family:Inter,sans-serif;font-weight:300;font-size:14px;line-height:18px;margin:0;color:var(--hiw-stone)}.how-it-works__cta{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;color:var(--hiw-ink);font-family:Inter,sans-serif;font-weight:500;font-size:14px;line-height:18px;text-decoration:none;white-space:nowrap}.how-it-works__cta span{text-decoration:underline;text-underline-offset:2px}.how-it-works__cta-arrow{flex-shrink:0;display:block;width:10px;height:14px}@media screen and (max-width:749px){.how-it-works__panels{flex-direction:column}.how-it-works__panel{height:var(--hiw-mobile-collapsed-height);width:100%;transition:height var(--hiw-transition-duration) var(--hiw-transition-easing)}.how-it-works__panel.is-collapsed{flex:0 0 auto;width:100%;height:var(--hiw-mobile-collapsed-height)}.how-it-works__panel.is-open{flex:0 0 auto;width:100%;height:var(--hiw-mobile-open-height)}.how-it-works__panel.is-collapsed .how-it-works__image--collapsed-desktop,.how-it-works__panel.is-collapsed .how-it-works__image--collapsed-desktop.how-it-works__image--placeholder{display:none}.how-it-works__panel.is-collapsed .how-it-works__image--collapsed-mobile,.how-it-works__panel.is-collapsed .how-it-works__image--collapsed-mobile.how-it-works__image--placeholder{display:block}.how-it-works__content-wrap{margin-top:18px}.how-it-works__content{width:100%!important;margin-left:0!important;flex-direction:column;align-items:flex-start;gap:12px;padding-left:0}.how-it-works__content-text{max-width:100%}}@media screen and (min-width:750px){.how-it-works__image--collapsed-mobile{display:none!important}}@media(prefers-reduced-motion:reduce){.how-it-works__panel{transition-duration:1ms!important}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/gene-how-it-works.css.map */