/**
 * Page page-em — bloc deux colonnes (intro + offre)
 * Remplace Foundation grid / equalizer pour cette section.
 */
/* Titres axes : dans .titre (pas un descendant .card). */
#em h2.titre {
    font-size: 1.5rem !important;
    color: #054f88 !important;
}

#em h2 {
    color: #054f88 !important; font-weight: 800 !important;
}
#em #axescreation .icone img {width: 35%; height: auto; border-radius: 100%;}

 #em  .card {border-radius: 15px !important;}

 #em .bloc-innova {
    background-color: #31132D;
    color: #fff;
}
#em .bloc-gradiant {
    background: rgb(148, 49, 114);
    background: linear-gradient(90deg, rgba(148, 49, 114, 1) 9%, rgba(181, 67, 178, 1) 49%, rgba(141, 86, 169, 1) 95%);
}
#em p {margin-bottom: 1rem;}
#em p:last-child {margin-bottom: 0rem;}
#em #services .fond-bleu h3 {color: white !important;}
/*
#em #autres-services .card {
    background-color: #1b75bc;
    color: white !important;
}*/


 #intro-em h2 {color: #0a4573 !important;}
 #em .contact-intro h2 {color: #0a4573 !important; }
 #em .contact-intro {padding-left: 0rem;}
 #em .contact-intro {padding-right: 0rem;}
 #em .contact-formulaire {padding-left: 0rem;}
 #em .contact-formulaire {padding-right: 0rem;}
 #em .contact-formulaire h3 {color: #0a4573 !important;}

#em #bienvenue-card p {
  font-size: 1.25rem;

}
#em #equipe-em .card {
    border-radius: 20px !important;
}

/* #equipe-em : icône courriel en bas de chaque carte 
#em #equipe-em .em-equipe-grille > .column {
	display: flex;
	flex-direction: column;
}
#em #equipe-em .em-equipe-grille .card {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	height: 100%;
	min-height: 0;
}
#em #equipe-em .em-equipe-grille .card > div:first-child {
	flex-shrink: 0;
}
#em #equipe-em .em-equipe-grille .card > [data-equalizer-watch] {
	flex: 1 1 auto;
	display: flex !important;
	flex-direction: column !important;
	justify-content: space-between !important;
	min-height: 0;
}*/

#em #offreservices .card {
  background-color: #1b75bc;
  color: white !important;
}
#em #offreservices .card  a{
  text-decoration: underline;
  color: white !important;
  font-weight: semibold;
}

#em #offreservices .card  a:hover{
  text-decoration: none;
}

#em #offreservices .card-section-double ul {
    margin-left: 1.25rem !important;
    list-style-type: disc;
}

 #cel .card{
  background-color: #254A66;
  color: white !important;
}
 #cer .card{
	background-color: #2A5D97;
	color: white !important;
  }

/* Wrapper : garder large-12 columns dans le PHP — le .row Foundation parent est en flex ;
   sans pleine largeur, ce bloc se place en colonne étroite à côté de #photos. */

/* Cartes « services » (#services, page EM) :
   — ordre DOM : titre puis description (lecteurs d’écran) ;
   — visuel : column-reverse (description au-dessus) ;
   — même hauteur de ligne : la zone blanche flex-grow, la bande titre flex: 0. */
#em #services .em-services-card-a11y.flxgrid-stack-end {
	flex-direction: column-reverse;
	min-height: 0;
}

#em #services .em-services-card-a11y__heading h3 {
	margin-top: 0;
	margin-bottom: 0;
}

/* Carte remplit la cellule .flxgrid__item (ligne = même hauteur). */
#em #services .flxgrid__item > .card.em-services-card-a11y.flxgrid-stack-end {
	flex: 1 1 auto;
	width: 100%;
	min-height: 0;
}

/* Mep donne .flxgrid-card-footer un flex-grow — ici on veut la bande titre fixe ; le corps grandit. */
#em #services .em-services-card-a11y.flxgrid-stack-end > .em-services-card-a11y__heading.flxgrid-card-footer {
	flex: 0 0 auto;
}

/* Zone description (corps visuel au-dessus) : prend tout l’espace restant = blocs blancs alignés dans la ligne. */
#em #services .em-services-card-a11y.flxgrid-stack-end > .em-services-card-a11y__body {
	flex: 1 1 auto;
	min-height: 0;
	width: 100%;
	box-sizing: border-box;
}

.em-info-wrapper {
	width: 100%;
}

.em-info-row {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.em-info-col {
	min-width: 0;
}

/* Tablette et bureau : deux colonnes, même hauteur, contenu centré verticalement */
@media (min-width: 768px) {
	
	
	.em-info-row {
		flex-direction: row;
		align-items: stretch;
		gap: 2rem;
	}

	.em-info-col {
		flex: 1 1 50%;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.em-info-card {
		width: 100%;
	}
}
/* Rangées flex réutilisables (noms en tirets simples, sans double tiret ni underscore) */
.flex-cols-wrap {
	width: 100%;
}

.flex-cols-row {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.flex-cols-col {
	min-width: 0;
}

@media (min-width: 768px) {
	
	.flex-cols-split-40-60 {
		flex-direction: row;
		align-items: stretch;
		gap: 2rem;
	}

	.flex-cols-split-40-60 .flex-cols-col {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	.flex-cols-split-40-60 .flex-cols-col-40 {
		flex: 0 0 40%;
		max-width: 40%;
	}

	.flex-cols-split-40-60 .flex-cols-col-60 {
		flex: 0 0 60%;
		max-width: 60%;
	}

	.flex-cols-split-40-60 .flex-cols-inner {
		width: 100%;
	}
}

@media only screen and (max-width: 600px) {
	#em #axescreation .icone img {width: 50%; height: auto; border-radius: 100%;}

	#em .contact-formulaire {padding-left: 2rem !important;}
	#em .contact-formulaire{padding-right: 2rem !important;}
	#em .contact-intro {padding-left: 2rem !important;}
	#em .contact-intro {padding-right: 2rem !important;}
    #em #photos div.column:nth-child(4) {
      display: none;
    }
  
    #em #photos div.column:nth-child(3) {
      display: none;
    }
  }