/*
Theme Name: NOM A DEFINIR
Theme URI: http://www.wpbeaverbuilder.com
Version: 1.0
Description: THEME NOM A DEFINIR
Author: Agence 71
Author URI: https://agence71.fr
template: bb-theme
*/

/* Add your custom styles here... */ 

/*========================
*
* 				VARIABLES
* 
* ======================*/

:root {
	/* COULEURS */
	--blanc: #fff;
	--noir: #000;
	--brun:#48403C;
	--dore-1: #CBB783;
	--dore-2: #F0EADA;


	/* FONT_WEIGHT */
	--thin: 100;
	--extra-light: 200;
	--light: 300;
	--regular: 400;
	--medium: 500;
	--semi-bold: 600;
	--bold: 700;
	--extra-bold: 800;
	--black: 900;

	/* FONT FAMILY */
	--merri: "Merriweather", serif;
	--scandia: "scandia-web", sans-serif;


	/* FONT SIZE */
	--250px: 250px;
	--80px: 80px;
	--70px: 70px; 
	--60px: 60px;
	--50px: 50px;
	--40px: 40px; 
	--32px: 32px;
	--30px: 30px;
	--28px: 28px;
	--25px: 25px;
	--22px: 22px;
	--20px: 20px;
	--18px: 18px;
	--16px: 16px;
	--14px: 14px;
	--12px: 12px;
}

@media all and (max-width: 1024px) {
	:root {
		--250px: 225px;
		--80px: 72px;
		--70px: 63px; 
		--60px: 54px; 
		--50px: 45px;
		--40px: 36px; 
		--32px: 29px;
		--30px: 27px;
		--28px: 25px;
		--25px: 23px;
		--22px: 20px; 
		--20px: 18px;
		--18px: 16px;
		--16px: 14px;
		--14px: 13px;
		--12px: 11px;

	}

}

@media all and (max-width: 768px) {
	:root {
		--250px: 203px;
		--80px: 50px;
		--70px: 44px; 
		--60px: 38px; 
		--50px: 41px;
		--40px: 33px; 
		--32px: 26px;
		--30px: 24px;
		--28px: 22px;
		--25px: 20px;
		--22px: 18px; 
		--20px: 16px;
		--18px: 15px;
		--16px: 15px;
		--14px: 12px;
		--12px: 10px;
	}
}


/*========================
 * 
 * 				TARTEAUCITRON
 * 
 * ======================*/

button#tarteaucitronManager img {
  content: url(https://agence71.fr/rgpd.png);
  width: 25px !important;
  height: 25px !important;
  transition: 200ms linear !important;
}

div#tarteaucitronIcon button#tarteaucitronManager {
  background: #212121;
  margin-left: 8px;
  font-size: 1.3px !important;
  padding: 10px !important;
  border-radius: 10em 10em 20em 20em;
  transition: 150ms linear !important;
  margin: 0 0 12px 20px !important;
}

button#tarteaucitronManager:hover img {
  transform: scale(1.1) !important;
}

.tarteaucitron-magic-block-recaptcha {
  position: fixed !important;
  z-index: 99999;
  bottom: 0;
}

.grecaptcha-badge {
  display: none;
}

body div#tarteaucitronRoot div#tarteaucitronAlertBig {
  max-width: 450px !important;
}

#tarteaucitronDisclaimerAlert {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

#tarteaucitronDisclaimerAlert:before {
  content: 'Cookies ?' !important;
  display: inline-block;
  font-size: 20px;
  font-weight: bold;
}

#tarteaucitronAlertBig:before {
  content: '' !important;
  display: inline-block;
  width: 120px;
  height: 80px;
  background-image: url('https://www.marteau-solutions-bois.fr/fr/wp-content/uploads/2021/04/Logo-blanc.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}

.tarteaucitronH1 {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  gap: 20px;
}

.tarteaucitronH1::before {
  content: '';
  display: block;
  width: 120px;
  height: 80px;
  background-image: url('https://www.marteau-solutions-bois.fr/fr/wp-content/uploads/2021/04/Logo-blanc.png');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}

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

html body div#tarteaucitronRoot button#tarteaucitronPersonalize2 {
  font-size: 18px !important;
  font-weight: bold;
  animation: fade 1s infinite;
}

@keyframes fade {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.85;
  }
}








/*========================
* 
* 				GENERAL
* 
* ======================*/

/*========== TOOLSET LIGTHBOX ==========*/

.toolset-dialog {
	width: 70% !important;
	left: 50px !important;
	background: #23282deb !important;
	padding: 50px !important;
	border-radius: 10px !important;
	overflow-y: scroll;
}

.toolset-dialog button {
	cursor: pointer !important;
	margin: 4px;
	padding: 15px;
	background: #135e96;
	transition: all 0.2s linear;
}

.ui-dialog-titlebar-close {
	background: red !important;
}

.ui-dialog-titlebar-close:hover {
	color: red;
}

.js-toolset-collapsible__toggle {
	background: #595959 !important;
}

.toolset-dialog button:hover {
	background: white !important;
	color: #135e96;
	transition: all 0.2s linear;
}

/*========== Si Internet Explorer ==========*/

html.internet-explorer body.ie {
	margin-top: 40px;
}

