/*********************** HIW ************************/
.hiw_opening {
    margin-top: 60px;
    text-align: center;
}

.hiw {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 60px;
}

.step_icon {
    width: 60px;
    height: 60px;
    border-radius: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

.step_icon i {
    font-size: 22px;
    color: var(--light-blue);
}

.step {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 30%;
    text-align: center;
    margin-bottom: 45px;
}

.step p {
    margin-top: 0;
}

.step_yellow .step_icon {
    border: 5px solid var(--yellow);
}

.step_light-blue .step_icon {
    border: 5px solid var(--light-blue);
}

.step_grey .step_icon {
    border: 5px solid var(--grey);
}

.step_dark-blue .step_icon {
    border: 5px solid var(--dark-blue);
}

.step_yellow i,
.step_yellow h3 {
    color: var(--yellow);
}

.step_light-blue i,
.step_light-blue h3 {
    color: var(--light-blue);
}

.step_grey i,
.step_grey h3 {
    color: var(--grey);
}

.step_dark-blue i,
.step_dark-blue h3 {
    color: var(--dark-blue);
}

.hiw_wrapper .button {
    margin: 0 auto;
}

@media (max-width: 1330px) {
    .step {
        width: 48%;
        margin-bottom: 0;
    }

    .step:last-of-type {
        margin: 45px auto;
    }
}

@media (max-width: 950px) {
    .hiw_wrapper {
        flex-direction: column;
    }

    .step {
        width: 80%;
        margin: 0 auto 45px auto;
    }

    .step:last-of-type {
        margin-top: 0;
    }
}

@media (max-width: 600px) {
    .step {
        width: 100%;
    }

    .hiw_wrapper .button {
        width: 100%;
    }
}