/* Hover bouton header */
.ast-header-button a {
  transition: all 0.3s ease;
}

.ast-header-button a:hover {
  background-color: #1d4ed8 !important;
  transform: translateY(-1px);
}
/* Hover menu */
.main-header-menu a {
  transition: all 0.2s ease;
}

.main-header-menu a:hover {
  color: #2563eb !important;
}
.main-header-menu a {
  position: relative;
}

.main-header-menu a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 0%;
  height: 2px;
  background: #2563eb;
  transition: width 0.3s ease;
}

.main-header-menu a:hover::after {
  width: 100%;
}
.site-header {
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}
/* Sous-menus plus propres */
.main-header-menu .sub-menu {
  background: #ffffff;
  box-shadow: 0 10px 25px rgba(0,0,0,0.10);
  border-radius: 10px;
  padding: 10px 0;
}

/* Liens du sous-menu */
.main-header-menu .sub-menu a {
  color: #111111 !important;
  padding: 12px 18px !important;
  line-height: 1.4;
}

/* Hover sous-menu */
.main-header-menu .sub-menu a:hover {
  background: #eff6ff;
  color: #2563eb !important;
}
/* Sous-sous-menu mieux détaché */
.main-header-menu .sub-menu .sub-menu {
  margin-left: 8px;
  border-radius: 10px;
}
.site-header {
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}/* Fond du dropdown */
.main-header-menu .sub-menu {
  background: #ffffff !important;
  backdrop-filter: none !important;
  box-shadow: 0 12px 30px rgba(0,0,0,0.12);
  border-radius: 12px;
  padding: 10px 0;
  min-width: 260px;
}

/* Items */
.main-header-menu .sub-menu li a {
  color: #1a1a1a !important;
  padding: 14px 20px !important;
  font-size: 14px;
  font-weight: 500;
}

/* Hover clean */
.main-header-menu .sub-menu li a:hover {
  background: #f1f5ff !important;
  color: #2563eb !important;
}

/* Enlever l'effet bleu dégueu */
.main-header-menu .sub-menu {
  opacity: 1 !important;
}
.main-header-menu .sub-menu {
  margin-top: 10px;
}
.main-header-menu .sub-menu {
  transition: all 0.2s ease;
}
.site-header {
  border-bottom: 1px solid #E5E7EB;
}
.ast-site-identity {
  display: flex;
  align-items: center;
}
.main-header-menu .menu-link:hover {
  color: #2563EB;
}
.ast-button:hover {
  background-color: #1D4ED8;
  transform: translateY(-1px);
  transition: all 0.2s ease;
}
.site-header .ast-site-identity {
  padding-left: 15px;
}.main-header-menu > li > a {
  font-weight: 500;
  font-size: 15px;
}.main-header-menu > li > a:hover {
  color: #2563EB;
}.ast-button {
  border-radius: 30px;
  padding: 12px 22px;
  font-weight: 600;
  transition: all 0.3s ease;
}

.ast-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.3);
}/* Supprime les trous entre les sous-menus */
.main-header-menu .sub-menu {
  margin-top: 0 !important;
}

/* Rend le hover plus tolérant */
.main-header-menu li.menu-item-has-children:hover > .sub-menu {
  display: block;
}

/* Zone invisible pour éviter les coupures */
.main-header-menu li.menu-item-has-children {
  position: relative;
}

.main-header-menu li.menu-item-has-children::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: 20px;
}/* Alignement propre des sous-menus */
.main-header-menu .sub-menu {
  border-radius: 10px;
  padding: 10px 0;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}/* Flèches menu mobile Astra */
.ast-menu-toggle {
    color: #000 !important;
    opacity: 1 !important;
}

/* Icônes flèches sous-menu */
.ast-icon.icon-arrow svg {
    fill: #000 !important;
    color: #000 !important;
    opacity: 1 !important;
}
/* ===================================================================
   LOT 1 — Fix responsive mobile (2026-07-06) — retours equipe MEGD
   Mobile only (<=781px). Desktop inchange. Backup durable: BRAIN/MEGD.
   =================================================================== */
