customer-journey{--customer-journey-count: 3;--customer-journey-line-inset: 16.6667%;--customer-journey-progress: 0;--customer-journey-rail-inset: max(1.2rem, calc((100vw - var(--page-width)) / 2 - 4.4rem));counter-reset:customer-journey-step;display:grid;gap:0;grid-template-columns:repeat(var(--customer-journey-count),minmax(0,1fr));margin-bottom:1rem;padding:1.6rem 0 1.2rem;position:relative}customer-journey,[data-customer-journey-stop]{scroll-margin-top:calc(var(--header-height, 100px) + var(--announcement-bar-height, 0px) + 2rem)}customer-journey:before,customer-journey:after{content:"";height:3px;left:calc(var(--customer-journey-line-inset) - 1.5px);position:absolute;right:calc(var(--customer-journey-line-inset) - 1.5px);top:calc(3.1rem - 1.5px)}customer-journey:before{background:rgba(var(--color-foreground),.48)}customer-journey:after{background:rgb(var(--color-foreground));transform:scaleX(var(--customer-journey-progress));transform-origin:left;transition:transform .22s ease}.customer-journey__stop{color:inherit;counter-increment:customer-journey-step;display:grid;font-size:1.3rem;gap:.6rem;grid-template-rows:3rem auto auto;justify-items:center;min-width:0;padding:0 1.2rem;position:relative;text-align:center;text-decoration:none;z-index:1}.customer-journey__title{font-size:1.35rem;font-weight:600;grid-row:2;-webkit-hyphens:auto;hyphens:auto;line-height:1.3;text-wrap:balance}.customer-journey__description{color:rgba(var(--color-foreground),.68);font-size:1.2rem;grid-row:3;line-height:1.45;max-width:24ch}.customer-journey__stop:before,.customer-journey__stop:after{left:50%;position:absolute;transform:translate(-50%)}.customer-journey__stop:before{background:rgb(var(--color-background));border:2px solid rgba(var(--color-foreground),.48);border-radius:50%;content:"";height:3rem;top:0;width:3rem}.customer-journey__stop:after{color:rgba(var(--color-foreground),.68);content:counter(customer-journey-step,decimal-leading-zero);font-size:1.1rem;font-weight:600;top:.78rem}.customer-journey__stop.is-complete:before,.customer-journey__stop.is-active:before{background:rgb(var(--color-foreground));border-color:rgb(var(--color-foreground))}.customer-journey__stop.is-complete:after,.customer-journey__stop.is-active:after{color:rgb(var(--color-background))}.customer-journey__stop.is-active:before{outline:3px solid rgba(var(--color-foreground),.16);outline-offset:2px}.customer-journey__rail{display:grid;gap:.8rem;grid-template-columns:3.2rem;list-style:none;margin:0;padding:0;position:fixed;right:var(--customer-journey-rail-inset);top:50%;transform:translateY(-50%);z-index:4}.customer-journey__rail[hidden]{display:none}.customer-journey__rail li{position:relative;z-index:1}.customer-journey__rail-stop{align-items:center;background:rgb(var(--color-button-text));border:1px solid rgb(var(--color-foreground));border-radius:50%;color:rgb(var(--color-foreground));display:flex;font-size:1rem;font-weight:600;height:3.2rem;justify-content:center;line-height:1;position:relative;text-decoration:none;transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease;width:3.2rem}.customer-journey__rail-stop:after{background:rgb(var(--color-foreground));border:1px solid rgb(var(--color-button-text));border-radius:.2rem;box-shadow:0 .4rem 1.2rem rgba(var(--color-foreground),.14);color:rgb(var(--color-button-text));content:attr(data-customer-journey-label);font-size:1.2rem;font-weight:500;line-height:1.3;opacity:0;padding:.8rem 1.2rem;pointer-events:none;position:absolute;right:calc(100% + 1.2rem);top:50%;transform:translate(.4rem,-50%);transition:opacity .14s ease,transform .14s ease;visibility:hidden;white-space:nowrap;z-index:2}.customer-journey__rail-stop.is-complete{background:rgb(var(--color-button-text));border-color:rgb(var(--color-foreground));color:rgb(var(--color-foreground))}.customer-journey__rail-stop.is-active{background:rgb(var(--color-foreground));border-color:rgb(var(--color-button-text));color:rgb(var(--color-button-text))}.customer-journey__rail-stop:focus-visible{box-shadow:0 0 0 2px rgb(var(--color-button-text)),0 0 0 4px rgb(var(--color-foreground));outline:none}.customer-journey__rail-stop:focus-visible:after{opacity:1;transform:translateY(-50%);visibility:visible}@media(hover:hover){.customer-journey__rail-stop:hover:after{opacity:1;transform:translateY(-50%);visibility:visible}.customer-journey__rail-stop:hover{transform:translate(-2px)}}@media screen and (min-width:750px){customer-journey:before,customer-journey:after{top:calc(6.4rem - 1.5px)}.customer-journey__stop{grid-template-columns:minmax(0,1fr);grid-template-rows:10rem auto}.customer-journey__stop:before{background:rgba(var(--color-background),.85);height:10rem;width:10rem}.customer-journey__stop:after{display:none}.customer-journey__title{align-self:center;grid-row:1;max-width:9.4rem;position:relative;z-index:1}.customer-journey__description{max-width:100%;min-width:0}.customer-journey__stop.is-complete .customer-journey__title,.customer-journey__stop.is-active .customer-journey__title{color:rgb(var(--color-button-text))}}@media screen and (min-width:750px)and (max-width:809px){.customer-journey__stop{grid-template-rows:10rem}.customer-journey__description{display:none}}@media screen and (max-width:749px){.customer-journey__rail{display:none}.customer-journey__stop{align-content:start;column-gap:1.2rem;grid-template-columns:3rem minmax(0,1fr);grid-template-rows:auto auto;justify-items:start;min-height:10rem;padding:1.2rem 0;text-align:left}customer-journey:before,customer-journey:after{bottom:7.3rem;height:auto;left:calc(1.5rem - 1.5px);right:auto;top:2.7rem;width:3px}customer-journey:after{transform:scaleY(var(--customer-journey-progress));transform-origin:top}.customer-journey__stop:before{left:0;top:1.2rem;transform:none}.customer-journey__stop:after{left:1.5rem;top:1.98rem;transform:translate(-50%)}.customer-journey__title,.customer-journey__description{grid-column:2}.customer-journey__title{font-size:1.5rem}.customer-journey__description{font-size:1.3rem;max-width:44ch}}@media(prefers-reduced-motion:reduce){customer-journey:after,.customer-journey__rail-stop,.customer-journey__rail-stop:after{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/1/assets/customer-journey.css.map */