/* Header */
.site-header {
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    z-index: 1000;
}


.hero{

    position: relative;

    /*min-height: 100vh;*/

    display: flex;

    align-items: center;

    overflow: hidden;

}
.hero__background{

    position:absolute;

    inset:0;

}
.hero__slide{

    position:absolute;

    inset:0;

    opacity:0;

    transition:opacity 1.2s ease;

}

.hero__slide.active{

    opacity:1;

}
.hero__slide img{

    width:100%;

    height:100%;

    object-fit:cover;

}
.hero__overlay{

    position:absolute;

    inset:0;

    background:

    linear-gradient(

        90deg,

        rgba(3, 3, 3, 0.9),

        rgba(3,3,3,.70),

        rgba(3,3,3,.45)

    );

}
.hero .container{

    position:relative;

    z-index:2;

}
.hero__content{

    max-width:700px;

    color:white;
    margin-top: 8rem;
    margin-bottom: 7rem;

}
.hero__title{

    margin-bottom:1.5rem;

    color:white;

    line-height:1.1;

}
.hero__description{

    max-width:620px;

    margin-bottom:2.5rem;

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

    font-size:1.125rem;

}
.hero__actions{

    display:flex;

    gap:1rem;

    flex-wrap:wrap;

}
/* ==========================================================
   HERO PARTNERS
========================================================== */

.hero__partners{

    position:absolute;

    left:0;

    bottom:0;

    width:100%;

    z-index:3;

    margin-inline:auto;

    padding: 2rem 0;

    background:linear-gradient(
        to top,
        rgba(3,3,3,.82),
        rgba(3,3,3,.55),
        transparent
    );

}
.hero__partners-header{

    text-align:center;

    margin-bottom:1rem;

}

.hero__partners-label{

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

    font-size:.65rem;

    font-weight:600;

    letter-spacing:.12em;

    text-transform:uppercase;

}
.hero__partners-marquee{

    overflow:hidden;

    position:relative;

}
.hero__partners-track{

    display:flex;

    align-items:center;

    gap:5rem;

    width:max-content;

    animation:partnerMarquee 35s linear infinite;

}
.hero__partners-track img{

    height:64px;

    width:auto;

    object-fit:cover;

    opacity:.75;

    /*filter:grayscale(100%);*/

    transition:all .35s ease;

}
.hero__partners-track img:hover{

    filter:none;

    opacity:1;

    transform:scale(1.08);

}
@keyframes partnerMarquee{

    from{

        transform:translateX(0);

    }

    to{

        transform:translateX(-50%);

    }

}
.hero__partners-marquee::before,
.hero__partners-marquee::after{

    content:"";

    position:absolute;

    top:0;

    width:140px;

    height:100%;

    z-index:2;

}
.hero__partners-marquee::before{

    left:0;

    background:linear-gradient(
        to right,
        rgba(3,3,3,.9),
        transparent
    );

}
.hero__partners-marquee::after{

    right:0;

    background:linear-gradient(
        to left,
        rgba(3,3,3,.9),
        transparent
    );

}
/* ==========================================================
   HERO BACKGROUND
========================================================== */

.hero__background{

    position:absolute;

    inset:0;

    z-index:0;

}
.hero__slide{

    position:absolute;

    inset:0;

    opacity:0;

    visibility:hidden;

    transition:
        opacity 1200ms ease,
        visibility 1200ms ease;

}
.hero__slide.active{

    opacity:1;

    visibility:visible;

}
.hero__slide img{

    width:100%;

    height:100%;

    object-fit:cover;

    transform:scale(1);

    transition:transform 7s ease;

}
.hero__slide.active img{

    transform:scale(1.08);

}
.hero__overlay{

    position:absolute;

    inset:0;

    background:

    linear-gradient(

        90deg,

        rgba(3,3,3,.88) 0%,

        rgba(3,3,3,.70) 35%,

        rgba(3,3,3,.45) 65%,

        rgba(3,3,3,.25) 100%

    );

    z-index:1;

}


/* About */

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

.about{

    background:var(--neutral-0);

}
.about__wrapper {
    display: flex;
    gap: 6rem;
    align-items: center;
}

