/* Titres principaux */
h2 { 
    font-size: 36px; /* Réduire un peu la taille du titre pour moins de lourdeur visuelle */
    margin-bottom: 1.5rem; /* Ajouter de l'espace sous le titre */
    margin-top: 2rem; /* Ajouter de l'espace au-dessus du titre */
}

h3{
    margin-top: 4rem;
    margin-bottom: 3rem;
}

/* Section de l'en-tête */
header {
    padding: 0rem 0 !important;
}

/* Contenu du blog */
#blog-content {
    margin-top: 6rem;
    line-height: 1.9; /* Augmenter l'espacement entre les lignes pour une meilleure lisibilité */
}

/* Paragraphes */
#blog-content p {
    margin-bottom: 1.5rem; /* Ajouter de l'espace sous chaque paragraphe */
    text-align: justify;
}

/* Images du contenu du blog */
#blog-content img {
    margin-top: 1.5rem; /* Ajouter de l'espace au-dessus des images */
    margin-bottom: 2rem; /* Ajouter de l'espace en dessous des images */
}

/* Section des articles connexes */
#related-posts {
    padding: 4rem 0; /* Ajouter de l'espace au-dessus et en dessous de la section */
}

#related-posts h3 {
    margin-bottom: 2rem; /* Ajouter de l'espace sous le titre des articles connexes */
}

#related-posts .card {
    margin-bottom: 3rem; /* Ajouter plus d'espace entre les cartes d'articles connexes */
}

/* Cartes d'articles connexes */
#related-posts .card-title {
    font-size: 1.25rem;
    margin-bottom: 1rem;
}

#related-posts .card-body {
    line-height: 1.6; /* Augmenter l'espacement entre les lignes pour les cartes */
}

/* Ajustement des boutons */
.btn-primary {
    background: #fd8917;
    padding: 10px 20px;
    font-weight: bold;
    border: none;
    border-radius: 5px;
 /* Ajouter de l'espace entre le contenu et le bouton */
}

.btn-primary:hover {
    background: #e67e00;
}

/* Section des dates */
#published-date {
    font-size: 0.9rem;
    color: #555; /* Une couleur plus douce pour rendre le texte moins agressif visuellement */
    margin-bottom: 2rem; /* Ajouter de l'espace sous la date de publication */
}
