/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 04 2025 | 10:35:55 */
/* =================================
   Correction Couleur Arrière-Plan
   ================================= */

/* Pour l'arrière-plan général du site ('le mur') */
body {
    background-color: #E9ECEF !important;
}

/* Pour l'arrière-plan du contenu ('la feuille') */
.ast-separate-container, 
.ast-plain-container,
.ast-separate-container .ast-article-post, 
.ast-separate-container .ast-comment-list li, 
.ast-plain-container .ast-single-post {
    background-color: #F8F9FA !important;
}

/* =================================
   Raffinements Typographie des Titres
   ================================= */

/* Pour mettre les titres H3 dans la couleur d'accentuation */
h3.entry-title,
.entry-content h3 {
    color: #2A52BE;
}

/* Pour mettre les titres H6 en gras (via Astra) et en italique (ici) */
.entry-content h6 {
    font-style: italic;
}

/* =================================
   Espacement personnalisé des Titres
   ================================= */

.entry-content h2 {
    margin-top: 40px;
    margin-bottom: 15px;
}

.entry-content h3 {
    margin-top: 30px;
    margin-bottom: 10px;
}

/* =================================
   Style personnalisé pour les Citations
   ================================= */

.entry-content blockquote {
    border-left: 3px solid #2A52BE; /* Utilise votre couleur d'accentuation */
    padding-left: 25px;
    margin-left: 0;
    margin-right: 0;
    font-size: 1.1em; /* Un peu plus grand que le texte normal */
    font-style: italic;
    color: #555555; /* Un gris moyen pour se distinguer */
}

.entry-content blockquote p {
    margin-bottom: 0;
}

/* =================================
   Style subtil pour les Images
   ================================= */

.entry-content img {
    border-radius: 5px; /* Les mêmes coins arrondis que vos boutons */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08); /* Une ombre très douce et discrète */
}

/* =======================================================
   STYLE DE SURVOL POUR LES BLOCS D'ARTICLES (Coins droits)
   (Accueil et Publications Similaires)
   ======================================================= */

/* 1. On prépare les "cartes" à l'animation */
.uagb-post__inner-wrap,
.ast-related-posts-wrapper .ast-related-post {
    transition: all 0.3s ease-in-out; 
    border-radius: 0 !important; /* On force les coins droits sur la carte */
}

/* 2. On s'assure que le conteneur de l'image a aussi des coins droits */
.uagb-post__image,
.ast-related-posts-wrapper .post-thumb {
    border-radius: 0 !important;
}

/* 3. Au survol, on applique l'ombre et le relief */
.uagb-post__inner-wrap:hover,
.ast-related-posts-wrapper .ast-related-post:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 28px rgba(0,0,0,0.1), 0 10px 10px rgba(0,0,0,0.08);
}

/* =======================================================
   VERSION 3 : Effet de survol robuste pour la grille
   ======================================================= */

/* On définit le lien comme le cadre de référence pour la position */
.ast-post-format- .post-thumb a {
    display: block;
    position: relative;
}

/* On crée la couche de couleur (l'overlay) */
.ast-post-format- .post-thumb a::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #2A52BE; /* Votre Bleu Encre */
    opacity: 0; /* On le cache par défaut */
    transition: opacity 0.4s ease-in-out;
    border-radius: 5px; /* On n'oublie pas les coins arrondis */
}

/* Au survol du lien, on fait apparaître la couche de couleur */
.ast-post-format- .post-thumb a:hover::after {
    opacity: 0.2; /* Réglez cette valeur pour une teinte plus ou moins forte */
}

/* On s'assure que l'image elle-même est en dessous de notre couche de couleur */
.ast-post-format- .post-thumb img {
    display: block; /* Évite des espaces fantômes sous l'image */
    position: relative;
    z-index: 1; /* Couche de l'image */
    transition: transform 0.4s ease-in-out;
}

/* On s'assure que notre couche de couleur est au-dessus */
.ast-post-format- .post-thumb a::after {
    z-index: 2; /* Couche de l'overlay */
}


/* =======================================================
   Style COMPLET pour le bouton Hero (Défaut et Survol)
   ======================================================= */

/* -- État Normal (par défaut) -- */
.bouton-hero-accueil .wp-block-button__link {
    background-color: #2A52BE !important; /* Votre Bleu Encre */
    color: #FFFFFF !important;             /* Texte en blanc */
    transition: background-color 0.3s ease-in-out; /* Prépare une animation fluide */
}

/* -- État au Survol -- */
.bouton-hero-accueil .wp-block-button__link:hover {
    background-color: #5F85D9 !important; /* Votre bleu plus clair */
    color: #FFFFFF !important;             /* Le texte reste blanc */
}


/* =======================================================
   Styles responsives pour la Bannière d'Accueil (Mobile) - VERSION RENFORCÉE
   ======================================================= */

/* =======================================================
   Styles pour le Titre de la Bannière d'Accueil
   ======================================================= */

/* Taille par défaut pour Ordinateur */
.banniere-hero-accueil h1.wp-block-heading {
    font-size: 60px !important; 
}

/* Version pour les petits écrans */


/* =======================================================
   Style pour le Bouton de Newsletter sur Fond Bleu
   (Effet "Fantôme Inversé")
   ======================================================= */

/* =======================================================
   Style COMPLET pour le Bouton de Newsletter sur Fond Bleu
   ======================================================= */