html.internet-explorer body.ie:after {
	content: "Vous utilisez actuellement Internet Explorer, certains éléments peuvent ne pas s'afficher correctement. Nous vous recommandons d'utiliser un autre navigateur.";
	position: absolute;
	padding: 10px;
	top: 0px;
	color: var(--blanc);
	background-color: #dd0000;
	width: 100%;
	vertical-align: middle;
	text-align: center;
}

/* ========== */

body {
	width: 100vw;
	overflow-x: hidden;
	background-color: #fff !important;
	font-family: var(--scandia);
}

.nowrap {
	white-space: nowrap;
}

.devant {
	z-index: 99;
	position: relative;
}

.nowrap {
	white-space: nowrap;
}

.maxwidth50 .fl-col-content {
	max-width: 50%;
}

@media all and (max-width: 768px) {
	.maxwidth50 .fl-col-content {
		width: 100%;
		max-width: inherit;
	}
}

.maxwidth1600px .fl-col-content {
	max-width: 1600px;
}

.maxwidth1200px .fl-col-content {
	max-width: 1200px;
}

.maxwidth1000px .fl-col-content {
	max-width: 1000px;
}

.maxwidth900px .fl-col-content {
	max-width: 900px;
}

.maxwidth800px .fl-col-content {
	max-width: 800px;
}

.maxwidth600px .fl-col-content {
	max-width: 600px;
}

.maxwidth400px .fl-col-content {
	max-width: 400px;
}

.droite .fl-col-content {
	margin-left: auto;
}

.centrer .fl-col-content {
	margin-left: auto;
	margin-right: auto;
}

.ultra-light {
	font-weight: 200;
}

.light {
	font-weight: 300;
}

.regular {
	font-weight: 400;
}

.medium {
	font-weight: 500;
}

.bold {
	font-weight: 700;
}

.black {
	font-weight: 900;
}

.italic {
	font-style: italic;
}

.underline {
	text-decoration: underline;
}

.normal {
	font-style: normal;
}

.lowercase {
	text-transform: lowercase !important;
}

.capitalize {
	text-transform: capitalize !important;
}

/*========================
* 
* 				TYPO
* 
* ======================*/

.titre-1 {
	font-family: var(--merri);
	font-weight: bold;
	font-size: var(--80px);
	color: var(--blanc);
	line-height: 95px;
}

.titre-2 {
	font-family: var(--merri);
	font-weight: var(--regular);
	font-size: var(--60px);
	color: var(--brun);
	line-height: var(--70px);
}

.titre-3 {
	font-family: var(--scandia);
	font-weight: var(--regular);
	font-size: var(--20px);
	line-height: 30px;
	color: var(--brun);
	text-transform: uppercase; 
}

@media screen and (max-width: 768px){
	.titre-1 {
		font-size: var(--40px);
		line-height: 40px;
	}
	.titre-2 {
		font-size: var(--30px);
		line-height: 30px;
	}
}
.contenu-1 *,
.contenu-1 a,
.contenu-1 p {
	font-family: var(--scandia)!important;
	font-weight: var(--regular);
	font-size: var(--20px);
	line-height: 30px;
	color: var(--brun);
}

.contenu-2 *,
.contenu-2 a,
.contenu-2 p {
	font-family: var(--scandia) !important;
	font-weight: 500;
	font-size: var(--28px);
	line-height: 35px;
	color: var(--brun);
	transition: all linear 300ms;
}

.contenu-1 a:hover,
.contenu-2 a:hover {
	color: var(--dore-1);
	transition: all linear 300ms;
}


.titre-separateur .uabb-divider-content .uabb-divider-text {
	font-family: var(--scandia) !important;
	font-weight: var(--regular);
	font-size: var(--20px);
	line-height: 30px;
	text-transform: uppercase;
}

.titre-separateur .uabb-separator-line {
	vertical-align: baseline; 
}

.separateur-slider {
	position:relative;
	z-index:2;
}

@media screen and (max-width: 1000px){
	.separateur-slider .fl-module-content {
		margin-left: 20px;
	}

	.col-height {
		min-height: 110px; 
	}
}

.separateur-slider .uabb-module-content h3 {
	color: var(--blanc) !important;
}
.separateur-slider .uabb-module-content span {
	border-color: var(--blanc) !important;
}



/*===== EXEMPLE =====*/

/* --- Exemple */

/*========================
* 
* 				CTA
* 
* ======================*/
/* --- Cta-lanceur */
.cta-lanceur {
	background: var(--dore-2);
}

.cta-lanceur .fl-module-content .uabb-module-content a {
	background-color: var(--brun) !important;
	width: 100%;
	height: 100%; 
	border-radius: 0 !important; 
	border-right: 1px solid var(--dore-1) !important;
	display: flex;
	flex-direction: column;
	align-content: center;
	justify-content: center;
	min-height: 135px; 
	transition: all linear 300ms;
}

.cta-lanceur .fl-module-content .uabb-module-content a:hover {
	transform: translateY(-20px);
	background-color: var(--dore-1) !important;
	transition: all linear 300ms;
}

