/* ===============================
   PROGRAMMES SECTION
================================ */

.programmes {
    position: relative;
    padding: 50px 0;

    background:
        radial-gradient(
            circle at top left,
            rgba(13, 110, 253, 0.12),
            transparent 40%
        ),
        radial-gradient(
            circle at bottom right,
            rgba(25, 135, 84, 0.12),
            transparent 45%
        ),
        linear-gradient(
            135deg,
            #f8fafc,
            #eef4f1,
            #f5f7fb
        );

    overflow: hidden;
}

.programmes::before,
.programmes::after {
    content: "";

    position: absolute;

    width: 350px;
    height: 350px;

    border-radius: 50%;

    filter: blur(80px);

    opacity: 0.35;

    pointer-events: none;
}

.programmes::before {
    top: -150px;
    left: -120px;

    background: rgba(13, 110, 253, 0.25);
}

.programmes::after {
    bottom: -180px;
    right: -100px;

    background: rgba(25, 135, 84, 0.25);
}

.programmes .container {
    position: relative;
    z-index: 2;
}


.section-heading{

    max-width:720px;

    margin-bottom:70px;

}


.section-tag{

    display:flex;

    align-items:center;

    gap:15px;

    color:#b8860b;

    font-size:.8rem;

    font-weight:700;

    letter-spacing:2px;

    margin-bottom:20px;

}


.section-tag span{

    width:45px;

    height:3px;

    background:#FFC107;

    border-radius:10px;

}


.section-heading h2{

    font-size:clamp(1.5rem,4vw,3.5rem);

    font-weight:800;

    line-height:1.1;

    color:#1f2937;

    margin-bottom:25px;

}


.section-heading h2 span{

    color:#198754;

}


.section-heading p{

    font-size:1.1rem;

    line-height:1.8;

    color:#6b7280;

}


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

.programmes-grid{

    display:grid;

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

    gap:30px;

}


/*===============================
        PROGRAMME CARD
================================*/

.programme-card{

    position:relative;

    height:520px;

    overflow:hidden;

    border-radius:25px;

    cursor:pointer;

    isolation:isolate;

}


.programme-image{

    position:absolute;

    inset:0;

    z-index:-2;

}


.programme-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:transform .7s ease;

}


.programme-overlay{

    position:absolute;

    inset:0;

    z-index:-1;

    background:
        linear-gradient(
            to top,
            rgba(5,15,20,.95),
            rgba(5,15,20,.25)
        );

}


.programme-card:hover .programme-image img{

    transform:scale(1.1);

}


/*===============================
        NUMBER
================================*/

.programme-number{

    position:absolute;

    top:30px;

    right:30px;

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

    font-size:1.1rem;

    font-weight:700;

    letter-spacing:2px;

}


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

.programme-content{

    position:absolute;

    left:35px;

    right:35px;

    bottom:35px;

    color:#fff;

}


.programme-icon{

    width:65px;

    height:65px;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:25px;

    border-radius:18px;

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

    backdrop-filter:blur(10px);

    -webkit-backdrop-filter:blur(10px);

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

    font-size:1.5rem;

    color:#FFC107;

}


.programme-content h3{

    font-size:1.7rem;

    font-weight:700;

    margin-bottom:15px;

}


.programme-content p{

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

    line-height:1.7;

    margin-bottom:25px;

}


/*===============================
        LINK
================================*/

.programme-link{

    display:inline-flex;

    align-items:center;

    gap:12px;

    color:#FFC107;

    font-weight:600;

    text-decoration:none;

    transition:.3s;

}


.programme-link i{

    transition:.3s;

}


.programme-link:hover i{

    transform:translateX(8px);

}