.lpo-hiw-scroll{position:relative}.lpo-hiw-scroll__intro{margin-bottom:var(--space-32)}.lpo-hiw-scroll__title{margin:0 0 var(--space-32);font-family:var(--fondly-f-sans);font-size:var(--t-h2);line-height:var(--lh-h2);letter-spacing:var(--ls-heading);color:var(--lpo-text, var(--text-heading));max-width:22ch;font-weight:600}.lpo-hiw-scroll__tabs{display:inline-flex;align-items:center;background:color-mix(in srgb,var(--fondly-ink) 4%,var(--fondly-paper-soft));border:1px solid var(--fondly-line);border-radius:var(--radius-pill);padding:var(--space-8);margin-bottom:var(--space-32);box-shadow:none}.lpo-hiw-scroll__tab{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-16) var(--space-32);border-radius:var(--radius-pill);border:none;background:transparent;font-family:var(--fondly-f-sans);font-size:var(--t-meta);font-weight:600;line-height:1;color:var(--text-soft);cursor:pointer;min-height:48px;transition:background .2s ease,color .2s ease}.lpo-hiw-scroll__tab:focus-visible{outline:2px solid var(--lpo-em, var(--fondly-coral));outline-offset:2px}.lpo-hiw-scroll__tab.is-active{background:var(--fondly-ink);color:var(--fondly-paper)}.lpo-hiw-scroll__panel{display:none;position:relative}.lpo-hiw-scroll__panel.is-active{display:block}.lpo-hiw-scroll__lede{max-width:var(--prose-max, 42rem);margin:0;font-family:var(--fondly-f-serif);font-size:var(--t-lede);line-height:var(--lh-lede);color:var(--lpo-muted, var(--text-body));font-weight:400}.lpo-hiw-scroll__lede p{margin:0}.lpo-hiw-scroll__progress{position:sticky;top:calc(var(--header-height, 72px) + var(--space-24));z-index:5;margin-top:var(--space-32);margin-bottom:var(--space-32);padding:var(--space-8) 0;background:var(--lpo-bg, var(--sand, #ebe4d6));transition:opacity .3s ease}.lpo-hiw-scroll__progress.is-hidden{opacity:0;pointer-events:none}.lpo-hiw-scroll__progress-line{position:absolute;left:0;top:50%;height:1px;width:0;background:var(--fondly-ink-soft, #2c393d);transform:translateY(-50%);z-index:1}.lpo-hiw-scroll__progress-rail{position:relative;display:flex;align-items:center;width:100%;gap:0}.lpo-hiw-scroll__progress-rail:before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--fondly-line);transform:translateY(-50%);z-index:0}.lpo-hiw-scroll__progress-number{position:relative;z-index:1;flex:1;display:flex;justify-content:center}.lpo-hiw-scroll__progress-number span{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;font-family:var(--fondly-f-sans);font-size:var(--t-meta);font-weight:600;background:var(--fondly-paper);color:var(--text-soft, var(--fondly-ink-mute));border:1px solid var(--fondly-line);transition:background .2s ease,color .2s ease,border-color .2s ease}.lpo-hiw-scroll__progress-number.is-current span{background:var(--fondly-ink);color:var(--fondly-paper);border-color:var(--fondly-ink)}.lpo-hiw-scroll__progress-number.is-complete span{background:var(--fondly-paper-soft);color:var(--fondly-ink-soft, #2c393d);border-color:var(--fondly-line)}.lpo-hiw-scroll__progress-connector{flex:1;height:1px}.lpo-hiw-scroll__step{position:sticky;top:calc(var(--header-height, 72px) + var(--space-24));min-height:min(70vh,calc(100vh - var(--header-height, 72px) - var(--space-128)));display:flex;align-items:center;padding:var(--space-32) 0;z-index:var(--step-z, 1);background:var(--lpo-bg, var(--sand, #ebe4d6));isolation:isolate}.lpo-hiw-scroll__step-inner{display:grid;grid-template-columns:1fr;gap:var(--space-32);width:100%;transform-origin:center center;will-change:transform,opacity}.lpo-hiw-scroll__step-media{border-radius:var(--radius-card, 6px);overflow:hidden;background:var(--fondly-paper-soft);border:1px solid var(--fondly-line)}.lpo-hiw-scroll__step-img{display:block;width:100%;height:auto;aspect-ratio:16 / 10;object-fit:cover}.lpo-hiw-scroll__step-content{display:flex;flex-direction:column;gap:var(--space-16)}.lpo-hiw-scroll__step-label span{display:inline-block;font-family:var(--fondly-f-sans);font-size:var(--t-meta);font-weight:600;letter-spacing:var(--ls-meta);text-transform:uppercase;color:var(--lpo-em, var(--fondly-coral))}.lpo-hiw-scroll__step-title{margin:0;font-family:var(--fondly-f-sans);font-size:var(--t-h3);line-height:var(--lh-h3);letter-spacing:var(--ls-heading);color:var(--lpo-text, var(--text-heading))}.lpo-hiw-scroll__step-body{font-size:var(--t-base);line-height:var(--lh-body);color:var(--lpo-muted, var(--text-body))}.lpo-hiw-scroll__step-body p{margin:0 0 var(--space-16)}.lpo-hiw-scroll__step-body p:last-child{margin-bottom:0}@media(max-width:989px){.lpo-hiw-scroll__intro{margin-bottom:var(--space-16)}.lpo-hiw-scroll__progress{position:relative;top:auto;margin-top:var(--space-16);margin-bottom:var(--space-32)}.lpo-hiw-scroll__step{position:relative;top:auto;min-height:0;align-items:flex-start;padding:0 0 var(--space-64)}.lpo-hiw-scroll__step:last-child{padding-bottom:0}.lpo-hiw-scroll__step-inner{gap:var(--space-16);will-change:auto;opacity:1!important;visibility:visible!important;transform:none!important}.lpo-hiw-scroll__progress-number span{width:36px;height:36px}}@media(min-width:990px){.lpo-hiw-scroll__step-inner{grid-template-columns:1.1fr .9fr;align-items:center;gap:var(--space-64)}.lpo-hiw-scroll__progress-number span{width:44px;height:44px}}@media(prefers-reduced-motion:reduce){.lpo-hiw-scroll__step{position:relative;top:auto;min-height:0}.lpo-hiw-scroll__step-inner{will-change:auto;transform:none!important;opacity:1!important;visibility:visible!important}.lpo-hiw-scroll__progress{position:relative;top:auto}.lpo-hiw-scroll__progress-line{width:100%!important}}
/*# sourceMappingURL=/cdn/shop/t/13/assets/lpo-how-it-works-scroll.css.map */
