/*
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
*/


/* ----------- Fonts ----------- */
h1, h2, h3 {
	font-family: "REM", sans-serif;
	font-style: normal;
	line-height: 1.2em;
}

h1 {
	font-size: 55px !important;
	font-weight: bold;
	color: white;
}

h2 {
	font-size: 33px !important;
	font-weight: 200;
	color: #6F6E6E;
	text-transform: uppercase;
}

h3 {
	font-size: 30px !important;
	font-weight: bold;
}

@media (max-width:980px) {
h1 {
	font-size: 40px !important;
	font-weight: bold;
	color: white;
}
h2 {
		font-size: 26px !important;}
}


p, li {
	font-family: "REM", sans-serif;
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: 1.2em;
	color: black;
}

a {
	font-family: "REM", sans-serif;
	font-size: 15px;
	font-style: normal;
	cursor: pointer;
	color: black;
}

/* Règle spécifique car Wordpress force le underline dans le a */
body a {
	text-decoration: none;
}





/* ----------- Menu Header & Footer ----------- */

/* Header */
.et_pb_menu .et_pb_menu__wrap {
	align-items: flex-end; /* colle les éléments en bas */
}

#menu-header li a {
	font-size: 17px !important;
	font-family: "REM", sans-serif;
	font-weight: bold !important;
	color: black;
	cursor: pointer;
}

#menu-header li a:hover{
	color: #F2B80C !important;
}

#menu-header .current-menu-item a {
	color: #EF7C00 !important;
	text-decoration: none;
}

#menu-header .sub-menu {
	background-color: white !important;
	border-top: 3px solid #EF7C00;
	width: 400px;
}

#menu-header .sub-menu li a {
	width: 360px;
	border-bottom: 1px solid #F2F2F2
}

#menu-header .contact-menu {
	border-radius: 5px;
	height: 30px;
	margin-top: 23px;
	padding: 10px 20px;
	background-color: #FDC00D;
	transition: background-color 0.3s ease;
}

#menu-header .contact-menu:hover  {
	background-color: #EF7C00;
}

#menu-header .contact-menu a {
	color: white !important;
	font-size: 14px !important;
	font-weight: 900 !important;
	padding: 0;
}


#menu-header .contact-menu a:hover {
	color: #FFFFFF !important;
	opacity: 100%;
	text-decoration: none;
}
/* menu sur mobile */
ul#mobile_menu1 {
    background-color: white !important;
    border-top: 3px solid #EF7C01;
}
.et_pb_menu_0_tb_header .mobile_nav .mobile_menu_bar:before {
    color: #ecab0c!important;
}


/* Footer */
.swiper-certifications .dipl_logo_image {
    max-width: 100px;
}

/* Module Blog  */
.realisations-footer .et_pb_post {
	background: none;
	border: 0px;
	max-width: 30%;
    display: inline-block;
    margin-right: 3%;
}

.realisations-footer .et_pb_post:hover .entry-featured-image-url img {
    border: solid 3px white;
}

.realisations-footer .entry-title {
	color: white;
	font-size: 20px !important;
	font-weight: bold;
}

.realisations-footer .more-link {
	font-size: 0;
	display: inline-flex !important; 
	align-items: center;
	gap: 5px;
}

.realisations-footer .more-link::before {
	content: "Voir la réalisation";
	font-size: 14px;
	color: white;
	text-decoration: underline;
}

.realisations-footer .et_pb_post:hover .more-link::before {
	font-weight: bold;
	text-decoration: none;
}

.realisations-footer .more-link::after {
	content: "›";
	color: white;
	font-size: 30px;
	text-decoration: none;
	margin-top: -5px;

}

.realisations-footer .more-link:hover {
	text-decoration: none;
}

@media(max-width:980px) {
.realisations-footer .et_pb_post {
    background: none;
    border: 0px;
    max-width: 100%!important;
}
}

.titre-pointille {
	display: flex;
	align-items: center;
	gap: 10px;
}

.titre-pointille h2 {
	margin: 0;
	padding: 0;
	font-size: 22px !important;
}

.titre-pointille hr {
	flex-grow: 1;
	border: none;
	border-top: 1px dashed #C4C4C4;
}



.menu-footer p {
	padding: 0px;
}

.menu-footer a {
	color: black;
	font-size: 17px;
}

.menu-footer a:hover {
	color: #EF7C00;
	font-weight: bold;
	text-decoration: none;
}

.menu-footer hr {
	border: none;
	border-top: 1px dashed #000; /* noir, à adapter à ta couleur */
	margin: 10px 0; /* espace autour du hr, ajustable */
}


.section-legale p, .section-legale a {
	font-size: 11px;
	color: #6F6E6E;
}


















/* ----------- Components boutons ----------- */
/* Base commune */
.et_pb_button, .et_pb_button:hover, .et_pb_module .et_pb_button:hover  {
	border: 0px;
}

.et_pb_button:hover:after {
	display: none;
}


.yellow-button,
.orange-button,
.yellow-to-white-button,
.yellow-to-grey-button,
.orange-to-white-button,
.orange-to-grey-button {
	font-family: "REM", sans-serif;
	font-size: 15px;
	font-weight: 800;
	border-radius: 6px;
	padding: 10px 20px !important;
	color: white;
	cursor: pointer;
	transition: all 0.3s ease;
	text-transform: uppercase;
}


/* Jaune */
.yellow-button, .yellow-to-grey-button {
	background-color: #FDC00D !important;
}

.yellow-button:hover {
	background-color: #EF7C00 !important;
	color: white !important;
	text-decoration: none;
}

.yellow-to-white-button {
	background-color: #FDC00D !important;
	border: solid 3px #FDC00D !important;
}

