.vertical-scroll-indicator{position:relative}.vertical-scroll-indicator[id*=hero]{margin-right:4rem;position:relative;z-index:9}.vertical-scroll-indicator[id*=hero]:has(.starting-circle){margin-top:1.5rem}.vertical-scroll-indicator[id*=hero]:has(.ending-circle){margin-top:2rem}.vertical-scroll-indicator:has(.starting-circle):before,.vertical-scroll-indicator:has(.starting-circle):after{content:"";width:2px;position:absolute;top:24px;left:11px}.vertical-scroll-indicator.hide-track:before,.vertical-scroll-indicator.hide-track:after{display:none!important}.vertical-scroll-indicator:has(.starting-circle):before{background:var(--brown-colour);height:var(--indicator-height, 0)}.vertical-scroll-indicator:has(.starting-circle):after{background:var(--brown-colour);height:var(--scroll-progress-height, 0);transition:height .8s cubic-bezier(.4,0,.2,1)}.vertical-scroll-indicator .starting-circle,.vertical-scroll-indicator .ending-circle,.horizontal-scroll-indicator .starting-circle,.horizontal-scroll-indicator .ending-circle{display:block!important;background-color:var(--orange-colour);height:24px;width:24px;border-radius:50%;position:relative;border:8px solid transparent;transition:.3s}.vertical-scroll-indicator .starting-circle .icon-outline,.vertical-scroll-indicator .ending-circle .icon-outline,.horizontal-scroll-indicator .starting-circle .icon-outline,.horizontal-scroll-indicator .ending-circle .icon-outline,.vertical-scroll-indicator .starting-circle .icon-fill,.vertical-scroll-indicator .ending-circle .icon-fill,.horizontal-scroll-indicator .starting-circle .icon-fill,.horizontal-scroll-indicator .ending-circle .icon-fill{opacity:0;transition:opacity .3s ease}.vertical-scroll-indicator .starting-circle .icon-outline,.vertical-scroll-indicator .ending-circle .icon-outline,.horizontal-scroll-indicator .starting-circle .icon-outline,.horizontal-scroll-indicator .ending-circle .icon-outline{opacity:1}.vertical-scroll-indicator .starting-circle.active .icon-outline,.vertical-scroll-indicator .ending-circle.active .icon-outline,.horizontal-scroll-indicator .starting-circle.active .icon-outline,.horizontal-scroll-indicator .ending-circle.active .icon-outline{opacity:0}.vertical-scroll-indicator .starting-circle.active .icon-fill,.vertical-scroll-indicator .ending-circle.active .icon-fill,.horizontal-scroll-indicator .starting-circle.active .icon-fill,.horizontal-scroll-indicator .ending-circle.active .icon-fill{opacity:1}.vertical-scroll-indicator .starting-circle-icon,.vertical-scroll-indicator .ending-circle-icon,.horizontal-scroll-indicator .starting-circle-icon,.horizontal-scroll-indicator .ending-circle-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.horizontal-scroll-indicator-wrapper{margin-top:2rem;display:flex;justify-content:space-between;position:relative}.horizontal-scroll-indicator:has(.starting-circle):before,.horizontal-scroll-indicator:has(.starting-circle):after{content:"";width:100%;height:4px;position:absolute;left:8px;top:6px}.horizontal-scroll-indicator:has(.starting-circle):before{background:var(--grey-3-colour, #b3b3b3);width:var(--indicator-width, 0)}.horizontal-scroll-indicator:has(.starting-circle):after{background:var(--brown-colour);width:var(--scroll-progress-width, 0)}
/*# sourceMappingURL=/cdn/shop/t/3/assets/snippet-scroll-indicator.css.map */
