.section-how-does-it-work-bg,.section-how-does-it-work-bg .how-does-it-work__pagination-step.text--label,.section-how-does-it-work-bg .how-does-it-work__pagination-step.text--label span{background:var(--coffee)}.how-does-it-work__head{grid-column-start:1;grid-column-end:4}.how-does-it-work__head .section__heading{padding:0 0 48px}.how-does-it-work__pagination-container{position:relative;margin-bottom:48px}.section-how-does-it-work.layout-2 .how-does-it-work__pagination-container{display:none}.how-does-it-work__pagination-steps{display:flex;justify-content:space-between;align-items:center}.how-does-it-work__pagination-step.text--label{z-index:2;background:#fff;color:rgb(var(--color-heading-text));font-family:var(--font-heading-family);font-size:16px;line-height:1.5;letter-spacing:1px;text-transform:uppercase;padding-top:0;padding-bottom:0}.how-does-it-work__pagination-step.text--label:first-child{padding-right:16px}.how-does-it-work__pagination-step.text--label:last-child{padding-left:16px}.how-does-it-work__pagination-step.text--label:not(:first-child):not(:last-child){padding-inline:16px}.how-does-it-work__pagination-background{position:absolute;top:50%;left:0;z-index:1;width:100%;height:1px;background-color:#bac5d0;transform:translateY(-50%)}.section-how-does-it-work .how-does-it-work__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.section-how-does-it-work .how-does-it-work__item{display:flex;flex-direction:column;gap:0}.section-how-does-it-work.layout-1 .how-does-it-work__item{position:relative}.section-how-does-it-work .how-does-it-work__media{position:relative;width:100%;overflow:hidden;border-radius:var(--card-corner-radius)}.section-how-does-it-work .how-does-it-work__media img,.section-how-does-it-work .how-does-it-work__media svg{width:100%;height:100%;object-fit:cover}.section-how-does-it-work.layout-1 .how-does-it-work__media{aspect-ratio:437/447}.section-how-does-it-work.layout-2 .how-does-it-work__media{aspect-ratio:437/547}.section-how-does-it-work .how-does-it-work__title-container{position:absolute;bottom:20px;left:20px;z-index:2;display:flex;justify-content:space-between;align-items:center;width:calc(100% - 40px);padding:12px 0;border-top:1px solid #fff;border-bottom:1px solid #fff}.section-how-does-it-work .how-does-it-work__title-container .how-does-it-work__title{font-size:24px;color:#fff}.section-how-does-it-work .how-does-it-work__title-container svg{width:40px;height:40px}.section-how-does-it-work.layout-2 .how-does-it-work__title-container{display:none}.section-how-does-it-work .how-does-it-work__overlay{display:none;z-index:1}.section-how-does-it-work.layout-1 .how-does-it-work__overlay{display:flex;flex-direction:column;justify-content:center;gap:12px;position:absolute;top:0;right:0;bottom:0;left:0;padding:16px;background:linear-gradient(to top,rgba(0,0,0,.7) 0%,transparent 60%);transition:background .4s ease}.section-how-does-it-work.layout-1 .how-does-it-work__overlay *{opacity:0}.section-how-does-it-work.layout-1 .how-does-it-work__overlay .how-does-it-work__description,.section-how-does-it-work.layout-1 .how-does-it-work__overlay .how-does-it-work__cta{transition:all .5s}@media(hover:hover){.section-how-does-it-work.layout-1 .how-does-it-work__item:hover .how-does-it-work__overlay{background:#fff;z-index:3;border:1px solid #BAC5D0}.section-how-does-it-work.layout-1 .how-does-it-work__item:hover .how-does-it-work__overlay *{opacity:1}}.section-how-does-it-work.layout-1 .how-does-it-work__item:focus-within .how-does-it-work__overlay{background:#fff;z-index:3;border:1px solid #BAC5D0}.section-how-does-it-work.layout-1 .how-does-it-work__item:focus-within .how-does-it-work__overlay *{opacity:1}.section-how-does-it-work.layout-2 .how-does-it-work__overlay,.section-how-does-it-work.layout-1 .how-does-it-work__content{display:none}.section-how-does-it-work .how-does-it-work__content{display:flex;flex-direction:column;gap:12px;padding:16px}.section-how-does-it-work .how-does-it-work__title{margin:0;font-size:24px}.section-how-does-it-work .how-does-it-work__description{margin:0}.section-how-does-it-work .how-does-it-work__step{display:none;margin:0;padding:0;color:#973f54;font-family:var(--font-heading-family);font-size:16px;letter-spacing:1px}.section-how-does-it-work.layout-2 .how-does-it-work__step{display:block}@media screen and (max-width:749px){.section-how-does-it-work .section__heading{font-size:32px}.how-does-it-work__head .section__heading{padding-bottom:32px!important}.section-how-does-it-work .how-does-it-work__body{overflow-x:scroll}.section-how-does-it-work .how-does-it-work__grid .how-does-it-work__item{width:69vw}.how-does-it-work__pagination-container{margin-bottom:24px!important}.how-does-it-work__pagination-steps{display:grid!important;grid-template-columns:repeat(3,69vw);gap:8px}.how-does-it-work__pagination-background{width:calc(207vw + 16px)!important}.how-does-it-work__pagination-step.text--label{background-color:transparent!important;padding:0!important}.how-does-it-work__pagination-step.text--label span{background:#fff}.how-does-it-work__pagination-step.text--label:first-child span{padding-right:8px}.how-does-it-work__pagination-step.text--label:last-child span{padding-left:8px;margin-left:-8px}.how-does-it-work__pagination-step.text--label:not(:first-child):not(:last-child) span{padding-inline:8px;margin-left:-8px}.section-how-does-it-work .how-does-it-work__title-container .how-does-it-work__title{max-width:150px}}
/*# sourceMappingURL=/cdn/shop/t/53/assets/section-how-does-it-work.css.map */
