.step-by-step{--sbs-primary: #1e4a5c;--sbs-secondary: #c4937a;--sbs-card-bg: #1e4a5c;--sbs-card-text: #ffffff;--sbs-section-bg: #ffffff;--sbs-font-body: var(--font-body-family, var(--body-font-family, sans-serif));--sbs-font-heading: var(--font-heading-family, var(--heading-font-family, sans-serif));--sbs-fg: var(--color-foreground, var(--color-base-text, #1a1a1a));--sbs-padding-sm: 56px;--sbs-padding-md: 88px;--sbs-padding-lg: 96px;--sbs-step-gap: 20px;--sbs-badge-size: 44px;--sbs-timeline-w: 60px;--sbs-img-radius: 12px;--sbs-card-radius: 14px;padding-block:var(--sbs-padding-lg);background-color:var(--sbs-section-bg);border-radius:0!important;overflow:visible!important;box-shadow:none!important;border:none!important}.step-by-step--padding-small{padding-block:var(--sbs-padding-sm)}.step-by-step--padding-medium{padding-block:var(--sbs-padding-md)}.step-by-step--padding-large{padding-block:var(--sbs-padding-lg)}.step-by-step__container{max-width:var(--page-width, 1200px);margin-inline:auto;padding-inline:var(--page-width-padding, 24px)}.step-by-step__header{text-align:center;margin-bottom:64px}.step-by-step__heading{font-family:var(--sbs-font-heading);line-height:1.15;margin:0 0 18px;color:var(--sbs-fg)}.step-by-step__heading-regular{display:block;font-size:clamp(20px,2.8vw,30px);font-weight:400;letter-spacing:-.01em}.step-by-step__heading-bold{display:block;font-size:clamp(28px,4vw,46px);font-weight:700;letter-spacing:-.025em}.step-by-step__subheading{font-family:var(--sbs-font-body);font-size:clamp(14px,1.4vw,16px);color:var(--sbs-fg);line-height:1.65;margin:0}.step-by-step__subheading p{margin:0}.step-by-step__steps{display:flex;flex-direction:column;max-width:700px;margin-inline:auto}.step-by-step__step{display:flex;align-items:center;padding-block:var(--sbs-step-gap);overflow:visible}.step-by-step__image-col{flex:0 0 42%;padding-right:0}.step-by-step__video{display:block;width:100%;height:auto;aspect-ratio:4 / 3;object-fit:cover;border-radius:var(--sbs-img-radius)}.step-by-step__img-placeholder{width:100%;aspect-ratio:4 / 3;border-radius:var(--sbs-img-radius);background:#1e4a5c1a}.step-by-step__timeline{flex:0 0 var(--sbs-timeline-w);align-self:stretch;display:flex;align-items:center;justify-content:center;position:relative;z-index:1;overflow:visible}.step-by-step__timeline:before{content:"";position:absolute;left:50%;transform:translate(-50%);width:2px;background:var(--sbs-secondary);top:calc(-1 * var(--sbs-step-gap));bottom:calc(-1 * var(--sbs-step-gap))}.step-by-step__step--first .step-by-step__timeline:before{top:50%;bottom:calc(-1 * var(--sbs-step-gap))}.step-by-step__step--last .step-by-step__timeline:before{top:calc(-1 * var(--sbs-step-gap));bottom:50%}.step-by-step__step--first.step-by-step__step--last .step-by-step__timeline:before{display:none}.step-by-step__badge{position:relative;z-index:2;width:var(--sbs-badge-size);height:var(--sbs-badge-size);border-radius:50%;background:var(--sbs-secondary);color:#fff;font-family:var(--sbs-font-heading);font-size:17px;font-weight:700;line-height:1;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 0 0 4px var(--sbs-section-bg)}.step-by-step__card-col{flex:1;padding-left:0;align-self:stretch;display:flex;align-items:center}.step-by-step__card{width:100%;height:100%;background:var(--sbs-card-bg);border-radius:var(--sbs-card-radius);padding:22px 24px;display:flex;align-items:center}.step-by-step__card-text{font-family:var(--sbs-font-body);font-size:14px;line-height:1.65;color:var(--sbs-card-text);margin:0}.step-by-step__card-text p{margin:0}.step-by-step__card-text strong,.step-by-step__card-text b{font-weight:700}@media screen and (max-width:749px){.step-by-step{--sbs-step-gap: 14px;--sbs-badge-size: 36px;--sbs-timeline-w: 46px;--sbs-img-radius: 8px;--sbs-card-radius: 10px}.step-by-step__container{padding-inline:16px}.step-by-step__header{margin-bottom:40px}.step-by-step__steps{max-width:100%}.step-by-step__card{padding:14px 16px}.step-by-step__card-text{font-size:13px;line-height:1.6}.step-by-step__badge{font-size:14px}}@media screen and (max-width:380px){.step-by-step{--sbs-step-gap: 10px;--sbs-badge-size: 30px;--sbs-timeline-w: 38px}.step-by-step__image-col{flex-basis:38%}.step-by-step__card{padding:12px 14px}.step-by-step__card-text,.step-by-step__badge{font-size:12px}}@media print{.step-by-step__timeline:before{display:none}}
/*# sourceMappingURL=/cdn/shop/t/17/assets/step-by-step-claudecode.css.map */