/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

#formulaire-sticky{
	margin-bottom: auto;
	position: sticky;
	top: 291px;
	height : 420px;
    width: 384px;
	margin-bottom: 800px;
}

.prenom-ff{
	margin-top:20px;
}
.nom-ff{
	margin-top:20px;
}
/* FLUENT FORMS WIDGET */
.fluentform-widget-wrapper{
    background-color: white;
		border: 2px #0088FF solid!important;
    padding : 2% 6% 2% 6%;
    border-radius: 20px;
}
.full-form .ff-default .ff-el-form-control, .ff-default .ff-el-form-control {
	color:#262B47!important;
}
input:focus::-webkit-input-placeholder {
	color : transparent!important;
}
@media only screen and (max-width: 767px){
	.fluentform-widget-wrapper{
	padding : 4% 6% 4% 6%;
}
}

/* WEBSITE */
.titre-h1{
    margin-bottom:20px!important;
}
.titre-h1-bleu{
    color:#0088FF;
}
.titre-h2{
    margin-bottom:20px!important;
}
.titre-h3{
    margin-bottom:10px!important;
}
.titre-h2-bleu{
    color:#0088FF;
}
.saut-ligne-mobile{
    display: none;
}
.nom-avis{
    color:#0088FF;
    font-weight:700;
}
.p-bleu{
    color:#0088FF;
}
.p-bleu a{
    color:#0088FF;
}
.p-bleu a:hover{
	  color:#0088FF;
    opacity:0.8;
}
.p-no-margin p:last-child{
    margin-bottom:0;
}
.cards-hover:hover{
    transform: scale(1.02);
    transition: all .2s ease-in-out;
}
.p-lettrine {
  color: #0088ff;
  float: left;
  font-family: Times;
  font-size: 75px;
  padding-top:10px;
  padding-right: 10px;
}
.p-citation{
	font-size:35px;
	font-weight:700;
	font-family: Times;
	line-height:37px;
}
.p-secondaire{
	font-size:13px;
	line-height:18px;
}
.rll-youtube-player{
    overflow: hidden;
    -webkit-border-radius: 20px;
    -webkit-mask-image: -webkit-radial-gradient(white, black);
}

/* MENU
.jet-mobile-menu__body{
	margin-top:25px!important;
}
*/
/* ACCORDÉON */
.custom-list {
  list-style: none; /* Supprime les puces par défaut */
  padding-left: 0; /* Supprime l'espacement à gauche */
	margin:10px 0 5px 0;/* Ajoute de l'espace entre le bullet point et l'accordéon */
}
.custom-list li {
  background: url('https://www.youschool.fr/wp-content/uploads/2023/12/check-bleu-clair-icone.svg') no-repeat left top; /* Utilise l'image comme arrière-plan à gauche de chaque élément de liste */
  padding-left: 40px; /* Ajoute un espace à gauche pour l'image */
  padding-bottom:6px;/* Espacement pour afficher l'image dans son entièreté */
  margin-bottom: 10px; /* Espacement entre les éléments de la liste */
  background-size: 25px;/* Taille de l'image */
}
.custom-list li:last-child{
    margin-bottom:0!important;
}
.e-n-accordion-item-title-text{
    font-weight:500!important;
    font-size:16px!important;
	  color:#393e59!important;
}
.e-n-accordion .elementor-widget-container p:last-child{
    margin-bottom:0!important;
}
@media only screen and (max-width: 767px){
	/* Empêcher le zoom du navigateur lors de la sélection d'une input */
input, textarea,select {
    font-size: 16px!important;
}
.titre-h2{
    margin-bottom:12px!important;
}
.saut-ligne-ordinateur{
    display:none;
}
.saut-ligne-mobile{
    display: initial;
    }
.eael-ext-scroll-to-top-button{
		display:none!important;
	}
	.cards-hover:hover{
    transform: none;
}
	.p-lettrine{
  padding-top:4px;
  padding-right: 8px;
    }
	.p-citation{
	font-size:28px;
		line-height:30px;
}
}

/* BLOG */
/* Au dessous du formulaire */
/* #custom_html-3{
    margin-top: 50px;
}
/* Au dessus du widget Facebook */
/*#jupiterx_posts-2{
    margin-top: 40px;
}
/* Titre Articles */
.card-title{
    margin-bottom:20px;
}
/* Texte Articles */
.jupiterx-widget-posts-post-title{
    font-size:15px!important;
}
/* Entre les articles */
.jupiterx-widget-posts-item{
    margin-bottom:20px!important;
}
/* Ajustement de l'image mise en avant desktop */
.jupiterx-post-image img {
		width:90%;
		margin-left:50px;
}
/* Ajustement de l'image mise en avant mobile */
@media only screen and (max-width: 767px) {
.jupiterx-post-image img {
		width:94%;
		margin-left:10px;
	margin-top:10px;
}
}