@media screen and (max-width: 769px){
	.cta-lanceur .fl-module-content .uabb-module-content a:hover{
		transform: none; 
	}
	.cta-lanceur .fl-module-content .uabb-module-content a{
		min-height: 110px;

	}

	.cta-lanceur .fl-module-content .uabb-module-content {
		border-top: 1px solid var(--dore-1)
	}
}

.cta-lanceur .fl-module-content .uabb-module-content a span {
	font-family: var(--scandia);
	font-weight: bold;
	font-size: var(--20px);
	color: var(--blanc);
	text-transform: uppercase;
	line-height: 25px;
}

/* --- cta-contact */


.cta-contact .fl-module-content .uabb-module-content a {
	background: transparent !important; 
	padding-left: 0; 
}

.cta-contact .fl-module-content .uabb-module-content a span {
	font-family: var(--scandia);
	font-weight: bold;
	font-size: 20px;
	line-height: 34px;
	color: var(--dore-1) !important;
}

/* --- cta-dore */
.cta-dore .fl-module-content .uabb-module-content a {
	border: 3px solid var(--dore-1) !important;
	border-radius: 50px !important;
	background-color: var(--dore-1) !important;
	transition: all linear 300ms;
	padding: 25px 40px;
}

.cta-dore .fl-module-content .uabb-module-content a:hover {
	border: 3px solid var(--dore-1);
	border-radius: 50px;
	background-color: var(--blanc) !important;
	transition: all linear 300ms;
}


.cta-dore .fl-module-content .uabb-module-content a span {
	font-family: var(--scandia);
	font-weight: var(--medium);
	font-size: var(--20px);
	color: var(--blanc)!important;
	text-transform: uppercase;
	transition: all linear 300ms;
}

.cta-dore .fl-module-content .uabb-module-content a:hover span {
	color: var(--dore-1)!important;
	transition: all linear 300ms;
}

@media screen and (max-width: 769px){
	.cta-dore .fl-module-content .uabb-module-content a {
		padding: 15px 30px;
	}
	.cta-dore .fl-module-content .uabb-module-content a span{
		font-size: var(--18px);
	}
}
/*===== EXEMPLE =====*/

/* --- Exemple */

/*========================
* 
* 				HEADER
* 
* ======================*/
/* --- bandeau */
.text-menu {
	display: flex; 
	gap: 20px;
	flex-direction: row; 
	justify-content: flex-end;
}

.text-menu p {
	margin-bottom: 0; 
}

.text-menu a {
	font-family: var(--scandia);
	font-weight: bold;
	font-size: var(--16px);
	color: var(--blanc);
	text-transform: uppercase; 
	transition: all linear 300ms;
}

.text-menu a:hover {
	transition: all linear 300ms;
	color: var(--dore-1);
	text-decoration: none; 
}

.rangee-padding > .fl-row-content-wrap {
	padding-left: 200px; 
}

@media screen and (max-width: 1000px){
	.rangee-padding > .fl-row-content-wrap {
		padding-left: 0px; 
	}
}



.border-dore {
	position: relative;
}

.menu-open .border-dore::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 200px;
	width: 2px;
	height: 100%;
	background-color: var(--dore-1);
	z-index: 2; 
}



.border-dore::before {
	display: none;
}

.menu-open .border-dore::before {
	display: block;
}

.menu-open .border-dore {
	background-color: var(--brun) !important; 
}

.menu-open .bandeau-transparent .fl-row-content-wrap {
	border-bottom: none;



}
.bandeau-transparent .fl-row-content-wrap {
	border-bottom: 2px solid var(--dore-1);
	margin-left: 200px; 
	padding-left: 0px;
}

@media screen and (max-width: 1000px){
	.bandeau-transparent .fl-row-content-wrap {
		border-bottom:none;
		margin-left: 0px; 
		padding-left: 0px;
	}

	.menu-open .border-dore::before {
		display: none;
	}

}




/* --- sticky */

.menu-sticky {
	position: fixed;
	top: -10px;
	left: 20px;
	width: auto;
	z-index: 9999;
	cursor: pointer;
}


@media screen and (max-width: 1000px){
	.menu-sticky {
		position: fixed;
		top: -5px;
		right: -10px;
		left: auto; 
		width: auto;
		z-index: 9999;
	}

	.menu-sticky img {
		width: 50px!important;
		height: 50px;
	}
}
body:not(.fl-builder-edit) 
.menu-burger-hover,
body:not(.fl-builder-edit) 
.burger-cross {
	display: none;
}

body:not(.fl-builder-edit) .menu-hidden-responsive,
body:not(.fl-builder-edit) .menu-hidden {
	display: none;
}


/* Quand le menu est ouvert (côté visiteur) */
body.menu-open .menu-burger {
	display: none;
}


body.menu-open .menu-burger-hover {
	display: none !important;
}

.menu-burger:hover  {
	display: none;
}

.menu-burger:hover + .menu-burger-hover {
	display: block;
}

