.values-block {
    align-self: stretch;
    overflow: hidden;
    justify-content: center;
    align-items: center;
    gap: 64px;
    display: inline-flex;
    flex-wrap: wrap;
    align-content: center;
    padding-bottom: 64px;
}
.values-content {
    justify-content: flex-start;
    align-items: flex-start;
    gap: 48px;
    display: flex;
}
.value-content {
    width: 100%;
    max-width: 350px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-end;
    display: inline-flex;
}
.value-card {
    align-self: stretch;
    padding : 32px 24px;
    position: relative;
    background: white;
    box-shadow: 0px 28.42px 56.84px rgba(62, 52, 69, 0.12),
                0px 2.37px 4.74px rgba(62, 52, 69, 0.04);
    border-radius: 8px;
    outline: 2px white solid;
    outline-offset: -2px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 24px;
    display: flex;
}
.value-card-content {
    align-self: stretch;
    padding-left: 32px;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 16px;
    display: flex;
}
.value-card-title{
    color: #564C68;
    font-size: 32px;
    font-family: Rethink Sans;
    font-weight: 700;
    line-height: 140%;
    margin: 0px;
}
.value-card-icon {
    padding: 16px;
    left: -40px;
    top: 37.50px;
    position: absolute;
    background: #AF9CFB;
    border-radius: 8px;
    outline: 2px #AF9CFB solid;
    outline-offset: -2px;
    justify-content: flex-start;
    align-items: flex-start;
    display: inline-flex;
}
.icon-value {
    width: 48px;
    height: 48px;
}
.value-card:hover .value-card-title {
    color : #AF9CFB;
}
.value-card:hover {
    background-color:#F2EFFE;
}
@media (max-width: 1024px) {
    .value-card-icon {
        left: -35px;
    }
    .icon-value {
        width: 36px;
        height: 36px;
    }
    .value-card-title {
        font-size: 28px;
        line-height: 136%;
    }
    .value-card {
        padding: 28px 20px;
        justify-content: center;
    }
    .icon {
        width: 36px;
        height: 36px;
        position: relative;
    }
.value-card-icon {
    top :inherit;
}
}
@media (max-width: 767px) {
    .icon-value {
        width: 28px;
        height: 28px;
    }
    .icon {
        width: 28px;
        height: 28px;
        position: relative;
    }
    .value-card-title {
        font-size: 24px;
        line-height: 133%;
    }
    .value-card {
        padding: 24px 16px;
        justify-content: center;
    }
}
@media (min-width: 1300px) and (max-width: 1400px) {
    .value-content {
        max-width: 320px
    }
}
@media (min-width:767px) and (max-width: 910px) {
    .value-content {
        max-width: 250px
    }
}
@media (min-width:320px) and (max-width: 440px) {
    .value-card-icon {
        left: -25px;
    }
    .value-content {
        max-width: 240px
    }
}