.how-it-works{display:flex;flex-direction:column;gap:32px;padding-left:var(--page-margin-side-mobile);padding-right:var(--page-margin-side-mobile);background-color:var(--colour-bianca)}.how-it-works .heading{line-height:1.2}.how-it-works .heading strong{color:var(--colour-rouge);font-weight:inherit}.how-it-works .steps{display:grid;grid-template-columns:4px 1fr;column-gap:12px;row-gap:24px}.how-it-works .step{display:contents}.how-it-works .step-media{grid-column:1 / -1;grid-row:1;position:relative;height:336px;padding:16px;border-radius:28px 28px 0 0;overflow:hidden;background-color:var(--colour-white);opacity:0;pointer-events:none;transition:opacity .5s ease-in-out}.how-it-works .step.is-active .step-media{opacity:1;pointer-events:auto}.how-it-works .step-media .global-image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.how-it-works .step-badge{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:100px;background-color:var(--colour-bianca)}.how-it-works .step-bar{grid-column:1;position:relative;width:4px;border-radius:100px;background-color:var(--colour-dark-10);overflow:hidden}.how-it-works .step-bar:after{content:"";position:absolute;top:0;left:0;width:100%;height:var(--progress, 0%);border-radius:100px;background-color:var(--colour-dark)}.how-it-works .step-text{grid-column:2;display:flex;flex-direction:column;padding:8px 0}.how-it-works .step-title{position:relative;text-align:left;color:var(--colour-dark-70);transition:color .5s ease-in-out}.how-it-works .step-title:after{content:"";position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px}.how-it-works .step.is-active .step-title{color:var(--colour-dark)}.how-it-works .step-body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s ease-in-out}.how-it-works .step.is-active .step-body{grid-template-rows:1fr}.how-it-works .step-body>.step-content{min-height:0;overflow:hidden;padding-top:0;opacity:0;transition:opacity .25s ease-in-out}.how-it-works .step.is-active .step-body>.step-content{opacity:1;transition:opacity .5s ease-in-out .15s;padding-top:12px}.how-it-works .step-content p{margin:0}.how-it-works .step-content p+p{margin-top:1em}@media screen and (min-width:1000px){.how-it-works{padding-left:var(--page-margin-side-desktop);padding-right:var(--page-margin-side-desktop)}.how-it-works .steps{display:flex;align-items:flex-start;gap:24px}.how-it-works .step{display:flex;flex-direction:column;flex:1;min-width:0}.how-it-works .step-media{width:100%;height:495px;opacity:1;pointer-events:auto}.how-it-works .step-bar{display:none}.how-it-works .step-text{padding:16px 0 0}.how-it-works .step-title{color:var(--colour-dark)}.how-it-works .step-title:after{display:none}.how-it-works .step-body{grid-template-rows:1fr}.how-it-works .step-body>.step-content{opacity:1;padding-top:12px}}
/*# sourceMappingURL=/cdn/shop/t/159/assets/how-it-works.css.map */