.about__image {
    width: 90%;
    max-width: 480px;
    margin-inline: auto;
    overflow: hidden;
}

.about__image img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.about__content{

    max-width:620px;

}
.section-tag{

    display:inline-block;

    margin-bottom:1rem;

    color:var(--brand-secondary);

    font-size:.85rem;

    font-weight:800;

    text-transform:uppercase;

    letter-spacing:.14em;

    color:var(--clr-secondary);

}
.about__title{

    margin-bottom:1.5rem;

    line-height:1.15;
    font-size: 2rem;

}
.about__text{

    margin-bottom:1.25rem;

    color:var(--text-body);

    line-height:1.8;

}
/* ==========================================================
   IMPACT STATS
========================================================== */

.stats{
padding: 0;
background: var(--color-surface);

}

.stats__grid{

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));

    gap: 1.5rem;

}

.stat-card{

    padding: 2.5rem 2rem;

    background: var(--clr-light);

    border-radius: 1rem;


}


.stat-card__number{

    margin-bottom: .75rem;

    color: var(--text-secondary);

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

    font-weight: 800;

    line-height: 1;

}

.stat-card__label{

    color: var(--color-text);

    line-height: 1.6;

    font-size: .95rem;
    font-weight: 800;

}
.gallery {
    padding-block: 4rem 6rem;
}

.gallery__image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 1rem;
}

/* ==========================================================
   programs
========================================================== */

.impact-programs{

    background:#333333;

}
.section-label{
    color: var(--clr-secondary);
    text-transform: uppercase;
    font-weight: 600;
}
.impact-programs .section-title{
    margin-top: 1rem;
    color:#fff;

}
.impact-programs .section-heading p{
    margin-top: 1rem;
    color:rgba(255,255,255,.75);

}
.impact-programs__wrapper{

    position:relative;

}
.impact-showcase{

    position:sticky;

    top:90px;

    height:80vh;

    overflow:hidden;

}
.impact-card{

    position:absolute;

    inset:0;

    display:grid;

    grid-template-columns:.9fr 1.1fr;

    gap:5rem;

    align-items:center;

    opacity:0;

    visibility:hidden;

    transform:translateY(50px);

    transition:
        opacity .45s ease,
        transform .45s ease,
        visibility .45s;

}
.impact-card.active{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

    z-index:2;

}

.impact-steps{

    position:relative;

}
.impact-step{

    height:100vh;

}

.impact-card__logo{

    max-width:100px;

    margin-bottom:2rem;

}
.impact-card h3{

    color:#fff;

    font-size:2rem;

    margin-bottom:1rem;

}
.impact-card p{

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

    line-height:1.8;

}
.impact-card__image{

    border-radius:20px;

    overflow:hidden;

}
.impact-card__image img{

    width:100%;

    height:100%;

    object-fit:cover;

}


.impact-card__logo{
    border-radius: 8px;
}



/* ==========================================================
   WHAT WE DO
========================================================== */

.services{
    padding-block:6rem;
    background:var(--clr-light);
}

.section-heading{
    max-width:700px;
    margin:0 auto 4rem;
    text-align:center;
}

.services__grid{
    display:flex;
    flex-wrap:wrap;
    gap:1.5rem;
}

.service-card{
    display:flex;
    flex:1 1 300px;
    flex-direction:column;


    padding:1.75rem;

    border-radius:1rem;

    background:#fff;

    border:1px solid rgba(0,0,0,.06);

    transition:.3s ease;

}


.service-card__icon{
    width:56px;
    height:56px;

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

    margin-bottom:1.5rem;

    border-radius:50%;

    background:rgba(21,173,234,.1);

    color:var(--clr-secondary);
}

.service-card__icon svg{
    width:24px;
    height:24px;
}

.service-card__title{
    margin-bottom:.85rem;
    font-size:1.25rem;
    overflow-wrap: break-word;
}

.service-card__text{
    color:var(--text-body);
    line-height:1.5;
    font-size: .8rem;
}

/* Team */
.team{

    padding-block:6rem;
    background:var(--clr-light);

}

