/* ===== Our Mission & Vision (Frame 228) ===== */
.mv {
    width: 100%;
    background: #FFFFFF;
    padding: 80px 0;
    display: flex;
    justify-content: center;
}

.mv__inner {
    width: 1380px;
    max-width: calc(100% - 60px);
    display: flex;
    flex-direction: column;
    gap: 40px;
}

/* --- Header (Frame 217) --- */
.mv__head {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 24px;
}

.mv__bar {
    flex: none;
    width: 6px;
    align-self: stretch;
    min-height: 90px;
    border-radius: 3px;
    background: linear-gradient(180deg, #CF8E00 0%, #064700 100%);
}

.mv__head-text {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.mv__title {
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    font-size: 48px;
    line-height: 72px;
    text-transform: uppercase;
    color: #363636;
}

.mv__subtitle {
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-style: italic;
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
    color: #363636;
}

/* --- Cards (Frame 227) --- */
.mv__cards {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.mv__card {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 31px;
    padding: 30px;
    border-radius: 30px;
}

.mv__card--mission { background: rgba(6, 71, 0, 0.1); }
.mv__card--vision  { background: rgba(207, 142, 0, 0.1); }

.mv__body {
    flex: 1 1 480px;
    max-width: 574px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.mv__card-title {
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 36px;
    color: #363636;
}

.mv__card-desc {
    margin: 0;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    text-align: justify;
    color: #363636;
}

.mv__img {
    flex: 1 1 500px;
    max-width: 690px;
    height: 421px;
    border-radius: 30px;
    background-size: cover;
    background-position: center;
}

/* --- Responsive --- */
@media (max-width: 1000px) {
    .mv__card {
        flex-direction: column;
        align-items: stretch;
        gap: 24px;
    }
    /* keep the picture on top for both cards on narrow screens */
    .mv__card--mission .mv__body { order: 2; }
    .mv__card--mission .mv__img  { order: 1; }
    .mv__body,
    .mv__img { max-width: 100%; }
    .mv__img { height: 300px; }
}

@media (max-width: 560px) {
    .mv { padding: 48px 0; }
    .mv__title { font-size: 32px; line-height: 44px; }
    .mv__card-desc { text-align: left; font-size: 18px; line-height: 28px; }
    .mv__card { padding: 20px; }
    .mv__img { height: 220px; }
}