body.menu-open .burger-cross {
	display: block;
}
/* Ajout padding pour compenser la hauteur du logo en absolute */
body:not(.fl-builder-edit) .menu-hidden .fl-row-content-wrap {
	padding-top: 120px; 
}
body:not(.fl-builder-edit).menu-open .menu-hidden-responsive,
body:not(.fl-builder-edit).menu-open .menu-hidden {
	display: block;
	position: fixed;      /* pour le superposer à la page */
	top: 0;
	left: 0;
	width: 100vw;         /* largeur pleine */
	height: 100dvh;
	background: #fff;     /* ou une couleur de fond que tu veux */
	z-index: 9999;        /* au-dessus du contenu */
	overflow-y: auto;     /* si le contenu dépasse */
	animation: slideIn 0.6s ease forwards; /* petit effet */
}

.menu-hidden-responsive {
	background-color: var(--brun) !important;
}
.menu-hidden-responsive .fl-row-content-wrap {
	height: 100%; 
}

.menu-hidden-responsive .fl-row-content-wrap .fl-row-content{
	position: static !important;
}


@media screen and (max-width: 1200px){
	body:not(.fl-builder-edit).menu-open .menu-hidden {
		display: none ; 
	}
}

@media screen and (min-width: 1200px){
	body:not(.fl-builder-edit).menu-open .menu-hidden-responsive {
		display: none ; 
	}
}


/* Animation d'apparition depuis la gauche */
@keyframes slideIn {
	from {
		transform: translateX(-100%);
	}
	to {
		transform: translateX(0);
	}
}

/* Quand on le ferme (si tu veux une anim inverse) */
body:not(.menu-open) .menu-hidden-responsive,
body:not(.menu-open) .menu-hidden {
	animation: slideOut 0.4s ease forwards;
}

@keyframes slideOut {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-100%);
	}
}

/*------ Menu Responsive ---*/

.menu-hidden .text-menu-hidden {
	right: 30px;
}

.menu-hidden .text-menu-hidden,.menu-hidden .logo-menu-hidden {
	position: absolute;
	top: 50px;
	margin-top: 0;
}

.menu-hidden-responsive .text-menu-hidden {
    position: fixed;
    bottom: 50px;
    left: 30px;
    margin: 0;
    text-align: left !important;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}

.menu-hidden-responsive .logo-menu-hidden {
	position: absolute;
	top: 20px;
	left: 20px;
	z-index: 999999;
}

.menu-hidden-responsive:has(.uabb-menu-responsive ul#menu-menu-responsive li.uabb-active .sub-menu)
.text-menu-hidden {
	bottom: -50px;
}



.text-menu p {
	position: relative;
	z-index: 99;
}

.menu-hidden-responsive .fl-col {
	width: 100%; 
}

.menu-hidden-responsive .uabb-menu-responsive .uabb-menu-toggle {
	display: none; 
}


.menu-hidden-responsive .uabb-menu-responsive ul#menu-menu-responsive li a span {
	transition: all linear 300ms;
	font-family: var(--scandia);
	font-weight: 500;
	font-size: var(--40px);
	color: var(--blanc);
}

.menu-hidden-responsive .uabb-menu-responsive ul#menu-menu-responsive li a:hover span {
	transition: all linear 300ms;
	color: var(--dore-1);
}

.menu-hidden-responsive .uabb-menu-responsive ul#menu-menu-responsive li .sub-menu {
	border-color: transparent;
}

.menu-hidden-responsive .uabb-menu-responsive ul#menu-menu-responsive li .sub-menu li a span {
	font-size: var(--25px);
}


.uabb-menu-responsive {
	/*position: absolute;*/
	top: 80px;
	z-index: 20; 
	/*padding-bottom: 300px; */

}


.uabb-creative-menu.uabb-menu-responsive .sub-menu {
	position: static !important; /* Ne plus utiliser absolute */
	display: none; /* caché par défaut */
}

.uabb-creative-menu.uabb-menu-responsive .menu-item-has-children.uabb-active > .sub-menu {
	display: block !important; /* Afficher le sous-menu actif */
}

/* Ajuster le padding pour que le sous-menu soit indenté */
.uabb-creative-menu.uabb-menu-responsive .sub-menu li a {
	padding-left: 20px; 
}


/* --- sticky fleche */
/* position fixe à gauche */
.sticky-fleche {
	position: fixed;
	bottom: 0px;
	left: 60px;
	transform: translateY(-50%);
	z-index: 9999;
	cursor: pointer;
}

.menu-open .sticky-fleche {
	display: none; 
} 

/* container photo */
.sticky-fleche .fl-col-content {
	position: relative;
	display: inline-block;
}

/* images communes */
.sticky-fleche img {
	display: block;
	max-width: 60px;
	max-height: 60px;
	width: auto;
	height: auto;
	object-fit: contain;
	pointer-events: none;
	transition: opacity 0.3s ease, transform 0.3s ease;
}

/* image hover empilée au-dessus, invisible par défaut */
.img-sticky-fleche-hover {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	z-index: 2;
	transition: opacity 300ms linear, transform 300ms ease;
}

/* image normale */
.img-sticky-fleche {
	z-index: 1;
	transition: opacity 300ms linear, transform 300ms ease;
}

/* bascule hover */
.sticky-fleche:hover .img-sticky-fleche-hover { opacity: 1; }
.sticky-fleche:hover .img-sticky-fleche       { opacity: 0; }

