/*==================================================
ABOUT PAGE
==================================================*/

.page-header{

position:relative;

height:420px;

background:url('../images/makazilogo.png') center center/cover;

display:flex;

align-items:center;

}

.page-overlay{

position:absolute;

inset:0;

background:rgba(10,47,143,.70);

}

.page-content{

position:relative;

z-index:2;

color:#fff;

text-align:center;

}

.page-content h1{

color:#fff;

font-size:54px;

margin-bottom:18px;

}

.page-content nav{

display:flex;

justify-content:center;

gap:10px;

}

.page-content nav a{

color:#fff;

}

.page-content nav span{

color:#fff;

}

.about-image{

position:relative;

}

.about-image img{

border-radius:22px;

box-shadow:var(--shadow);

}

.experience-box{

position:absolute;

bottom:30px;

left:30px;

background:var(--secondary);

padding:25px 35px;

border-radius:18px;

text-align:center;

color:#fff;

}

.experience-box h2{

color:#fff;

font-size:42px;

margin-bottom:5px;

}

.about-company p{

margin-bottom:20px;

line-height:1.9;

}

.about-list{

display:grid;

grid-template-columns:repeat(2,1fr);

gap:18px;

margin-top:35px;

}

.about-list div{

display:flex;

align-items:center;

gap:12px;

font-weight:600;

}

.about-list i{

color:var(--secondary);

}

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

.vision-mission{

    background:var(--light);

}

.vm-card{

    background:#fff;

    border-radius:22px;

    padding:40px 35px;

    text-align:center;

    height:100%;

    transition:.4s;

    box-shadow:var(--shadow-sm);

}

.vm-card:hover{

    transform:translateY(-10px);

    box-shadow:var(--shadow);

}

.vm-icon{

    width:90px;

    height:90px;

    margin:auto;

    margin-bottom:25px;

    border-radius:50%;

    background:rgba(10,47,143,.08);

    display:flex;

    align-items:center;

    justify-content:center;

}

.vm-icon i{

    font-size:34px;

    color:var(--primary);

}

.vm-card h3{

    margin-bottom:18px;

}

.values-list{

    padding:0;

    margin:0;

    list-style:none;

}

.values-list li{

    padding:10px 0;

    border-bottom:1px solid #eee;

}

.values-list li:last-child{

    border:none;

}

/*==================================================
OUR TEAM
==================================================*/

.our-team{

background:var(--light);

}

.team-card{

background:#fff;

border-radius:20px;

overflow:hidden;

box-shadow:var(--shadow-sm);

transition:.4s;

}

.team-card:hover{

transform:translateY(-10px);

box-shadow:var(--shadow);

}

.team-card img{

width:100%;

height:340px;

object-fit:cover;

}

.team-content{

padding:25px;

text-align:center;

}

.team-content h4{

margin-bottom:6px;

}

.team-content span{

color:var(--secondary);

font-size:14px;

font-weight:600;

}

/*==================================================
TIMELINE
==================================================*/

.company-timeline{

background:#fff;

}

.timeline{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:25px;

}

.timeline-item{

background:var(--light);

padding:35px;

border-radius:20px;

text-align:center;

}

.timeline-item h4{

font-size:34px;

color:var(--primary);

margin-bottom:15px;

}

@media(max-width:991px){

.timeline{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:576px){

.timeline{

grid-template-columns:1fr;

}

}