.team__wrapper{

    display:flex;

    gap:3rem;

    align-items:flex-start;

}
.team__ceo{

    flex:0 0 340px;

    position:sticky;

    top:60px;

}
.ceo-card{

    border:1px solid rgba(0,0,0,.1);
    background:#fff;
    border-radius:1rem;
    padding:1rem;
}
.ceo-card__image{

    width:100%;

    border-radius:.75rem;

    margin-bottom:1.5rem;

}
.ceo-card__name{
    font-size: 1.2rem;
}
.ceo-card__position{
    color:var(--color-secondary);
    font-size:.95rem;
    font-weight:500;
}
.team__members{

   flex:1;

    display:flex;

    flex-wrap:wrap;

    gap:1.5rem;

}
.member-card{

    flex:1 1 calc(50% - .75rem);

    padding:1.5rem;

    background:#fff;

    border:1px solid rgba(0,0,0,.06);

    border-radius:1rem;

    transition:.3s ease;

}
.member-card img{

    width:100%;

    aspect-ratio:4/5;

    object-fit:cover;

    border-radius:.75rem;

    margin-bottom:1rem;

}
.member-card__name{

    margin-bottom:.35rem;

    font-size:1.1rem;

    font-weight:700;

}

.member-card__position{

    color:var(--color-secondary);

    font-size:.95rem;

    font-weight:500;

}

/* Testimonials */
/* ==========================================================
   TESTIMONIALS
========================================================== */

.testimonials{

    padding-block:6rem;

    background:#fff;

}

.testimonials__grid{

    display:flex;

    flex-wrap:wrap;

    gap:1.5rem;

}

.testimonial-card{

    flex:1 1 320px;

    padding:2rem;

    background:#F5F5F5;

    border-radius:1rem;

    transition:.3s ease;

}

.testimonial-card svg{

    width:40px;

    height:40px;

    color:#15ADEA;

    margin-bottom:1.5rem;

}
.testimonial-card__text{

    margin-bottom:1rem;

    line-height:1.5;

    color:#333333;

}
.testimonial-card__stars{

    margin-bottom:1.5rem;

    color:#FFD700;

    font-size:1rem;

    letter-spacing:2px;

}
.testimonial-card__name{

    margin-bottom:.35rem;
    font-size: 1.25rem;

    font-weight:700;

}

.testimonial-card__position{

    color:#666;

    font-size:.95rem;

}

.testimonial-card__organization{

    display:block;

    margin-top:.35rem;

    color:#15ADEA;

    font-weight:600;

}

/* Blog */
/* ==========================================
   BLOG
========================================== */

.blog{

    padding-block:6rem;

    background:#ffffff;

}

.blog-heading{

    display:flex;

    justify-content:space-between;

    align-items:flex-end;

    gap:2rem;

    margin-bottom:3rem;

}

.blog__link{

    display:inline-flex;

    align-items:center;

    gap:.75rem;

    padding:.9rem 1.5rem;

    border:1px solid rgba(4,1,88,.1);

    border-radius:.75rem;

    color:var(--color-primary);

    background:#fff;

    font-weight:600;

    transition:.3s ease;

}

.blog__link:hover{

   border-color: #15ADEA;
    color: #15ADEA;
    transform: translateX(2px);

}
.blog__grid{

    display:flex;

    flex-wrap:wrap;

    gap:1.5rem;

}
.blog-card{

    flex:1 1 320px;

    overflow:hidden;

    border-radius:1rem;

    background:#ffffff;

    border:1px solid rgba(0,0,0,.06);

    transition:.35s ease;

}

.blog-card:hover{

    transform:translateY(-6px);

    box-shadow:0 18px 40px rgba(0,0,0,.08);

}
.blog-card__image{

    overflow:hidden;

    aspect-ratio:16/10;

}

.blog-card__image img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.5s;

}

