.about-site-header{
    top:0;
}
/* ==========================================================
   ABOUT HERO
========================================================== */

.about-hero{

    position:relative;

    display:flex;

    align-items:center;

    justify-content:center;

    overflow:hidden;

}
.about-hero__bg{

    position:absolute;

    inset:0;

    z-index:-2;

}

.about-hero__bg img{

    width:100%;

    height:100%;

    object-fit:cover;

}
.about-hero__overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        rgba(3,3,3,.75),
        rgba(3,3,3,.70)
    );

    z-index:-1;

}

.about-hero__content{

    max-width:760px;

    padding:4rem 0 2rem;

    color:#ffffff;

}
.section-label{

    display:inline-block;

    margin-bottom:1rem;

    color:var(--clr-secondary);

    font-size:.95rem;

    font-weight:600;

    text-transform:uppercase;

    letter-spacing:.08em;

}
.about-hero h1{

    margin-bottom:1.5rem;

    font-size:clamp(2.5rem,5vw,2.5rem);

    line-height:1.15;

}
.about-hero p{

    max-width:640px;

    font-size:1.125rem;

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

}


/* ==========================================
   OUR STORY
========================================== */

.our-story{

    padding:6rem 0;

}
.our-story__wrapper{

    display:flex;

    align-items:center;

    gap:5rem;

}
.our-story__content{

    flex:1.2;

}
.our-story__content p{

    margin:1.5rem 0 2.5rem;

    line-height:1.8;

    color:var(--color-text);

}

.our-story__image{

    flex:1;

}
.our-story__image img{

    width:100%;

    display:block;

    border-radius:1rem;

    object-fit:cover;

}
/* ==========================================================
   JOURNEY
========================================================== */

.journey{

    background: var(--clr-dark);

    padding-bottom:6rem;

    color:#ffffff;

}
.journey__banner{

    height:35vh;

    min-height:280px;

    overflow:hidden;
    margin-bottom:4rem;
    border-radius:1rem;

}
.journey__banner img{

    width:100%;

    height:100%;

    object-fit:cover;

}
.journey__header{

    text-align:center;

    margin:0 auto 4rem;

    max-width:700px;

}
.journey__header .section-title{

    color:#ffffff;

}
.timeline{

    position:relative;

    max-width:1000px;

    margin:auto;

}
.timeline::before{

    content:"";

    position:absolute;

    top:0;

    bottom:0;

    left:50%;

    width:2px;

    background:#15ADEA;
    opacity: .5;

    transform:translateX(-50%);

    border-radius:999px;

}

.timeline__item{

    position:relative;

    width:50%;

    margin-bottom:4rem;

}
.timeline__item--right{

    margin-left:auto;

    padding-left:3rem;

}
.timeline__item--left{

    padding-right:3rem;

}
.timeline__item::before{

    content:"";

    position:absolute;

    top:1.2rem;

    width:14px;

    height:14px;

    background:#15ADEA;

    border:2px solid #ffffff;

    border-radius:50%;

}
.timeline__item--right::before{

    left:-7px;

}
.timeline__item--left::before{

    right:-7px;

}
.timeline__content{

    color:var(--text-white);
}
.timeline__year{

    display:inline-block;

    margin-bottom:1rem;

    color:#15ADEA;

    font-weight:700;

    font-size:1.25rem;

}
.timeline__content h3{

    margin-bottom:.75rem;

}
.timeline__content p{

    line-height:1.7;

    color:var(--text-light);

}
/* ==========================================================
   MISSION • VISION • VALUES
========================================================== */

.mvv{

    padding:6rem 0;

    background:#ffffff;

}
.mvv__grid{

    display:grid;

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

    gap:2rem;
    align-items:stretch;

    margin-top:4rem;

}
.mvv__card{

    background:var(--bg-light);

    border-radius:1rem;
border:1px solid rgba(0,0,0,.08);
    padding:2rem;
box-shadow:var(--shadow-md);
    display:flex;

    flex-direction:column;
    height:100%;

}
.mvv__card i{

    width:32px;

    height:32px;

    color:#15ADEA;

    margin-bottom:2rem;

}
.mvv__card h3{
    margin-top: 1rem;
    margin-bottom:1rem;

}
.mvv__card p{
    font-size:1rem;
    line-height:1.5;

    color:#555;

}
.mvv__card ul{

    margin:0;

    padding-left:1rem;

    display:grid;

    gap:.75rem;

    color:#555;

}
.mvv__image{

    overflow:hidden;

    border-radius:1rem;
    height:100%;

}
.mvv__image img{

    width:100%;

    height:100%;

    min-height:320px;

    object-fit:cover;

    display:block;

    transition:transform .6s ease;

}
.mvv__image:hover img{

    transform:scale(1.05);

}
/* ==========================================
   TRUSTED BY
========================================== */

.partners{

    padding:6rem 0;

    background:#F8FAFC;

}
.partner-marquee-title{
    margin-bottom:1rem;
}
.partners .logo-marquee img{

    height:64px;

}

.hero__partners-marquee::before{

    left:0;

    background:linear-gradient(
        to right,
        rgba(255, 255, 255, 0.9),
        transparent
    );

}
.hero__partners-marquee::after{

    right:0;

    background:linear-gradient(
        to left,
        rgba(255, 255, 255, 0.9),
        transparent
    );

}




/* Mobile responsiveness */
@media (max-width:992px){

    .our-story__wrapper{

        flex-direction:column-reverse;

        gap:3rem;

    }

    .our-story__content{

        text-align:center;

    }

    .our-story__stats{

        justify-content:center;

    }
     .mvv__grid{

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

    }

}



@media (max-width:768px){

    .about-hero{

        min-height:50vh;

    }

    .about-hero__content{

        padding:7rem 0 3rem;

    }

    .about-hero h1{

        font-size:2.25rem;

    }

    .about-hero p{

        font-size:1rem;

    }
    .timeline::before{

        left:20px;

    }

    .timeline__item{

        width:100%;

        padding-left:4rem;

        padding-right:0;

        margin-left:0;

    }
    .timeline__item--left,
    .timeline__item--right{

        padding-left:4rem;

    }

    .timeline__item::before{

        left:11px;

        right:auto;

    }
     .mvv__grid{

        grid-template-columns:1fr;

    }
    

}