.number-box {
    clip-path: polygon(0 0, 100% 0, 100% 91%, 91% 100%, 0 100%);
}
.number:after {
    content: '';
    width: 1px;
    height: 70px;
    background: white;
    transform: rotate(-140deg);
    position: absolute;
    bottom: -20%;
    right: -20%
}

.arrow,.arrow-2 {
    position: relative;
    width: 0px;
    height: 100%;
}

.arrow::before,
.arrow::after,
.arrow-2::before,
.arrow-2::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 15px;
    height: 100%;
    background-color: transparent;
    border-style: solid;
    border-color: transparent;
    transition: border-color 0.3s ease;
}

.arrow::before {
    border-left: 15px solid transparent;
    border-bottom: 30px solid currentColor;
    left: -15px;
    transform: translateY(-50%);
}

.arrow::after {
    border-left: 15px solid transparent;
    border-top: 30px solid currentColor;
    right: 0px;
    transform: translateY(-50%);
}
.arrow-2::before {
    border-left: 15px solid transparent;
    border-bottom: 30px solid #D0A616;
    left: -15px;
    transform: translateY(-50%);
    background: white;
}

.arrow-2::after {
    border-left: 15px solid transparent;
    border-top: 30px solid #D0A616;
    right: 0px;
    transform: translateY(-50%);
}
.arrow-2.end::after{
    border-top: 30px solid #2A458D !important;
}
.arrow-2.end::before{
    border-bottom: 30px solid #2A458D !important;
}

.arrow.white {
    color: white;
}