/* FLUENT FORMS WIDGET RIGHT */
body{
    overflow:visible!important;
}
.text-danger{
	font-size:11px!important
}
/* NOUVEAUX FORMS */
/* Dimensions inputs */
.fluentform-step{
	padding: 0 !important;
}
.titre-form, .titre-form p, h3, .shortcode_espace, .ff-custom_html>p{
	margin-bottom: 0 !important;
}
.ff-custom_html p:nth-child(2){
	margin-top: 10px !important;
}
.selection-formation{
    display: none!important;
}
.ff-el-form-hide_label{
	margin: 0 !important;
}
.fluentform .ff-el-group:not(.titre-form, .selection-age, .intro-formation){
	margin-top: 10px !important;
	margin-bottom : 0 !important;
}
.intro-formation{
	margin: 0!important;
}
.intro-formtion p:nth-child(2){
	margin-top: 5px !important;
}
.selection-age{
	margin: 5px 0 0 0 !important;
}
.full-form .selection-age{
	margin-top: -20px !important;
}
select .ff-el-form-control {
	padding: 10px 15px !important;
}
.step-nav {
    display: flex;
    justify-content: center;
    flex-direction: column-reverse;
    align-items: center;
}
.ff-step-t-container{
	flex-direction: column-reverse; 
	gap: 0 !important;
}
.ff-step-t-container .ff-t-cell{
	width: 100% !important;
}
.ff-el-form-check{
	margin: 10px 0 5px 0 !important;
}
/* Responsive inputs */
@media screen and (max-width: 1024px){
	.full-form .selection-age{
		margin-top: -10px !important
	}
}
/*Boutons du formulaire*/
.ff_submit_btn_wrapper{
	display: flex;
  justify-content: center;
	margin-top: 20px;
}
.full-form .ff-btn-submit, .full-form .ff-btn-next{
	width: 80% !important;
}

.full-form .radio-flex{
    display: flex;
}
.radio-flex .ff-el-input--content{
	display: flex;
    gap: 15px;
}
.radio-flex .ff-el-form-check- ,.ff-el-form-check-label{
    margin: 0 !important;
}
.radio-flex .ff-el-input--label{
	margin-right: 10px;
}
@media screen and (max-width:767px){
	.ff-btn-submit{
	width: 100% !important;
}
	.radio-flex{
		flex-direction:column;
	}
}
.ff-btn-next{
	margin-top: 20px;
}

/* Apparence */
.fluentform-widget-wrapper{
    background-color: white;
    border: 2px #0088FF solid !important;
    padding: 2% 6% 2% 6%;
    border-radius: 20px;
}
.full-form .fluentform-widget-wrapper{
	background-color: transparent !important;
  border: none !important;
	padding:0;
}
.brochure-selection-formation{
	-webkit-appearance: none!important;
  background-image: url("https://www.youschool.fr/wp-content/uploads/2024/01/chevron-icone.svg")!important;
  background-repeat: no-repeat;
  background-position: 95%;
}
label{
	color: #262B47;
  font-size: 14px;
	font-weight: 500 !important;
}
select{
	line-height: 18px !important;
}
select, input{
	background-color: #F5F7FE;
	font-size: 14px;
}
.ff-el-form-control{
	font-family: 'Poppins' !important;
}
::placeholder{
	color: #7E84A3 !important;
	font-family:'Poppins';
}
.full-form select, .full-form input{
			background-color: #FFF;
}
.full-form .ff-default .ff-el-form-control{
	border: 1px solid #cfd3E8 !important;
 font-family:'Poppins'!important;
 color: #7E84A3;
}
.full-form .ff-default .ff-el-form-control:focus{
	border: 1px solid #0088FF !important;
}
/*Boutons du formulaire*/
.ff-btn-next, .ff-btn-submit{
	width: 100%;
	background-color: #0088FF !important;
  border-color: #0088FF !important;
	border: none;
	border-radius: 8px;
	transition:0.3s;
	padding: 11px 20px !important;
}