/* rotation flèche selon direction */
.sticky-fleche.down img { transform: rotate(-90deg); }  /* pointe vers le bas */
.sticky-fleche.up img   { transform: rotate(90deg); } /* pointe vers le haut */
/* cache uniquement côté visiteur */






/* --- Menu */

body:not(.fl-builder-edit) .col-hide {
	display: none; 
	width: 100%; 
	height: 100%; 
}

.col-hide .fl-col-content {
	display: flex; 
	flex-direction: column; 
	justify-content: center; 
	height: 100%;
}

.col-sous-menu .fl-col-content:first-of-type {
	display: block;
}

.col-sous-menu .fl-col-group {
	height: 100%;
}

.texte-menu {
	border-right: 2px solid var(--dore-1);
}

.texte-menu a {
	font-family: var(--scandia);
	font-weight: 500;
	/*font-size: var(--70px);*/
	font-size: 4vw;
	color: var(--blanc);
	transition: all linear 300ms;
	text-decoration: none; 
	padding-left: 35px;
	display:block;
	line-height: 1;
	margin-bottom: 20px;
}

.texte-menu a:hover {
	color: var(--dore-1);
	opacity: 0.7; 
	transition: all linear 300ms;
	text-decoration: none; 
}
.texte-sous-menu{
	height: 100%;
	display: flex; 
	flex-direction: column;
	justify-content: center;
}
.texte-sous-menu a {
	font-family: var(--scandia);
	font-weight: 200;
	font-size: var(--32px);
	color: var(--blanc);
	transition: all linear 300ms;
	text-decoration: none; 
	padding-left: 35px;
	display:block;
}

.texte-sous-menu a:hover {
	color: var(--dore-1);
	opacity: 0.7; 
	transition: all linear 300ms;
	text-decoration: none; 

}



/*===== EXEMPLE =====*/

/* --- Exemple */

/*========================
* 
* 				FOOTER
* 
* ======================*/

.text-footer p {
	font-family: var(--scandia);
	font-weight: 300;
	font-size: var(--20px);
	line-height: 30px;
	color: var(--brun);
}


.text-footer p a {
	color: var(--dore-1) !important;
	transition: all linear 300ms; 
}

.text-footer p a:hover {
	transition: all linear 300ms; 
	opacity: 0.7; 
}

.text-info-client p a,
.text-info-client p {
	font-family: var(--scandia);
	font-weight: 500;
	font-size: var(--20px);
	line-height: 30px;
	color: var(--brun);
}

.rangee-padding-footer > .fl-row-content-wrap {
	padding: 0px 70px 0px 200px; 
}

@media screen and (max-width: 1000px){
	.rangee-padding-footer > .fl-row-content-wrap {
		padding: 0px 20px; 
	}
}

/*===== EXEMPLE =====*/

/* --- Exemple */

/*========================
* 
* 				HOME PAGE
* 
* ======================*/
.container-img .fl-col-group:first-of-type,
.image-lanceur .fl-col-content {
	min-height:900px;
}

@media screen and (max-width: 768px){
	.container-img .fl-col-group:first-of-type{
		min-height:500px;
	}
	.image-lanceur .fl-col-content {
		min-height:500px;
		background-position: center top;
	}
	.image-lanceur .titre-1{
		margin-top: 120px;
	}
}

.image-lanceur .fl-col-content {
	justify-content: flex-end; 
}

.container-img {
	position: relative; /* pour que les images position:absolute se superposent */
	width: 100%;
	height: 100%; /* ou min-height selon ton design */
}


body:not(.fl-builder-edit) 
.image-lanceur {
	position: absolute; /* superposition */
	top: 0;
	left: 200px;
	width: 100%;
	height: 100%;
	min-height: 1000px;
	opacity: 0; /* invisible par défaut */
	transition: opacity 0.3s ease-in-out; /* fondu fluide */
	z-index: 1;
	pointer-events: none; /* les images ne bloquent pas le hover sur les boutons */
}

@media screen and (max-width: 1000px){
	body:not(.fl-builder-edit) 
	.image-lanceur {
		position: absolute; /* superposition */
		top: 0;
		left: 0;
		width: 100% !important;
		height: 100%;
		min-height: 1000px;
		opacity: 0; /* invisible par défaut */
		transition: opacity 0.3s ease-in-out; /* fondu fluide */
		z-index: 1;
		pointer-events: none; /* les images ne bloquent pas le hover sur les boutons */
	}
}


.image-lanceur.img-defaut {
	opacity: 1; /* visible par défaut */
}

.cta-lanceur {
	margin-top: -50px;
	position: relative;
	z-index: 2; /* au-dessus des images */
}
/*===== Smart SLider =====*/

.n2_clear .n2-ss-slide .n2-ss-layers-container {
	max-width: 100% !important;
}

.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content {
	padding-left: 200px !important;
	padding-bottom: 70px !important; 
}

@media screen and (max-width: 1000px){
	.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content {
		padding-left: 10px !important;
		padding-bottom: 50px !important; 
	}
}


@media screen and (max-width: 768px){
	.n2_clear .n2-ss-mobilePortrait {
		height: 500px;
	}
}


.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content .titre-slider div {
	font-family: var(--merri) !important;
	font-weight: var(--bold) !important;
	font-size: var(--60px) !important;
	line-height: 70px !important; 
	color: var(--blanc) !important;
}

