:root{
  --bg: #f6f8fb;
  --surface: #ffffff;
  --surface-muted: #eef2f7;

  --text: #0f172a;
  --text-muted: #475569;

  --primary: #0b3a6a;       
  --primary-700: #082d52;
  --accent: #0ea5e9;        

  --success: #16a34a;
  --danger: #dc2626;

  --radius: 14px;
  --radius-lg: 18px;

  --shadow: 0 10px 30px rgba(15, 23, 42, .08);
  --shadow-soft: 0 6px 18px rgba(15, 23, 42, .06);

  --border: 1px solid rgba(15, 23, 42, .10);
}

html, body { height: 100%; }
body{
  font-family: 'Lato', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  color: var(--text);
  background: var(--bg);
}

@media (min-width: 1200px){
  .container{ width: 1200px; }
}

img{
  border-radius: var(--radius);
  max-width: 100%;
  height: auto;
}

.margintop{
	margin-top: 30px;
	}
header{
	border-top: 7px solid #ececec;
	}
header .logo{
	margin: 15px 0;
	}
.phone-box{
	background: #ececec;
    border-radius: 30px;
    margin-top: 8px;
    margin-bottom: 8px;
    padding: 20px 0;
    text-align: center;
}
.phone-box p{
	font-size: 20px;
	margin: 0;
	color: #1c4d92;
	font-weight: 600;
}
.phone-box a{
	display: inline-block;
    text-align: center;
    font-size: 32px;
    font-weight: 600;
    background-color: #17b95f;
    color: #fff;
    margin-top: 10px;
    padding: 5px 30px;
}
.bandeau{
  position: relative;
  background: url(../img/bandeau.jpg) center/cover no-repeat;
  color: #fff;
  padding: 56px 0;
}

.bandeau:before{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(90deg, rgba(8,45,82,.86), rgba(8,45,82,.30));
}

.bandeau .container{ position: relative; z-index: 1; }

.bandeau h1{
  margin: 0 0 10px;
  font-size: 34px;
  line-height: 1.15;
}

.bandeau p{
  margin: 0;
  max-width: 58ch;
  color: rgba(255,255,255,.92);
  font-size: 17px;
}


main{
	padding: 45px 0;
	}
.box{
  padding: 28px;
  border-radius: var(--radius-lg);
  background: var(--surface);
  border: var(--border);
  box-shadow: var(--shadow-soft);
}

.box.grey{
  background: var(--surface-muted);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: none;
}

.box.blue{
  background: var(--primary);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: var(--shadow);
  color: #fff;
}

.box.icon{
	overflow: hidden;
	clear:both;
	position:relative;
	margin-bottom: 30px;
	}
.box.icon .bgicon{
	position:absolute;
	right: -50px;
	bottom: -50px;
	}
.box.icon .bgicon i{
	font-size: 250px;
	color: #305b98;
	transform: rotate(15deg);
	}
.heading-icon{
  margin: 0 0 18px;
  padding: 6px 0 6px 54px;
  font-size: 20px;
  letter-spacing: .2px;
  position: relative;
}