.ff-btn-prev{
	padding: 0 !important;
	margin-top: 5px;
	background-color: transparent !important;
  border-color: transparent !important;
  color: #0088ff !important;
	font-size: 13px;
}
.ff-btn-next:hover {
    background-color: #393e59!important;
    border-color: #393e59!important;
	transition:0.3s;
}
/*Sélection du pays*/
.iti__country-name{
    font-size:15px;
}
.iti__country iti__standard{
     font-size:15px;
}
.iti__dial-code{
    font-size:15px;
}

/*Fin du formulaire*/

@media only screen and (max-width: 767px){
    .jupiterx-sidebar{
        display:none;
    }
    /*.ff-btn-prev{
    margin: 10px 0 0 40%!important;*/
	}

/* Partie Blog */

/* Progress bar */
.progress-bar{
	position: fixed;
	top: 0;
	z-index:100;
	background-color: #F5F7FE!important;
}
.elementor-scrolling-tracker {
    --scrolling-track-default-progress-color: #0088FF !important;
    --scrolling-track-default-color: #f5f7fe !important;
}
.progress-bar .elementor-scrolling-tracker-horizontal{
	height: 5px !important;
}
@media screen and (max-width: 767px){
	.progress-bar{
	top: 62px !important;
	}
	.progress-bar .elementor-scrolling-tracker-horizontal{
	height: 7px !important;
}
}
/* CARDS ARTICLES */

/* Animation hover */
.articles-blog .elementor-post__card:hover{
    transform: scale(1.02);
    transition: all .2s ease-in-out;
}
/* Apparence titre + meta */
.articles-blog .elementor-post__title{
    margin: -8px 0 0 0 !important;
}
.articles-blog .elementor-post__meta-data{
    margin: 5px 0 10px 0px !important;
    border-top: 0 !important;
    color: #393E59 !important;
    
}
.articles-blog .elementor-post-date{
    padding: 5px 10px;
    background: #E8ECFD;
    border-radius: 6px;
}
/* Bouton Voir plus*/
.articles-blog .elementor-button-wrapper{
	margin-top: 20px !important;
}
/* Masquer scrollbar Chrome, Safari Opera */
.articles-blog ::-webkit-scrollbar {
    display: none;
    }
/* Masquer scrollbar IE, Edge Firefox */
.articles-blog {
    -ms-overflow-style: none; }
/* Responsive */
@media screen and (max-width: 1024px){

/* Container */
.articles-blog .elementor-posts-container{
    display: flex;
    overflow-x: scroll;
    padding-bottom:20px;
}
.articles-blog .elementor-grid .elementor-grid-item{
    min-width: 70%;
}
.articles-blog .elementor-post__card{
	margin-top:10px;
	margin-left: 10px;
}
/* Animation hover none */
.articles-blog .elementor-post__card:hover{
    transform: none;
    transition:none;
    }

/* Apparence titre + meta */
.articles-blog .elementor-post__title {
    margin-top: -10px!important;
	}
}