.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content .cta-slider div a {
	position: relative;
	z-index:3;
}

.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content .cta-slider div a {
	border: 3px solid var(--dore-1) !important;
	border-radius: 50px !important;
	background-color: var(--dore-1) !important;
	transition: all linear 300ms;
	margin-top: 30px !important; 
	padding: 20px 40px !important;
}

.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content .cta-slider div:hover a {
	border: 3px solid var(--dore-1);
	border-radius: 50px;
	background-color: var(--blanc) !important;
	transition: all linear 300ms;
}

.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content .cta-slider div a div {
	font-family: var(--scandia) !important;
	font-weight: var(--medium) !important;
	font-size: var(--20px) !important;
	color: var(--blanc) !important;
	text-transform: uppercase;
	transition: all linear 300ms;
}

.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content .cta-slider div:hover a div {
	color: var(--dore-1) !important;
	transition: all linear 300ms;
}

@media screen and (max-width: 769px) {

	.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content .cta-slider div a {
		padding: 10px 25px !important;
	}
	.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content .cta-slider div a div {
		font-size: var(--18px) !important;
	}

	.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content .titre-slider div {
		line-height: 50px !important; 
	}

	.n2_clear .n2-ss-slide .n2-ss-layers-container .n2-ss-section-main-content .titre-slider div{
		font-size: var(--30px) !important ;
		line-height: 30px !important; 
	}

}

.cta-prev-next {
	position: relative;
	z-index: 0; 
}

@media screen and (max-width: 769px) {
	.cta-prev-next {
		margin-left: 60%; 
	}
}


/*===== carousel Realisation =====*/
.div-flex{
	display: flex; 
	flex-direction: row; 
	justify-content: flex-end;
}

.div-flex a {
	position: relative;
	display: inline-block;
	padding-right: 20px; 
}

.div-flex img.hover {
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	transition: opacity 300ms linear;
}

.div-flex img{
	max-width: 50px;
	max-height: 50px; 
}
@media screen and (max-width: 769px){
	.div-flex a:hover,
	.div-flex a {
		padding-right: 0px; 
		padding-left: 5px; 
	}
	.div-flex img.hover{
		left: 5px; 
	}

}

.div-flex a:hover img.hover {
	opacity: 1;
}

.div-flex img.normal {
	transition: opacity 300ms linear;
}

.div-flex a:hover img.normal {
	opacity: 0;
}

.slick-prev, .slick-next {
	display: none !important; 
}

.carousel-realisation h3.uabb-image-carousel-caption {
	padding-left: 0px; 
	padding-top: 10px;

	font-family: var(--scandia);
	font-weight: var(--regular);
	font-size: var(--20px);
	line-height: 30px;
	color: var(--blanc);
	text-align:left;
}

.carousel-realisation {
	margin-right: 20%;
}
.rangee-padding {
	overflow:hidden;
}

.carousel-realisation .slick-list {
	overflow: visible !important;
}

.carousel-realisation .uabb-gallery-img {
	aspect-ratio: 65 / 44;
	object-fit: cover;
}


/* gap entre slides */
.custom-realisation-carousel .uabb-image-carousel-item {
	margin-right: 30px; /* ton gap */
}

/* marge à droite pour laisser entrevoir la prochaine */
.custom-realisation-carousel .slick-list {
	padding-right:15% !important;
}

.fancybox__container .fancybox__toolbar__items button:hover,
.fancybox__container .fancybox__toolbar__items button:focus,
.fancybox__container .fancybox__toolbar__items button {
	background-color: transparent; 
	border: none !important;
}




/*========================
* 
* 				Page Contact
* 
* ======================*/


.form-contact .fl-module-content form .gform-body .gform_fields .ginput_container textarea::placeholder,
.form-contact .fl-module-content form .gform-body .gform_fields .ginput_container textarea,
.form-contact .fl-module-content form .gform-body .gform_fields .ginput_container input,
.form-contact .fl-module-content form .gform-body .gform_fields .ginput_container input::placeholder {
	font-family: var(--scandia) !important;
	font-weight: 400;
	font-size: var(--16px);
	line-height:20px;
	color: var(--dore-1);
}

.form-contact .fl-module-content form .gform-body .gform_fields .ginput_container textarea,
.form-contact .fl-module-content form .gform-body .gform_fields .ginput_container input {
	border-radius: 25px;
}

.form-contact .fl-module-content form .gform-body .gform_fields .ginput_container label {
	font-family: var(--scandia) !important;
	font-weight: 400;
	font-size: var(--16px);
	line-height:20px;
	color: var(--dore-1);
}


/*--- Check RGPD --- */

.form-contact .fl-module-content form .gform-body .gform_fields .ginput_container_consent input::before {
	color: var(--dore-1) !important;
	accent-color: var(--dore-1); 
}

/*--- cta envoyer --- */

.form-contact .fl-module-content form .gform-footer input {
	border: 3px solid var(--dore-1) !important;
	border-radius: 50px !important;
	background-color: var(--dore-1) !important;
	margin-top: 30px !important; 
	padding: 20px 40px !important;
	font-family: var(--scandia) !important;
	font-weight:var(--semi-bold) !important;
	font-size: var(--20px) !important;
	color: var(--blanc) !important;
	text-transform: uppercase !important;
	transition: all linear 300ms !important;
}