.blog-card:hover img{

    transform:scale(1.08);

}
.blog-card__content{

    padding:1.5rem;

}
.blog-card__category{

    display:inline-block;

    margin-bottom:1rem;

    padding:.4rem .9rem;

    border-radius:999px;

    background:rgba(21,173,234,.10);

    color:#15ADEA;

    font-size:.85rem;

    font-weight:600;

}
.blog-card__title{
    font-size: 1.25rem;
    margin-bottom:1rem;

    line-height:1.4;

}
.blog-card__excerpt{

    margin-bottom:1.5rem;

    color:#666;
    font-size: 1rem;
    line-height:1.5;

}
.blog-card__link{

    display:inline-flex;

    align-items:center;

    gap:.5rem;

    color: var(--clr-secondary);

    font-weight:600;

    text-decoration:none;

}

.blog__link{
    color: var(--clr-secondary);
}

.blog-card__link:hover{

    color:var(--clr-primary);

}
.blog__footer{

    margin-top:3rem;

    display:flex;

    justify-content:center;

}

/* Contact */
.cta-contact{

    padding-block:6rem;

    background:var(--clr-dark);

    color:#fff;

}
.cta-contact__wrapper{

    display:flex;

    gap:3rem;

    align-items:center;

}
.cta{

    flex:2;

}
.cta__desc{
    color: var(--border-color);
    margin-top: 1rem;
}
.contact-card{

    flex:1;

    padding:2rem;

    background:rgba(255,255,255,.08);

    border:1px solid rgba(255,255,255,.12);

    border-radius:1rem;

    backdrop-filter:blur(8px);

}
.contact-card ul{

    display:flex;

    flex-direction:column;

    gap:1.5rem;

    margin-top:2rem;

}
.contact-card li{

    display:flex;

    gap:1rem;

    align-items:flex-start;

}
.contact-card__link{

    display:flex;

    align-items:flex-start;

    gap:1rem;

    text-decoration:none;

    color:#ffffff;

    transition:.3s ease;

}

.contact-card__link:hover{

    color:var(--clr-secondary);

}
.contact-card svg{

    width:22px;

    height:22px;

    color:var(--clr-secondary);

    flex-shrink:0;

}
.contact-card__icon{

    width:44px;

    height:44px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:.75rem;

    background:rgba(255,255,255,.08);

    transition:.3s ease;

}


.contact-card__note{

    margin-top:2rem;

    padding-top:1.5rem;

    border-top:1px solid rgba(255,255,255,.12);

    font-size:.95rem;

    line-height:1.7;

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

}

.contact-card__note strong{

    color:#ffffff;

    font-weight:600;

}
/* Footer */
.footer{

    padding-top:5rem;

    background:var(--clr-dark);

    color:#fff;

}
.footer__grid{

    display:flex;

    flex-wrap:wrap;

    gap:3rem;

    justify-content:space-between;

}
.footer__brand{

    flex:2.5 1 420px;

}

.footer__logo{
    width: 110px;
    display: block;
}
.footer__logo img{
    width: 100%;
}

.footer__links{

    flex:1 1 200px;

}

.footer__social{

    flex:1 1 180px;

}

.footer__grid > div{

    flex:1 1 180px;

}
.footer__title{

    margin-bottom:1.5rem;

    font-size:1.1rem;

    color:#ffffff;

}
.footer ul{

    display:flex;

    flex-direction:column;

    gap:.85rem;

}
.footer a{

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

    text-decoration:none;

    transition:.3s;

}

.footer a:hover{

    color:var(--clr-secondary);

}
.footer__brand p{

    margin-top:1.5rem;

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

    line-height:1.8;
    font-size: 1rem;

}
.footer__bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:2rem;

    margin-top:4rem;

    padding:2rem 0;

    border-top:1px solid rgba(255,255,255,.1);

}
.footer__bottom p {
    font-size: 1rem;
    font-weight: 300;
    color: var(--clr-light);
}
.footer__social-links{

    display:flex;

    flex-wrap:wrap;

    gap:1rem;

}
.footer__social-links a{

    width:44px;

    height:44px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:rgba(255,255,255,.08);

    color:#ffffff;

    transition:.3s ease;

}
.footer__social-links a:hover{

    background:#15ADEA;

    color:#ffffff;

    transform:translateY(-3px);

}


.footer__social-links svg{

    width:20px;

    height:20px;

}