/* ==========================================
   ABOUT HERO
========================================== */

.about-hero{

    background:
    linear-gradient(rgba(13,71,161,0.75), rgba(0,166,81,0.65)),
    url("../assets/images/about/about-bg.jpg");

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    min-height: 650px;

    display: flex;

    align-items: center;

    justify-content: center;

    text-align: center;

    color: white;

    padding: 120px 20px;

}

.about-hero h1{

    color:white;

    font-size:52px;

    margin-bottom:20px;

}

.about-hero p{

    color:white;

    font-size:20px;

}

/* ==========================================
   COMPANY PROFILE
========================================== */

.company-profile{

    background:white;

}

.company-profile h2{

    text-align:center;

    margin-bottom:30px;

}

.company-profile p{

    max-width:900px;

    margin:auto;

    text-align:center;

    margin-bottom:25px;

}

/* ==========================================
   MISSION & VISION
========================================== */

.mission-vision{

    background:#F5F7FA;

}

.mission-vision .container{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(350px,1fr));

    gap:30px;

}

.mission-card{

    background:white;

    padding:40px;

    border-radius:12px;

    box-shadow:var(--shadow);

}

/* ==========================================
   VALUES
========================================== */

.core-values{

    background:white;

}

.core-values h2{

    text-align:center;

    margin-bottom:50px;

}

.values-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));

    gap:30px;

}

.value-card{

    background:#F5F7FA;

    padding:35px;

    text-align:center;

    border-radius:12px;

    transition:.3s;

}

.value-card:hover{

    transform:translateY(-8px);

}

.value-card h3{

    color:var(--primary);

}