.form-contact .fl-module-content form .gform-footer input:hover {
	border: 3px solid var(--dore-1) !important;
	border-radius: 50px !important;
	background-color: var(--blanc) !important;
	margin-top: 30px !important; 
	padding: 20px 40px !important;
	font-family: var(--scandia) !important;
	font-weight:var(--semi-bold) !important;
	font-size: var(--20px) !important;
	color: var(--dore-1) !important;
	text-transform: uppercase !important;
	transition: all linear 300ms !important;
}

@media screen and (max-width: 1000px){
	.form-contact .fl-module-content form .gform-body div#gform_fields_2 {
		column-gap: var(--16px) !important; 
	}
}



.form-contact .gform_confirmation_message * {
	color: var(--noir); 
}

/*========================
* 
* 	ARCHIVE PAGE Réalisations 
* 
* ======================*/



.vue-archive-realisations .form-group {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 25px;
	margin: 40px 0;
}

.vue-archive-realisations .form-group.type-de-batiment {
	margin-top: 0px;
}

.vue-archive-realisations .form-group > label,
.vue-archive-realisations .form-group input {
	display: none;
}

.vue-archive-realisations .form-group .form-check {
	padding: 0;
}

.vue-archive-realisations .form-group label.form-check-label {
	font-family: var(--scandia);
	font-weight: 500;
	font-size: 18px;
	color: var(--blanc) !important;
	transition: all 300ms linear;
	background: var(--dore-1) !important;
	border-radius: 55px !important;
	border: 3px solid var(--dore-1) !important;
	padding: 25px 40px;
	cursor: pointer;
	text-align: center;
	text-transform: uppercase;
}


@media all and (max-width: 1200px) {
	.vue-archive-realisations .form-group label.form-check-label {

	font-size: var(--18px);
	color: var(--blanc) !important;
	transition: all 300ms linear;
	background: var(--dore-1) !important;
	border-radius: 55px !important;
	border: 3px solid var(--dore-1) !important;
	padding: 15px 30px;
	cursor: pointer;
	text-align: center;
	text-transform: uppercase;
}

	.vue-archive-realisations .form-group {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 16px;
	margin: 40px 0;
}
	
	
	
}




@media all and (min-width: 1000px) {
	.vue-archive-realisations .form-group label.form-check-label:hover {
		background:var(--blanc) !important;
		color: var(--dore-1) !important;
	}
}

@media all and (max-width: 768px) {
	.vue-archive-realisations .form-group label.form-check-label {

	font-size: 16px;
	color: var(--blanc) !important;
	transition: all 300ms linear;
	background: var(--dore-1) !important;
	border-radius: 55px !important;
	border: 3px solid var(--dore-1) !important;
	padding: 8px 15px;
	cursor: pointer;
	text-align: center;
	text-transform: uppercase;
}
	
		.vue-archive-realisations .form-group {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 12px;
	margin: 40px 0;
}
	
	
}

/* caché le type atelier */
.vue-archive-realisations .form-group.type-de-realisation .form-check input[value="atelier"] + label  {
	display: none; 
}


.vue-archive-realisations .form-group input:checked + label {
	background: var(--blanc) !important;
	font-weight: 600 !important;
	color: var(--dore-1) !important;
}

.vue-archive-realisations .container {
	margin-top: 80px;
	max-width: 100% !important;
	width: 100%;
	padding: 0 !important;
}

.vue-archive-realisations .container .col-md-4 {
	padding: 0 8px !important;
	display: flex;
	justify-content: center;
}

@media all and (max-width: 1000px) {
	.vue-archive-realisations .container .col-md-3 {
		flex: 0 0 50% !important;
		max-width: 100% !important
	}
}

@media all and (max-width: 768px) {
	.vue-archive-realisations .container .col-md-3 {
		flex: 0 0 100% !important;
		max-width: 100% !important
	}
}

.vue-archive-realisations .container-card {
	margin-bottom: 30px;
	transition: 150ms linear;
	max-width: 500px !important;
	transition: all linear 300ms;
}

.vue-archive-realisations .container-card:hover {
	opacity: 0.5;
	transition: all linear 300ms;
}

.vue-archive-realisations .container-card a {
	text-decoration: none !important;
}

.vue-archive-realisations .container-card img {
	aspect-ratio: 1.33/1;
	object-fit: cover;
	border-radius: 0px;
	overflow: hidden;
	width: 100%; 
	height: 100%; 
}

.vue-archive-realisations .container-card .titre {
	font-family: var(--scandia);
	font-weight: 700;
	font-size: 26px;
	color: var(--noir);
	margin-top: 20px;
	text-decoration: none !important;
}

.rangee-2-img .fl-module-photo .fl-photo-content {
	aspect-ratio: 4 / 3;
	overflow: hidden;
}

