.order-steps {
    border-bottom:1px solid var(--line);
    padding:30px 20px;
    background:#fff;
}
.order-steps ol {
    display:flex;
    align-items:center;
    justify-content:center;
    width:fit-content;
    max-width:100%;
    margin:auto;
}
.order-steps li {
    display:flex;
    align-items:center;
    gap:10px;
    color:#788386;
    line-height:1.4;
}
.order-steps li:not(:last-child)::after {
    content:"";
    width:40px;
    height:1px;
    background:#cad2cd;
    margin:0 22px 0 12px;
    flex-shrink:0;
}
.order-steps__number {
    display:flex;
    align-items:center;
    justify-content:center;
    width:34px;
    height:34px;
    flex-shrink:0;
    border:1px solid #cbd4cf;
    border-radius:50%;
}
.order-steps .is-current {
    color:var(--ink);
    font-weight:600;
}
.order-steps .is-current .order-steps__number {
    background:var(--gold);
    border-color:var(--gold);
    color:#18292c;
}
.order-steps .is-complete {
    color:var(--teal);
}
.order-steps .is-complete .order-steps__number {
    border-color:var(--teal);
    background:var(--teal);
    color:white;
}
.order-steps .is-complete::after {
    background:var(--teal) !important;
}
@media(max-width:900px) {
    .order-steps li:not(:last-child)::after {
        width:24px;
        margin:0 12px 0 2px;
    }
}
@media(max-width:640px) {
    .order-steps ol {
        flex-direction:column;
        align-items:stretch;
        gap:26px;
    }
    .order-steps li {
        position:relative;
    }
    .order-steps li:not(:last-child)::after {
        width:1px;
        height:20px;
        position:absolute;
        left:16px;
        top:37px;
        margin:0;
    }
}
