/* section plan */
    .container_plans{
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 32px;
    }

    .content_plan{
        flex: 0 0 350px;
        border: 2px solid var(--second);
        padding: 15px;
        border-radius: 32px;
    }

    .content_plan.active{
        zoom: 110%;
    }

    .box_plan{
        display: flex;
        flex-direction: column;
        align-items: center;
        max-height: 550px;
        overflow-y: auto;
        padding: 5px;
    }

    .box_plan::-webkit-scrollbar{
        width: 0;
        height: 0;
    }

    .box_plan::-webkit-scrollbar-thumb{
        background-color: var(--light-white);
    }

    .content_plan:hover .box_plan::-webkit-scrollbar{
        width: 4px;
        height: 4px;
    }            

    .content_plan p, .content_plan h2, .content_plan strong{
        text-align: center;
    } 

    .titre_pan{
        font-size: 20px;
        font-weight: 700;
        text-transform: uppercase;
        color: var(--second);
    }

    .description_plan{
        font-size: 15px;
        margin: 8px 0;
    }

    .prix_plan, .prix_plan b{
        font-weight: 700; 
    }

    .prix_plan b{
        font-size: 32px;
    }

    .prix_plan span{
        font-size: 50px;
        font-weight: 700;
        color: var(--second);
    }

    .text_garanttie{
        font-size: 13px;                
    }

    .content_plan .flexBtn{
        width: 100%;
        margin: 16px 0;
    }

    .content_plan .flexBtn > .btn{
        width: 100%;
    }

    .content_plan .flexBtn > .btn:hover{
        scale: 1.02;
    }

    .list_caracteristique{
        list-style: none;
    }

    .list_caracteristique li{
        display: flex;
        gap: 8px;
    }

    .list_caracteristique li span{
        font-size: 13px;
    }

    .list_caracteristique li i{
        color: var(--second);
    }

    .list_caracteristique li:not(:last-child){
        margin-bottom: 8px;
    }
/* section plan */

/* responsive */
    /* section plan */
        @media screen and (max-width: 1200px) {
            .container_plans{
                flex-wrap: wrap;
            }

            .content_plan.active{
                zoom: 100%;
            }
        }

        @media screen and (max-width: 880px) {
            .content_plan{
                flex: 0 0 450px;
            }
        }

        @media screen and (max-width: 550px) {
            .content_plan{
                flex: 0 0 350px;
            }
        }

        @media screen and (max-width: 420px) {
            .content_plan{
                flex: 0 0 330px;
            }
        }

        @media screen and (max-width: 370px) {
            .content_plan{
                flex: 0 0 300px;
            }
        }
    /* section plan */
/* responsive */