/* Défilement images pages bonus */
@media screen and (max-width:767px){
.scroll-section-image{
    display: flex;
    flex-wrap: nowrap;
    overflow-x: scroll;
 }
	
	.scroll-section-image .elementor-icon-box-icon{
		display: flex !important;
		align-items: center !important;
	}
/* Masquer scrollbar Chrome, Safari Opera */
.scroll-section-image::-webkit-scrollbar {
    display: none;
    }
/* Masquer scrollbar IE, Edge Firefox */
.scroll-section-image{
    -ms-overflow-style: none; }
}
/* FIL D'ARIANE*/
#breadcrumbs, #breadcrumbs a {
    color: #0088ff;
    font-size: 13px;
    margin-bottom:10px;
}
.breadcrumb_last{
 font-weight:600;
}
@media screen and (max-width:767px){
#breadcrumbs{
	text-align:center;
}
}
/* Conteneurs */
.simulateur-duree{
	background-color: #FFFFFF;
}
.simulateur-duree .time-container {
    display: flex;
    align-items: center;
    gap: 12px;
}
.simulateur-duree .time-content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
/* Styles textes */
.simulateur-duree .title {
    font-size: 20px;
    font-weight: 600;
    text-align: center;
}
.simulateur-duree .number {
    font-size: 56px;
    font-weight: 600;
    color: #0088ff;
    margin-top: 14px;
}
.simulateur-duree .hours-week {
    margin: 0;
    color: #0088ff;
    font-size: 20px;
    font-weight: 500;
}
/* Style du slider */
.range {
    width: 100%;
}
input[type="range"] {
    width: 100%;
    margin: 20px 0;
}
/* Résultat de la simulation */
.simulateur-duree .result {
    margin-top: 10px;
}
.simulateur-duree .row {
    margin: 0;
    padding: 16px 20px;
    background-color: #edf7ff;
    border-radius: 12px;
    justify-content: center;
}
.simulateur-duree .row p {
    margin: 0;
}
@media only screen and (max-width: 767px) {
    .simulateur-duree .time-container {
        gap: 5px;
    }
    .simulateur-duree .title {
        font-size: 16px;
        text-align: center;
    }
    .simulateur-duree .number {
        font-size: 45px;
    }
    .simulateur-duree .hours-week {
        font-size: 18px;
    }
    .simulateur-duree .row {
        padding: 16px 10px;
    }
    .simulateur-duree .row p {
        font-size: 13px;
        text-align: center;
    }
}
/* Personnalisation de la piste et du pouce du slider */
input[type="range"] {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 10px;
    background: #C0DBFB;
    border-radius: 5px;
    outline: none;
    transition: background 0.3s;
}
/* Personnaliser le pouce */
input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 28px;
    height: 28px;
    background: #0088ff;
    border-radius: 50%;
    border: 4px solid #fff;
    cursor: pointer;
    transition: background 0.3s, box-shadow 0.3s;
}
input[type="range"]:hover::-webkit-slider-thumb {
    background: #0088ff;
    /* Couleur au survol */
}
/* Personnalisation pour Firefox */
input[type="range"]::-moz-range-track {
    width: 100%;
    height: 10px;
    background: #C0DBFB;
    border-radius: 5px;
}
input[type="range"]::-moz-range-thumb {
    width: 28px;
    height: 28px;
    background: #0088ff;
    border-radius: 50%;
    border: 4px solid #fff;
    cursor: pointer;
    transition: background 0.3s, box-shadow 0.3s;
}
input[type="range"]:hover::-moz-range-thumb {
    background: #0088ff;
    /* Couleur au survol */
}
/* Personnalisation pour Internet Explorer */
input[type="range"]::-ms-track {
    width: 100%;
    height: 10px;
    background: #C0DBFB;
    border-color: transparent;
    border-width: 10px 0;
    color: transparent;
    background-color: transparent;
}
input[type="range"]::-ms-thumb {
    width: 28px;
    height: 28px;
    background: #0088ff;
    border-radius: 50%;
    border: 4px solid #fff;
    cursor: pointer;
}
input[type="range"]:hover::-ms-thumb {
    background: #0088ff;
    /* Couleur au survol */
}
/* Navigation */
/* Soulignement*/
.nav-tab a{
    border-bottom: solid transparent 3px;
}
.nav-tab .elementor-icon-list-text{
    padding-bottom: 10px;
   }
.nav-tab .active{
        border-bottom: solid #0088FF 3px ;
        color: #0088FF;
    }
/* Responsive */
@media screen and (max-width: 1024px){
   .nav-tab ul{
       display: flex;
       justify-content: flex-start !important;
       flex-wrap: nowrap !important;
       overflow-x: scroll;
   }
    .nav-tab li{
       padding: 0 !important;
       position: relative !important;
       white-space: nowrap;
    }
/* Masquer scrollbar Chrome, Safari Opera */
    .nav-tab ul::-webkit-scrollbar {
        display: none;
    }
/* Masquer scrollbar IE, Edge Firefox */
    .nav-tab ul {
    -ms-overflow-style: none; 
    scrollbar-width: none
    }
}
/* Scroll mobile auto widget tabs   */
@media only screen and (max-width: 767px) {
.e-n-tabs-heading.e-n-tabs-heading.e-n-tabs-heading.e-n-tabs-heading {
overflow-x: auto;
display: flex;
flex-wrap: nowrap;
justify-content: start;

}
.e-n-tabs-heading > .e-n-tab-title{
white-space: nowrap;
}  
}


