/* ABOUT HERO SECTION */

.about-hero{
    position:relative;
    height:500px;

   background-image:
    linear-gradient(to top,
    rgba(60, 92, 121, 0.95) 0%,
    rgba(0,37,70,0.88) 35%,
   /* rgba(0,45,110,0.55) 60%,*/
    rgba(6, 6, 6, 0.15) 100%),
    url('../images/about.jpg');

    background-size:cover;
    background-position:center;
    background-repeat:no-repeat;

    display:flex;
    align-items:center;
    justify-content:center;

    text-align:center;
}

/* CONTENT */

.hero-content{
    position:relative;
    z-index:2;
    max-width:900px;
    padding:20px;
}

/* ABOUT US SMALL TITLE */

.small-title{
    color:#f2f5f7;
    font-size:18px;
    font-weight:700;
    letter-spacing:2px;
    position:relative;
}

.small-title::before,
.small-title::after{
    content:'';
    position:absolute;
    top:50%;
    width:70px;
    height:2px;
    background:#b7d4ff;
}

.small-title::before{
    left:-90px;
}

.small-title::after{
    right:-90px;
}

/* MAIN TITLE */

.about-hero h1{
    font-size:72px;
    font-weight:800;
    color:#efecec;
    margin-top:10px;
    margin-bottom:10px;
    line-height:1.1;
}

.about-hero h1 span{
    color:#e5e9ef;
}

/* TAGLINE */

.tagline{
    font-size:22px;
    color:#0b0e11;
    font-weight:500;
    margin-bottom:25px;
}

/* CENTER LINE */

.line{
    width:140px;
    height:2px;
    background:#101113;
    margin:25px auto;
    position:relative;
}

.line::after{
    content:'';
    position:absolute;
    width:10px;
    height:10px;
    background:#0d0e0e;
    border-radius:50%;
    top:-4px;
    left:50%;
    transform:translateX(-50%);
}

/* TEXT */

.intro-text{
    max-width:750px;
    margin:auto;
    color:#f8f1f1;
    font-size:18px;
    line-height:1.8;
}

/* RESPONSIVE */

@media(max-width:768px){

    .about-hero{
        height:420px;
        padding:40px 20px;
    }

    .about-hero h1{
        font-size:40px;
    }

    .tagline{
        font-size:16px;
    }

    .intro-text{
        font-size:14px;
    }

    .small-title::before,
    .small-title::after{
        width:35px;
    }

    .small-title::before{
        left:-45px;
    }

    .small-title::after{
        right:-45px;
    }

}
/* WHO WE ARE */.who-we-are{    padding:60px 0 10px ;}.about-grid{    display:grid;    grid-template-columns:1fr 1fr;    gap:10px;    align-items:start;}
.section-title{    color:#0077cc;    font-weight:500;    font-size:15px;}.about-left h2{    font-size:42px;    line-height:1.2;    margin:10px 0 25px;}
.about-left p{    margin-bottom:20px;    color:#555;}
.about-right{    display:grid;    grid-template-columns:1fr 1fr;    gap:20px;}
.feature-box{    border:1px solid #e5e5e5;    padding:20px 10px;    border-radius:20px;    transition:0.4s;    background:#fff;}
.feature-box:hover{    transform:translateY(-5px);    box-shadow:0 10px 30px rgba(0,0,0,0.08);}
.icon{    width:70px;    height:70px;    background:#eaf6ff;    border-radius:50%;    display:flex;    align-items:center;    justify-content:center;    margin-bottom:20px;}
.icon i{    font-size:30px;    color:#008cff;}
.feature-box h3{    font-size:18px;    margin-bottom:10px;    color:#004b87;}
.feature-box p{    color:#555;    font-size:15px;}


/* MISSION */.mission-section{    padding:40px 0 80px;}
.mission-grid{    display:grid;    grid-template-columns:repeat(3,1fr);    gap:20px;}
.mission-box{    border:1px solid #e5e5e5;    border-radius:5px;    padding:30px 25px;    transition:0.4s;}
.mission-box:hover{    transform:translateY(-5px);    box-shadow:0 10px 30px rgba(0,0,0,0.08);}
.mission-icon{    width:50px;    height:50px;    border-radius:50%;    background:#eef7ff;    display:flex;    align-items:center;    justify-content:center;    margin-bottom:20px;}
.mission-icon i{    color:#008cff;    font-size:30px;}
.mission-box h3{    color:#004b87;    margin-bottom:15px;}
.mission-box p,.mission-box li{    color:#555;}
.mission-box ul{    padding-left:20px;}/* QUOTE */.quote-section{    background:#f7fbff;    padding:50px 0;    text-align:center;}
.quote-section p{    font-size:22px;    color:#333;    max-width:900px;    margin:auto;}.quote-section i{    color:#008cff;    margin:0 10px;}



/* RESPONSIVE */@media(max-width:992px){   
   .about-grid{        grid-template-columns:1fr;    }   
 .about-right{        grid-template-columns:1fr;    }    
.mission-grid{        grid-template-columns:1fr;    }   
 .footer-grid{        grid-template-columns:1fr 1fr;    }  
  .about-hero h1{        font-size:42px;    }}@media(max-width:768px){    .footer-grid{        grid-template-columns:1fr;    }   
 .about-left h2{        font-size:32px;    }   
  .about-hero h1{        font-size:34px;    }   
   .tagline{        font-size:18px;    }}