.epsp-process-steps,
.epsp-process-steps *{
    box-sizing:border-box;
}

.epsp-process-steps{
    --epsp-direction:horizontal;
    --epsp-line-offset:12.5%;
    position:relative;
    width:100%;
    display:flex;
    flex-direction:row;
    align-items:flex-start;
    gap:0;
    padding:10px 0 20px;
    isolation:isolate;
}

.epsp-process-steps.epsp-direction-vertical{
    flex-direction:column;
}

/* IMPORTANT: this is a real border, not a background. */
.epsp-line{
    position:absolute !important;
    z-index:-1 !important;
    display:block !important;
    pointer-events:none !important;
    opacity:1 !important;
    visibility:visible !important;
    background:transparent !important;
    border:0 solid #FF7A00 !important;
    border-radius:0 !important;
}

.epsp-process-steps.epsp-direction-horizontal .epsp-line{
    top:38px;
    left:var(--epsp-line-offset);
    right:var(--epsp-line-offset);
    height:0;
    border-top-width:2px !important;
}

.epsp-process-steps.epsp-direction-vertical .epsp-line{
    top:38px;
    bottom:38px;
    left:28px;
    width:0;
    border-left-width:2px !important;
}

.epsp-item{
    position:relative;
    flex:1 1 0;
    min-width:0;
    text-align:center;
    padding:0 15px;
    transition:transform .3s ease;
}

.epsp-direction-vertical .epsp-item{
    width:100%;
    flex:0 0 auto;
    display:flex;
    align-items:flex-start;
    text-align:left;
    padding:0 0 30px;
}

.epsp-number-wrap{
    display:flex;
    justify-content:center;
    align-items:center;
    height:56px;
    margin-bottom:18px;
    position:relative;
    z-index:2;
}

.epsp-direction-vertical .epsp-number-wrap{
    width:56px;
    height:56px;
    flex:0 0 56px;
    margin:0 24px 0 0;
}

.epsp-number{
    width:56px !important;
    height:56px !important;
    flex:0 0 56px;
    border-radius:50%;
    border:1px solid #52749A;
    background:#052B57;
    color:#FFFFFF;
    display:flex;
    align-items:center;
    justify-content:center;
    line-height:1;
    font-size:16px;
    font-weight:700;
    transition:
        background-color .35s ease,
        border-color .35s ease,
        color .35s ease,
        transform .35s ease,
        box-shadow .35s ease;
}

.epsp-item:hover .epsp-number,
.epsp-item.epsp-active .epsp-number{
    background:#F47B20;
    border-color:#F47B20;
    color:#FFFFFF;
    transform:scale(1.08);
    box-shadow:0 0 0 6px rgba(244,123,32,.12);
}

.epsp-content{
    min-width:0;
}

.epsp-title{
    display:block;
    margin:0 0 7px;
    color:#FFFFFF;
    font-size:16px;
    font-weight:700;
    line-height:1.35;
    text-decoration:none;
    transition:color .35s ease;
}

.epsp-item:hover .epsp-title,
.epsp-item.epsp-active .epsp-title{
    color:#F47B20;
}

.epsp-description,
.epsp-description p,
.epsp-description li{
    color:#D7E2EF;
    font-size:13px;
    line-height:1.55;
}

.epsp-description{
    max-width:270px;
    margin:0 auto;
}

.epsp-description p{
    margin:0 0 7px;
}

.epsp-direction-vertical .epsp-description{
    max-width:none;
    margin:0;
}

.epsp-item:hover .epsp-description,
.epsp-item:hover .epsp-description *{
    color:#FFFFFF;
}

/* Hover mode switches */
.epsp-hover-circle .epsp-item:hover .epsp-title,
.epsp-hover-circle .epsp-item.epsp-active .epsp-title{
    color:#FFFFFF;
}
.epsp-hover-circle .epsp-item:hover .epsp-description,
.epsp-hover-circle .epsp-item:hover .epsp-description *,
.epsp-hover-circle .epsp-item.epsp-active .epsp-description,
.epsp-hover-circle .epsp-item.epsp-active .epsp-description *{
    color:#D7E2EF;
}

.epsp-hover-circle-title .epsp-item:hover .epsp-description,
.epsp-hover-circle-title .epsp-item:hover .epsp-description *{
    color:#D7E2EF;
}

/* Desktop/tablet horizontal */
@media (min-width:768px){
    .epsp-process-steps.epsp-direction-horizontal{
        display:flex !important;
    }
    .epsp-process-steps.epsp-direction-horizontal .epsp-item{
        display:block;
    }
}

/* Vertical */
.epsp-process-steps.epsp-direction-vertical{
    padding-left:0;
}

/* Small screens */
@media (max-width:767px){
    .epsp-process-steps.epsp-direction-horizontal{
        display:flex;
        flex-direction:row;
        overflow-x:auto;
        padding-bottom:25px;
    }

    .epsp-process-steps.epsp-direction-horizontal .epsp-item{
        min-width:220px;
    }

    .epsp-process-steps.epsp-direction-horizontal .epsp-line{
        min-width:calc(220px * 4);
    }

    .epsp-process-steps.epsp-direction-vertical .epsp-line{
        top:38px;
        bottom:38px;
        left:27px;
    }
}