#programmes-main{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4rem;
    background: linear-gradient(135deg, var(--main-color) 0%, var(--secondary-color) 50%, rgb(74, 63, 53) 100%);
}
#programmes-main > div{
    width: 35%;
}
#programmes-main img{
    max-width: 100%;
    border-radius: 2rem;
}
.programmes-main-left h1{
    font-family: "Cormorant", serif;
    font-size: 6rem;
    color: #fff;
}

#coaching{
    background-color: #fdfbf7;
    display: flex;
    align-items: center;
    gap: 4.5rem;
    padding: 6rem 6rem;
}
#coaching img{
    max-width: 100%;
    border-radius: 10px;
}
#coaching > div{
    width: 50%;
}
.coaching-div-left{
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.coaching-div-left h1{
    font-family: "Cormorant", serif;
    font-size: 3.5rem;
}
.coaching-div-left p{
    font-family: var(--main-font-family);
    font-size: 1.09rem;
}
.coaching-div-left a{
    text-decoration: none;
    background-color: #6B5744;
    width: fit-content;
    padding: .75rem 3rem;
    color: #fdfbf7;
    border-radius: 50px;
    font-family: var(--main-font-family);
    font-size: 1.09rem;
}
.coaching-div-left a:hover{
    color: #fdfbf7;
    background-color: #6b5744ac;
}


#program-category{
    display: flex;
    gap: 2rem;
    justify-content: center;
    padding: 6rem 2rem;
}
.program-category-div{
    width: 30%;
    position: relative;
    border-radius: 17px;
}
.program-category-div img{
    max-width: 100%;
    border-radius: 17px;
}
.shine-red{
    background-color: rgba(107, 87, 68, 0.41);
    background-image: linear-gradient(to top, rgba(215, 11, 96, .92), rgba(215, 11, 96, .3), rgba(215, 11, 96, 0));
}
.shine-green{
    background-color: rgba(107, 87, 68, 0.41);
    background-image: linear-gradient(to top, rgba(17, 145, 152, .92), rgba(17, 145, 152, .3), rgba(17, 145, 152, 0));
}
.shine-yellow{
    background-color: rgba(107, 87, 68, 0.41);
    background-image: linear-gradient(to top, rgba(235, 188, 2, .92), rgba(235, 188, 2, .3), rgba(235, 188, 2, 0));
}
.shine{
    position: absolute;
    bottom: 0;
    border-radius: 17px;
    color: #fff;
    padding: 2rem;
    padding-bottom: 3rem;
    /*background-color: rgba(107, 87, 68, 0.41);
    background-image: linear-gradient(to top, rgba(107, 87, 68, .92), rgba(107, 87, 68, .3), rgba(107, 87, 68, 0));
    */
    display: flex;
    flex-direction: column;
    justify-content: end;
    height: 100%;
}
.shine h1{
    font-family: "Cormorant", serif;
    margin-bottom: 3.2rem;
    font-size: 2rem;
    text-transform: uppercase;
}
.shine p{
    font-family: var(--main-font-family);
    font-size: 1.09rem;
}
.shine a{
    background-color: #fdfbf7;
    color: #6B5744;
    padding: .5rem 1.5rem;
    text-decoration: none;
    border-radius: 50px;
    font-size: 1.09rem;
    width: fit-content;
}

#faq{
    background-color: #fdfbf7;
    padding: 5rem 0;
}
#faq h1{
    text-align: center;
    font-family: "Cormorant", serif;
    font-weight: 500;
    font-size: 3.7rem;
    margin-bottom: 3rem;
}
.accordion{
    width: 60%;
    margin: auto;
}
.accordion-item{
    margin-bottom: 2rem !important;
}
.accordion-item button{
    text-transform: uppercase !important;
    font-weight: 500 !important;
    font-size: 1.25rem;
    padding-block: 1.5rem;
}
.accordion-item p{
    font-family: var(--main-font-family);
    font-size: 1.1rem;
    color: #2B2B2B;
}
.accordion-button:not(.collapsed) {
    color: black !important; /* Forces the active button's text color to black */
    border: none;
}

@media screen and (max-width: 598px) {
    #programmes-main{
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        padding: .75rem;
        padding-bottom: 4rem;
        background: linear-gradient(135deg, rgb(139, 115, 85) 0%, rgb(107, 87, 68) 50%, rgb(74, 63, 53) 100%);
    }
    #programmes-main > div{
        width: 100%;
    }
    .programmes-main-left h1{
        font-size: 3rem;
        text-align: center;
    }

    #coaching{
        background-color: #fdfbf7;
        flex-direction: column;
        align-items: center;
        gap: 1.5rem;
        padding: 3rem .75rem;
    }
    #coaching > div{
        width: 100%;
    }


    #program-category{
        display: flex;
        flex-direction: column;
        gap: 2rem;
        justify-content: center;
        padding: 2rem 1rem;
    }
    .program-category-div{
        width: 100%;
        position: relative;
        border-radius: 17px;
    }

    #faq{
        padding: 3rem .75rem;
    }
    .accordion{
        width: 100%;
        margin: auto;
    }
}