/* Cible le bouton auquel on a ajouté notre classe personnalisée */
.mailpoet_form .bouton-newsletter-bleu input[type=submit] {
    /* --- État Normal : "Fantôme" --- */
    width: 100% !important;
    background-color: transparent !important;
    color: #FFFFFF !important;             
    border: 2px solid #FFFFFF !important;  
    border-radius: 5px !important; /* <-- On force les coins arrondis ici */
    transition: all 0.3s ease-in-out !important; 
}

/* --- État au Survol : "Plein" --- */
.mailpoet_form .bouton-newsletter-bleu input[type=submit]:hover {
    background-color: #FFFFFF !important;
    color: #2A52BE !important;           
}


/* =======================================================
   Styles pour la section Newsletter de l'accueil
   ======================================================= */

/* Centre le contenu du formulaire (titre, texte, champs) */
.section-newsletter-centree {
    text-align: center;
}

/* Cible spécifiquement le bouton pour l'étirer en pleine largeur */
.section-newsletter-centree .forminator-button-submit {
    width: 100% !important;
    margin-top: 15px !important; /* Ajoute un peu d'espace au-dessus du bouton */
}


/* =======================================================
   VERSION FINALE : Correctif définitif espacement Icône/Titre
   ======================================================= */

/* 1. On utilise Flexbox pour un alignement vertical parfait */
.uagb-infobox__content-wrap {
    display: flex;
    align-items: center;
}

/* 2. On ANNULE la marge par défaut du titre H3 qui pose problème */
.uagb-infobox__content-wrap .uagb-ifb-title-wrap .uagb-ifb-title {
    margin: 0 !important;
}

/* 3. On crée notre propre espacement, propre et maîtrisé */
.uagb-infobox__content-wrap .uagb-ifb-icon-wrap {
    margin-right: 15px !important; /* Ajoute un espace de 15px seulement à droite de l'icône */
}

/* =======================================================
   Contrôle de la taille de l'image de la clé sur la page Loge
   ======================================================= */

.image-cle-loge {
    max-width: 600px !important; /* Définit la largeur MAXIMALE de l'image */
    margin-left: auto !important; /* Astuce pour centrer l'image */
    margin-right: auto !important;/* Astuce pour centrer l'image */
}

/* =======================================================
   Afficher/Cacher des éléments de menu selon l'appareil
   ======================================================= */

/* Sur les écrans d'ordinateur (plus larges que 921px, le point de bascule d'Astra) */
@media (min-width: 922px) {
    .mobile-uniquement {
        display: none !important; /* On cache l'élément de menu */
    }
}

/* =======================================================
   Effet d'ombre et de relief au survol pour les Boîtes d'Info
   ======================================================= */

/* 1. On prépare la carte à être animée en douceur */
.carte-reseau-social {
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

/* 2. Au survol, on applique l'ombre et l'effet de soulèvement */
.carte-reseau-social:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 28px rgba(0,0,0,0.1), 0 10px 10px rgba(0,0,0,0.08); /* Une ombre douce mais visible */ 
}

/* =======================================================
   Style définitif pour l'avatar sur la page "À propos"
   (Taille et arrondi sur tous les appareils)
   ======================================================= */

/* On cible la classe personnalisée que VOUS avez mise */
.avatar-hibou img {
    /* Le correctif de taille */
    max-width: 360px !important; /* L'image ne sera JAMAIS plus large que 180px */
    width: 100%; /* S'assure qu'elle rétrécit bien sur les petits écrans */

    /* Le correctif d'arrondi (même si le style est déjà appliqué, on le force) */
    border-radius: 50% !important;   /* Force l'image à être un CERCLE parfait sur TOUS les appareils */
    
    /* Bonus : on centre l'image quand la colonne passe en pleine largeur sur mobile */
    margin-left: auto;
    margin-right: auto;
}

/* =======================================================
   Style DÉFINITIF (avec INVERSION) pour le Bouton de Sondage
   ======================================================= */

/* On cible le bouton "Valider le vote" du sondage */
.forminator-poll .forminator-button-submit {
    /* --- État Normal (Plein) --- */
    background-color: #2A52BE !important; /* Notre Bleu Encre */
    color: #FFFFFF !important;             /* Texte blanc */
    border: 2px solid #2A52BE !important; /* Bordure bleue (pour une transition douce) */
    border-radius: 5px !important;         /* Vos 5px d'arrondi */
    padding: 12px 24px !important;         
    font-weight: 600 !important;           
    width: 100%;                           
    max-width: 400px;                      
    margin-top: 25px !important;           
    transition: all 0.3s ease-in-out !important; /* Animation complète */
    cursor: pointer;
}

/* --- État au Survol (Inversé / Fantôme) --- */
.forminator-poll .forminator-button-submit:hover {
    background-color: transparent !important; /* Le fond devient transparent */
    color: #2A52BE !important;             /* Le texte prend la couleur du bleu */
}

/* Effet de survol pour les cartes d'idées de projets */
.carte-idee {
	transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    padding: 20px;
    border-radius: 5px;
    height: 100%; /* Pour que les cartes de la même ligne aient la même hauteur */
}

.carte-idee:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 28px rgba(0,0,0,0.1), 0 10px 10px rgba(0,0,0,0.08); /* Une ombre douce mais visible */ 
}