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

.page-hero{

    background:#214f99;

    padding:120px 0;

    color:#fff;

}

.page-hero span{

    color:#8fd04f;

    font-weight:700;

}

.page-hero h1{

    color:#fff;

    margin:20px 0;

}

.page-hero p{

    color:rgba(255,255,255,.85);

    max-width:700px;

}

.company-overview{

    padding:110px 0;

}

.overview-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:70px;

    align-items:center;

}

.overview-image img{

    width:100%;

    border-radius:20px;

}

.section-tag{

    color:var(--secondary);

    font-weight:700;

}

.overview-content h2{

    margin:18px 0;

}

.overview-content p{

    margin-bottom:18px;

    color:#666;

}

.overview-list{

    margin-top:30px;

}

.overview-list li{

    margin-bottom:15px;

    font-weight:600;

}

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

.vision-mission{

    padding:110px 0;

    background:#f8fbff;

}

.vision-grid{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:35px;

}

.vision-card,
.mission-card{

    background:#fff;

    border:1px solid var(--border);

    border-radius:20px;

    padding:50px;

    transition:.35s;

}

.vision-card:hover,
.mission-card:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 45px rgba(0,0,0,.08);

}

.vision-tag{

    display:inline-block;

    padding:8px 18px;

    background:#eef4ff;

    color:var(--primary);

    border-radius:30px;

    font-size:13px;

    font-weight:700;

    margin-bottom:18px;

}

.vision-card h2,
.mission-card h2{

    font-size:34px;

    margin-bottom:20px;

}

.vision-card p,
.mission-card p{

    color:#666;

    line-height:1.9;

}

@media(max-width:991px){

.vision-grid{

grid-template-columns:1fr;

}

}

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

.company-timeline{

    padding:110px 0;

}

.timeline{

    position:relative;

    max-width:950px;

    margin:70px auto 0;

}

.timeline::before{

    content:"";

    position:absolute;

    left:120px;

    top:0;

    bottom:0;

    width:3px;

    background:#214f99;

}

.timeline-item{

    display:flex;

    gap:40px;

    margin-bottom:60px;

    position:relative;

}

.timeline-year{

    min-width:120px;

    height:120px;

    background:#214f99;

    color:#fff;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:24px;

    font-weight:700;

    z-index:2;

}

.timeline-content{

    flex:1;

    background:#fff;

    border:1px solid var(--border);

    border-radius:18px;

    padding:35px;

    box-shadow:0 15px 35px rgba(0,0,0,.05);

    transition:.35s;

}

.timeline-content:hover{

    transform:translateY(-8px);

    box-shadow:0 20px 45px rgba(0,0,0,.08);

}

.timeline-content h3{

    margin-bottom:15px;

    font-size:28px;

}

.timeline-content p{

    color:#666;

    line-height:1.8;

}

@media(max-width:768px){

.timeline::before{

display:none;

}

.timeline-item{

flex-direction:column;

align-items:center;

text-align:center;

}

.timeline-year{

width:90px;

height:90px;

font-size:20px;

}

}

/*==================================================
LEADERSHIP TEAM
==================================================*/

.leadership-team{

    padding:110px 0;

    background:#f8fbff;

}

.team-grid{

    display:grid;

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

    gap:35px;

}

.team-card{

    background:#fff;

    border:1px solid var(--border);

    border-radius:20px;

    overflow:hidden;

    transition:.35s;

}

.team-card:hover{

    transform:translateY(-10px);

    box-shadow:0 20px 45px rgba(0,0,0,.08);

}

.team-card img{

    width:100%;

    height:380px;

    object-fit:cover;

}

.team-content{

    padding:30px;

}

.team-content h3{

    margin-bottom:8px;

    font-size:28px;

}

.team-content span{

    color:var(--primary);

    font-weight:600;

}

.team-content p{

    margin-top:18px;

    color:#666;

    line-height:1.8;

}

@media(max-width:991px){

.team-grid{

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

}

}

@media(max-width:767px){

.team-grid{

grid-template-columns:1fr;

}

}

/*==================================================
LABORATORY INFRASTRUCTURE
==================================================*/

.laboratory-section{

    padding:110px 0;

}

.lab-grid{

    display:grid;

    grid-template-columns:2fr 1fr 1fr;

    gap:25px;

}

.lab-image{

    overflow:hidden;

    border-radius:18px;

}

.lab-image img{

    width:100%;

    height:280px;

    object-fit:cover;

    transition:.4s;

}

.large{

    grid-row:span 2;

}

.large img{

    height:585px;

}

.lab-image:hover img{

    transform:scale(1.08);

}

@media(max-width:991px){

.lab-grid{

grid-template-columns:1fr 1fr;

}

.large{

grid-row:auto;

}

.large img{

height:350px;

}

}

@media(max-width:767px){

.lab-grid{

grid-template-columns:1fr;

}

.lab-image img{

height:260px;

}

.large img{

height:260px;

}

}

/*==================================================
ABOUT CTA
==================================================*/

.about-cta{

    padding:110px 0;

}

.about-cta-wrapper{

    background:linear-gradient(135deg,#214f99,#173b72);

    border-radius:24px;

    padding:70px;

    text-align:center;

}

.about-cta-wrapper span{

    color:#8fd04f;

    font-weight:700;

    letter-spacing:1px;

}

.about-cta-wrapper h2{

    color:#fff;

    margin:20px 0;

    font-size:48px;

}

.about-cta-wrapper p{

    color:rgba(255,255,255,.9);

    max-width:700px;

    margin:0 auto 40px;

}

.about-cta-buttons{

    display:flex;

    justify-content:center;

    gap:18px;

    flex-wrap:wrap;

}

.btn-whatsapp{

    background:#25D366;

    color:#fff;

}

.btn-whatsapp:hover{

    background:#1ea952;

}

@media(max-width:768px){

.about-cta-wrapper{

padding:40px 25px;

}

.about-cta-wrapper h2{

font-size:34px;

}

.about-cta-buttons{

flex-direction:column;

}

.about-cta-buttons a{

width:100%;

}

}