/* STYLE MENU */
 nav ul, nav li {
	 list-style: none;
	 padding: 0;
	 margin: 0;
}
 nav a {
	 display: flex;
     align-items: center;
     gap: 5px;
	 text-decoration: none;
}
nav a img{
    width: 30px;;
}
 nav a:hover, nav a:visited {
	 text-decoration: none;
}
 .menu-bar {
	 background: #ffffff;
	 display: flex;
}
 .menu-link {
	 padding: 10px 10px;
	 background: #ffffff;
	 color: #000;
	 transition: background .2s, color .2s;
	 position: relative;
	 z-index: 1;
}
/*.menu-secondaire .menu-link:nth-last-child(1){
    border-bottom-left-radius: 20px;
}*/
.menu .menu-list li{
    border-bottom: #f5f7fe;
}
 .menu-link[aria-haspopup="true"] {
	 padding-right: 40px;
}
 .menu-link[aria-haspopup="true"]:after {
	content: "";
	background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/1397521/arrowRight.svg#accent');
	background-size: 14px;
	filter: brightness(0) saturate(100%) invert(21%) sepia(8%) saturate(2487%) hue-rotate(193deg) brightness(94%) contrast(85%);
	width: 14px;
	height: 14px;
	font-size: 12px;
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
}
 .mega-menu-header {
	 font-size: 1.2em;
	 text-transform: uppercase;
	 font-weight: bold;
	 color: #136a73;
}
 .mega-menu {
	 background: #ffffff;
	 z-index: 10;
     border:1px solid #f0f0f0;
}
 .mega-menu--multiLevel {
	 flex-direction: column;
}

