/*
Theme Name: LIZIWEB - Theme enfant Divi
Description: Theme enfant du theme Divi. Vous pouvez desormais le personnaliser sans risquer de perdre vos modifications
Author: LIZIWEB
Author URI: https://liziweb.com
Template: Divi
Version: 1.0
*/


/* ------- HEADER -----*/

.et_header_style_left #et-top-navigation nav>ul>li>a {
    padding-bottom: 33px;
    text-transform: uppercase;
	font-size:17px;
}

/* ------ styles textes et boutons ---------*/

h1 {
	font-size:35px;
	font-weight: bolder;
	color:white;
	line-height: 1.4em;
}

h2.fond-couleur, h2.fond-couleur-blanc {
    position: relative;
	color:#007D4F;
	line-height:1.3em;
	font-weight:bold;
}

h2.fond-couleur span {
    display: inline;
    background: linear-gradient(
        transparent 60%,
        #D7EFFA 40%);
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    padding: 0.1em 20px; /* 20px avant / après */
}
h2.fond-couleur-blanc span {
    display: inline;
    background: linear-gradient(
        transparent 60%,
        #ffffff 40%);
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
    padding: 0.1em 20px; /* 20px avant / après */
}
h3 {
	font-size:28px!important;
	font-weight: bold;
}

/* ----- boutons -------*/

/* Bouton dégradé Divi */
.bouton-degrade.et_pb_button{
  background: linear-gradient(60deg, #00C2FF, #0077FF);
  border-radius: 0;

  border: 2px solid transparent !important; /* empêche le saut */
  box-sizing: border-box !important;

  transition: background 0.25s ease;
}

/* Texte toujours blanc */
.bouton-degrade.et_pb_button,
.bouton-degrade.et_pb_button span{
  color: #ffffff !important;
}

/* Réserver la place de la flèche */
.bouton-degrade.et_pb_button span{
  display: inline-block;
  padding-right: 26px;
}

/* Icône (flèche) invisible par défaut */
.bouton-degrade.et_pb_button::after{
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity 0.25s ease, transform 0.25s ease;
  margin-left: 0;
}

/* Hover : flèche visible */
.bouton-degrade.et_pb_button:hover::after{
  opacity: 1;
  transform: translateX(0);
}
/* Supprimer les traits parasites sur les côtés du bouton Divi */
.bouton-degrade.et_pb_button{
  box-shadow: none !important;       /* enlève ombres internes Divi */
  outline: none !important;          /* enlève outline focus/hover */
  background-clip: padding-box !important; /* empêche le bleed du gradient */
}

/* Sécurité supplémentaire sur hover/focus */
.bouton-degrade.et_pb_button:hover,
.bouton-degrade.et_pb_button:focus,
.bouton-degrade.et_pb_button:active{
  box-shadow: none !important;
  outline: none !important;
}

/* ------ Home page -------*/
@media (min-width: 980px) {

  /* Autoriser le dépassement */
  .section-remonte,
  .section-remonte .ligne-remonte,
  .section-remonte .et_pb_column {
    overflow: visible !important;
  }

  /* Faire remonter l’image sans créer d’espace */
  .section-remonte .ligne-remonte .image-remonte {
    margin-top: -150px;
    position: relative;
    z-index: 10;
  }

}


/* ------ PUCES --------*/
/* =========================================================
   LISTES CHECK – Light / Dark + variantes "droite"
   ========================================================= */

/* ---------- Base commune (toutes les listes) ---------- */
ul.check-light,
ul.check-dark,
ul.check-light-droite,
ul.check-dark-droite{
  list-style: none;
  padding: 0;
  margin: 0;
}

ul.check-light li,
ul.check-dark li,
ul.check-light-droite li,
ul.check-dark-droite li{
  position: relative;
  margin-bottom: 18px;
}

/* ---------- Variante "gauche" (classique) ---------- */
ul.check-light li,
ul.check-dark li{
  padding-left: 36px; /* espace pour l’icône à gauche */
}

/* Puce gauche - LIGHT */
ul.check-light li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0.25em;
  width: 25px;
  height: 25px;
  background: url("https://liziweb-dev.fr/l1-earth/wp-content/uploads/2026/01/check.svg") no-repeat center;
  background-size: contain;
}

/* Puce gauche - DARK */
ul.check-dark li::before{
  content: "";
  position: absolute;
  left: 0;
  top: 0.25em;
  width: 25px;
  height: 25px;
  background: url("https://liziweb-dev.fr/l1-earth/wp-content/uploads/2026/01/check-dark.svg") no-repeat center;
  background-size: contain;
}

/* ---------- Variante "droite" (texte à droite + puce à droite) ---------- */
ul.check-light-droite li,
ul.check-dark-droite li{
  padding-right: 36px; /* espace pour l’icône à droite */
  text-align: right;   /* texte en butée droite */
}

/* On neutralise toute puce à gauche pour les variantes droite */
ul.check-light-droite li::before,
ul.check-dark-droite li::before{
  content: none;
}

/* Puce droite - LIGHT */
ul.check-light-droite li::after{
  content: "";
  position: absolute;
  right: 0;
  top: 0.25em;
  width: 25px;
  height: 25px;
  background: url("https://liziweb-dev.fr/l1-earth/wp-content/uploads/2026/01/check.svg") no-repeat center;
  background-size: contain;
}

/* Puce droite - DARK */
ul.check-dark-droite li::after{
  content: "";
  position: absolute;
  right: 0;
  top: 0.25em;
  width: 25px;
  height: 25px;
  background: url("https://liziweb-dev.fr/l1-earth/wp-content/uploads/2026/01/check-dark.svg") no-repeat center;
  background-size: contain;
}

/* =========================================================
   MOBILE : Les variantes "droite" repassent à gauche (classique)
   ========================================================= */
@media (max-width: 767px){

  /* Texte à gauche + espace icône à gauche */
  ul.check-light-droite li,
  ul.check-dark-droite li{
    text-align: left;
    padding-right: 0;
    padding-left: 36px;
  }

  /* On supprime la puce à droite */
  ul.check-light-droite li::after,
  ul.check-dark-droite li::after{
    content: none;
  }

  /* Et on remet la puce à gauche (light/dark) */
  ul.check-light-droite li::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0.25em;
    width: 25px;
    height: 25px;
    background: url("https://liziweb-dev.fr/l1-earth/wp-content/uploads/2026/01/check.svg") no-repeat center;
    background-size: contain;
  }

  ul.check-dark-droite li::before{
    content: "";
    position: absolute;
    left: 0;
    top: 0.25em;
    width: 25px;
    height: 25px;
    background: url("https://liziweb-dev.fr/l1-earth/wp-content/uploads/2026/01/check-dark.svg") no-repeat center;
    background-size: contain;
  }
}


/* ------ Page Cas Clients --------*/

.bloc-cas-client {
	padding-bottom:0px!important;
}

/* ===== Desktop / général ===== */
/* Bordure sur tous les blocs */
.item-bloc .bloc-3elements{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 0 20px;
}

/* Séparateur : uniquement à partir du 2ème bloc (donc pas sur le 1er, et pas besoin de gérer le dernier) */
.item-bloc + .item-bloc .bloc-3elements{
  border-top: 1px solid #E8E8D8;
}

/* 15% – texte gauche */
.bloc-3elements__left{
  flex: 0 0 15%;
  font-size: 20px;           /* ⬅️ taille demandée */
  line-height: 1.2;
}

/* 8% – icône */
.bloc-3elements__icon{
  flex: 0 0 8%;
  display: flex;
  justify-content: center;
  align-items: center;
}

/* image svg */
.bloc-3elements__svg{
  width: 42px;               /* ⬅️ taille demandée */
  height: 42px;
  object-fit: contain;       /* sécurité si SVG/PNG */
  display: block;
}

/* 77% – paragraphe */
.bloc-3elements__text{
  flex: 0 0 77%;
}

.bloc-3elements__text p{
  margin: 0;
}

/* ===== Mobile ===== */
@media (max-width: 767px){
  .bloc-3elements{
    flex-wrap: wrap;
    gap: 10px;
  }

  /* texte + icône sur la même ligne */
  .bloc-3elements__left{
    flex: 0 0 auto;
  }

  .bloc-3elements__icon{
    flex: 0 0 auto;
    justify-content: flex-start;
  }

  /* paragraphe en dessous, pleine largeur */
  .bloc-3elements__text{
    flex: 0 0 100%;
  }
}

/* ===== Desktop / général / Bloc témoignages  ===== */
/* Conteneur */
.bloc-temoignage{
  display: flex;
  align-items: center;    /* centrage vertical */
  gap: 12px;
  width: 100%;
  padding: 15px 0 20px;
}

/* 20% – logo (bloc 1) */
.bloc-temoignage__left{
  flex: 0 0 20%;
}

/* (optionnel) logo responsive */
.bloc-temoignage__logo{
  max-width: 100%;
  height: auto;
  display: block;
}

/* 5% – icône (bloc 2) */
.bloc-temoignage__icon{
  flex: 0 0 5%;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

/* icône quote */
.bloc-temoignage__svg{
  width: 35px;
  height: 35px;
  object-fit: contain;
  display: block;
}

/* 75% – texte (bloc 3) */
.bloc-temoignage__text{
  flex: 0 0 75%;
}

.bloc-temoignage__text p{
  margin: 0;
}

p.nom-temoignage{
  font-weight: bold;
  color: #007D4F;
  margin-top: 10px; /* pour séparer du texte */
}

/* ===== Mobile ===== */
@media (max-width: 767px){
  .bloc-temoignage{
    flex-wrap: wrap;      /* autorise retour à la ligne */
    align-items: flex-start;
  }

  /* Bloc 1 en pleine largeur au-dessus */
  .bloc-temoignage__left{
    flex: 0 0 100%;
  }

  /* Bloc 2 + 3 en ligne en dessous */
  .bloc-temoignage__icon{
    flex: 0 0 auto;       /* taille selon contenu */
    justify-content: flex-start;
  }

  .bloc-temoignage__text{
    flex: 1 1 0;          /* prend tout le reste de la ligne */
    min-width: 0;
  }
}

/* adaptation section bas de page avec photo consultant en cover à gauche */

/* ================================
   SECTION "choix-clients" (Divi)
   - Desktop : 50% image full-bleed à gauche / 50% contenu à droite (contenu limité à 700px)
   - Mobile : image puis texte
   ================================ */

/* Row en "full-bleed" uniquement dans cette section (même si la section est normale) */
.choix-clients .et_pb_row{
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  padding: 0 !important;

  display: flex;
  align-items: stretch;  /* colonnes même hauteur */
}

/* Nettoyage des marges de colonnes Divi */
.choix-clients .et_pb_row > .et_pb_column{
  margin: 0 !important;
}

/* ---------- DESKTOP / TABLETTE LARGE ---------- */
@media (min-width: 981px){

  /* 2 colonnes = 50 / 50 */
  .choix-clients .et_pb_row > .et_pb_column{
    width: 50% !important;
  }

  /* Colonne gauche : image de fond qui couvre toute la zone */
  .choix-clients .et_pb_row > .et_pb_column:first-child{
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    /*min-height: 520px; /* sécurité si peu de contenu à droite */
  }

  /* Colonne droite : empile les modules (2 textes + bouton) */
  .choix-clients .et_pb_row > .et_pb_column:last-child{
    display: flex;
    flex-direction: column;   /* IMPORTANT : évite modules côte à côte */
    justify-content: center;  /* optionnel : centre verticalement l'ensemble */
    align-items: flex-start;

    padding-top: 70px;
    padding-bottom: 70px;
    padding-left: 60px;       /* espace entre image et contenu */
    /* garde une marge "contenu site" à droite */
    padding-right: max(20px, calc((100vw - 1400px) / 2));
  }

  /* Contenu de la colonne droite limité à 700px */
  .choix-clients .et_pb_row > .et_pb_column:last-child .et_pb_module{
    max-width: 700px;
    width: 100%;
  }
}

/* ---------- MOBILE / TABLETTE ---------- */
@media (max-width: 980px){

  /* Divi empile naturellement, on garde l'ordre : image puis texte */
  .choix-clients .et_pb_row{
    display: block;
  }

  /* IMPORTANT : si la colonne gauche est "vide", on lui donne une hauteur
     pour que le background apparaisse */
  .choix-clients .et_pb_row > .et_pb_column:first-child{
    min-height: 280px;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
  }

  /* Colonne droite : modules empilés, padding confort */
  .choix-clients .et_pb_row > .et_pb_column:last-child{
    display: flex;
    flex-direction: column;
    padding: 30px 20px !important;
  }

  /* En mobile on laisse le contenu prendre toute la largeur */
  .choix-clients .et_pb_row > .et_pb_column:last-child .et_pb_module{
    max-width: 100%;
    width: 100%;
  }
}


/* ------ Qui sommes nous ---- */

.sebastien-gabriel{
  margin-top: -180px;
}


.et_pb_module.et_pb_toggle.et_pb_toggle.bascule-qui-sommes-nous.et_pb_toggle_item.et_pb_toggle_close, .et_pb_module.et_pb_toggle.et_pb_toggle.bascule-qui-sommes-nous.et_pb_toggle_item.et_pb_toggle_open {
    border: none;
	background-color: #F7F7F0;
}
h5.et_pb_toggle_title {
    padding: 0 0 0 20px !important;
}
/* NE cacher l'icône QUE sur ce bloc précis (si tu en as besoin) */
.et_pb_toggle.bascule-qui-sommes-nous .et_pb_toggle_title:before{
  display: none !important;
}
.et_pb_toggle_close .et_pb_toggle_title, .et_pb_toggle_close h5.et_pb_toggle_title {
    text-decoration: underline;
}
.et_pb_toggle_content {
    padding: 20px;
}


/* ------ PAGE CONTACT ------ */

/* gravity form*/
/* Champs texte, email, tel, textarea */
.formulaire-contact .gform_wrapper input[type="text"],
.formulaire-contact .gform_wrapper input[type="email"],
.formulaire-contact .gform_wrapper input[type="tel"],
.formulaire-contact .gform_wrapper textarea{
  background-color: #F7F7F0;
  border: none;                 /* ⬅️ suppression bordure */
  border-radius: 5px;
  padding: 12px 14px;
  box-sizing: border-box;
  text-align: right;
}

/* Placeholder aligné à droite et noir */
.formulaire-contact .gform_wrapper input::placeholder,
.formulaire-contact .gform_wrapper textarea::placeholder{
  text-align: right;
  color: #000;                  /* ⬅️ placeholder noir */
  opacity: 1;
}

/* Focus propre sans bordure */
.formulaire-contact .gform_wrapper input:focus,
.formulaire-contact .gform_wrapper textarea:focus{
  outline: none;
  background-color: #F7F7F0;
}

/* Supprime les espacements Gravity Forms supplémentaires */
.formulaire-contact .gform_wrapper .gfield + .gfield{
  margin-top: 0 !important;
}

/* Supprime ombres éventuelles */
.formulaire-contact .gform_wrapper input,
.formulaire-contact .gform_wrapper textarea{
  box-shadow: none;
}
/* Réduction du gap vertical de la grille */
.formulaire-contact .gform_wrapper .gform_fields{
  row-gap: 15px !important;
  gap: 15px !important; /* sécurité selon version */
}

/* Sécurité : enlève marges résiduelles des champs */
.formulaire-contact .gform_wrapper .gfield{
  margin-bottom: 0 !important;
}



/* bouton gravity form*/
/* =========================================================
   Gravity Forms dans module Divi .formulaire-contact
   - Bouton à droite desktop / centré mobile
   - Dégradé + ombre 5px bas-droite
   - Sans border-radius
   ========================================================= */

/* Alignement du footer du formulaire (le conteneur du bouton) */
.et_pb_text.formulaire-contact .gform_wrapper .gform_footer{
  display: flex !important;
  justify-content: flex-end !important; /* droite desktop */
  align-items: center !important;
  padding-top: 10px !important;
}

/* Style du bouton submit Gravity Forms (input ou button) */
.et_pb_text.formulaire-contact .gform_wrapper .gform_footer input[type="submit"],
.et_pb_text.formulaire-contact .gform_wrapper .gform_footer button,
.et_pb_text.formulaire-contact .gform_wrapper .gform_footer input.gform_button{
  background: linear-gradient(60deg, #00C2FF, #0077FF) !important;
  border: none !important;
  border-radius: 0 !important; /* aucun arrondi */
  color: #fff !important;
  font-size: 18px !important;
  line-height: 1 !important;
  padding: 14px 34px !important;
  cursor: pointer;
  box-shadow: 5px 5px 0 rgba(0,0,0,0.25) !important; /* ombre 5px bas-droite */
  transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
  -webkit-appearance: none;
  appearance: none;
}

/* Hover */
.et_pb_text.formulaire-contact .gform_wrapper .gform_footer input[type="submit"]:hover,
.et_pb_text.formulaire-contact .gform_wrapper .gform_footer button:hover,
.et_pb_text.formulaire-contact .gform_wrapper .gform_footer input.gform_button:hover{
  transform: translate(1px, 1px);
  box-shadow: 3px 3px 0 rgba(0,0,0,0.25) !important;
  opacity: 0.95;
}

/* Mobile : bouton centré */
@media (max-width: 767px){
  .et_pb_text.formulaire-contact .gform_wrapper .gform_footer{
    justify-content: center !important;
  }
}
/* MOBILE : placeholders + texte alignés à gauche  */
@media (max-width: 767px){

  .et_pb_text.formulaire-contact .gform_wrapper input,
  .et_pb_text.formulaire-contact .gform_wrapper textarea{
    text-align: left !important;
  }

  .et_pb_text.formulaire-contact .gform_wrapper input::placeholder,
  .et_pb_text.formulaire-contact .gform_wrapper textarea::placeholder{
    text-align: left !important;
  }
}

/* mise ne forme adresses*/

.adresse-bloc{
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

/* ⬅️ SLOT ICÔNE FIXE */
.adresse-bloc__icon-wrap{
  min-width: 24px;      /* largeur identique pour tous */
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

/* Icône libre, non déformée */
.adresse-bloc__icon{
  height: 20px;
  width: auto;
  display: block;
}

/* Texte empilé */
.adresse-bloc__text{
  display: flex;
  flex-direction: column;
}

.adresse-bloc__text div{
  line-height: 1.3;
}

@media (max-width: 767px){

  .adresse-bloc{
    justify-content: center;     /* centre le bloc */
    align-items: center;         /* centre verticalement icône + texte */
    text-align: center;          /* centre le texte */
  }

  /* Le slot icône reste fixe mais centré */
  .adresse-bloc__icon-wrap{
    min-width: 24px;
    justify-content: center;
  }

  /* Texte centré */
  .adresse-bloc__text{
    align-items: center;
  }
}




/* ----- PAGE BESOINS --------*/

@media(min-width:980px){
/* Remonter la section des onglets de 150px */
.section-tabs-overlap{
  position: relative;
  margin-top: -160px;
  z-index: 10; /* passe au-dessus de la section précédente */
}

.tab-content-text h4 {
    font-size: 20px;
    color: #007D4F;
	font-weight:bold;
	padding-bottom: 20px;
}
}


/* =========================================================
   TABS TABLEAU – Divi Tabs (module class: tabs-tableau)
   ========================================================= */

/* --- Prévoir la hauteur max du titre --- */
.tabs-tableau .tab-title{
  font-size: 28px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;

  min-height: calc(4 * 1.15em); /* ajuste selon ton titre le plus long */
}

/* Inactif : taille visuelle normale */
.tabs-tableau .et_pb_tabs_controls li:not(.et_pb_tab_active) .tab-title{
  font-size: 24px !important;
  font-weight: 400 !important;
}



/* ---- Barre des onglets ---- */
.tabs-tableau .et_pb_tabs_controls{
  display: flex !important;
  gap: 0 !important;                 /* collés */
  border-bottom: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  width: 100% !important;

  align-items: stretch !important;   /* ✅ mêmes hauteurs */
  overflow: visible !important;      /* ✅ triangle visible */
}

/* 4 onglets = 25% chacun sur desktop */
@media (min-width: 768px){
  .tabs-tableau .et_pb_tabs_controls li{
    flex: 0 0 25% !important;
    max-width: 25% !important;
  }
}

/* LI: flex pour étirer le lien à 100% hauteur */
.tabs-tableau .et_pb_tabs_controls li{
  position: relative !important;     /* pour le triangle */
  display: flex !important;          /* ✅ hauteur uniforme */
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  overflow: visible !important;
}

/* Lien = “vrai” bouton, étiré en hauteur */
.tabs-tableau .et_pb_tabs_controls li a{
  display: flex !important;          /* ✅ background jusqu’en bas */
  width: 100% !important;
  height: 100% !important;           /* ✅ même hauteur */
  box-sizing: border-box !important;

  padding: 18px 18px !important;
  margin: 0 !important;
  text-decoration: none !important;

  border: 0 !important;
  outline: 0 !important;
  border-radius: 0 !important;

  background: #F7F7F0 !important;    /* INACTIVE */
  transition: background 0.25s ease, transform 0.2s ease;
}

/* HOVER = #007D4F */
.tabs-tableau .et_pb_tabs_controls li:hover > a{
  background: #007D4F !important;
}

/* ACTIVE = dégradé */
.tabs-tableau .et_pb_tabs_controls li.et_pb_tab_active > a{
  background: linear-gradient(60deg, #00C2FF, #0077FF) !important;
}

/* ---- Triangle sous l’onglet actif ---- */
.tabs-tableau .et_pb_tabs_controls li.et_pb_tab_active > a{
  position: relative !important;
  overflow: visible !important;
}

.tabs-tableau .et_pb_tabs_controls li.et_pb_tab_active > a::after{
  content: "" !important;
  position: absolute !important;
  left: 50% !important;
  transform: translateX(-50%) !important;

  /* triangle qui déborde en dessous */
  bottom: -14px !important;
  width: 28px !important;
  height: 16px !important;
  background-color:#00A6FF;
  clip-path: polygon(50% 100%, 0 0, 100% 0) !important;
}

/* ---- Contenu interne du titre d’onglet ---- */
.tabs-tableau .tab-head{
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 10px !important;

  flex: 1 1 auto !important;         /* ✅ remplit la hauteur disponible */
}

/* IMPORTANT : empêche le stretch (sinon tab-sub prend toute la largeur) */
.tabs-tableau .tab-txt{
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  align-items: flex-start !important; /* ✅ surlignage derrière le texte seulement */
}

/* Icônes 70x70 (2 images : off/on) */
.tabs-tableau .tab-ico{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
}
.tabs-tableau .tab-ico .ico{
  width: 70px !important;
  height: 70px !important;
  display: block !important;
}

/* Inactive : OFF visible, ON cachée */
.tabs-tableau .tab-ico .ico--on{ display: none !important; }
.tabs-tableau .tab-ico .ico--off{ display: block !important; }

/* Hover + Active : ON visible, OFF cachée */
.tabs-tableau .et_pb_tabs_controls li:hover .tab-ico .ico--on,
.tabs-tableau .et_pb_tabs_controls li.et_pb_tab_active .tab-ico .ico--on{ display: block !important; }

.tabs-tableau .et_pb_tabs_controls li:hover .tab-ico .ico--off,
.tabs-tableau .et_pb_tabs_controls li.et_pb_tab_active .tab-ico .ico--off{ display: none !important; }

/* ---- Sous-titre ---- */
.tabs-tableau .tab-sub{
  position: relative !important;
  display: inline-block !important;
  width: auto !important;
  flex: 0 0 auto !important;
  z-index: 1 !important;

  color: #007D4F !important;          /* INACTIVE: vert */
  font-size: 16px !important;
  font-weight: 600 !important;
}

/* Surlignage “à cheval” :
   - commence à 60% de la hauteur du texte
   - finit à 40% sous le texte
   => top: 60% ; height: 80% (60% -> 140%) */
.tabs-tableau .tab-sub::after{
  content: "" !important;
  position: absolute !important;
  left: -5px !important;              /* ✅ déborde 5px */
  right: -5px !important;

  top: 60% !important;                /* ✅ démarre à 60% */
  height: 35% !important;             /* ✅ va 35% sous le bas */

  background: #ffffff !important;     /* INACTIVE: blanc */
  z-index: -1 !important;
}

/* HOVER : texte blanc + surlignage #2C4A3F */
.tabs-tableau .et_pb_tabs_controls li:hover .tab-sub{
  color: #ffffff !important;
}
.tabs-tableau .et_pb_tabs_controls li:hover .tab-sub::after{
  background: #2C4A3F !important;
}

/* ACTIVE : texte blanc + surlignage #007D4F */
.tabs-tableau .et_pb_tabs_controls li.et_pb_tab_active .tab-sub{
  color: #ffffff !important;
}
.tabs-tableau .et_pb_tabs_controls li.et_pb_tab_active .tab-sub::after{
  background: #007D4F !important;
}

/* ---- Titre ---- */
/* INACTIVE : noir, regular 24px */
.tabs-tableau .tab-title{
  color: #000000 !important;
  font-size: 24px !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
}

/* HOVER : blanc, regular 24px */
.tabs-tableau .et_pb_tabs_controls li:hover .tab-title{
  color: #ffffff !important;
  font-size: 24px !important;
  font-weight: 400 !important;
}

/* ACTIVE : blanc, bold 28px */
.tabs-tableau .et_pb_tabs_controls li.et_pb_tab_active .tab-title{
  color: #ffffff !important;
  font-size: 28px !important;
  font-weight: 700 !important;
}

@media (max-width:980px){
/* INACTIVE : noir, regular 20px */
.tabs-tableau .tab-title{
  color: #000000 !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
}

/* HOVER : blanc, regular 20px */
.tabs-tableau .et_pb_tabs_controls li:hover .tab-title{
  color: #ffffff !important;
  font-size: 18px !important;
  font-weight: 400 !important;
}

/* ACTIVE : blanc, bold 24px */
.tabs-tableau .et_pb_tabs_controls li.et_pb_tab_active .tab-title{
  color: #ffffff !important;
  font-size: 22px !important;
  font-weight: 700 !important;
}
}

/* ---- Contenu des onglets ---- */
.tabs-tableau .et_pb_all_tabs{
  border: 0 !important;
  padding-top: 25px !important;
}

/* Layout contenu 2/3 - 1/3 */
.tabs-tableau .et_pb_all_tabs .tab-content-2col{
  display: flex !important;
  align-items: flex-start !important;
  gap: 30px !important;
  flex-wrap: nowrap !important;
}

.tabs-tableau .et_pb_all_tabs .tab-content-text{
  width: 66.666% !important;
  flex: 0 0 66.666% !important;
  min-width: 0 !important;
}

.tabs-tableau .et_pb_all_tabs .tab-content-img{
  width: 33.333% !important;
  flex: 0 0 33.333% !important;
  min-width: 0 !important;
}

.tabs-tableau .et_pb_all_tabs .tab-content-img img{
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

.tab-content-text p, .tab-content-text ul {
    margin-left: 20px;
}

/* Mobile */
@media (max-width: 767px){
  .tabs-tableau .et_pb_tabs_controls{
    flex-direction: column !important;
  }

  .tabs-tableau .et_pb_tabs_controls li{
    flex: 0 0 auto !important;
    max-width: none !important;
  }

  /* triangle : optionnel sur mobile (si tu veux le garder, supprime ce bloc) */
  .tabs-tableau .et_pb_tabs_controls li.et_pb_tab_active > a::after{
    display: none !important;
  }

  .tabs-tableau .et_pb_all_tabs .tab-content-2col{
    flex-direction: column !important;
  }

  .tabs-tableau .et_pb_all_tabs .tab-content-text,
  .tabs-tableau .et_pb_all_tabs .tab-content-img{
    width: 100% !important;
    flex: 0 0 100% !important;
  }
}

.et_pb_module.et_pb_tabs.et_pb_tabs_0.tabs-tableau {
    border: none;
}

/* bascule page VOS BESOINS sur mobile */
/* ===============================
   BASCULE - besoins
   =============================== */

/* Masquer l'icône native Divi (optionnel mais souvent utile) */
/*.bascule-besoins .et_pb_toggle_title .et_pb_toggle_icon{
  display:none !important;
}*/

/* TITRE (fermé) */
.bascule-besoins .et_pb_toggle_title{
  position: relative;
  padding-left: 64px !important; /* place icône */
  background: #F7F7F0;
  color: #000;
}
.bascule-besoins .et_pb_toggle_close .et_pb_toggle_title, .bascule-besoins .et_pb_toggle_close h5.et_pb_toggle_title {
    text-decoration: none;
    color: #000;
    font-weight: 400;
}
.bascule-besoins .et_pb_toggle_close {
    background-color: #f4f4f4;
    padding: 0px!important;
}
.bascule-besoins .et_pb_toggle {
    border: none;
}
.bascule-besoins.et_pb_toggle_close {
    background-color: #f4f4f4;
    padding: 0px!important;
}

/* apparence titre*/
.bascule-besoins h5.et_pb_toggle_title {
    padding: 20px 50px 20px 20px !important;
    font-size: 24px;
    font-weight: bold;
	text-decoration:none;
	color: #000;
}

/* CONTENU */
.bascule-besoins .et_pb_toggle_content{
  background: #fff;
}
.et_pb_toggle_open {
    padding: 0px;
    background-color: #fff;
    z-index: 1;
}
.bascule-besoins .tab-content-img img {
  max-width:250px;
  display:block;
  margin :20px auto;
}
.bascule-besoins h4 {
    font-size: 18px;
    color: #007D4F;
}


/* OUVERT : gradient uniquement sur le titre */
.bascule-besoins.et_pb_toggle_open .et_pb_toggle_title{
  background: linear-gradient(60deg, #00C2FF, #0077FF);
  color: #fff;
}
/*.bascule-besoins.et_pb_toggle_open .et_pb_toggle_title:before {
    font-size: 30px!important;
    right: 20px!important;
}*/
.bascule-besoins .et_pb_toggle_title:before {
    font-size: 30px!important;
	right: 20px!important;
}



/* ------ FOOTER ------ */

.footer-menu-light a{
	color:white;
}
.et_pb_menu--without-logo .et_pb_menu__menu>nav>ul>li {
    margin-top: 28px;
}

.contact-inline {
    display: inline-block;
    border-top: 1px solid #007D4F;
    border-bottom: 1px solid #007D4F;
    padding: 8px 0;
}

.icon-svg {
    height: 20px;
    width: auto;
    vertical-align: middle;
	padding: 0 10px;
}