@media (max-width: 781px){
  .entry-content .wp-block-heading,
  .entry-content h1, .entry-content h2,
  .has-xx-large-font-size, .has-x-large-font-size, .has-large-font-size{
    font-size: clamp(22px, 6.2vw, 30px) !important;
    line-height: 1.25 !important;
    word-break: normal !important;
    overflow-wrap: break-word !important;
    hyphens: none !important;
  }
  .entry-content h3{
    font-size: clamp(19px, 5.2vw, 24px) !important;
    line-height: 1.3 !important;
    overflow-wrap: break-word !important;
  }
  .entry-content .wp-block-columns{ flex-direction: column !important; }
  .entry-content .wp-block-columns,
  .entry-content .wp-block-column,
  .entry-content .wp-block-group{ min-width: 0 !important; max-width: 100% !important; width: 100% !important; }
  .entry-content .wp-block-columns,
  .entry-content .wp-block-column{ padding-left: 0 !important; padding-right: 0 !important; }
  .entry-content > .wp-block-columns,
  .entry-content > .wp-block-cover,
  .entry-content > .wp-block-group{ padding-left: 14px !important; padding-right: 14px !important; }
  .entry-content .alignfull,
  .entry-content .alignwide{ margin-left: auto !important; margin-right: auto !important; max-width: 100% !important; }
  .jetpack-contact-form-container,
  .jetpack-contact-form-container.alignwide{ width: 100% !important; max-width: 100% !important; margin-left: auto !important; margin-right: auto !important; }
  .contact-form input, .contact-form textarea, .contact-form select{ max-width: 100% !important; box-sizing: border-box !important; }
  .entry-content img:not(.wp-block-cover__image-background),
  .entry-content iframe{ max-width: 100% !important; height: auto !important; }
  /* Fix regression : les images de fond des covers doivent remplir (pas height:auto) */
  .entry-content .wp-block-cover__image-background{ height: 100% !important; width: 100% !important; object-fit: cover !important; }
}

