.achievements {
    background-color: var(--main-color);
    width: 100vw;
    height: calc(var(--dimension-ratio) * 160px);
    margin: calc(var(--dimension-ratio) * 40px);
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.achievement {
    display: flex;
    gap: calc(var(--dimension-ratio) * 20px);
    text-align: center;
    color: white;
}

.achievement img{
    height: calc(var(--dimension-ratio) * 96px);
    width: calc(var(--dimension-ratio) * 96px);
    margin: auto;
}
.counter{
    color: white;
   font-size:var(--font-size-32);
   font-weight: 500;
   line-height: var(--font-size-40);
   text-align: center;
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: calc(var(--dimension-ratio) * 15px);
}


.achievements-content{
    width: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
    gap: calc(var(--dimension-ratio) * 25px);
}

.achievements-content-item{
    width: calc(var(--dimension-ratio) * 500px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start ;
    flex-wrap: wrap;
    gap: calc(var(--dimension-ratio) * 12px);
}

.achievements-content-img{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: var(--opinion-background-color);
    border-radius: calc(var(--dimension-ratio) * 15px);
}

.achievements-content-img img{
    width: auto;
    height: calc(var(--dimension-ratio) * 333.3333333px);
    border-radius: calc(var(--dimension-ratio) * 15px);
}

.achievements-content-item p{
    margin: 0;
    font-size: var(--font-size-22);
    font-weight: 400;
    color: var(--secondary-color)
}


@media (max-width: 635px) {
    .achievements {
        height: 60px;
    }
    .achievement img {
        height: 40px;
        width: 40px;
    }
    .counter{
        font-size: 11px;
        line-height: 15px;
    }
}