/*
Theme Name: Hello Elementor Child
Theme URI: https://studionumerik.fr/
Description: Hello Elementor Child Theme
Author: Studio Numerik
Author URL: https://studionumerik.fr/
Template: hello-elementor
Version: 1.2.16
License: GNU General Public License v2 or later
License URL: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hello-elementorchild
*/
/* Placer votre CSS ci-dessous 


noir : #
jaune : #ffe955
*/

/*HOME*/
h1 small{font-size:0.4em;}
.elementor-heading-title span{color:#ffe955;text-decoration-color: #ffe955; }
.elementor-heading-title span u{color:#ffe955;text-decoration-color: #ffe955; }

	b{font-weight:600;}


a,a:active, a:hover {
    color: #ffe955;
}

.elementor-widget-n-accordion .e-n-accordion-item .elementor-widget-text-editor p {letter-spacing:0.3px!important;}

.elementor-widget-button{transition:all ease0.3s;}
.elementor-widget-button.hover-white a:hover{background-color:#FFFFFF!important;color:#191e1e!important;border-color:#FFFFFF!important;}
.elementor-widget-button.hover-black a:hover{background-color:#191e1e!important;color:#FFFFFF!important;} 
.elementor-widget-button.hover-yellow a:hover{background-color:#ffe955!important;color:#191e1e!important;} 



body{overflow-x:hidden;}

.lineBtn a:hover,.lineBtn2 a:hover{color:#FFFFFF!important;background:initial!important;    border-color:#FFFFFF!important;}  
.lineBtn a:hover svg,.lineBtn2 a:hover svg{fill:#FFFFFF!important;transform:translateX(2px);}  
.lineBtn a  svg,.lineBtn2 a  svg{transition:all 0.3s ease;}  

.lineBtn.hoverYellow a:hover,.lineBtn2.hoverYellow a:hover{color:#FFE955!important;background:initial!important;    border-color:#FFE955!important;}  
.lineBtn.hoverYellow a:hover svg,.lineBtn2.hoverYellow a:hover svg{fill:#FFE955!important;transform:translateX(2px);}  





.btn-down img {
  display: inline-block;
  animation: btnDownBounce 1.7s ease-in-out infinite;
  cursor: pointer;
}

@keyframes btnDownBounce {
  0% {
    transform: translateY(0);
    opacity: 0.8;
  }

  50% {
    transform: translateY(12px);
    opacity: 1;
  }

  100% {
    transform: translateY(0);
    opacity: 0.8;
  }
}


@media (min-width: 1024px) {
	.elementor-widget-n-accordion .e-n-accordion-item .elementor-widget-text-editor{max-width:85%!important;}
}
 

@media (min-width: 1367px) {
	.elementor-nav-menu--main .elementor-nav-menu ul{transform:translateX(-7px);}
}

@media (max-width: 1366px) {
		.noBrPortable br{display:none!important;}
		
		.elementor-nav-menu--main .elementor-nav-menu ul{transform:translateX(7px);}
}

    #to_top_scrollup {
        background: initial !important;
    }
@media (max-width: 768px) {
	#wpadminbar{display:none!important;}
	 html {
        margin-top: 0!important;
    }
	
	.clemHome{position:absolute;top:-40px;right:0;}
	
	.noBrMobile br{display:none!important;}
	.keepBrMobile br{display:initial!important;}
	body .brOnlyMobile br{display:initial!important;}
		
}

.brOnlyMobile br{display:none!important;}


@media (min-width: 1025px) { 
		.menuMobileOnly {display:none!important;}
}

@media (max-width: 1024px) 
{
		#menu-menu-principal .menu-item.btn a::after{display:none;}
		#menu-menu-principal .menu-item.btn.yellow a{ fill:#ffe955;
		color: #ffe955;border-color: #ffe955;}
		#menu-menu-principal .menu-item.btn:last-child a{margin-top:10px;}
		.ue_inner_menu::before{
				content:" ";
				position:absolute;
				top:30px;left:30px;
				fill:#FFF;
				background:url(/wp-content/themes/hello-elementor-child/assets/images/A.svg) no-repeat center center transparent!important;
				background-size:25px;width:26px;height:26px;}
		#menu-menu-principal .menu-item.btn a::before{content: "";
			display: inline-block;
			width: 16px;
			height: 16px;
			flex: 0 0 16px;
			margin-right:15px;
			background-color: currentColor;
			-webkit-mask-image: url(/wp-content/themes/hello-elementor-child/assets/images/arrow-btn.svg);
			-webkit-mask-repeat: no-repeat;
			-webkit-mask-position: center;
			-webkit-mask-size: contain;
			mask-image: url(/wp-content/themes/hello-elementor-child/assets/images/arrow-btn.svg);
			mask-repeat: no-repeat;
			mask-position: center}
	
		#menu-menu-principal .menu-item.btn a{
			font-size:19px!important;
					margin: 20px auto 0 auto;
			background-color:transparent;
			font-family: "brockmann", Sans-serif;
			
			font-weight: 400;
			line-height: 16px;
			letter-spacing: 0.15px;
			fill:#FFF;
			color: #FFF;
			border-style: solid;
			border-width: 1px 1px 1px 1px;
			border-color: #FFF;
			border-radius: 50px 50px 50px 50px;
			padding: 16px 20px 15px 20px;
	}
}

@media (max-width: 767px) {
		.homeAvisBtn svg{max-width:90px;margin:0 10px 0 25px;}
		
		.elementor-widget-button:not(.lineBtn,.lineBtn2,.priceBtn),.elementor-widget-button:not(.lineBtn,.lineBtn2,.homeAvisBtn,.priceBtn) a{width:100%!important;}
		
}

@media (max-width: 380px) {
	
		.homeAvisBtn > a > span {flex-wrap: wrap;} 
		.homeAvisBtn > a > span > span{width:100%!important;}
		.homeAvisBtn > a  {padding-right:0!important;margin-right:0!important;}
		.homeAvisBtn > a svg {    transform: translateY(17px);    margin: auto;}
}



#to_top_scrollup{    background: initial !important;}

.ue-rollover-image-effect img{cursor:none;}

.placesDispo {
  display: flex;
  align-items: center;
  gap: 8px;
}

.placesDispo b{font-weight:500;}
.placesDispo b > u {
  text-decoration-thickness: 1px;
  text-underline-offset: 2px;
}

.placesDispo::before {
  content: "";
  width: 6px;
  height: 6px;
  background: #FF5100;
  border-radius: 50%;
  flex: 0 0 6px;
}


.halfBlackBg::before {
  content: " ";
  width: 100%;
  height: 50%;
  background: #191E1E;
  position:absolute;
  top:0;left:0;z-index:0;
  display:block;
}
.halfBlackBg{z-index:1;}


.placesDispo.green::before {
    background: #05c916;
}

@media (max-width: 414px) {
		.placesDispo {max-width:196px!important;}
		.placesDispo::before{transform:translateY(-9px);}
		.placesDispo .elementor-heading-title {line-height:1.2em!important;}
}

.homeMarquee .marquee_text span{transform:translateY(-5px)!important;}
.homeMarquee .marquee_text{margin: 0 30px!important;}
.homeMarquee .marquee_text img{margin: 0 15px!important;}
.homeMarquee .marquee_text img{transform:translateY(9px)!important;}

 .ue-scroll-marquee-item img {
  transition: transform 0.3s ease;
}

 .ue-scroll-marquee-item:hover img {
  transform: scale(1.2);
  z-index: 2;
}

.elementor-widget-ucaddon_responsive_testemonial_carousel .owl-item .ue-text{min-height:257px!important;}

.bottomLine {
  position: relative;
}

.bottomLine::after {
  content: "";
  position: absolute;
  left: 0;
  right: auto;
  bottom: -1px; /* décale sur la bordure existante */
  width: 100%;
  height: 1px;
  background-color: #FFFFFF;
  z-index: 10;
  pointer-events: none;
}

/* 75% de largeur, calé à droite */
.bottomLine.line3-4::after {
  left: auto;
  right: 0;
  width: 75%;
}

/* 50% de largeur, calé à droite */
.bottomLine.line2-4::after {
  left: auto;
  right: 0;
  width: 50%;
}

/* 25% de largeur, calé à droite */
.bottomLine.line1-4::after {
  left: auto;
  right: 0;
  width: 25%;
}



.elementor-nav-menu .menu-item > a {padding-bottom: 5px!important;}
.elementor-nav-menu .menu-item-has-children > a {
    position: relative;
    padding-right: 24px;
}

.elementor-nav-menu .menu-item-has-children > a .sub-arrow {
    display: none;
}

.elementor-nav-menu .menu-item-has-children > a::after {
    content: ""!important;
    width: 12px!important;
    height: 12px!important;
    background-image: url("/wp-content/themes/hello-elementor-child/assets/images/fleche-bas.png");
    background-size: contain!important;
    background-repeat: no-repeat!important;
    background-position: center!important;
    position: absolute!important;
    left: initial!important;
    right: -10px!important;
    top: 56%!important;
    transform: translateY(-50%) translateX(7px)!important;
	opacity:1!important;
	    background-color: transparent !important;
	
    background-size: 12px!important;
}



.arrow .elementor-button-text,
.elementor-button.arrow .elementor-button-text {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.arrow.lineBtn2 .elementor-button-text::before{position:absolute;left:-25px;top:5px;}

.arrow .elementor-button-text::before,
.elementor-button.arrow .elementor-button-text::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  flex: 0 0 16px;

  background-color: currentColor;

  -webkit-mask-image: url("/wp-content/themes/hello-elementor-child/assets/images/arrow-btn.svg");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;

  mask-image: url("/wp-content/themes/hello-elementor-child/assets/images/arrow-btn.svg");
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}

.arrow .elementor-button-text::before,
.elementor-button.arrow .elementor-button-text::before {
  transition: transform 0.25s ease;
}

.arrow:hover .elementor-button-text::before,
.elementor-button.arrow:hover .elementor-button-text::before {
  transform: translateX(4px);
}


.e-n-accordion > .e-n-accordion-item:first-of-type > .e-n-accordion-item-title {
  border-top: 0!important;
}


.realisations-grid {
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.realisations-grid.is-filtering {
    opacity: 0;
    transform: translateY(10px) scale(0.98);
}

.realisations-grid.is-filtered {
    animation: realisationsIn 0.45s ease both;
}

@keyframes realisationsIn {
    from {
        opacity: 0;
        transform: translateY(14px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}



/* ==========================================================
   LOOP RÉALISATIONS
   Motif :
   1  2  3
   4  4  5
   4  4  6
   7  8  9
   10 12 12
   11 12 12
   puis on recommence
========================================================== */

@media (min-width: 1025px) {

    .loopRealisations .elementor-loop-container {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        grid-auto-flow: dense;
        gap: 32px 16px;
    }


    /* ---------------------------
       GRANDE IMAGE À GAUCHE
       éléments 4, 16, 28...
    ---------------------------- */

    .loopRealisations .e-loop-item:nth-child(12n + 4) {
        grid-column: 1 / span 2;
        grid-row: span 2;
    }


    /* Les deux petites à droite */
    .loopRealisations .e-loop-item:nth-child(12n + 5),
    .loopRealisations .e-loop-item:nth-child(12n + 6) {
        grid-column: 3;
    }


    /* ---------------------------
       DEUX PETITES À GAUCHE
       éléments 10/11, 22/23...
    ---------------------------- */

    .loopRealisations .e-loop-item:nth-child(12n + 10),
    .loopRealisations .e-loop-item:nth-child(12n + 11) {
        grid-column: 1;
    }


    /* ---------------------------
       GRANDE IMAGE À DROITE
       éléments 12, 24, 36...
    ---------------------------- */

    .loopRealisations .e-loop-item:nth-child(12n + 12) {
        grid-column: 2 / span 2;
        grid-row: span 2;
    }


    /* Images normales */
    .loopRealisations .imageRealisation img {
        width: 100%;
        aspect-ratio: 1.45 / 1;
        object-fit: cover;
        display: block;
    }


    /* Images des grandes réalisations */
    .loopRealisations .e-loop-item:nth-child(12n + 4) .imageRealisation img,
    .loopRealisations .e-loop-item:nth-child(12n + 12) .imageRealisation img {
        aspect-ratio: 1.15 / 1;
    }

}

@media (min-width: 1025px) {

    /* Grande réalisation gauche / droite */
    .loopRealisations .e-loop-item:nth-child(12n + 4) .imageRealisation,
    .loopRealisations .e-loop-item:nth-child(12n + 12) .imageRealisation {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Elementor ajoute parfois un conteneur autour de l'image */
    .loopRealisations .e-loop-item:nth-child(12n + 4) .imageRealisation .elementor-widget-container,
    .loopRealisations .e-loop-item:nth-child(12n + 12) .imageRealisation .elementor-widget-container {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Lien éventuel autour de l'image */
    .loopRealisations .e-loop-item:nth-child(12n + 4) .imageRealisation a,
    .loopRealisations .e-loop-item:nth-child(12n + 12) .imageRealisation a {
        display: block;
        width: 100%;
    }

    /* Image */
    .loopRealisations .e-loop-item:nth-child(12n + 4) .imageRealisation img,
    .loopRealisations .e-loop-item:nth-child(12n + 12) .imageRealisation img {
        width: 100% !important;
        max-width: none !important;
        display: block;
        object-fit: cover;
    }

}

/* Cache l'image pendant le zoom */
.loopRealisations .imageRealisation {
    overflow: hidden;
	border-radius:10px;
}

/* Animation fluide */
.loopRealisations .imageRealisation img {
    transition: transform 0.9s cubic-bezier(.2,.6,.3,1);
    transform: scale(1);
}

/* Survol de toute la carte */
.loopRealisations .e-loop-item:hover .imageRealisation img {
    transform: scale(1.06);
}
@media (max-width: 767px) {

    .loopRealisations .elementor-loop-container {
        grid-template-columns: 1fr !important;
    }

    .loopRealisations .e-loop-item {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
        width: 100% !important;
    }

    .loopRealisations .imageRealisation,
    .loopRealisations .imageRealisation .elementor-widget-container,
    .loopRealisations .imageRealisation a,
    .loopRealisations .imageRealisation img {
        width: 100% !important;
        max-width: none !important;
    }

}
@media (max-width: 767px) {

    .loopRealisations .imageRealisation img {
        width: 100% !important;
        aspect-ratio: 4 / 3 !important;
        object-fit: cover !important;
        display: block;
    }

}

/* Header transparent sur les fiches Réalisation */
.single-realisation .mainHeader {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
    background: transparent !important;
    background-color: transparent !important;
} 
.single-realisation .mainHeader a{background: transparent !important;
background-color: transparent !important;}

.single-realisation .mainHeader {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;

    background: transparent !important;
    background-color: transparent !important;
}

/* Dégradé de lisibilité au-dessus de l'image */
.single-realisation .mainHeader::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 250px;

    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.70) 0%,
        rgba(0, 0, 0, 0) 100%
    );

    pointer-events: none;
    z-index: 0;
}

/* Le contenu du menu reste au-dessus du dégradé */
.single-realisation .mainHeader > * {
    position: relative;
    z-index: 1;
}