.elementor-kit-12{--e-global-color-primary:#320B7C;--e-global-color-secondary:#8042F6;--e-global-color-text:#000000BF;--e-global-color-accent:#36CDDE;--e-global-color-18e0a67:#FFFFFF;--e-global-color-279fbee:#000000;--e-global-color-aef6ed9:#FAB900;--e-global-color-2904fc3:#77D839;--e-global-typography-primary-font-family:"Lato";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Lato";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Lato";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Lato";--e-global-typography-accent-font-weight:500;font-family:"Lato", Sans-serif;}.elementor-kit-12 e-page-transition{background-color:#FFBC7D;}.elementor-kit-12 a{font-family:"Lato", Sans-serif;}.elementor-kit-12 h1{font-family:"Lato", Sans-serif;}.elementor-kit-12 h2{color:var( --e-global-color-primary );font-family:"Lato", Sans-serif;font-size:24px;font-weight:bold;}.elementor-kit-12 h3{color:var( --e-global-color-primary );font-family:"Lato", Sans-serif;font-size:20px;}.elementor-kit-12 h4{font-family:"Lato", Sans-serif;font-size:18px;}.elementor-kit-12 h5{font-family:"Lato", Sans-serif;font-size:18px;}.elementor-kit-12 h6{font-family:"Lato", Sans-serif;font-size:16px;}.elementor-kit-12 button,.elementor-kit-12 input[type="button"],.elementor-kit-12 input[type="submit"],.elementor-kit-12 .elementor-button{font-family:"Lato", Sans-serif;}.elementor-kit-12 label{font-family:"Lato", Sans-serif;}.elementor-kit-12 input:not([type="button"]):not([type="submit"]),.elementor-kit-12 textarea,.elementor-kit-12 .elementor-field-textual{font-family:"Lato", Sans-serif;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header{padding-inline-end:0px;padding-inline-start:0px;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Lato Regular (Normal) */
@font-face {
    font-family: 'Lato';
    src: url('/wp-content/uploads/fonts/Lato-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}

/* Lato Italic */
@font-face {
    font-family: 'Lato';
    src: url('/wp-content/uploads/fonts/Lato-Italic.woff2') format('woff2');
    font-weight: 400;
    font-style: italic;
}

/* Lato Light */
@font-face {
    font-family: 'Lato';
    src: url('/wp-content/uploads/fonts/Lato-Light.woff2') format('woff2');
    font-weight: 300;
    font-style: normal;
}

/* Lato Bold */
@font-face {
    font-family: 'Lato';
    src: url('/wp-content/uploads/fonts/Lato-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

/* Lato Black */
@font-face {
    font-family: 'Lato';
    src: url('/wp-content/uploads/fonts/Lato-Black.woff2') format('woff2');
    font-weight: 900;
    font-style: normal;
}


body, h1, h2, h3, h4, h5, h6, p, a, span, div {
    font-family: 'Lato', sans-serif !important;
}


/*animation vertical 1*/

/* Carte 1 */
.effet_carte {
  animation: animMonteDescend 2s ease-in-out infinite;
  transform-origin: center;
  display: inline-block;
}

/* Carte 2 */
.effet_carte_2 {
  animation: animDescendMonte 2s ease-in-out infinite;
  transform-origin: center;
  display: inline-block;
}

/* Animation qui monte puis descend */
@keyframes animMonteDescend {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
  100% {
    transform: translateY(0);
  }
}

/* Animation inverse : descend puis monte */
@keyframes animDescendMonte {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(15px);
  }
  100% {
    transform: translateY(0);
  }
}


/* Rotation normale (horaire) */
.cercle_animation {
  animation: tourneEnRond 8s linear infinite;
  transform-origin: center;
  display: inline-block;
}

/* Rotation inverse (antihoraire) */
.cercle_animation2 {
  animation: tourneEnRondInverse 8s linear infinite;
  transform-origin: center;
  display: inline-block;
}

/* Animation horaire */
@keyframes tourneEnRond {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* Animation antihoraire */
@keyframes tourneEnRondInverse {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}


/* -----------------------------------------------------------------
  Page offres
   -----------------------------------------------------------------*/


/* -----------------------------------------------------------------
   1. Couleur propre à chaque onglet (normal + actif)
   -----------------------------------------------------------------*/
#wb,
#wb.elementor-active      { background:#36CDDE; }

#ps,
#ps.elementor-active      { background:#FAB900; }

#ft,
#ft.elementor-active      { background:#77D839; }

#fp,
#fp.elementor-active      { background:#8042F6; }

/* -----------------------------------------------------------------
   2. Icônes masquées par défaut
   -----------------------------------------------------------------*/
.elementor-tabs .elementor-tab-title .elementor-icon {
  display:none;            /* icône cachée */
}

/* -----------------------------------------------------------------
   3. Icône visible uniquement sur l’onglet actif
   -----------------------------------------------------------------*/
.elementor-tabs .elementor-tab-title.elementor-active .elementor-icon {
  display:inline-flex;     /* ou block selon ton besoin */
  margin-left:0.35em;      /* petit écart avec le texte (facultatif) */
}

/* ---------------------------------------------------------------
   Couleur du texte pour le seul onglet #wb (normal + actif)
   ---------------------------------------------------------------*/
#wb,
#wb.elementor-active {           /* même règle, qu’il soit sélectionné ou non */
  color: #fff;                /* texte du titre en jaune pâle */
}







/* ===================================================================
   0. CACHE l’icône par défaut  + transition douce
   ===================================================================*/
.elementor-widget-n-tabs .e-n-tab-title .e-n-tab-icon svg{
  opacity:0;                         /* invisible tant que le tab n’est pas actif */
  transition:opacity .25s ease,fill .25s ease;
}

/* ===================================================================
   1. COULEUR de l’icône = même couleur que le fond (donc vraiment
      « invisible ») lorsqu’on N’EST PAS sur l’onglet actif
   ===================================================================*/
#wb .e-n-tab-icon svg {fill:#8042F6;}   /* fond onglet wb */
#ps .e-n-tab-icon svg {fill:#36CDDE;}   /* fond onglet ps */
#ft .e-n-tab-icon svg {fill:#FFDB76;}   /* fond onglet ft */
#fp .e-n-tab-icon svg {fill:#FFBA26;}   /* fond onglet fp */

/* ===================================================================
   2. Quand l’onglet devient ACTIF  →  on rend l’icône visible
      + on lui donne la même couleur que le texte du titre
      (currentColor = hérite du color du bouton)
   ===================================================================*/
#wb[aria-selected="true"] .e-n-tab-icon svg,
#ps[aria-selected="true"] .e-n-tab-icon svg,
#ft[aria-selected="true"] .e-n-tab-icon svg,
#fp[aria-selected="true"] .e-n-tab-icon svg{
  opacity:1;          /* on montre l’icône */
  fill:currentColor;  /* prend la couleur du texte du titre */
}

/* ===================================================================
   3. Si tu veux définir (ou rappeler) la couleur du TEXTE de chaque
      onglet, fais‑le ici ; l’icône actif héritera automatiquement.
      – wb = #FFEB96  (déjà demandé)
      – ps, ft, fp → #8042F6  (comme tu le souhaites)
   ===================================================================*/
#wb,
#wb.elementor-active {color:white;}

#ps,
#ps.elementor-active,
#ft,
#ft.elementor-active,
#fp,
#fp.elementor-active {color:white;}




/* Border‑radius 20 px sur mobile pour les onglets NON actifs */
@media (max-width: 768px) {

  /* ciblage par ID + aria-selected="false" (donc pas l’onglet actif) */
  #wb[aria-selected="false"],
  #ps[aria-selected="false"],
  #ft[aria-selected="false"],
  #fp[aria-selected="false"]  {
    border-radius: 20px;
  }

}






/* dégradé des slick-arrow───────── État normal : contour violet + fond blanc ───────── */
.jet-listing-grid__slider-icon.slick-arrow{
  width:48px; height:48px;
  display:flex; align-items:center; justify-content:center;

  border:1px solid #8042F6;
  background-color:#fff;          /* ← uniquement la couleur pleine */
  color:#8042F6;

  border-radius:12px;
  transition:background-image .3s ease, background-color .3s ease,
             color .3s ease;
}

/* ───────── Icône (SVG / <i>) reprend la couleur du parent ──── */
.jet-listing-grid__slider-icon.slick-arrow svg,
.jet-listing-grid__slider-icon.slick-arrow i{
  fill:currentColor;
  color:inherit;
}

/* ───────── Hover / Focus : on efface le fond blanc puis         */
/*             on applique le dégradé comme image de fond        */
.jet-listing-grid__slider-icon.slick-arrow:hover,
.jet-listing-grid__slider-icon.slick-arrow:focus{
  background-color:transparent !important;               /* supprime la couleur unie */
  background-image:linear-gradient(135deg,#8042F6 0%,#36CDDE 100%) !important;
  color:#fff;                                            /* flèche blanche */
}

/* ───────── (Optionnel) Flèche désactivée ────────────────────── */
.jet-listing-grid__slider-icon.slick-arrow.slick-disabled{
  opacity:.35; pointer-events:none;
}


/* ───────── Position de l'icon ────────────────────── */
.elementor-widget-n-tabs .e-n-tab-title {
  position: relative;
}

@media (max-width: 768px) {
  .elementor-widget-n-tabs .e-n-tab-title .e-n-tab-icon svg {
    position: absolute;
    top: 10px;         /* adapte selon le design mobile souhaité */
    right: 30px;      /* adapte selon le design mobile souhaité */
    width: 16px;      /* adapte si nécessaire */
    height: 16px;
  }
}


@media (min-width: 769px) {
  .elementor-widget-n-tabs .e-n-tab-title .e-n-tab-icon svg {
    position: absolute;
    top: 15px;       /* adapte à ta position */
    right: 40px;     /* adapte aussi */
    width: 18px;
    height: 18px;
  }
}



/*------------------------------------- page question réponse -------------------------------*/

.jet-tabs__label-text{
    text-align: center;
}/* End custom CSS */