.var-steps{display:flex;justify-content:space-between;overflow:hidden;width:100%}:root{--step-tag-size:20px;--step-tag-background:#9e9e9e;--step-tag-font-size:var(--font-size-md);--step-tag-color:#fff;--step-tag-active-color:var(--color-primary);--step-tag-margin:4px 0;--step-tag-icon-size:var(--font-size-lg);--step-content-font-size:var(--font-size-md);--step-content-color:rgba(0,0,0,.38);--step-content-active-color:#000;--step-line-background:#000;--step-vertical-min-height:30px;--step-vertical-tag-margin:0 4px;--step-vertical-line-height: calc(100% - 30px) ;--step-vertical-line-min-height:20px}.tag{align-items:center;background:var(--step-tag-background);border-radius:50%;color:var(--step-tag-color);display:flex;font-size:var(--step-tag-font-size);height:var(--step-tag-size);justify-content:center;width:var(--step-tag-size)}.content,.tag{cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);transition:.3s var(--cubic-bezier)}.content{color:var(--step-content-color);font-size:var(--step-content-font-size)}.var-step{display:flex;flex:1;position:relative;-webkit-tap-highlight-color:rgba(0,0,0,0)}.var-step__horizontal{display:flex;width:100%}.var-step__horizontal-main{align-items:center;display:flex;flex-basis:100%;flex-direction:column}.var-step__horizontal-tag{align-items:center;background:var(--step-tag-background);border-radius:50%;color:var(--step-tag-color);cursor:pointer;display:flex;font-size:var(--step-tag-font-size);height:var(--step-tag-size);justify-content:center;margin:var(--step-tag-margin);width:var(--step-tag-size);-webkit-tap-highlight-color:rgba(0,0,0,0);transition:.3s var(--cubic-bezier)}.var-step__horizontal-tag--active{background:var(--step-tag-active-color)}.var-step__horizontal-content{color:var(--step-content-color);cursor:pointer;font-size:var(--step-content-font-size);-webkit-tap-highlight-color:rgba(0,0,0,0);transition:.3s var(--cubic-bezier)}.var-step__horizontal-content--active{color:var(--step-content-active-color)}.var-step__horizontal-line{background:var(--step-line-background);flex:1;height:1px;position:relative;top:14px;transform:scaleY(.5)}.var-step__vertical{width:100%}.var-step__vertical-main{align-items:flex-start;display:flex;min-height:var(--step-vertical-min-height)}.var-step__vertical-tag{align-items:center;background:var(--step-tag-background);border-radius:50%;color:var(--step-tag-color);cursor:pointer;display:flex;flex-shrink:0;font-size:var(--step-tag-font-size);height:var(--step-tag-size);justify-content:center;margin:var(--step-vertical-tag-margin);width:var(--step-tag-size);-webkit-tap-highlight-color:rgba(0,0,0,0);transition:.3s var(--cubic-bezier)}.var-step__vertical-tag--active{background:var(--step-tag-active-color)}.var-step__vertical-content{color:var(--step-content-color);cursor:pointer;font-size:var(--step-content-font-size);-webkit-tap-highlight-color:rgba(0,0,0,0);transition:.3s var(--cubic-bezier)}.var-step__vertical-content--active{color:var(--step-content-active-color)}.var-step__vertical-line{background:var(--step-line-background);height:var(--step-vertical-line-height);left:14px;min-height:var(--step-vertical-line-min-height);position:relative;top:calc(-100% + 45px);transform:scaleX(.5);width:1px}.var-step__icon[var-step-cover]{font-size:var(--step-tag-icon-size)}