/* ABOUT HERO */

.about-hero{

    position: relative;

    padding: 90px 0 85px;

    background:
    url('../images/hospital-contact.jpg')
    center/cover no-repeat;

    overflow: hidden;

}

.about-hero-overlay{

    position: absolute;

    inset: 0;

    background:
    linear-gradient(
        135deg,
        rgba(2, 18, 54, 0.90),
        rgba(5, 38, 104, 0.75)
    );

}

.about-hero .container{

    position: relative;

    z-index: 2;

}

.about-hero-content{

    max-width: 720px;

    color: #fff;

}

.about-tag{

    display: inline-block;

    padding: 10px 20px;

    border-radius: 40px;

    background: rgba(255,255,255,0.10);

    backdrop-filter: blur(10px);

    margin-bottom: 24px;

    font-size: 14px;

    font-weight: 600;

}

.about-hero-content h1{

    font-size: 54px;

    line-height: 1.15;

    margin-bottom: 24px;

    font-weight: 700;

}

.about-hero-content p{

    font-size: 18px;

    line-height: 1.9;

    color: rgba(255,255,255,0.86);

}

/* HOSPITAL STORY */

.hospital-story-section{

    padding: 100px 0;

}

.hospital-story-grid{

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 70px;

    align-items: center;

}

.hospital-story-image img{

    width: 100%;

    border-radius: 28px;

    display: block;

    box-shadow:
    0 25px 60px rgba(15,23,42,0.12);

}

.hospital-story-content span{

    display: inline-block;

    margin-bottom: 18px;

    color: #0d6efd;

    font-weight: 600;

}

.hospital-story-content h2{

    font-size: 44px;

    line-height: 1.2;

    color: #0b1b46;

    margin-bottom: 24px;

}

.hospital-story-content p{

    color: #667085;

    line-height: 1.9;

    margin-bottom: 22px;

}

.story-highlights{

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 22px;

    margin-top: 35px;

}

.highlight-box{

    background: #f8fbff;

    padding: 28px;

    border-radius: 22px;

    border: 1px solid rgba(13,110,253,0.08);

}

.highlight-box h3{

    margin-bottom: 14px;

    color: #0b1b46;

}

/* MISSION VISION */

.mission-vision-section{

    padding-bottom: 100px;

}

.mission-grid{

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 30px;

}

.mission-card{

    background:
    linear-gradient(
        135deg,
        #071c4d,
        #0b2b70
    );

    color: #fff;

    padding: 50px;

    border-radius: 28px;

    box-shadow:
    0 25px 60px rgba(15,23,42,0.12);

}

.mission-icon{

    width: 72px;

    height: 72px;

    border-radius: 22px;

    background: rgba(255,255,255,0.12);

    display: flex;

    align-items: center;

    justify-content: center;

    font-size: 28px;

    margin-bottom: 28px;

}

.mission-card h3{

    font-size: 32px;

    margin-bottom: 22px;

}

.mission-card p{

    line-height: 1.9;

    color: rgba(255,255,255,0.82);

}

/* WHY CHOOSE */

.why-choose-section{

    padding-bottom: 100px;

}

.section-title-center{

    text-align: center;

    max-width: 760px;

    margin: 0 auto 60px;

}

.section-title-center span{

    display: inline-block;

    margin-bottom: 18px;

    color: #0d6efd;

    font-weight: 600;

}

.section-title-center h2{

    font-size: 48px;

    line-height: 1.2;

    color: #0b1b46;

    margin-bottom: 20px;

}

.section-title-center p{

    color: #667085;

    line-height: 1.9;

}

.why-grid{

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 28px;

}

.why-card{

    background: #fff;

    border-radius: 24px;

    padding: 40px 32px;

    box-shadow:
    0 18px 50px rgba(15,23,42,0.08);

    transition: 0.3s ease;

}

.why-card:hover{

    transform: translateY(-8px);

}

.why-card i{

    width: 72px;

    height: 72px;

    border-radius: 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    background:
    linear-gradient(
        135deg,
        #0d6efd,
        #0056d2
    );

    color: #fff;

    font-size: 28px;

    margin-bottom: 28px;

}

.why-card h3{

    margin-bottom: 16px;

    color: #0b1b46;

}

.why-card p{

    color: #667085;

    line-height: 1.8;

}