/* Styles généraux */
body {
    margin: 0;
    padding: 0;
    font-family: 'Lato', sans-serif;
    background-color: #000;
    color: #fff;
}

.card {
    margin: 0; /* Enlever les marges par défaut des cartes */
}
.row {
    margin: 0 -15px; /* Enlever les marges négatives par défaut des lignes */
}
.col-md-4 {
    padding: 0 15px; /* Ajuster le padding des colonnes */
}

.intro {
    padding: 60px 0;
}

.video-gallery .card {
    border: none;
    background-color: #000; /* Fond noir pour les cartes */
    box-shadow: 0 4px 8px rgba(255, 255, 255, 0.1);
    transition: transform 0.2s;
    height: 100%; /* Assurez que toutes les cartes aient la même hauteur */
}

.video-gallery .card-img-top {
    height: 400px; /* Hauteur fixe pour les images */
    object-fit: cover; /* Assurez que l'image couvre tout l'espace disponible sans déformation */
}

.video-gallery .card-body {
    background-color: #000; /* Fond noir pour la zone sous l'image */
    color: #fff; /* Texte blanc */
}

.video-gallery .card:hover {
    transform: scale(1.05);
}

.video-gallery .btn {
    background-color: #fff; /* Fond blanc pour le bouton */
    color: #000; /* Texte noir */
    border: none; /* Pas de bordure */
}

.video-gallery .btn:hover {
    background-color: #ddd; /* Fond gris clair au survol */
    color: #000; /* Texte noir */
}

.footer {
    padding: 20px 0;
    background-color: #000; /* Assurez que le footer soit noir */
}

.footer .text-uppercase {
    text-transform: uppercase;
    font-weight: bold;
}

.footer .text-light {
    color: #ccc;
}

.footer .text-light:hover {
    color: #fff;
    text-decoration: none;
}

.navbar-dark .navbar-nav .nav-link {
    color: white;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
    color: #ff9900;
}

.navbar-dark .navbar-brand {
    color: white;
}

.navbar-dark .dropdown-menu {
    background-color: #000;
    border: none;
}

.navbar-dark .dropdown-menu .dropdown-item {
    color: white;
}

.navbar-dark .dropdown-menu .dropdown-item:hover,
.navbar-dark .dropdown-menu .dropdown-item:focus {
    color: #ff9900;
    background-color: transparent;
}

.social-icons .nav-link {
    color: white;
}

.social-icons .nav-link:hover {
    color: #ff9900;
}

@media (max-width: 991px) {
    .navbar {
        display: flex;
        justify-content: center; /* Centre le contenu horizontalement */
        align-items: center; /* Centre les éléments verticalement */
        padding: 2rem 2rem; /* Ajoute du padding en haut et en bas pour plus d'espacement */
        position: relative;
    }

    .navbar-brand {
        position: absolute;
        left: 50%;
        transform: translateX(-50%); /* Centre le titre horizontalement */
        top: 50%; /* Ajuste la position verticale pour centrer le titre */
        transform: translate(-50%, -50%); /* Centre verticalement le titre */
        white-space: nowrap;
        z-index: 1; /* Assure que le titre reste au-dessus des autres éléments */
    }

    .navbar-toggler {
        position: absolute;
        right: 1rem; /* Place le bouton hamburger à droite */
        top: 50%; /* Centre verticalement avec plus d'espace en haut */
        transform: translateY(-50%); /* Centre verticalement */
        z-index: 2; /* Assure que le bouton est au-dessus des autres éléments */
    }

    .navbar-collapse {
        position: absolute;
        top: 100%; /* Place le menu en dessous de la barre de navigation */
        left: 0;
        width: 100%;
        background-color: #000; /* Conserve le fond noir */
        text-align: left; /* Aligne le texte du menu à gauche */
        z-index: 0; /* Le menu se trouve en dessous du titre et du bouton */
    }

    .navbar-collapse.collapsing {
        height: 0; /* Permet l'animation de transition sans déplacement du titre */
    }
    .navbar-nav .nav-link {
        padding-left: 15px; /* Ajoute un décalage vers la droite pour le texte */
    }
}