/* ===== Loupe recherche header — visible (bleu MEGD) + taille ===== */
/* Par defaut le SVG sort en 0x0 et blanc sur desktop -> invisible */
.ast-search-menu-icon a,
.ast-search-menu-icon .astra-search-icon{ color:#0274be !important; }
.ast-search-menu-icon svg{ width:20px !important; height:20px !important; fill:#0274be !important; }
.ast-search-menu-icon .ast-icon{ font-size:20px !important; }

/* ===================================================================
   Touches de couleur MEGD (2026-07-06) — retour equipe (cartes ternes)
   =================================================================== */
/* Icones des cartes de services en bleu MEGD (etaient gris ardoise) */
.kt-info-svg svg, .kt-info-svg svg *,
.wp-block-kadence-infobox .kb-svg-icon-wrap svg,
.wp-block-kadence-infobox .kb-svg-icon-wrap svg * { fill:#006afe !important; color:#006afe !important; }
/* Effet survol des cartes (desktop) : soulevement + ombre + bordure bleue */
@media (min-width:769px){
  .kt-blocks-info-box-link-wrap{ transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important; }
  .kt-blocks-info-box-link-wrap:hover{ transform: translateY(-6px) !important; box-shadow: 0 16px 34px -14px rgba(0,106,254,.45) !important; border-color:#006afe !important; }
}

/* ===== Formulaire Contact desktop : bouton ENVOYER sur sa propre ligne ===== */
/* Le form Jetpack est en display:flex -> le bouton se cale a droite du champ Message.
   Les champs sont deja tous pleine largeur, donc block = layout propre. */
@media (min-width:782px){
  .wp-block-jetpack-contact-form{ display:block !important; }
  .wp-block-jetpack-contact-form .wp-block-button{ text-align:center; margin-top:14px; }
}

/* Espace sous la grille de services (avant "Pourquoi choisir MEGD") */
/* #megd-services-grid espace */
#megd-services-grid{ margin-top:20px !important; margin-bottom:64px !important; }

/* Polish grille : titres reservent 2 lignes -> descriptions alignees */
/* msg-title min-height */
#megd-services-grid .msg-title{ min-height:50px; }
@media(max-width:600px){ #megd-services-grid .msg-title{ min-height:0; } }

/* Centrage page Politique de cookies (UE) - gabarit pleine largeur */
.page-id-10059 .entry-content {
    max-width: 1140px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}


/* ==================================================================
   MEGD - Lisibilite du formulaire de contact (Jetpack Forms)
   18/08/2026, JB. Demande Michael : "le formulaire n est pas tip top
   et n est pas tres lisible, surtout sur ordinateur".

   100 % cosmetique. Aucun champ, aucun label, aucun reglage Jetpack
   n est modifie : le formulaire envoie exactement comme avant.

   Ce que ca corrige, mesure en direct sur la page le 18/08 :
   - tout etait centre, labels compris -> l oeil n avait aucune ligne
     de depart. On repasse en aligne a gauche.
   - les champs faisaient 75 % (classe grunion-field-width-75) d une
     colonne deja etroite -> ils prennent toute la colonne.
   - champs sans bordure visible sur fond gris -> fond blanc, bordure
     nette, etat focus visible.
   - le Message est en rows="20" dans le bloc (pave de 570 px) -> 150 px.
   - "(obligatoire)" ecrit 5 fois en gras -> garde mais discret.

   Le double selecteur (.x.x) et les !important sont necessaires :
   teste, sans eux les regles se font battre par le theme.

   SAUVEGARDE de l etat precedent :
   ~/Documents/Agents/megd-backups/megd-customizer-css-AVANT-2026-08-18.css
   ROLLBACK : supprimer ce bloc jusqu a FIN FORMULAIRE.
   ================================================================== */
body .wp-block-jetpack-contact-form.wp-block-jetpack-contact-form{
  max-width: 100% !important;
  text-align: left !important;
  padding: 34px !important;
}
body .wp-block-jetpack-contact-form .grunion-field-wrap{
  text-align: left !important;
  margin-bottom: 18px;
  width: 100%;
}
body .wp-block-jetpack-contact-form .grunion-field,
body .wp-block-jetpack-contact-form .grunion-field-width-75,
body .wp-block-jetpack-contact-form .contact-form__select-wrapper,
body .wp-block-jetpack-contact-form .jetpack-field__input-phone-wrapper{
  width: 100% !important;
  max-width: 100% !important;
}
body .wp-block-jetpack-contact-form .grunion-field-label{
  display: block !important;
  text-align: left !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #1c2430 !important;
  line-height: 1.35 !important;
  margin: 0 0 6px !important;
}
body .wp-block-jetpack-contact-form .grunion-label-required{
  font-size: 12px !important;
  font-weight: 400 !important;
  color: #8a94a6 !important;
  margin-left: 5px;
}
body .wp-block-jetpack-contact-form input[type="text"],
body .wp-block-jetpack-contact-form input[type="email"],
body .wp-block-jetpack-contact-form input[type="tel"],
body .wp-block-jetpack-contact-form select,
body .wp-block-jetpack-contact-form textarea,
body .wp-block-jetpack-contact-form .contact-form__select-wrapper,
body .wp-block-jetpack-contact-form .jetpack-field__input-phone-wrapper{
  background: #ffffff !important;
  border: 1px solid #cfd6e0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: 16px !important;
  color: #1c2430 !important;
  padding: 12px 14px !important;
  min-height: 48px !important;
  box-sizing: border-box !important;
  text-align: left !important;
}
body .wp-block-jetpack-contact-form .contact-form__select-wrapper{
  display: flex !important;
  align-items: center !important;
}
body .wp-block-jetpack-contact-form .contact-form__select-wrapper select,
body .wp-block-jetpack-contact-form .jetpack-field__input-phone-wrapper input{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
}
body .wp-block-jetpack-contact-form input:focus,
body .wp-block-jetpack-contact-form select:focus,
body .wp-block-jetpack-contact-form textarea:focus,
body .wp-block-jetpack-contact-form .jetpack-field__input-phone-wrapper:focus-within{
  border-color: #006afe !important;
  box-shadow: 0 0 0 3px rgba(0,106,254,.15) !important;
  outline: none !important;
}
body .wp-block-jetpack-contact-form textarea{
  height: 150px !important;
  min-height: 150px !important;
  resize: vertical;
  line-height: 1.5 !important;
}
body .wp-block-jetpack-contact-form .wp-block-button{
  margin-top: 26px;
  text-align: left !important;
  width: 100%;
}
body .wp-block-jetpack-contact-form .wp-block-button__link{
  width: 100% !important;
  max-width: 340px !important;
  min-height: 54px !important;
  font-size: 16px !important;
  letter-spacing: .04em;
}
@media (max-width: 767px){
  body .wp-block-jetpack-contact-form.wp-block-jetpack-contact-form{
    padding: 20px 18px !important;
  }
  body .wp-block-jetpack-contact-form .wp-block-button__link{
    max-width: 100% !important;
  }
}
/* --- 18/08 (2e passe, demande Michael) : le formulaire prend toute la largeur ---
   Il etait enferme dans une colonne de 611 px centree dans 1168 px : d ou la
   sensation de formulaire minuscule perdu au milieu. On libere la chaine de
   colonnes qui le contient (:has), et on passe les champs courts sur 2 colonnes :
   des champs Nom ou E-mail de 1000 px de large seraient illisibles.
   Sous 783 px tout revient sur une seule colonne. */
.wp-block-columns:has(.jetpack-contact-form-container),
.wp-block-column:has(.jetpack-contact-form-container),
.wp-block-group:has(.jetpack-contact-form-container){
  max-width: none !important;
  width: 100% !important;
  flex-basis: 100% !important;
}
/* les conteneurs de champs sont a 75 % (grunion-field-width-75-wrap), pas les champs */
body .wp-block-jetpack-contact-form .grunion-field-width-75-wrap,
body .wp-block-jetpack-contact-form .grunion-field-wrap{
  width: 100% !important;
  max-width: 100% !important;
}
@media (min-width: 783px){
  body .wp-block-jetpack-contact-form.wp-block-jetpack-contact-form{
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    column-gap: 26px;
    align-items: start;
    padding: 40px 44px !important;
  }
  /* pleine largeur : le titre, l'accroche, le menu deroulant, le message, les erreurs et le bouton */
  body .wp-block-jetpack-contact-form > h2,
  body .wp-block-jetpack-contact-form > p,
  body .wp-block-jetpack-contact-form > .wp-block-heading,
  body .wp-block-jetpack-contact-form > .wp-block-paragraph,
  body .wp-block-jetpack-contact-form > .wp-block-jetpack-field-select,
  body .wp-block-jetpack-contact-form > .wp-block-jetpack-field-textarea,
  body .wp-block-jetpack-contact-form > .wp-block-button,
  body .wp-block-jetpack-contact-form > .contact-form__error{ grid-column: 1 / -1 !important; }
  body .wp-block-jetpack-contact-form > div{ min-width: 0; }
}
/* FIN FORMULAIRE */


/* ==================================================================
   MEGD - Numero de telephone dans l en-tete (ordinateur)
   18/08/2026, JB. Demande Michael : "un bouton et appelle comme sur
   telephone mais pour le format ordinateur", puis "a cote de devis
   gratuit, sur la meme ligne".

   Le numero est affiche en clair, pas cache derriere un bouton : sur
   ordinateur on ne clique pas pour appeler, on lit le numero. Le lien
   tel: reste actif pour les portables et les softphones.
   Pose via Personnaliser > En-tete > element HTML 1 (natif Astra),
   dans la zone primary_right_center, juste avant le bouton.

   POURQUOI le menu perd son entree "Contact" au-dessus de 921 px :
   a 1470 px la barre etait pleine (logo + 5 entrees + bouton + loupe).
   Le numero fait 155 px : sans liberer de place, le bouton DEVIS
   GRATUIT passait par-dessus la loupe, ou son texte se cassait sur
   4 lignes. L entree "Contact" et le bouton pointent tous les deux
   vers /contact-megd/ : c etait un doublon de 124 px, exactement ce
   qui manquait. L entree reste visible dans le menu mobile.
   La loupe n est pas touchee : c est une demande de l equipe MEGD
   (cf le commentaire du snippet de header collant).

   Reglages indispensables, tous verifies a la mesure :
   - flex-wrap:nowrap sinon le numero s empile au-dessus du bouton
   - flex-shrink:0 + white-space:nowrap sinon le bouton se comprime
     a 109 px et "DEVIS GRATUIT" passe sur 4 lignes
   - padding-right:24px sinon il ne reste que 2 px avant la loupe

   Masque sous 921 px : la barre d appel du bas prend le relais.
   ROLLBACK : Personnaliser > En-tete, retirer l element HTML 1,
   puis supprimer ce bloc.
   ================================================================== */
.megd-tel-header{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  font-weight: 700;
  font-size: 18px;
  line-height: 1;
  color: #006afe;
  text-decoration: none;
}
.megd-tel-header:hover,
.megd-tel-header:focus{ color: #1d4ed8; text-decoration: none; }
/* Astra enveloppe le HTML dans un <p> : sans ca, la marge le desaligne */
.ast-header-html p{ margin: 0; }
@media (min-width: 921px){
  .megd-tel-header{ margin-right: 18px; }
  /* entree "Contact" du menu : doublon du bouton DEVIS GRATUIT */
  .main-header-menu > li.menu-item-532{ display: none !important; }
  .site-header-primary-section-right-center{
    flex-wrap: nowrap !important;
    align-items: center !important;
    padding-right: 24px !important;
  }
  .site-header-primary-section-right-center > .ast-builder-layout-element{ flex-shrink: 0 !important; }
  .ast-custom-button-link{ white-space: nowrap !important; }
}
@media (max-width: 920px){ .megd-tel-header{ display: none; } }
/* FIN TELEPHONE ENTETE */

/* LISIBILITE ARTICLES ET PAGES (20/09/2026) : puces aerees, plus d'air avant les titres */
.single-post .entry-content ul:not(.ez-toc-list), .page .entry-content ul:not(.ez-toc-list),
.single-post .entry-content ol:not(.ez-toc-list), .page .entry-content ol:not(.ez-toc-list){ margin: .6em 0 2em; padding-left: 1.4em; }
.single-post .entry-content ul:not(.ez-toc-list) li, .page .entry-content ul:not(.ez-toc-list) li,
.single-post .entry-content ol:not(.ez-toc-list) li, .page .entry-content ol:not(.ez-toc-list) li{ margin-bottom: .65em; line-height: 1.65; }
.single-post .entry-content ul:not(.ez-toc-list) li:last-child, .page .entry-content ul:not(.ez-toc-list) li:last-child,
.single-post .entry-content ol:not(.ez-toc-list) li:last-child, .page .entry-content ol:not(.ez-toc-list) li:last-child{ margin-bottom: 0; }
.single-post .entry-content h2{ margin-top: 1.6em; }
.single-post .entry-content h3{ margin-top: 1.2em; }
/* FIN LISIBILITE ARTICLES */