/* =========================
   ENDED OPPORTUNITY DETAILS
========================= */



/* HERO */

.ended-hero{

    background:var(--light);

    padding:100px 10%;

    text-align:center;

}


.ended-hero span{

    display:inline-block;

    padding:8px 20px;

    border-radius:20px;

    background:var(--accent);

    color:white;

    font-weight:600;

    margin-bottom:20px;

}



.ended-hero h1{

    font-family:var(--font-heading);

    font-size:var(--heading-xl);

    color:var(--primary);

    margin-bottom:20px;

}



.ended-hero p{

    max-width:800px;

    margin:auto;

    font-size:var(--text-lg);

}







/* OVERVIEW */


.ended-overview{

    padding:var(--section-padding);

    display:flex;

    justify-content:center;

    align-items:center;

    gap:60px;

}



.ended-image{

    width:450px;

}



.ended-image img{

    width:100%;

    border-radius:25px;

    object-fit:cover;

}




.ended-content{

    max-width:550px;

}



.ended-content h2{

    font-family:var(--font-heading);

    color:var(--primary);

    font-size:var(--heading-lg);

    margin-bottom:20px;

}



.ended-content p{

    line-height:1.8;

}





/* INFO BOX */


.info-box{

    display:flex;

    gap:20px;

    margin-top:35px;

    flex-wrap:wrap;

}



.info-box div{

    background:var(--light);

    padding:20px;

    border-radius:15px;

    min-width:150px;

    text-align:center;

}



.info-box h3{

    font-family:var(--font-heading);

    color:var(--accent);

    font-size:18px;

}






/* program-partners */


.program-partners{

    background:var(--light);

    padding:80px 10%;

    text-align:center;

}



.program-partners h2{

    font-family:var(--font-heading);

    color:var(--primary);

    font-size:var(--heading-lg);

    margin-bottom:40px;

}



.program-partners-cards{

    display:flex;

    justify-content:center;

    gap:40px;

    flex-wrap:wrap;

}