li .last-item-single{
	font-weight: 600;
}
 @media all and (min-width: 951px) {
	/* .nav > nav {
		 max-width: 900px;
		 margin: 0 auto;
	}*/
	 .menu [aria-haspopup="true"] ~ ul {
		 display: none;
	}
	 .menu-bar {
		 position: relative;
		 justify-content: center;
	}
	.menu-bar-link{
		margin-top: 20px;
		margin-bottom: 20px;
	}

	.menu-bar-link:hover{
		color: #0088FF;
	}
	 .menu-bar > li > [aria-haspopup="true"]:after {
		 background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/1397521/arrowBottom.svg#accent'); 
		 filter: brightness(0) saturate(100%) invert(21%) sepia(8%) saturate(2487%) hue-rotate(193deg) brightness(94%) contrast(85%);
	}
    .menu-bar > li:hover > ul,
    .menu-bar > li:focus-within > ul {
         display: flex;
         transform-origin: top;
         animation: dropdown .2s ease-out;
}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul:hover {
		 display: flex;
	}
	 .menu-bar > li:focus-within > [aria-haspopup="true"] ~ ul {
		 display: flex;
	}
	 .menu-bar > li > [aria-haspopup="true"]:focus, .menu-bar > li:focus-within > [aria-haspopup="true"], .menu-bar > li:hover > a {
		 color: #0088FF;
	}
	 .menu-bar > li > [aria-haspopup="true"]:focus:after, .menu-bar > li:focus-within > [aria-haspopup="true"]:after, .menu-bar > li:hover > a:after {
		 filter: brightness(0) saturate(100%) invert(32%) sepia(98%) saturate(1876%) hue-rotate(192deg) brightness(102%) contrast(109%);
	}
	 .mega-menu {
		 position: absolute;
		 top: 100%;
		 left: 0;
		 width: 100%;
	}
	 .mega-menu:hover {
		 display: flex;
	}
	/* .mega-menu a:hover {
		 background: tint(#0088FF,85%);
		 color: #0088FF;
	}*/
	 .mega-menu--multiLevel > li {
		 width: 33.333333333333%;
	}
	 .mega-menu--multiLevel > li > [aria-haspopup="true"] ~ ul {
		 left: 33.333333333333%;
		 width: 33.333333333333%;
	}
	 .mega-menu--multiLevel > li > [aria-haspopup="true"] ~ ul ul {
		 width: 100%;
		 left: 100%;
	}
	 .mega-menu--multiLevel li:hover > [aria-haspopup="true"] ~ ul {
		 display: block;
		 transform-origin: left;
		 animation: flyout .2s ease-out;
	}
	 .mega-menu--multiLevel li:focus-within > [aria-haspopup="true"] ~ ul {
		 display: block;
	}
	 .mega-menu--multiLevel li:hover > [aria-haspopup="true"], .mega-menu--multiLevel li:hover > a, .mega-menu--multiLevel li:focus-within > [aria-haspopup="true"], .mega-menu--multiLevel li:focus-within > a {
		 background: tint(#f5f7ff);
         color:#262B47;
		 font-weight: 600;
         background-color: #f5f7fe;
	}
    .menu-link.mega-menu-link{
        border-bottom:1px solid #f0f0f0;
    }
	.mega-menu.menu-deroulant > li:not(:first-child):not(:last-child) > .menu-link.mega-menu-link{
		padding-top: 0 !important;
	}

    .menu-link.menu-list-link{
        border-bottom:1px solid #f0f0f0;
    }
	.menu-list-link{
		padding-bottom : 15px;
	}
	 .mega-menu--multiLevel [aria-haspopup="true"] ~ ul {
		 position: absolute;
		 top: 0;
		 height: 100%;
	}
	/*.menu-link.last-item-double{
		border-bottom-left-radius: 5px;
		border-bottom-right-radius: 5px;*/
	}
	 .mega-menu--flat > * {
		 flex: 1;
	}
	 .mobile-menu-trigger, .mobile-menu-header, .mobile-menu-back-item {
		 display: none;
	}

 @media all and (max-width: 950px) {
	 /*.nav {
		 padding: 20px;
	}*/
	 .mobile-menu-trigger, .mobile-menu-header, .mobile-menu-back-item {
		 display: block;
	}
	/*Icon burger */
	 .mobile-menu-trigger i{
		font-size:20px;
		display: flex;
		justify-content: flex-end;
	}
	 .mobile-menu-header {
		 order: -1;
	}
	.logo-youschool-header {
		 width:100%;
	}
	 .mobile-menu-header a, .mobile-menu-header a:hover {
		 color: #0088FF;
		 visibility: visible;
	}
	 .menu-bar {
		 flex-direction: column;
		 position: fixed;
		 top: 0;
		 left: -100%;
		 height: 100vh;
		 width: 78%;
		 overflow-x: hidden;
		 transition: left .3s;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul {
		 display: flex;
		 flex-direction: column;
		 background: #ffffff;
		 position: absolute;
		 left: 100%;
		 top: 0;
		 max-height: 100vh;
		 width: 100%;
		 transition: left .3s;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul > li > [aria-haspopup="true"] {
		 font-size: 1.2em;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul > li > [aria-haspopup="true"] ~ ul a {
		 padding-left: 40px;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul > li > [aria-haspopup="true"] ~ ul > li > [aria-haspopup="true"] ~ ul a {
		 padding-left: 80px;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul [aria-haspopup="true"] {
		 color: #2a2a2a;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul [aria-haspopup="true"]:after {
		content: "";
		background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/1397521/arrowRight.svg#accent');
		background-size: 14px;
		filter: brightness(0) saturate(100%) invert(21%) sepia(8%) saturate(2487%) hue-rotate(193deg) brightness(94%) contrast(85%);
		width: 14px;
		height: 14px;
		font-size: 12px;
		position: absolute;
		right: 10px;
		top: 50%;
		transform: translateY(-50%);
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul [aria-haspopup="true"] ~ ul {
		 max-height: 0px;
		 transform-origin: top;
		 transform: scaleY(0);
		 transition: max-height .1s;
	}
	 .mega-menu-content {
		 padding: 20px 25px;
	}
	 .mobile-menu-back-item {
		 order: -1;
	}
	 .mobile-menu-back-item a {
		 background: tint(grey,70%);
		 color: #2a2a2a;
		 max-height: calc(1.4em + 40px);
		 margin-top: calc(0px - (1.4em + 40px));
		 pointer-events: none;
	}
	 .mobile-menu-back-item a:before {
		 width: 14px;
		 height: 12px;
		 background-size: 14px;
		 margin-right: 10px;
		 display: inline-block;
	}
	 .mobile-menu-trigger:focus ~ ul {
		 left: 0;
	}
	 .menu-bar:hover, .menu-bar:focus-within {
		 left: 0;
	}
	 .menu-bar > li > [aria-haspopup="true"]:focus ~ ul {
		 left: 0;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul {
		 margin-top: calc(1.4em + 40px);
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul:hover, .menu-bar > li > [aria-haspopup="true"] ~ ul:focus-within {
		 left: 0;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul [aria-haspopup="true"]:focus ~ ul {
		 max-height: 500px;
		 animation: dropdown .3s forwards;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul li:focus-within > [aria-haspopup="true"] ~ ul {
		 max-height: 500px;
		 transform: scaleY(1);
	}
	 .menu-bar > li:focus-within ~ .mobile-menu-header a {
		 visibility: hidden;
	}
}
 @media all and (max-width: 950px) and (hover: none) {
	 .mobile-menu-trigger:hover ~ ul {
		 left: 0;
	}
	 .menu-bar > li > [aria-haspopup="true"]:hover ~ ul {
		 left: 0;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul:hover {
		 left: 0;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul [aria-haspopup="true"]:hover ~ ul {
		 max-height: 500px;
		 animation: dropdown .3s forwards;
	}
	 .menu-bar > li > [aria-haspopup="true"] ~ ul [aria-haspopup="true"] ~ ul:hover {
		 max-height: 500px;
		 transform: scaleY(1);
	}
	 .menu-bar > li:hover ~ .mobile-menu-header a {
		 visibility: hidden;
	}
}
 @keyframes dropdown {
	 0% {
		 opacity: 0;
		 transform: scaleY(0);
	}
	 50% {
		 opacity: 1;
	}
	 100% {
		 transform: scaleY(1);
	}
}
 @keyframes flyout {
	 0% {
		 opacity: 0;
		 transform: scaleX(0);
	}
	 100% {
		 opacity: 1;
		 transform: scaleX(1);
	}
}


/* CSS AJOUTÉ PAR NOUS */

.call-button {
  justify-content: center;
  border: 1px solid #0088FF;
  border-radius: 5px;
  font-size: 12px;
  transition: background-color 0.3s, color 0.3s;
  width:40%;
  font-weight: 500;
  padding: 0 5px 0 5px;
}

.call-button:hover {
  background-color: #0088FF;
  color:white!important;
}

.menu-header-flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.conteneur-logo{
    width: 50%;
}

.mobile-menu-header{
    padding:20px 10px 10px 10px;
}

.menu-deroulant{
	flex-direction: column;
    left: auto;
    width: auto; 
}

.menu-deroulant .menu-link.mega-menu-link{
	border: none;
}
.menu-deroulant .menu-link.mega-menu-link:hover{
	color: #0088FF;
}

@media screen and (min-width:1025px){
	.cta-menu-mobile{
		display: none;
	}
	/* Volets menu uniquement en desktop */
	/* 1) Autoriser le débordement pour tous les conteneurs */
.nav,
.menu-bar,
.mega-menu,
.mega-menu--multiLevel {
  overflow: visible !important;
}

/* 2) Masquer le volet secteurs par défaut */
.mega-menu--multiLevel {
  position: absolute !important;
  top: 100% !important;
  left: 4vw !important;
  width: auto !important;
  padding: 0 !important;
  display: none !important;           /* caché jusqu'au hover */
  background: transparent !important;
  gap: 0 !important;
  z-index: 1000;
}

/* 3) Afficher le volet secteurs au hover */
.menu-bar > li:hover > .mega-menu--multiLevel {
  display: flex !important;
}

/* 4) Chaque secteur ne prend que son contenu */
.mega-menu--multiLevel > li {
  position: relative;
  width: auto !important;
}

/* 5) Niveau 2 (formations) : masqué par défaut et en absolute hors conteneur */
.mega-menu--multiLevel > li > ul {
  display: none !important;
  position: absolute !important;
  top: 0 !important;
  left: 100% !important;
  min-width: 280px;/* ajustez selon besoin */
}
.mega-menu--multiLevel > li:hover > ul {
  display: block !important;
}

/* 6) Niveau 3 (pages) */
.mega-menu--multiLevel > li > ul > li > ul {
  display: none !important;
  position: absolute !important;
  top: 0 !important;
  left: 100% !important;
  min-width: auto;
}
.mega-menu--multiLevel > li > ul > li:hover > ul {
  display: block !important;
}
/* ========== Aligner les volets 2 & 3 en haut du volet 1 ========== */

/* 1) On retire le position:relative sur les <li> du niveau 1 pour que 
   leurs sous-menus soient positionnés par rapport au container .mega-menu--multiLevel */
.mega-menu--multiLevel > li {
  position: static !important;
}

/* 2) On s’assure que le container multi level est bien positionné */
.mega-menu--multiLevel {
  position: absolute !important;
}

/* 3) On force le top:0 des sous-menus (niveaux 2 & 3) */
.mega-menu--multiLevel > li > ul,
.mega-menu--multiLevel > li > ul > li > ul {
  top: 0 !important;
}
/* ========== Panels 2 & 3 full-height + fond blanc ========== */

/* 1) Sur le container flex des secteurs, on étire les enfants */
.mega-menu--multiLevel {
  align-items: stretch !important;
}

/* 2) Les sous-menus (niveaux 2 & 3) remplissent 100% de la hauteur du container */
.mega-menu--multiLevel > li > ul,
.mega-menu--multiLevel > li > ul > li > ul {
  height: 100% !important;
  background-color: #ffffff !important;
}

/* TEST BORDER RADIUS HOVER */
/* === 1) Premier panneau (niveau 1) : mega-menu--multiLevel === */
/* Par défaut : radius complet bas */
.menu-bar > li > .mega-menu--multiLevel {
	border-bottom-left-radius: 10px !important;
	border-bottom-right-radius: 10px !important;
	transition: border-radius 0.2s ease;
  }
  
  /* Au hover : retire le radius bas (pour aligner avec le panneau ouvert) */
  .menu-bar > li:hover > .mega-menu--multiLevel {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
  }
  
  
  /* === 2) Dernier item du premier niveau === */
  /* Par défaut : radius complet bas sur le LI final */
  .mega-menu--multiLevel > li .last-item-single {
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	overflow: hidden;
	transition: border-radius 0.2s ease;
  }
  
  /* Au hover : radius gauche seulement (le droit disparaît pour continuité) */
  .mega-menu--multiLevel > li .last-item-single:hover {
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 0;
  }
  
  
  /* === 3) Niveaux 2 et 3 : sous-UL imbriqués === */
  /* Par défaut : seulement coin bas droit arrondi */
  .mega-menu--multiLevel li > ul,
  .mega-menu--multiLevel li > ul li > ul {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 10px;
	transition: border-radius 0.2s ease;
  }
  
  /* Au hover (sous-panneau ouvert) : enlève le coin bas droit pour aligner */
  .mega-menu--multiLevel li:hover > ul {
	border-bottom-right-radius: 0;
  }
  
  
}
@media screen and (max-width: 1024px){
	.mega-menu-link{
		font-size: 15px !important;
	}
	.mega-menu--multiLevel li:focus-within > a{
		color: #0088FF !important;
	}
	.mobile-menu-header{
		display: flex;
		flex-direction: column;
		gap: 15px;
	}
	.close-btn{
		justify-content: flex-end;
	}
	.menu-bar li{
		border-bottom: 1px solid #e6ebfc ;
	}
	.cta-menu-mobile{
		padding: 20px 10px 30px 10px ;
		background-color: #f5f7ff;
	}
	.cta-menu-mobile h3{
		font-size: 19px;
		margin: 0;
		color: #4A4f68;
	}
	.cta-menu-mobile p{
		color: #7E84A3;
		font-weight: 500;
	}
	.cta-menu-mobile button{
    	border-radius: 6px;
		border: none;
    	padding: 10px 16px;
		background-color: #0088FF;
		color: white;	
		font-weight: 500;
	}
	.menu-deroulant{
		height: -webkit-fill-available;
	}
/* ================================
   1) Styles généraux DESKTOP + MOBILE
   ================================ */

/* Niveau 1 : .mega-menu--multiLevel */
.menu-bar > li > .mega-menu--multiLevel {
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	transition: border-radius 0.2s ease;
  }
  
  /* En hover desktop : retirer radius pour l'ouverture */
  .menu-bar > li:hover > .mega-menu--multiLevel {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
  }
  
  /* Dernier item du niveau 1 : radius complet */
  .mega-menu--multiLevel > li.last-item-single {
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 10px;
	overflow: hidden;
	transition: border-radius 0.2s ease;
  }
  
  /* En hover desktop : radius gauche uniquement */
  .mega-menu--multiLevel > li.last-item-single:hover {
	border-bottom-left-radius: 10px;
	border-bottom-right-radius: 0;
  }
  
  /* Niveaux 2 et 3 : radius bas droit uniquement */
  .mega-menu--multiLevel li > ul,
  .mega-menu--multiLevel li > ul li > ul {
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 10px;
	transition: border-radius 0.2s ease;
  }
  
  /* En hover desktop : retirer radius droit pour l'ouverture */
  .mega-menu--multiLevel li:hover > ul {
	border-bottom-right-radius: 0;
  }
  
  /* ================================
	 2) Désactivation du hover sur MOBILE
	 ================================ */
  /* Désactiver le hover en mobile */
	.menu-bar > li:hover > .mega-menu--multiLevel,
	.mega-menu--multiLevel > li:hover > ul,
	.mega-menu--multiLevel li > ul li:hover > ul {
	  display: none !important;
	}
  
	/* Ouvrir via la classe .open en mobile */
	.menu-bar > li.open > .mega-menu--multiLevel {
	  display: flex !important;
	}
  
	.mega-menu--multiLevel > li.open > ul {
	  display: block !important;
	}
  
	.mega-menu--multiLevel li > ul li.open > ul {
	  display: block !important;
	}
  }