/* =========================
   MISSION / VISION (ISOLATED)
========================= */

.aboutx-mv{
    display:flex;
    flex-direction:column;
    gap:14px;
    margin-top:10px;
}

/* CARD */
.aboutx-mv-card{
    position:relative;
    padding:18px 18px 18px 20px;

    border-radius:16px;

    background:rgba(255,255,255,0.04);
    border:1px solid rgba(255,255,255,0.08);

    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);

    transition:0.4s ease;

    overflow:hidden;
}

/* LEFT COLOR BAR */
.aboutx-mv-card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:4px;
    height:100%;
    background:#60a5fa;
}

/* HEADER */
.aboutx-mv-header{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:8px;
}

/* ICON */
.aboutx-mv-icon{
    width:32px;
    height:32px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:8px;

    background:rgba(96,165,250,0.15);
    color:#60a5fa;

    font-size:14px;
}

/* TITLE */
.aboutx-mv-card h3{
    font-size:1.05rem;
    font-weight:700;
    color:#ffffff;
}

/* TEXT */
.aboutx-mv-card p{
    font-size:0.95rem;
    line-height:1.7;
    color:#cbd5e1;
}

/* HOVER */
.aboutx-mv-card:hover{
    transform:translateY(-6px);
    border-color:rgba(96,165,250,0.4);
    box-shadow:0 12px 35px rgba(96,165,250,0.12);
}

/* DIFFERENT COLORS */
.aboutx-mv-card.mission::before{
    background:linear-gradient(to bottom,#60a5fa,#3b82f6);
}

.aboutx-mv-card.vision::before{
    background:linear-gradient(to bottom,#34d399,#10b981);
}