.yellow-to-white-button:hover {
	background-color: transparent !important;
	color: white !important;
	border: solid 3px white !important;
	text-decoration: none;
}

.yellow-to-grey-button:hover {
	background-color: #6F6E6E !important;
	color: white !important;
	text-decoration: none;
}


/* Orange */
.orange-button, .orange-to-grey-button {
	background-color: #EF7C00 !important;
}

.orange-button:hover {
	background-color: #FDC00D !important;
	color: white !important;
	text-decoration: none;
}

.orange-to-white-button {
	background-color: #EF7C00 !important;
	border: solid 3px #EF7C00 !important;
}

.orange-to-white-button:hover {
	background-color: transparent !important;
	color: white !important;
	border: solid 3px white !important;
	text-decoration: none;
}

.orange-to-grey-button:hover {
	background-color: #6F6E6E !important;
	color: white !important;
	text-decoration: none;
}



/* Bouton formulaire contact */
input#gform_submit_button_1 {
	font-family: "REM", sans-serif;
	font-size: 15px;
	font-weight: 800;
	background-color: #FDC00D;
	border-radius: 6px;
	padding: 15px 20px !important;
	color: white;
	cursor: pointer;
	transition: all 0.3s ease;
	text-transform: uppercase;
}

input#gform_submit_button_1:hover {
	background-color: #EF7C00 !important;
	color: white !important;
	text-decoration: none !important;
}






/* ----------- Autres Components ----------- */
/* Alignement de logos + textes */
/* Alignement de logos + textes */
.ligne-logos {
	display: flex;
	justify-content: space-between;
	align-items: flex-start; /* 🔥 Aligne en haut */
	flex-wrap: wrap;
	gap: 10px; /* plus propre que space-between */
	margin-bottom: 30px;
}

.logo-item {
	text-align: center;
	flex: 1 1 18%; /* 5 blocs sur une ligne */
	max-width: 18%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.logo-item a {
	text-decoration: none;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/*.logo-item img {
	width: 100%;
	max-width: 120px;
	height: auto;
	margin-bottom: 10px;
}*/
.logo-item img {
	width: 120px;
	height: 120px;
	object-fit: contain; /* évite la déformation */
	display: block;
	margin-bottom: 10px;
}


@media (max-width: 980px) {
	.ligne-logos {
		justify-content: center;
		gap: 40px;
	}

	.logo-item {
		flex: 0 0 50%;
		max-width: 40%;
		margin-bottom: 20px;
	}
}


/* Alignements de plusieurs boutons */
.btn-wrapper {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}

.btn-wrapper .et_pb_button {
	margin: 0;
}

@media (max-width: 980px) {
	.btn-wrapper {
		flex-direction: column;
		align-items: center;
	}
}






/* ----------- Page Accueil ----------- */
.colonne-secteur-activite {
  position: relative;
  overflow: hidden;
}

.colonne-secteur-activite .et_pb_text {
  position: relative;
  z-index: 2;
}

.colonne-secteur-activite::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(253, 192, 13, 0.78);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  z-index: 1;
}

.colonne-secteur-activite:hover::before {
  opacity: 1;
}

.texte-vignette-activite p {
	padding :150px 20px 50px 20px!important;
}



@media(min-width:980px){
.et_pb_row_3 .image-secteurs-home {
	height: 280px!important;
}
}
@media (max-width:980px){
.et_pb_row.et_pb_row_3.image-secteurs-home.et_pb_equal_columns.et_pb_gutters1.et_pb_row_5col {
    height: 100%;
}
}

/* ----------- Page Secteurs d'Activité ----------- */
@media (max-width: 1055px) {
	.row-secteur-activite {
		margin-left: 0px;
	}
	
	.row-secteur-activite-2 {
		margin-right: 0px;
	}
}




/* ----------- Page Contact ----------- */
.gfield input, .gfield textarea  {
    border: 0px !important;
}



/* ----------- Page Réalisations ----------- */
.realisations-blog .et_pb_post {
	background: none;
	border: 0px;
	padding: 40px;
	border-radius: 7px;
	transition: background-color 0.3s ease;
}

.realisations-blog .et_pb_post:hover {
	background-color: #F3F3F3;
}

.realisations-blog .et_pb_image_container, .realisations-blog .entry-featured-image-url {
	margin-bottom: 20px;
}

.realisations-blog .entry-title {
	color: #6F6E6E;
	font-size: 18px !important;
	font-weight: bold;
	margin-bottom: 20px;
	transition: color 0.3s ease;
}

.realisations-blog .et_pb_post:hover .entry-title {
	color: black !important;
}

.realisations-blog .more-link {
	font-size: 0;
}

.realisations-blog .more-link::before {
	content: "VOIR LA RÉALISATION";
	font-size: 14px;
	font-weight: 900;
	color: white;
	background-color: #C4C4C4;
	padding: 10px 20px;
	border-radius: 7px;
	transition: background-color 0.3s ease;
}

.realisations-blog .et_pb_post:hover .more-link::before {
	background-color: #EF7C00;
}

.realisations-blog .more-link:hover {
	text-decoration: none;
}


/* ----------- Page Article Réalisation ----------- */
h1.entry-title {
	font-size: 30px !important;
}


/* ------------ Alignements colonnes texte + image background en 1400 px large -----------*/
/* Colonne gauche : on ajoute un padding qui aligne le contenu sur une trame max 1400px */
/* Mobile / petit écran */
.col-texte-trame{
  padding-left: 10% !important;
  box-sizing: border-box;
  margin-bottom:0px!important;
}

/* À partir de 1400px */
@media (min-width: 1400px){
  .col-texte-trame{
    padding-left: calc((100vw - 1400px)/2 + 70px) !important;
  }
}