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

.about-hero{

    background:#123D72;
    color:#fff;
    text-align:center;
    padding:120px 0;

}

.about-hero h1{

    font-size:56px;
    margin-bottom:20px;

}

.about-hero p{

    max-width:700px;
    margin:auto;
    font-size:20px;

}

/*=========================
ABOUT COMPANY
=========================*/

.about-company{

    background:#fff;

}

.about-grid{

    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center;

}

.about-grid img{

    border-radius:25px;
    transition:var(--transition);

}
.about-grid img:hover{

    transform:scale(1.02);

}

.section-subtitle{

    color:#D4A547;
    font-weight:700;

}

.about-grid h2{

    margin:20px 0;
    font-size:48px;

}

.about-grid p{

    margin-bottom:20px;
    line-height:1.8;
    color:#555;

}

.about-features{

    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
    margin-top:30px;

}

/*=========================
VISION
=========================*/

.vision-section{

    background:#F8F8F8;

}

.vision-grid{

    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px;

}

.vision-card{

    background:var(--white);
    border-radius:25px;
    padding:40px;
    text-align:center;
    box-shadow:0 12px 30px rgba(0,0,0,.08);
    transition:var(--transition);

}
.vision-card:hover{

    transform:translateY(-8px);

    box-shadow:0 18px 45px rgba(0,0,0,.12);

}

.vision-card i{

    font-size:50px;
    color:#D4A547;
    margin-bottom:20px;

}

.vision-card h3{

    margin-bottom:15px;

}

.vision-card p{

    color:#666;
    line-height:1.8;

}