.heading-icon .icon{
  position:absolute;
  top: 0;
  left: 0;
  width: 44px;
  height: 44px;
  background: #0dc3ff;
  border-radius: 999px;
}
.heading-icon .icon i{ color: var(--primary); }
.heading-icon.blue{ color: var(--primary); }
.heading-icon.white{ color: #fff; }

.list-1{
	margin-top: 5px;
	}
.list-1 ul{
	list-style: none;
	padding: 0;
	margin: 0;
	}
.list-1 ul li{
	color: #333;
	font-size: 16px;
	margin-bottom: 20px;
	font-weight: 700;
	display: flex;
    align-items: baseline;
	}
.list-1 ul li i{
	color: #1c4d92;
	margin-right: 20px;
	font-weight: 700;
	}
.list-1 a{
	display: inline-block;
	background: #1c4d92;
	color: #fff;
	font-size: 16px;
	padding: 10px 30px;
	margin-left: 30px;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	}
.list-1 a:hover,
.list-1 a:focus{
	text-decoration:none;
	background: #333;
	}
.list-2 ul{
	list-style: none;
	padding: 0 0 0 20px;
	}
.list-2 ul li{
	position:relative;
	color: #fff;
	padding-left: 20px;
	margin-bottom: 15px;
	}
.list-2 ul li:before{
    position:absolute;
	content: "\f105";  
    font-family: FontAwesome;
    top: -5px;
	left:0;
	font-size: 20px;
	color:#0dc3ff;
	}
.fig-link-item{
	text-align: center;
	margin-bottom: 30px;
	}
.fig-link-item a{
	display: block;
	color:#fff;
	font-size: 18px;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	}
.fig-link-item a:hover,
.fig-link-item a:focus{
	color:#0dc3ff;
	}
.fig-link-item figure{
	background:#1c4d92;
	border-radius: 35px;
	}
.fig-link-item figure img{
	width: 100%;
	}
.fig-link-item figure figcaption{
	padding: 13px 0;
	}
.big-fig-link .fig-link-item figure figcaption{
	position:relative;
	height: 76px;
	}
.big-fig-link .fig-link-item figure figcaption span{
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	width: 80%
	}
.aside-fig-link{
	margin-bottom: 10px;
	position:relative;
	}
.aside-fig-link a{
	display: block;
	color: #fff;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	}
.aside-fig-link a:hover,
.aside-fig-link a:focus{
	color:#0dc3ff;
	}
.aside-fig-link figure{
	display:flex;
	}
.aside-fig-link img{
	border-radius: 10px;
	align-self:center;
	}
.aside-fig-link figcaption{
	display:inline-block;
	margin-left: 15px;
	font-size: 16px;
	align-self:center;
	}
footer{
	background: #222d3e;
	padding: 32px 0;
	}
footer .logo-footer{
	text-align:center;
	margin-top: 53px;
	}
footer h2{
	font-size: 20px;
	text-transform:uppercase;
	color: #0dc3ff;
	}
footer ul{
	padding: 0;
	list-style: none;
	}
footer ul li a{
	display:block;
	color: #fff;
	padding: 5px 0 5px 15px;
	
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	
	position: relative;
	}
footer ul li a:hover,
footer ul li a:focus{
	color: #D3D3D3;
	}
footer ul li a:before{
    position:absolute;
	content: "\f105";  
    font-family: FontAwesome;
    top: 50%;
	left:0;
	transform: translateY(-50%);
	
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	}
footer ul li a:hover:before,
footer ul li a:focus:before{
	left:5px;
	}

/* Boutons génériques */
.btn-primary,
.box.form form button[type="submit"]{
  background: var(--primary);
  color: #fff;
  font-size: 16px;
  padding: 12px 18px;
  border: none;
  border-radius: 12px;
  width: 100%;
  box-shadow: 0 10px 22px rgba(11,58,106,.18);
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
	margin-top: 20px;
}

.btn-primary:hover,
.box.form form button[type="submit"]:hover{
  background: var(--primary-700);
  transform: translateY(-1px);
}

/* Bouton d'appel = conversion */
.callbtn,
.btn-call{
  background: var(--success);
  color: #fff;
  border-radius: 999px;
  padding: 10px 30px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
  letter-spacing: .3px;
  box-shadow: 0 12px 26px rgba(22,163,74,.22);
}
.callbtn:hover, .callbtn:focus{ color:#fff; filter: brightness(.96); }

.callbtn i{ transform: rotate(-35deg); font-size: 22px; }

.bootstrap-select .btn-default{
	border: none;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all 0.2s ease;
	}
.bootstrap-select .btn-default:hover,
.bootstrap-select .btn-default:focus{
	background: none;
	}
.box.success{
	display: none;
	background: #e0ffda;
	text-align: center;
	}
.box.success p{
	margin: 0;
	font-size: 20px;
	color:#2A6119;
	}

.inscrit{
	display: none;
	}
.inscrit-box{
	background:#ececec;
	border-radius: 30px;
	text-align:center;
	}
.inscrit-box figure{
	position:relative;
	}
.inscrit-box figure figcaption{
	position:absolute;
	left: 50%;
	bottom: 10px;
	transform: translateX(-50%);
	width: 100%;
	}
.inscrit-box figure figcaption .icon{
  margin: 0 auto;
  width: 46px;
  height: 46px;
  border-radius: 999px;
  background: rgba(14,165,233,.16); /* accent soft */
  border: 1px solid rgba(255,255,255,.25);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.inscrit-box figure figcaption .icon i{
  color: #fff;
}

.inscrit-box figure figcaption h3{
	font-size: 20px;
	color: #fff;
	padding: 0 20px;
	}

.inscrit-box ul{
	list-style: none;
	padding: 0 0 20px;
	}
.inscrit-box ul li{
	margin-bottom: 5px;
	}
.inscrit-box ul li i{
	margin-right: 5px;
	color: #1c4d92;
	}
.inscrit-box form{
	padding: 20px;
	}
.inscrit-box form input,
.inscrit-box form textarea{
	border: none;
	box-shadow: none;
	}
.inscrit-box form input[type="submit"]{
	background: #1c4d92;
    color: #0dc3ff;
    font-size: 16px;
    padding: 5px 30px;
    width: 100%;
    box-shadow: none;
	}
.box{
	position: relative;
	}
.box .loader{
	display:none;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(255, 255, 255, 0.8);
    z-index: 999;
	}
.box .loader img{
	position:absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	}
.icon-box{
  border: 1px solid rgba(15,23,42,.12);
  border-radius: var(--radius-lg);
  padding: 26px;
  margin-bottom: 22px;
  text-align: left;
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.icon-box .icon{
  width: 56px;
  height: 56px;
  background: rgba(11,58,106,.12);
  border-radius: 14px;
  margin: 0 0 14px 0;
}
.icon-box .icon i{
  color: var(--primary);
  font-size: 24px;
}
.icon-box h4{ margin: 8px 0 10px; }
.icon-box p{ color: var(--text-muted); margin: 0; }
.working-contact-form input,
.working-contact-form textarea,
.reclamform input,
.reclamform textarea{
	border: none;
    box-shadow: none;
	}
.working-contact-form input[type=submit],
.reclamform input[type=submit]{
	display: inline-block;
    background: #1c4d92;
    color: #0dc3ff;
    font-size: 16px;
    padding: 10px 30px;
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
	}
.working-contact-form input[type=submit]:hover,
.working-contact-form input[type=submit]:focus,
.reclamform input[type=submit]:hover,
.reclamform input[type=submit]:focus{
	background: #333;
	}
.form-message-error {
    color: #E91E63;
    font-size: 11px;
    margin: 7px 0 10px 0;
}
	.fixedctc {
    display: none;
}

/* ############## CONTACT LANDING PAGE STYLE ############## */

.contact-landing header {
    border-top: none;
}
.contact-landing header .main-menu{
	background: #09204e;
}
.contact-landing header nav>ul>li>a{
	color: #ffffff;
}
.contact-landing header nav>ul>li.active>a, 
.contact-landing header nav>ul>li:hover>a, 
.contact-landing header nav>ul>li:focus>a{
	background: #013593;
}
.bandeau.famille{
	background:none;
	color: #fff;
	padding: 50px 0;
	}
.contact-landing footer {
    background: #013593;
}
.contact-landing footer h2 {
    color: #fff;
}
.contact-page{
	text-align: center;
}
.contact-page .wrapper{
	padding: 8%;
	background: #dce3f2;
}
.row-container {
  display: flex;
  flex-direction: row;
}
	@media (max-width: 900px) {
	  .row-container {
	    flex-direction: column-reverse;
	  }
	}
.vertical-center{
	display: flex;
}
.vertical-center-child{
	align-self: center;
}
.contact-page .img-contact-right{
	width: 100%;
}
.contact-page h1{
	text-transform: uppercase;
	font-size: 34px;
	margin-bottom: 40px;
	color: #09204e;
}
.contact-page p{
	color: #09204e;
	font-size: 18px;
}
.contact-page .sous-cat-btn{
	text-align: center;
	padding: 40px 0;
}
.contact-page .sous-cat-btn a{
	font-size: 18px;
    font-weight: 500;
    display: inline-block;
    padding: 10px 20px;
    background: #ffffff;
    color: #013593;
    margin: 10px 5px;
    border: 2px solid #013593;

    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.contact-page .sous-cat-btn a:hover{
	background: #013593;
	color: #fff;
}
#callButton{
	background: #60bd22;
    text-decoration: none;
    color: #fff;
    font-weight: bold;
    font-size: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 240px;
    height: 70px;
    margin: 0 auto;
}
#callButton img{
	margin-right: 10px;
}

@media (max-width: 480px) {
	.fixedctc{
		display: block;
		position: fixed;
	    bottom: 0;
	    left: 0;
	    background: #fff;
	    width: 100%;
	    text-align: center;
	    padding: 0;
	    box-shadow: inset 0 10px 0 0px #3a84df, inset 0 -10px 0 0px #3a84df;
	    z-index: 1000;
	}

	.fixedctc img{
		width: 100%;
		border-radius: 0;
	}		
	
	.bandeau{
		padding: 20px 0;
	} 
	.bandeau.famille{
		padding: 20px 0;
	}
	.bandeau h1 {
	    margin: 0 0 10px;
	    font-size: 28px;
	}
	.bandeau.famille h1{
		margin-bottom: 30px;
	    font-size: 23px;
	}
	.contact-page .sous-cat-btn a {
	    font-size: 16px;
	    padding: 10px 10px;
	    margin: 3px 3px;
	}
	.contact-page .sous-cat-btn {
	    padding: 30px 0;
	}
	.contact-page p {
	    font-size: 16px;
	}
	main {
	    padding: 25px 0;
	}
	.box {
	    padding: 20px;
	}
	.icon-box{
		height: inherit !important;
	}
	footer .logo-footer{
		text-align: left;
	    margin-top: 0;
	}

	#callButton{
		font-size: 26px;
		width: 220px;
    	height: 60px;
	}
	.contact-page .wrapper {
	    padding: 8% 6%;
	}
}

.sticky-call{
  display: none;
}

/* ===== Sticky: bouton & cartouche ===== */

/* Pas de soulignement sur le bouton sticky */
.btn-sticky-call,
.btn-sticky-call:hover,
.btn-sticky-call:focus{
  text-decoration: none !important;
}

/* Par défaut : on voit APPELER, pas 3242 */
.btn-sticky-call .btn-sticky-text{ display: inline; }
.btn-sticky-call .btn-sticky-number{ display: none; }

/* Desktop : après clic, 3242 remplace APPELER (si un jour tu affiches aussi en desktop) */
@media (min-width: 481px){
  .btn-sticky-call.is-revealed .btn-sticky-text{ display: none; }
  .btn-sticky-call.is-revealed .btn-sticky-number{
    display: inline;
    font-weight: 900;
    letter-spacing: .6px;
  }
}

/* Cartouche sticky : cachée avant clic, centrée, non agrandie, marge 5px */
.sticky-cartouche-wrap{ text-align: center; }

.sticky-cartouche{
  width: auto;
  max-width: 40%;
  height: auto;
  margin: 5px auto 0;
  border-radius: 0;
}

.hide-cartouche{ display: none !important; }
.show-cartouche{ display: block !important; }

@media (max-width: 480px){
  .sticky-call{
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2000;
    background: rgba(255,255,255,.96);
    border-top: 1px solid rgba(15,23,42,.12);
    padding: 10px 12px;
    backdrop-filter: blur(8px);
  }
  .sticky-call .inner{
    display:flex;
    align-items:center;
    justify-content: space-between;
    gap: 10px;
    max-width: 1200px;
    margin: 0 auto;
  }
  .sticky-call .txt{
    font-size: 14px;
    color: #0f172a;
    line-height: 1.2;
  }
}

/* FIX: centrage des icônes dans toutes les bulles */
.heading-icon .icon,
.icon-box .icon,
.inscrit-box figure figcaption .icon{
  display: inline-flex;        /* ou flex selon le cas */
  align-items: center;
  justify-content: center;
}

/* les <i> ne doivent plus être en absolute/transform pour être centrés */
.heading-icon .icon i,
.icon-box .icon i,
.inscrit-box figure figcaption .icon i{
  position: static !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  line-height: 1 !important;
}

/* uniformiser bootstrap-select (évite overrides conflictuels) */
.bootstrap-select .btn,
.bootstrap-select .btn-default{
  border-radius: 12px !important;
  border: 1px solid rgba(15,23,42,.14) !important;
  height: 46px;
}
@media (max-width: 480px){
  .fixedctc{ display:none !important; }
}

/* ========== INSCRIT TELEPHONE LEFT ========== */
.btn-callnow,
.btn-callnow:hover,
.btn-callnow:focus{
  text-decoration: none !important;
}

.inscrit-box.left{
  border-radius: var(--radius-lg);
  background: var(--surface);
  border: var(--border);
  box-shadow: var(--shadow-soft);
  overflow: hidden;
}

.inscrit-box.left figure{
  margin: 0;
}

.inscrit-box.left img{
  width: 100%;
  border-radius: 0; /* plus clean / institutionnel */
  display: block;
}

.inscrit-box.left figure figcaption{
  position: absolute;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  width: calc(100% - 24px);
  text-align: center;
}

.inscrit-box.left figure figcaption h3{
  margin: 10px 0 0;
  font-size: 18px;
  line-height: 1.2;
  color: #fff;
  text-shadow: 0 8px 18px rgba(0,0,0,.35);
}

/* Bouton call to action */
.inscrit-box .phone-btn{
  padding: 16px 18px 18px;
  margin: 0;
}

.btn-callnow{
  width: 100%;
  justify-content: center;
  gap: 10px;
  border-radius: 14px;
  padding: 12px 14px;
}

.btn-callnow i{
  transform: none; /* on veut une icône “officielle” */
  font-size: 28px;
}

/* Cartouche image sous le bouton */
.hide-cartouche{ display: none !important; }
.show-cartouche{ display: block !important; }

/* Affichage cartouche : pas d’agrandissement, centré, marge 5px */
.inscrit-box .cartouche3240{
  max-width: 50%;
  width: auto;       
  height: auto;
  margin: 5px auto 0;     
  border-radius: 0;     
}

/* Liste */
.inscrit-box.left ul{
  list-style: none;
  padding: 0 18px 18px;
  margin: 0;
  text-align: left;
}

.inscrit-box.left ul li{
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 8px 0;
  border-top: 1px solid rgba(15,23,42,.08);
  color: var(--text-muted);
  font-size: 14px;
}

.inscrit-box.left ul li:first-child{
  border-top: none;
}

.inscrit-box.left ul li i{
  color: var(--primary);
  margin-top: 2px;
}

/* Par défaut : on voit le texte */
.btn-callnow .btn-text{ display: inline; }
.btn-callnow .btn-number{ display: none; }

/* Après clic desktop : on remplace le texte par 3242 */
@media (min-width: 481px){
  .btn-callnow.is-revealed .btn-text{ display: none; }
  .btn-callnow.is-revealed .btn-number{
    display: inline;
    font-size: 24px;
    font-weight: 900;
    letter-spacing: .6px;
  }
}

/* Mobile : on garde “APPELER MAINTENANT” (et tel: déclenche l’appel) */
@media (max-width: 480px){
  .btn-callnow .btn-number{ display: none !important; }
}


/* Mobile: le numéro n’a pas besoin d’apparaître dans le bouton (optionnel) */
@media (max-width: 480px){
  .btn-callnow .btn-number{
    display: none !important;
  }
}

/* ========== Icon-box mêmes hauteurs (desktop only) ========== */
@media (min-width: 992px){

  /* Les lignes contenant les 2 colonnes */
  .margintop .row{
    display: flex;
    flex-wrap: wrap;
  }

  /* Chaque colonne devient un conteneur flex pour étirer la box */
  .margintop .row > [class*="col-"]{
    display: flex;
  }

  /* La box prend toute la hauteur disponible */
  .margintop .row > [class*="col-"] .icon-box{
    width: 100%;
    height: 100%;
  }
}

/* ========== MENU MODERNE & RESPONSIVE (Bootstrap 3) ========== */

/* cachés par défaut (desktop) */
.site-header .nav-mobile-brand,
.site-header .nav-mobile-home{
  display: none;
}

/* util */
.site-header .sr-only{
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  border:0;
}

/* header top align */
.site-header .header-actions{ text-align:right; }

/* burger */
.site-header .humburger-menu{
  display:none; /* visible seulement <1150px */
  background: transparent;
  border: 0;
  padding: 10px 12px;
  border-radius: 10px;
  color: var(--text);
	font-size: 30px;
	line-height: 1;
}
.site-header .humburger-menu:focus{
  outline: 3px solid rgba(14,165,233,.35);
  outline-offset: 2px;
}

/* conteneur menu */
.site-header .main-menu{
  background: #ececec;
  border-top: 1px solid rgba(15,23,42,.08);
}

/* =========================================================
   DESKTOP (>= 1150px)
   ========================================================= */
@media (min-width: 1150px){

  /* 1 seule ligne */
  .site-header .nav-list{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
    justify-content:space-between;
  }

  .site-header .nav-list > li{
    position:relative;
    flex:0 0 auto;
  }

  .site-header .nav-list > li > a{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding: 10px 10px;
    color: #1f2937;
    font-size: 14px;
    font-weight: 700;
    border-radius: 10px;
    text-decoration:none;
    white-space:nowrap;
    transition: background .15s ease, color .15s ease;
  }

  /* hover ergonomique : fond clair + texte bleu (pas de bleu foncé) */
  .site-header .nav-list > li > a:hover,
  .site-header .nav-list > li > a:focus{
    background: rgba(14,165,233,.12);
    color: var(--primary);
    text-decoration:none;
  }

  /* écrase l’ancien CSS legacy qui mettait fond bleu foncé */
  .site-header nav > ul > li:hover > a,
  .site-header nav > ul > li:focus > a{
    background: rgba(14,165,233,.12) !important;
    color: var(--primary) !important;
  }

  /* caret */
  .site-header .has-submenu > a::after{
    content:"";
    width:0;height:0;
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-top:6px solid rgba(31,41,55,.55);
    margin-left:6px;
  }

  /* submenu */
  .site-header .submenu{
    position:absolute;
    top: calc(100% + 8px);
    left:0;
    min-width:320px;
    max-width: min(440px, calc(100vw - 24px));
    background: #1f2a3a;
    border-radius: 14px;
    padding: 8px 0;
    box-shadow: 0 18px 45px rgba(15,23,42,.22);

    opacity:0;
    visibility:hidden;
    transform: translateY(6px);
    transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
    z-index: 3000;

    max-height: calc(100vh - 140px);
    overflow:auto;
  }

  .site-header .submenu li{
    border-top: 1px solid rgba(255,255,255,.08);
  }
  .site-header .submenu li:first-child{ border-top:0; }

  .site-header .submenu a{
    display:block;
    padding: 10px 14px;
    color:#fff;
    text-decoration:none;
    font-weight:600;
    line-height:1.25; font-size: 14px;
    transition: background .12s ease, color .12s ease;
  }

  /* nouvelle charte */
  .site-header .submenu a:hover,
  .site-header .submenu a:focus{
    background: rgba(14,165,233,.14);
    color: #ffffff;
    text-decoration:none;
  }

  /* ouverture */
  .site-header .has-submenu:hover > .submenu,
  .site-header .has-submenu:focus-within > .submenu{
    opacity:1;
    visibility:visible;
    transform: translateY(0);
  }
}

/* =========================================================
   MOBILE + TABLETTE (< 1150px) = 1 seule version
   Drawer FIXE à GAUCHE
   ========================================================= */
@media (max-width: 1150px){
  /* ===== Brand (logo en haut du drawer) ===== */
  .site-header .nav-mobile-brand{
    display: block;
    padding: 6px 6px 12px;
    border-bottom: 1px solid rgba(15,23,42,.10);
    margin-bottom: 12px;
  }
  .site-header .nav-mobile-brand-link{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
  }
  .site-header .nav-mobile-brand img{
    height: 40px;     /* ajuste si besoin */
    width: auto;
    border-radius: 0; /* plus propre pour un logo */
  }

  /* ===== Home item (uniquement mobile) ===== */
  .site-header .nav-mobile-home a{
    justify-content: flex-start;
    gap: 10px;
  }
  .site-header .nav-mobile-home i{
    font-size: 18px;
  }
}

@media (max-width: 1149px){

	.site-header .header-top{
    position: relative;
  }

	.site-header .header-actions{
    position: absolute;
    right: 20px;
    bottom: 0;     
    width: auto;
    text-align: right;
  }
  .site-header .humburger-menu{
	  float: none !important;
    margin: 0 !important;
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }

  /* drawer LEFT + fixes anti “morceau bloqué” */
  .site-header .main-menu{
    position: fixed;
    top: 0;
    left: 0;
    right: auto !important;        /* important vs styles legacy */
    height: 100vh;
    width: min(92vw, 380px);
    background: #fff;
    border-right: 1px solid rgba(15,23,42,.12);
    box-shadow: 18px 0 45px rgba(15,23,42,.20);

    transform: translate3d(-105%, 0, 0);
    transition: transform .18s ease;
    z-index: 5000;

    overflow: hidden;
    will-change: transform;
    backface-visibility: hidden;
  }

  .site-header .main-menu.is-open{
    transform: translate3d(0, 0, 0);
  }

  /* zone scroll */
  .site-header .main-menu .container{
    width: 100% !important;
    padding: 14px 14px 18px;
    height: 100%;
    overflow: auto;
  }

  .site-header .nav-list{
    list-style:none;
    margin:0;
    padding:0;
    display:block;
  }

  .site-header .nav-list > li{ position:relative; }

  .site-header .nav-list > li > a{
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding: 12px 12px;
    border-radius: 12px;
    background: rgba(15,23,42,.03);
    margin-bottom: 8px;
    color:#0f172a;
    font-weight:800;
    text-decoration:none;
  }

  /* accordéon */
  .site-header .submenu{
    position: static;
    min-width: 0;
    max-width: 100%;
    background: transparent;
    box-shadow: none;
    border-radius: 0;
    padding: 0 0 10px;

    opacity: 1;
    visibility: visible;
    transform: none;

    display: none;
  }

  .site-header .submenu a{
    display:block;
    background: rgba(14,165,233,.10);
    color: var(--primary);
    border-radius: 12px;
    margin: 6px 0 0;
    padding: 10px 12px;
    text-decoration:none;
    font-weight:700;
    line-height:1.25;
  }

  .site-header .submenu a:hover,
  .site-header .submenu a:focus{
    background: rgba(14,165,233,.16);
    color: var(--primary);
  }

  .site-header .has-submenu.is-open > .submenu{
    display:block;
  }

  /* caret mobile */
  .site-header .has-submenu > a::after{
    content:"";
    width:0;height:0;
    border-left:6px solid transparent;
    border-right:6px solid transparent;
    border-top:7px solid rgba(11,58,106,.70);
    transition: transform .15s ease;
  }
  .site-header .has-submenu.is-open > a::after{
    transform: rotate(180deg);
  }
}

/* overlay */
.nav-overlay{
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.40);
  opacity: 0;
  visibility: hidden;
  transition: opacity .18s ease, visibility .18s ease;
  z-index: 4500;
}
.nav-overlay.is-open{
  opacity: 1;
  visibility: visible;
}
body.nav-lock{
  overflow: hidden;
  overflow-x: hidden; 
}

/* ===== PRIME NAISSANCE : loader + résultat formulaire ===== */

/* Loader : on utilise ton overlay, mais avec contenu centré + texte */
.box.form .loader{
  display:none; /* déjà géré par ton JS */
}

.box.form .loader .loader-inner{
  position:absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  text-align:center;
  width: min(92%, 420px);
}

.box.form .loader img{
  position: static;
  transform: none;
  display: inline-block;
}

.box.form .loader .loader-text{
  margin: 12px 0 0;
  font-weight: 700;
  color: var(--text);
  font-size: 14px;
}

/* État résultat : la box change d'apparence */
.box.form.is-result{
  background: var(--surface);
  border: var(--border);
  box-shadow: var(--shadow-soft);
}

.box.form.is-result .heading-icon{
  display:none; /* optionnel: on masque le titre du formulaire */
}

.eligibility-result h3{
  margin: 0 0 10px;
  font-size: 20px;
  color: var(--primary);
}

.eligibility-result p{
  margin: 0 0 16px;
  color: var(--text-muted);
}

/* CTA + cartouche */
.eligibility-cta{
  text-align:center;
}

.eligibility-call{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: min(320px, 100%);
  text-decoration: none !important;
  border-radius: 999px;
}

.eligibility-cartouche-wrap{
  text-align:center;
  margin-top: 8px;
}

.eligibility-cartouche{
  max-width: 70%;
  height: auto;
  margin: 0 auto;
  border-radius: 0;
}

/* Desktop : après clic, 3242 remplace APPELER */
@media (min-width: 1151px){
  .eligibility-call.is-revealed .btn-text{ display:none; }
  .eligibility-call.is-revealed .btn-number{
    display:inline;
    font-weight: 900;
    letter-spacing: .6px;
  }
}

/* Mobile/Tablet : on garde APPELER (et tel: déclenche l'appel) */
@media (max-width: 1150px){
  .eligibility-call .btn-number{ display:none !important; }
}