/* --- STYLES POUR LA MODALE --- */
    .modal {
        display: none; 
        position: fixed;
        z-index: 1000;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.7);
        backdrop-filter: blur(5px);
    }

    .modal-content {
        background-color: #fff;
        margin: 10% auto;
        padding: 30px;
        border-radius: 12px;
        width: 90%;
        max-width: 500px;
        position: relative;
        text-align: center;
        box-shadow: 0 5px 30px rgba(0,0,0,0.5);
    }

    .close {
        position: absolute;
        right: 20px;
        top: 10px;
        font-size: 28px;
        cursor: pointer;
        color: #aaa;
    }

    .btn-ouvrir {
        display: inline-block;
        margin-top: 20px;
        padding: 12px 25px;
        background-color: #27ae60;
        color: white;
        text-decoration: none;
        border-radius: 5px;
        font-weight: bold;
    }

    /* On transforme le curseur pour indiquer que c'est cliquable */
    .vignette { cursor: pointer; }