.bureau-anime {
    position: relative; /* Nécessaire pour positionner l'overlay avec un pseudo-élément */
    width: 100%;
    background: 
        url("../images/lionlogoaslan2.png") center center no-repeat, /* Logo sans fond */
        black; /* Couleur de fond */
    background-size: cover; /* Taille de fond par défaut */
    background-attachment: fixed; /* Attachement fixe pour l'image de fond */
    background-position: center center; /* Centre l'image de fond */
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bureau-anime::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4); /* Overlay noir à 40% d'opacité */
    z-index: 1; /* S'assure que l'overlay est au-dessus du fond mais en dessous du contenu */
}

.bureau-anime dotlottie-player {
    position: relative;
    z-index: 2; /* Le contenu est au-dessus de l'overlay */
    width: 300px; /* Taille par défaut pour les écrans plus grands */
    height: 300px;
}

/* Media query pour les écrans de taille moyenne (tablettes) et inférieurs */
@media screen and (max-width: 768px) {
    .bureau-anime {
        background-attachment: scroll; /* Permet à l'image de fond de défiler avec le contenu */
        background-size: contain; /* Change la taille de l'image pour qu'elle soit visible */
        background-position: center top; /* Centre l'image en haut */
    }

    .bureau-anime dotlottie-player {
        width: 250px; /* Réduit la taille de l'animation pour mobiles */
        height: 250px; /* Réduit la hauteur */
    }
}

/* Media query pour les petits écrans (smartphones) */
@media screen and (max-width: 480px) {
    .bureau-anime {
        background-size: cover; /* Garde le cover pour les petits écrans */
        background-position: center; /* Centre l'image de fond */
    }

    .bureau-anime dotlottie-player {
        width: 200px; /* Taille plus petite pour les smartphones */
        height: 200px; /* Ajustement de la hauteur */
    }
}