.rangee-2-img .fl-module-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Tabs */
.uabb-tabs,
.uabb-tabs .uabb-tab-title,
.uabb-tabs .uabb-content{
	font-family: var(--scandia);
}
.uabb-tabs .uabb-content {
	font-size:var(--20px);
}
.uabb-tabs .uabb-tabs-nav ul li,
.uabb-tabs .uabb-tabs-nav .uabb-tab-current,
.uabb-tabs .uabb-tabs-nav .uabb-tab-link{
	border-top-left-radius: 20px !important;
	border-top-right-radius: 20px !important;
	border-bottom-left-radius: 0px!important;
	border-bottom-right-radius: 0px!important;

}
.uabb-tabs .uabb-content-wrap {
	border-top-left-radius: 0px!important;
	border-top-right-radius: 0px!important;
	border-bottom-left-radius: 20px!important;
	border-bottom-right-radius: 20px!important;
}
@media (max-width: 768px) { 
	.uabb-tabs .uabb-content-wrap .section .uabb-tab-acc-title.uabb-acc-0 {
		border-top-left-radius: 20px !important;
		border-top-right-radius: 20px !important;
	}
	.uabb-tabs .uabb-content-wrap .section:not(.uabb-content-current) .uabb-tab-acc-title.uabb-acc-2 {
		border-bottom-left-radius: 20px !important;
		border-bottom-right-radius: 20px !important;
	}
	.uabb-tabs .uabb-content-wrap .uabb-tab-acc-title {
		padding: 15px;
	}
}

/* Timeline */
.fl-module-uabb-timeline .uabb-timeline-connector:before {
	bottom: 23px !important;
}

.fl-module-uabb-timeline .uabb-timeline-heading {
	font-family: var(--scandia);
	font-weight: var(--bold);
	font-size: var(--22px);
}
.fl-module-uabb-timeline .uabb-events-inner-new {
	padding: 15px !important;
}
.uabb-timeline-connector .slick-prev,
.uabb-timeline-connector .slick-next {
	display: block !important;
}
.fl-module-uabb-timeline {
	padding-top: 40px;
}
.uabb-timeline-connector .slick-arrow, .uabb-timeline-connector .slick-arrow:hover, .uabb-timeline-connector .slick-arrow:focus {
	top: -40px;
}
.uabb-timeline-connector .slick-prev {
    left: 0px;
    top: -40px;	
}

.uabb-timeline-connector .slick-next {
	right: 0px;
    top: -40px;	
}
.uabb-timeline-connector .slick-prev i, 
.uabb-timeline-connector .slick-next i {
	font-size: 25px !important;
    padding: 10px;
}



/*######### CAROUSEL RÉALISATIONS ###############*/


.realisation-masonry {
  column-count: 3;
  column-gap: 8x;
}

.masonry-item {
  break-inside: avoid;
  margin-bottom: 16px;
}

.masonry-item img {
  width: 100%;
  height: auto;
  display: block;
}

@media (max-width: 1024px) {
  .realisation-masonry {
    column-count: 2;
  }
}

@media (max-width: 767px) {
  .realisation-masonry {
    column-count: 2;
  }
}






.real-slider {
  position: relative;
  width: 100%;
  max-width: 500px;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  margin: 0 auto;
  background: var(--blanc);
}

.real-slider-track {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease;
  position: relative;
  z-index: 1;
}

.real-slide {
  flex: 0 0 100%;
  min-width: 100%;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.real-slide a {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.real-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.real-slider-button {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 10;
  pointer-events: none;
  padding: 0 10px;
}

.real-slider-button button {
  pointer-events: auto;
}

.slide-single-prev:focus,
.slide-single-next:focus, 
.slide-single-prev,
.slide-single-next {
  position: relative;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: var(--dore-1);
	border: solid 1px var(--dore-1);
  color: #fff;
  cursor: pointer;
  font-size: 22px;
  line-height: 44px;
  text-align: center;
  padding: 0;
	transition: all linear 300ms; 
}


.slide-single-prev:hover,
.slide-single-next:hover {
  position: relative;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: var(--blanc);
	border: solid 1px var(--dore-1);
  color: var(--dore-1);
  cursor: pointer;
  font-size: 22px;
  line-height: 44px;
  text-align: center;
  padding: 0;
	transition: all linear 300ms; 
}


.slide-single-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.92);
  z-index: 99999;
  display: none;
  align-items: center;
  justify-content: center;
}

.slide-single-lightbox.is-open {
  display: flex;
}

.slide-single-lightbox-image {
  max-width: 90vw;
  max-height: 90vh;
  object-fit: contain;
}

.slide-single-lightbox-close:focus,
.slide-single-lightbox-close {
  position: absolute;
  top: 20px;
  right: 20px;
  z-index: 100000;
  width: 44px;
  height: 44px;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  appearance: none;
  -webkit-appearance: none;
  border: none;
  border-radius: 50%;
  background: var(--dore-1);
	border: 1px solid var(--dore-1);
  color: #fff;
  font-size: 32px;
  line-height: 1;
  cursor: pointer;
  pointer-events: auto;
	transition: all linear 300ms; 
}

.slide-single-lightbox-close:hover,
.slide-single-lightbox-close:active {
  color: var(--dore-1);
  outline: none;
	background-color: var(--blanc);
  box-shadow: none;
  transform: none;
	border: 1pcx solid var(--dore-1);
transition: all linear 300ms; 

}