.partner-card{

width:200px;
flex:0 0 200px;
padding:15px;

text-align:center;

background:white;

border-radius:22px;
transition:.3s;
        background: 
        linear-gradient(#fff, #fff) padding-box, 
        linear-gradient(to top, var(--accent), transparent) border-box,
        linear-gradient(to bottom, var(--orange), transparent) border-box;
        
    border: 1px solid transparent;

}


.partner-card:hover{
    transform:translateY(-12px);
    box-shadow:0 5px 15px rgba(0,0,0,0.15);
}

.partner-card img{
width:80px;
height:80px;
border-radius: 50%;
object-fit:cover;
margin-bottom:20px;
box-shadow:0 5px 15px rgba(0,0,0,0.4);
}



.partner-card h3{
font-family:var(--font-heading);
color:var(--primary);
}

.partner-card span{
font-family:var(--font-body);
color:var(--text);
font-weight: bold;
font-size: 14px;
}



/* EXPERIENCE */


.experience{

    padding:90px 10%;

    text-align:center;

}



.experience h2{

    font-family:var(--font-heading);

    color:var(--primary);

    font-size:var(--heading-lg);

    margin-bottom:20px;

}



.experience p{

    max-width:800px;

    margin:auto;

}



.experience-list{

    margin-top:40px;

    display:flex;

    justify-content:center;

    gap:25px;

    flex-wrap:wrap;

}



.experience-list div{

    background:white;

    padding:20px 35px;

    border-radius:30px;

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

    color:var(--primary);

    font-weight:600;

}









/* =========================
PROJECT GALLERY SLIDER
========================= */


.project-gallery{

    padding:50px 10%;

    overflow:hidden;
    background: var(--light);

}



.project-gallery h2{

    text-align:center;

    color:var(--primary);

    font-family:var(--font-heading);

    font-size:var(--heading-lg);

    margin-bottom:50px;

}





.gallery-wrapper{

    overflow:hidden;

    width:100%;

}





.gallery{


    display:flex;

    gap:30px;

    padding: 20px 0px;

    width:max-content;




}


.gallery-item{


    display:flex;

    gap:20px;

    flex-shrink:0;


}






.square-images{


    display:flex;

    flex-direction:column;

    gap:20px;


}



.square-images img{


    width:220px;

    height:220px;

    object-fit:cover;

    border-radius:20px;


}





.vertical-image{


    width:260px;

    height:460px;

    object-fit:cover;

    border-radius:20px;


}
.vertical-video{


    width:260px;

    height:460px;

    object-fit:cover;

    border-radius:20px;


}





.gallery img, .gallery video{
    transition:.3s;
}




.gallery img:hover, .gallery video:hover{
    transform:scale(1.05);
    box-shadow:0 5px 15px rgba(0,0,0,0.5);
}





@keyframes galleryMove{


from{

transform:translateX(0);

}



to{

transform:translateX(-50%);

}


}





@media(max-width:800px){


.square-images img{


width:150px;

height:150px;


}



.vertical-image{


width:150px;

height:320px;


}
}


/* =========================
 PARTICIPANT REVIEWS
========================= */

.reviews-section{
padding:10px 10%;
background:var(--white);
text-align:center;
}

.reviews-section h2{
font-family:var(--font-heading);
font-size:var(--heading-lg);
color:var(--primary);
margin-bottom:20px;
}

.reviews-intro{
max-width:700px;
margin:auto;
margin-bottom:45px;
}

.reviews-container{
overflow:hidden;
width:100%;
padding: 20px 0px;
}

.reviews-slider{
display:flex;
gap:35px;
transition:.5s ease;
}

.review-card{
width:500px;
flex: 0 0 500px;
padding:35px;
border-radius:25px;
        background: 
        linear-gradient(#fff, #fff) padding-box, 
        linear-gradient(to top, var(--accent), transparent) border-box,
        linear-gradient(to bottom, var(--orange), transparent) border-box;
    border: 1px solid transparent;
text-align:center;
transition: 0.3s;
}

.review-card:hover{
    transform:scale(1.05);
    box-shadow:0 5px 15px rgba(0,0,0,0.5);
}

.review-avatar img{
width:100px;
height:100px;
border-radius:50%;
object-fit:cover;
box-shadow:0 5px 15px rgba(0,0,0,0.5);
}



.review-card p{
line-height:1.2;
font-style: italic;
font-size: 14px;
}

.review-card h3{
font-size: 16px;
font-family:var(--font-heading);
color:var(--primary);
margin-top:10px;
}



.review-card span{
color:var(--accent);
font-size:14px;
font-weight:600;
}




/* CTA */


.ended-cta{

    background: var(--light);
    padding:80px 10%;

    text-align:center;

}



.ended-cta h2{

    font-family:var(--font-heading);

    color:var(--primary);

    font-size:var(--heading-lg);

    margin-bottom:30px;

}



.ended-cta a{


    display:inline-block;

    padding:15px 35px;

    background:var(--orange);

    color:white;

    border-radius:30px;

    text-decoration:none;

    font-weight:600;

    transition: 0.3s;

}



.ended-cta a:hover{

    background:var(--primary);

}



/* =========================
   RESPONSIVE
   ENDED OPPORTUNITY DETAILS
========================= */


/* TABLET */
@media (max-width:1024px){


.ended-hero{
    padding:80px 7%;
}


.ended-hero h1{
    font-size:50px;
}


.ended-overview{

    flex-direction:column;

    text-align:center;

    padding:70px 7%;

    gap:40px;

}



.ended-image{

    width:80%;

}


.ended-content{

    max-width:800px;

}



.info-box{

    justify-content:center;

}



.program-partners{

    padding:70px 7%;

}



.experience{

    padding:70px 7%;

}



.square-images img{

    width:180px;

    height:180px;

}



.vertical-image,
.vertical-video{

    width:220px;

    height:400px;

}



.review-card{

    width:400px;

    flex:0 0 400px;

}



.ended-cta{

    padding:70px 7%;

}



}




/* MOBILE */
@media (max-width:600px){



/* HERO */


.ended-hero{

    padding:60px 5%;

}


.ended-hero span{

    font-size:13px;

}



.ended-hero h1{

    font-size:35px;

    line-height:1.3;

}



.ended-hero p{

    font-size:16px;

    line-height:1.7;

}





/* OVERVIEW */


.ended-overview{

    padding:50px 5%;

}



.ended-image{

    width:100%;

}



.ended-content h2{

    font-size:32px;

}



.ended-content p{

    font-size:15px;

}





/* INFO */


.info-box{

    flex-direction:column;

    align-items:center;

}



.info-box div{

    width:100%;

}






/* PARTNERS */


.program-partners{

    padding:50px 5%;

}



.program-partners h2{

    font-size:32px;

}



.partner-card{

    width:100%;

    max-width:250px;

}





/* EXPERIENCE */


.experience{

    padding:60px 5%;

}


.experience h2{

    font-size:32px;

}


.experience-list{

    flex-direction:column;

    align-items:center;

}



.experience-list div{

    width:90%;

    padding:18px;

}





/* GALLERY */


.project-gallery{

    padding:40px 5%;

}



.project-gallery h2{

    font-size:32px;

}



.gallery{

    gap:15px;

}



.gallery-item{

    gap:15px;

}



.square-images{

    gap:15px;

}



.square-images img{

    width:130px;

    height:130px;

}



.vertical-image,
.vertical-video{

    width:160px;

    height:280px;

}




/* REVIEWS */


.reviews-section{

    padding:40px 5%;

}



.reviews-section h2{

    font-size:32px;

}



.reviews-slider{

    gap:20px;

}



.review-card{

    width:300px;

    flex:0 0 300px;

    padding:25px;

}



.review-card:hover{

    transform:none;

}



.review-card p{

    font-size:13px;

}




/* CTA */


.ended-cta{

    padding:60px 5%;

}



.ended-cta h2{

    font-size:32px;

}



.ended-cta a{

    padding:13px 28px;

}



}