.values {
    padding-bottom: 99px;
}

.mv {
    padding-bottom: 99px;
}

.values h2,
.mv h2 {
    padding: 0 0 44px 0;
}

.values div,
.mv div {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.values div {
    gap: 66px;
    
}
.mv div {
    gap: 99px;
}

.values .value,
.mv .mission,
.mv .vision {
    border-radius: 11px;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    padding: 1em;
    justify-content: space-between;
    gap: 1.618em;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease-in-out;
    img {
        border-radius: 8px;
    }
    p {
        padding: 0 !important;
    }
}

.values .value {
    background-color: #f8d250;
    width: 333px;
    img {
        border: solid 1px #fff;
    }
}

.mv .mission,
.mv .vision {
    background-color: #f2f2f2;
    width: 666px;
    img {
        border: solid 1px #000;
    }
    p {
        color: #0d0d0d;
    }
}

.values .value:hover,
.mv .mission:hover,
.mv .vision:hover {
    transform: scale(1.06);
}

@media (max-width: 754px) {   
    .mv .mission,
    .mv .vision {
        width: calc(100vw - 88px);
    }
}