/* ==========================================================
   LEGACY FITNESS ZONE
   PROGRAMS SECTION STYLE
========================================================== */



/* =========================
   PROGRAMS SECTION
========================= */


.programs-section{


    background:#050505;


}







/* =========================
   SECTION HEADING
========================= */


.section-heading{


    text-align:center;


    max-width:750px;


    margin:0 auto 60px;


}





.section-heading span{


    display:inline-block;


    color:#ff3c00;


    font-size:14px;


    font-weight:600;


    letter-spacing:2px;


    margin-bottom:15px;


}







.section-heading h2{


    font-size:


    clamp(35px,5vw,60px);


    font-weight:800;


    line-height:1.15;


    margin-bottom:20px;


}







.section-heading p{


    color:#aaa;


    font-size:16px;


}








/* =========================
   PROGRAM GRID
========================= */


.program-grid{


    display:grid;


    grid-template-columns:


    repeat(3,1fr);


    gap:30px;


}








/* =========================
   PROGRAM CARD
========================= */


.program-card{


    position:relative;


    background:#111;


    border-radius:25px;


    overflow:hidden;


    min-height:450px;


    cursor:pointer;


    border:1px solid rgba(255,255,255,0.06);


    transition:0.5s ease;


}







.program-card:hover{


    transform:translateY(-12px);


    box-shadow:


    0 25px 50px rgba(0,0,0,0.5);


    border-color:#ff3c00;


}








/* =========================
   CARD IMAGE
========================= */
.program-card img{

    width:100%;

    height:100%;

    min-height:450px;

    object-fit:cover;

    transform:scale(1.15);

    transition:0.8s ease;

    will-change:transform;

}




.program-card:hover img{

    transform:scale(1.05);

}






/* =========================
   IMAGE OVERLAY
========================= */


.program-card::after{


    content:"";


    position:absolute;


    inset:0;


    background:


    linear-gradient(

    transparent,

    rgba(0,0,0,0.95)

    );


    z-index:1;


}








/* =========================
   PROGRAM CONTENT
========================= */


.program-content{


    position:absolute;


    left:0;


    bottom:0;


    width:100%;


    padding:35px;


    z-index:2;


}








.program-content h3{


    font-size:28px;


    font-weight:700;


    margin-bottom:15px;


}








.program-content p{


    font-size:14px;


    color:#ddd;


    margin-bottom:20px;


}








.program-content a{


    display:inline-flex;


    align-items:center;


    color:#ff3c00;


    font-weight:600;


    font-size:14px;


    transition:0.3s ease;


}







.program-content a::after{


    content:"→";


    margin-left:8px;


    transition:0.3s ease;


}







.program-content a:hover::after{


    transform:translateX(5px);


}








/* =========================
   CARD TOP LINE
========================= */


.program-card::before{


    content:"";


    position:absolute;


    top:0;


    left:0;


    width:0;


    height:4px;


    background:#ff3c00;


    z-index:3;


    transition:0.4s ease;


}







.program-card:hover::before{


    width:100%;


}








/* =========================
   TABLET
========================= */


@media(max-width:1000px){



.program-grid{


    grid-template-columns:


    repeat(2,1fr);


}



}








/* =========================
   MOBILE
========================= */


@media(max-width:650px){



.programs-section{


    padding:70px 0;


}





.program-grid{


    grid-template-columns:1fr;


}





.program-card{


    min-height:400px;


}





.program-card img{


    min-height:400px;


}





.program-content{


    padding:25px;


}





.program-content h3{


    font-size:24px;


}



}
.program-card{

    opacity:0;

    transform:translateY(80px);

}


.program-card img{

    clip-path:inset(10%);

}


.program-card.revealed img{

    clip-path:inset(0%);

}