/*
Theme Name:   Hello Elementor Child
Theme URI:    https://elementor.com/hello-theme/
Description:  A lightweight child theme of Hello Elementor
Author:       emma42 - Issam : Dev Tem 
Author URI:   https://emma42.com
Template:     hello-elementor
Version:      1.0.0
Text Domain:  hello-elementor-child
*/ 


/* Fonts - Gilroy */
/**---- Thin ---------**/
@font-face {
	font-family: 'Gilroy';
	src: url('fonts/Gilroy-Thin.ttf') format('truetype');
	font-weight: 100;
	font-style: normal;
	font-display: swap;
} 

/**---- UltraLight ---------**/
@font-face {
	font-family: 'Gilroy';
	src: url('fonts/Gilroy-UltraLight.ttf') format('truetype');
	font-weight: 200;
	font-style: normal;
	font-display: swap;
} 

/**---- Light ---------**/
@font-face {
	font-family: 'Gilroy';
	src: url('fonts/Gilroy-Light.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
} 

/**---- Regular ---------**/
@font-face {
	font-family: 'Gilroy';
	src: url('fonts/Gilroy-Regular.ttf') format('truetype');
	font-weight: 400; /* Regular = 400 */
	font-style: normal;
	font-display: swap;
} 

/**---- Medium ---------**/
@font-face {
	font-family: 'Gilroy';
	src: url('fonts/Gilroy-Medium.ttf') format('truetype');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
} 

/**---- SemiBold ---------**/
@font-face {
	font-family: 'Gilroy';
	src: url('fonts/Gilroy-SemiBold.ttf') format('truetype');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
} 

/**---- Bold ---------**/
@font-face {
	font-family: 'Gilroy';
	src: url('fonts/Gilroy-Bold.ttf') format('truetype');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
} 
/**---- Extra Bold ---------**/
@font-face {
	font-family: 'Gilroy';
	src: url('fonts/Gilroy-ExtraBold.ttf') format('truetype');
	font-weight: 800;
	font-style: normal;
	font-display: swap;
} 
/**---- black ---------**/
@font-face {
	font-family: 'Gilroy';
	src: url('fonts/Gilroy-Black.ttf') format('truetype');
	font-weight: 900;
	font-style: normal;
	font-display: swap;
} 

/*   default style - Light  **/
:root {
	/* global */ 	
	--width-global: 80%; 
	--height-hero: 100vh;
	--section-spacing : 40px 15px 0px 15px;
	--section-spacing-header : 0px 15px 0px 15px;
	--section-padding :0px;
	--section-margin :0px;
	--section-spacingfooter :61px 15px 61px 15px; 
	/* font */
	--font-global: 'Gilroy', sans-serif;

	/* Color */
	--primary-color : hsl(0 0% 100%);
	--secondary-color : hsl(0 0% 0%); 
	--third-color : #929292;
	/* size font */  
	--size-text: 18px;  
	--size-link :18px;
	--size-menu-link :18px;
	--size-text-lg: 20px;  
	--size-a: 16px;
	--size-a-span: 26px;
	--size-a-lg: 40px;
	--size-btn : 13px;
	--size-input: 16px; 

	--size-h1-lg: 94px;
	--size-h1: 50px;
	--size-h2: 40px;
	--size-h3: 20px;
	--size-h4: 18px;
	--size-h5: 17px;
	--size-h6: 15px;

	/* weght font */
	--font-weight-100: 100;
	--font-weight-200: 200;
	--font-weight-300: 300;
	--font-weight-400: 400;
	--font-weight-500: 500;
	--font-weight-600: 600; 
	--font-weight-700: 700;
	--font-weight-800: 800;
	--font-weight-900: 900;

	/*transition*/
	--transition-global:all 0.3s ease;
	--bg-transition : background-color 0.3ms ease;

	/*   style - light  **/ 
	--color-bg: var(--primary-color);
	--color-text: var(--secondary-color); 
}

/*   style - dark  **/ 
:root[data-theme="dark"] {
	--color-bg: var(--secondary-color); 
	--color-text: var(--primary-color);
}

/* Mobile root value */
@media (max-width: 1024px) {
	:root {
		--width-global: 100%; 
		--height-hero: 100vh;
		--section-spacing : 40px 15px 0px 15px;
		--section-spacingfooter :46px 15px 46px 15px; 
		--section-spacing-header : 0px 15px 0px 15px;

		/*	 size font */  
		--size-text: 18px;  
		--size-link :15px;
		--size-menu-link :25px;
		--size-text-lg: 20px;  
		--size-a: 15px;
		--size-a-span: 20px;
		--size-a-lg: 34px;
		--size-btn : 13px;
		--size-input: 15px; 

		--size-h1-lg: 35px;
		--size-h1: 30px;
		--size-h2: 22px; 
		--size-h3: 20px;
		--size-h4: 18px;
		--size-h5: 17px;
		--size-h6: 15px;
	}
}


html[data-theme="dark"] #themeToggle span.elementor-button-content-wrapper::before {
	left: 44px; 
	transition: all 0.3s ease;
}
html[data-theme="dark"] #themeToggle::after{
	background-color: var(--color-text) !important; 
}
html[data-theme="dark"] #themeToggle::before{
	background-color: var(--color-bg) !important; 
}
body .mode.elementor-element.e-con.e-parent {
	background: var(--color-bg) !important;
	color: var(--color-text) !important; 
	transition: background 0.1s, color 0.1s !important; 
	text-transform: lowercase;
}


/* Container width - spacing */
.gwidth .e-con-inner{
	width:var(--width-global) !important;
	max-width:var(--width-global) !important; 	
	padding: var(--section-padding); 
}
.gwidth { 
	padding: var(--section-spacing) !important;
}
.gwidth.header{ 
	padding: var(--section-spacing-header) !important;
}

.gwidth.footer{ 
	padding: var(--section-spacingfooter) !important;
}

/* All link */
.mode .elementor-element:not(.animatehover) a  {	color: var(--color-text) !important;}
.mode .elementor-element:not(.animatehover) a:hover{color: var(--third-color) !important;}
/* Menu */
header .elementor-nav-menu{
	gap:20px;
}
header a.elementor-item,
header a.elementor-sub-item{ 
	text-align: center;
	font-family: var(--font-global);
	font-size: var(--size-menu-link);
	font-style: normal;
	font-weight: var(--font-weight-400);
	line-height: normal !important;
	text-transform: lowercase;
	padding: 5px 0px !important;

} 
header .mode a.elementor-item {
	color: var(--color-text) !important;
	background:none !important;
}
header .mode a.elementor-item:hover, 
header .mode .elementor-sub-item.elementor-item-active{
	color: var(--third-color) !important;
	background:none !important;
}
header .mode a.elementor-item.highlighted {
	color: var(--third-color) !important;
} 
header a.elementor-item:after {
	content: "";
	position: absolute; 
	height: 1px !important;
	background-color:var(--third-color) !important;
	-webkit-transform: scaleX(0);
	-ms-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: right center;
	-ms-transform-origin: right center;
	transform-origin: right center;
	-webkit-transition: -webkit-transform 0.3s ease;
	transition: -webkit-transform 0.3s ease;
	-o-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
	transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
header a.elementor-item:hover:after {
	-webkit-transform: scaleX(100%);
	-ms-transform: scaleX(100%);
	transform: scaleX(100%);
	-webkit-transform-origin: left center;
	-ms-transform-origin: left center;
	transform-origin: left center;
}
header .pll-parent-menu-item a.elementor-item:after {
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	height: 0px !important;
}

header .sub-menu.elementor-nav-menu--dropdown{
	background:var(--color-bg) !important;
	box-shadow: rgba(33, 35, 38, 0.1) 0px 10px 10px -10px;
	padding: 5px 20px 10px 15px !important;
	border-radius: 0px 0px 8px 8px;
	margin-top: 3px !important;
}
header .pll-parent-menu-item .sub-menu.elementor-nav-menu--dropdown{

	max-width: max-content !important;
	min-width: max-content !important;
}
header .mode .sub-menu.elementor-nav-menu--dropdown li.menu-item a.elementor-sub-item{
	color: var(--color-text) !important;
	margin-top:7px;	
	margin-left: 10px;
}

header .mode .sub-menu.elementor-nav-menu--dropdown li.menu-item.lang-item a.elementor-sub-item{ 
	margin-top:5px;	
	margin-left: -8px;
	opacity:1;
}
header .mode .sub-menu.elementor-nav-menu--dropdown a.elementor-sub-item:hover{
	background:transparent;
	opacity:0.9;
}  
header .mode .sub-menu li.menu-item:not(.lang-item) a.elementor-sub-item::before { 
	content:".";	
	font-size: 50px;
	color: var(--color-text) !important;
	position: absolute;
	margin-right: 20px;
	line-height: 10px;
	left: 0;
	top: -3px;
	margin-left: -20px;
}
header .pll-parent-menu-item img {
	width: 20px !important;
	height: auto !important;
	object-fit: contain;
}
body header .mode a.elementor-item.has-submenu:hover svg path,
body header .mode  a.elementor-item.has-submenu:hover svg rect{
	fill: var(--third-color) !important;
}

/* heading */
.heading.lg :is(h1){font-size: var(--size-h1-lg);}
.heading :is(h1){font-size: var(--size-h1);}
.heading :is(h2){font-size: var(--size-h2);} 
.heading :is(h3){font-size: var(--size-h3);}
.heading :is(h4){font-size: var(--size-h4);}
.heading :is(h5){font-size: var(--size-h5);}
.heading :is(h6){font-size: var(--size-h6);}

.heading :is(h1, h2, h3, h4, h5, h6){
	font-family: var(--font-global); 	
	font-style: normal; 
	line-height: normal;
	color: var(--color-text) !important;
}

.w100 :is(h1, h2, h3, h4, h5, h6, p, div,span){font-weight: var(--font-weight-100) !important;} 
.w200 :is(h1, h2, h3, h4, h5, h6, p, div,span){font-weight: var(--font-weight-200) !important;} 
.w300 :is(h1, h2, h3, h4, h5, h6, p, div,span){font-weight: var(--font-weight-300) !important;} 
.w400 :is(h1, h2, h3, h4, h5, h6, p, div,span){font-weight: var(--font-weight-400) !important;} 
.w500 :is(h1, h2, h3, h4, h5, h6, p, div,span){font-weight: var(--font-weight-500) !important;} 
.w600 :is(h1, h2, h3, h4, h5, h6, p, div,span){font-weight: var(--font-weight-600) !important;} 
.w700 :is(h1, h2, h3, h4, h5, h6, p, div,span){font-weight: var(--font-weight-700) !important;} 
.w800 :is(h1, h2, h3, h4, h5, h6, p, div,span){font-weight: var(--font-weight-800) !important;} 
.w900 :is(h1, h2, h3, h4, h5, h6, p, div,span){font-weight: var(--font-weight-900) !important;} 

/* text style */
.txt, .txt p, .txt div, .txt span{ 
	font-family: var(--font-global); 
	font-size: var(--size-text);
	font-style: normal; 
	line-height: normal;
}
.txt.lg, .txt.lg p, .txt.lg div, .txt.lg span{ 
	font-size: var(--size-text-lg);
}
.txt.grey{
	color: var(--third-color);
}
/*btn style*/
.mode .btn{
	display: inline-flex;
	padding: 15px 76px;
	justify-content: center;
	align-items: center;
	gap: 38px;
	background: var(--color-text);
}
.mode .btn span, .btn a{
	color: var(--color-bg) !important;
	font-family: var(--font-global); 
	font-size:  var(--size-btn);
	font-style: normal;
	font-weight: var(--font-weight-400) !important;
	line-height: normal;
}
/* Btn Play*/

.play a{
	cursor: pointer;
	width: 98px !important;
	height: 98px;
	border-radius: 98px;
	padding: 20px;
	margin: 0px;
	background: url(/wp-content/uploads/2025/09/play.svg);
	text-indent: -9999px;
	white-space: nowrap;
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center
}
/*list style*/
.no-list ul{
	list-style:none;	
	margin: 0;
	padding: 0;
}
.no-list ul li {
	margin: 7px 0px;
}
/*Input style*/
input,
textarea,
select {
	background: transparent;
}
input:focus,
textarea:focus,
select:focus,
input:hover,
textarea:hover,
select:hover {
	border: none;
	background: none;
	outline: none;
	box-shadow: none;
}
.mode .forminator-ui.forminator-custom-form[data-design=material] .forminator-textarea--wrap:after{
	border:none;
}

/* select filter -- all filter */

.filter-select-hidden {
	display: none; 
}
.filter-select {
	position: relative; 
	cursor: pointer;
	user-select: none;
}
.filter-select::after {
	content: "";
	position: absolute;
	right: 10px;
	top: 50%;
	width: 18px;
	height: 18px;
	pointer-events: none;
	transform: translateY(-50%) rotate(0deg);
	transition: transform .35s ease; 
	background-color: var(--color-text);  
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;  
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain; 
	-webkit-mask-image: url(/wp-content/uploads/2025/09/downselect.svg);
	mask-image: url(/wp-content/uploads/2025/09/downselect.svg);
	background-size: contain;
}


.filter-select.open::after {
	transform: translateY(-50%) rotate(180deg);
}
.filter-select-trigger {
	background-color: var(--color-bg);
	border-bottom: 1px solid var(--color-text);
	padding: 7px 0px 2px; 
}
.filter-select-trigger::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	height: 1px;   
	width: 0;       
	background: var(--third-color);    
	transition: width 0.3s ease;
}
.filter-select-trigger:hover::after {
	width: 100%;
}
.filter-options {
	display: none;
	position: absolute;
	top: 100%;

	left: 0;
	right: 0;
	background: var(--color-bg); 
	border-radius: 6px;
	margin: 4px 0 0;
	font-size: var(--size-text-lg);
	list-style: none;
	padding: 10px;
	z-index: 10;
	box-shadow: rgba(33, 35, 38, 0.1) 0px 10px 10px -10px;
}
.filter-options li {
	padding: 6px 0px;
	transition: background 0.2s;
}
.filter-options li:hover {
	color:var(--third-color);
}
.filter-options li.selected {
	font-weight: var(--font-weight-600);
}

/* swiper */


/*/  Swiper Arrows next- Prev : Top/Bottom Left/Right */
.nav-arrows div.elementor-swiper-button-prev svg,
.nav-arrows div.elementor-swiper-button-next svg{
	display:none;
}
.nav-arrows div.elementor-swiper-button-prev,
.nav-arrows div.elementor-swiper-button-next{
	width:20px;
	height:20px;	
	justify-content: center;
	flex-direction: column;
}  
.nav-arrows div.elementor-swiper-button-next:after,
.nav-arrows div.elementor-swiper-button-prev:after{
	content: '';
	position: absolute;
	width: 17px;
	height: 16px; 
	background-color: var(--color-text);  
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;  
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain;
}
.nav-arrows div.elementor-swiper-button-next:after{
	right: 0;
	-webkit-mask-image: url(/wp-content/uploads/2025/09/arrow-right.svg);
	mask-image: url(/wp-content/uploads/2025/09/arrow-right.svg);
}
.nav-arrows div.elementor-swiper-button-prev:after{
	left: 0;
	-webkit-mask-image: url(/wp-content/uploads/2025/09/arrow-left.svg);
	mask-image: url(/wp-content/uploads/2025/09/arrow-left.svg);
}
/*/ Arrows top 40 */ 
.nav-arrows.top40 div.elementor-swiper-button-prev,
.nav-arrows.top40 div.elementor-swiper-button-next{
	top:-40px !important;
}
/*/ Arrows top 80 */ 
.nav-arrows.top80 div.elementor-swiper-button-prev,
.nav-arrows.top80 div.elementor-swiper-button-next{
	top:-80px !important;
}
/*Arrows - right */
.nav-arrows.left div.elementor-swiper-button-prev {
	left:calc((100% - var(--width-global)) / 2) !important;
}

.nav-arrows.left div.elementor-swiper-button-next{
	left:calc((100% - (var(--width-global) - 45px)) / 2) !important;
	right:auto !important;	
}

/*Arrows - right */
.nav-arrows.right div.elementor-swiper-button-prev {
	right:calc(( var(--width-global) - (var(--width-global) - 45px)) / 2) !important;
	left: auto !important;
}

.nav-arrows.right div.elementor-swiper-button-next{
	right:calc(( var(--width-global) - var(--width-global)) / 2) !important;
	left:auto !important;	
}

/*pagination top right*/
.nav-arrows.right .swiper-pagination{
	left: auto;	
	right: 0;	
	margin-right: -40px;
	margin-top: 4px;
}
.nav-arrows.top40 .swiper-pagination{
	top:-40px !important;
}
.nav-arrows.top80 .swiper-pagination{
	top:-80px !important;
}
.nav-arrows .swiper-pagination .swiper-pagination-bullet
{
	width: 32px;
	height: 3px;
	transition: var(--transition-global);
	border-radius:0;
	background: var(--color-text) !important;
}
.nav-arrows .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
	width: 64px;
	transition: var(--transition-global);
}

/* *********Services page - parent ctg ******************/
.services-ctg .child-categories {
	list-style: none; 
	counter-reset: list-counter;
	padding-left: 0;
}

.services-ctg .child-categories li {
	counter-increment: list-counter; 
	position: relative;
	padding: 45px 0px 45px 70px;
	border-top: 1px solid var(--color-text); 
}

.services-ctg .child-categories li::before {
	content: counter(list-counter, decimal-leading-zero) "";
	position: absolute;
	left: 0; 
	font-size: var(--size-a-lg);
	color: var(--third-color) !important; 
}
.services-ctg .child-categories li:hover::before {
	opacity:0.6;
}
.services-ctg .child-categories li a,
.services-ctg .child-categories li::before{
	font-family: var(--font-global); 	
	font-style: normal;
	font-weight: var(--font-weight-700) !important;
	line-height: normal;
}
.services-ctg .child-categories li a{
	font-size: var(--size-a-lg);
	color: var(--color-text) !important; 	
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
}
.services-ctg .child-categories li a:hover{
	opacity:0.6;
}
.services-ctg .child-categories li a span{ 
	color:  var(--third-color) !important; ;
	font-family: var(--font-global); 	
	font-size: var(--size-a-span);
	font-style: normal;
	font-weight: var(--font-weight-400) !important;;
	line-height: normal;	
	margin-right: 30px;	
	text-align: right;
}


.services-ctg .child-categories li a span:before,
.lineanimate a:before{
	content: "";
	position: absolute; 
	height: 1px !important;
	background-color: var(--third-color) !important;
	-webkit-transform: scaleX(0);
	-ms-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: left center;
	-ms-transform-origin: left center;
	transform-origin: left center;
	-webkit-transition: -webkit-transform 0.3s ease;
	transition: -webkit-transform 0.3s ease;
	-o-transition: transform 0.3s ease;
	transition: transform 0.3s ease;
	transition: transform 0.3s ease, -webkit-transform 0.3s ease;
	width:100%;
	bottom:8px;
}
.services-ctg .child-categories li a:hover span:before,
.lineanimate a:hover:before{
	-webkit-transform: scaleX(100%);
	-ms-transform: scaleX(100%);
	transform: scaleX(100%);
	-webkit-transform-origin: right center;
	-ms-transform-origin: right center;
	transform-origin: right center;
}



.services-ctg .child-categories li a span:after{
	content:'';
	width: 16px;
	height: 16px;
	background-image:url(/wp-content/uploads/2025/09/readmore-icon.svg);
	background-repeat:no-repeat;
	background-size:contain;	
	position: absolute;
	margin-top: 10px;	
	margin-left: 14px;

}
/* Heading animate bg */

.animatehover a  {
	position: relative;
	color: inherit;
	text-decoration: none; 
}
.animatehover a:after {
	content: '';
	position: absolute;
	transition: transform .5s ease;
} 
.animatehover a {
	display: inline-block;
	overflow: hidden;
} 
.animatehover a:after {
	content: var(--hover-text);
	left: 0;
	top: 0;
	width: 0; 
	color: var(--third-color);
	white-space: nowrap;
	overflow: hidden;
	transition: width .5s ease;
}
.animatehover > a {
	display: block;
	margin: 2px;
	padding: 10px;
	background: #9556AE;
} 
.animatehover a:hover:after {
	width: calc(100% - 0px);
} 

/* Heading animate */
.a-animateheading,.animatehover {
	--hover-text: attr(data-hover); 
}


.a-animateheading :is(h1, h2, h3, h4, h5, h6, p, div,span) {
	position: relative;
	overflow: hidden;
	display: block; 
	-webkit-box-flex: 1;
	-webkit-flex-grow: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	padding: 0;
}

.a-animateheading :is(h1, h2, h3, h4, h5, h6, p, div,span) a {
	display: block;
	-webkit-transition: -webkit-transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
	transition: -webkit-transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
	transition: transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
	transition: transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55), -webkit-transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.a-animateheading :is(h1, h2, h3, h4, h5, h6, p, div,span):after {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	content: var(--hover-text);
	display: inline; 
	-webkit-transition: top 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
	transition: top 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.a-animateheading :is(h1, h2, h3, h4, h5, h6, p, div,span):hover {
	color:  var(--color-text);
}

.a-animateheading :is(h1, h2, h3, h4, h5, h6, p, div,span):hover a {
	color:  var(--color-text);
	-webkit-transform: translateY(-100%);
	transform: translateY(-100%);	
}

.a-animateheading :is(h1, h2, h3, h4, h5, h6, p, div,span):hover:after {
	top: 0;
	color:var(--third-color) !important;
}

.a-animateheading :is(h1, h2, h3, h4, h5, h6, p, div,span):active {
	-webkit-animation-name: rubberBand;
	animation-name: rubberBand;
}



/* Link Animate */
.a-animate a {
	position: relative;
	overflow: hidden;
	display: block; 
	-webkit-box-flex: 1;
	-webkit-flex-grow: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	padding: 0;
}

.a-animate a div {
	display: block;
	-webkit-transition: -webkit-transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
	transition: -webkit-transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
	transition: transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
	transition: transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55), -webkit-transform 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.a-animate a:after {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	content: attr(data-hover);
	display: inline; 
	-webkit-transition: top 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
	transition: top 500ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.a-animate a:hover {
	color:  var(--color-text);
}

.a-animate a:hover div {
	color:  var(--color-text);
	-webkit-transform: translateY(-100%);
	transform: translateY(-100%);
}

.a-animate a:hover:after {
	top: 0;
}

.a-animate a:active {
	-webkit-animation-name: rubberBand;
	animation-name: rubberBand;
}

.backto{
	width:34px;
	height:33px; 
	background-repeat:no-repeat;
	background-size:contain;
	margin-top: -5px;
	background-color: var(--color-text);  
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;  
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain; 
	-webkit-mask-image: url(/wp-content/uploads/2025/09/back.svg);
	mask-image: url(/wp-content/uploads/2025/09/back.svg);
	background-size: contain;
	margin-right: 10px;
} 

/* ********Scroll down cta*****************/


.scroll-d{
	border-style: solid;
	border-width: 2px;
	border-color: var(--color-txt);
	border-radius: 32px;  
	height: 43px;
	width: 23px; 
	margin: 0 auto;
}

.scroll-d .scroll-d-div{
	border-style: solid;
	border-width: 2px;
	border-color: var(--color-txt);
	border-radius: 8px;
	background-color: var(--color-txt); 
	position: relative; 
	height: 3px;
	width: 3px; 
	margin: 0 auto; 
	animation: wheel_animation 1.5s linear infinite;
}

/*********Copy Link ***************/
.copy-link {
	position: relative;
	display: inline-block;
	cursor: pointer;	 
	padding-left: 40px;
	font-size: 26px;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	color:  var(--color-txt) !important;
}
.copy-link:hover{
	color: var(--third-color) !important;
}
.copy-link::before{
	content:''; 
	background-size:contain;
	width: 25.8px;
	height: 28px;
	background-repeat:no-repeat;	
	position: absolute;
	left: 0px;
	background-color: var(--color-text);  
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;  
	mask-repeat: no-repeat;
	mask-position: center;
	mask-size: contain; 
	-webkit-mask-image: url(/wp-content/uploads/2025/09/copylink.svg);
	mask-image: url(/wp-content/uploads/2025/09/copylink.svg);
	background-size: contain;
}
.copy-tooltip {
	display: none;
	position: absolute;
	top: -40px;
	left: 50%;
	transform: translateX(-50%);
	background:  var(--color-bg);
	color:  var(--color-txt) !important;
	font-size: 15px;
	padding:6px 10px;
	border-radius: 6px;
	white-space: nowrap;
	z-index: 10;
	box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
}


/* ******************Mansorry gallery*****************/
.project-gallery-masonry {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
	grid-auto-rows: auto;
	gap: 10px;
}

.project-gallery-masonry .masonry-item { 
	overflow: hidden;
	position: relative;
	transition: transform .65s cubic-bezier(.23, 1, .32, 1); 
}
.project-gallery-masonry .masonry-item a::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 6.7);
	background: linear-gradient(180deg,rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.69) 100%);
	opacity: 0;
	transition: opacity 0.3s ease;
	z-index: 2;
}

.masonry-item a:hover::before {
	opacity: 1;
}
.masonry-item {
	transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.6s ease;
	opacity: 1;
	transform: translateY(0);
	position: absolute;
	box-sizing: border-box;
}

.masonry-item.hided {
	opacity: 0;
	transform: translateY(30px);
	pointer-events: none;
}
.masonry-item.box-landscape {
	grid-column: span 2;
	grid-row: span 2;
} 
.masonry-item.box-portrait {
	grid-column: span 1;
	grid-row: span 2;
}

.masonry-item.box-double {
	grid-column: span 1;
	grid-row: span 2;
}

.masonry-item img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	display: block;
}


.project-empty-message{
	display:none;
	position: absolute;
}
.gallery-title {
	color: var(--color-text); 
	font-size: 36px;
	font-style: normal; 
	line-height: normal;
	text-transform: lowercase;	
	margin-top: 0;
	margin-bottom:10px;
}
.masonry-item:hover {
	transform: translateY(-4px);
}
.masonry-item  img {
	transition: transform 1.5s cubic-bezier(.19, 1, .22, 1);
}
.masonry-item:hover  img {
	transform: scale(1.05);
}
/* Bouton  switch dark/light */
#themeToggle {
	display: inline-block;
	width: 80px;
	height: 40px;
	background: var(--color-text) !important;
	border-radius: 40px;
	position: relative;
	text-decoration: none;
	cursor: pointer;
	overflow: hidden;
}

#themeToggle .elementor-button-text {
	display: none;
}

#themeToggle::before {
	content: ""; 
	position: absolute;
	left:10px;
	width: 20px;
	height: 20px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	top: 50%;
	transform: translateY(-50%);
	color: #fff;
	z-index: 2;
	background-color: var(--color-text) !important; /* color of the shape */
	-webkit-mask: url('/wp-content/uploads/2025/09/light.svg') no-repeat center / contain;
	mask: url('/wp-content/uploads/2025/09/light.svg') no-repeat center / contain;
}

#themeToggle::after {
	content: "";
	position: absolute; 
	background-color: var(--color-bg) !important; 
	-webkit-mask: url('/wp-content/uploads/2025/09/dark.svg') no-repeat center / contain;
	mask: url('/wp-content/uploads/2025/09/dark.svg') no-repeat center / contain;
	left:50px;
	width: 20px;
	height: 20px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	top: 50%;
	transform: translateY(-50%);
	color: #fff;
	z-index: 2;
}

#themeToggle::marker {
	content: none;  
}

#themeToggle::selection {
	background: transparent;  
}

#themeToggle span.elementor-button-content-wrapper::before {
	content: "";
	position: absolute;
	top: 4px;
	left: 4px;
	width: 32px;
	height: 32px; 
	border-radius: 50%;
	transition: all 0.3s ease;
	z-index: 1;
	background-color: var(--color-bg) !important; 
}

/* Footer */
footer a,
footer .heading :is(h1, h2, h3, h4, h5, h6){	color: #fff !important;}
footer a:hover{color: var(--third-color) !important;}



















body .mode svg path,
body .mode svg rect{
	fill: var(--color-text) !important;
}
body .mode svg circle {
	stroke: var(--color-text) !important;
}
.mode h2, .mode span, .mode >p {
	color: var(--color-text) !important;
	text-decoration: none; 
}  

#animatedText p { 
	max-width: 800px;
	margin: 40px auto;
	text-align: center; 
}

#animatedText   span { 

	color:var(--third-color) !important;
	transition: .21s ease-in-out;
}
#animatedText   span.active {
	color:var(--color-text) !important;
	transition: .21s ease-in-out;
} 
.forminator-textarea--wrap textarea{
	border-right: none!important;
	border-left: none!important;
	border-top: none!important;
}

@media (max-width: 782px) {
	.forminator-ui.forminator-custom-form[data-design=material] .forminator-button {
		width: 50%!important;
	}
}

.forminator-ui.forminator-custom-form[data-design=material] .forminator-button {
	width: 22%!important;
}

/* Apply Gilroy-Regular font only to Forminator form 13693 */
.forminator-module-13693,
.forminator-module-13693 .forminator-input,
.forminator-module-13693 .forminator-textarea,
.forminator-module-13693 .forminator-label,
.forminator-module-13693 .forminator-button {
	font-family: 'Gilroy-Regular'!important;
}
/* Remove input border on hover inside Forminator form 13693 */
.forminator-module-13693 .forminator-input:hover,
.forminator-module-13693 .forminator-textarea:hover {
	border: none !important;
	box-shadow: none !important; 
}




/* Mobile style*/
@media (max-width: 1024px) {

	header a.elementor-item{
		justify-content: end;
		padding: 20px 20px 20px 0 !important;
	} 
	header a.elementor-sub-item{
		justify-content: end;
		padding: 5px 20px 5px 0 !important;
	}
	header nav ul.elementor-nav-menu > li:last-child{
		margin-top:100px;		
		padding-bottom: 60px;
	} 
	.sizemenu nav ul > li .elementor-widget-container {
		align-items: end;
		padding-right: 20px;		
		background: var(--color-bg);
		transition: none;
	}
	.sizemenu nav ul{
		width:80%;
		background: var(--color-bg);
	}
	nav.elementor-nav-menu--dropdown.elementor-nav-menu__container{
		height:var(--height-hero) !important;		
		background: transparent;
	}
	header .mode .sub-menu li.menu-item:not(.lang-item) a.elementor-sub-item::before {
		display:none;
	}
	header a.elementor-sub-item{
		font-size: var(--size-link) !important;
	}
	header .pll-parent-menu-item .sub-menu.elementor-nav-menu--dropdown {
		max-width: 100% !important;
	}
	.services-ctg .child-categories li{		
		padding: 33px 0px 33px 50px;
	}
	.a-animate a div{
		width:66%;
	}
	.a-animate a div.link-sm{
		width:100%;
	}

	.a-animate a:after{
		opacity:0;
	}
	.a-animate a:hover div{
		-webkit-transform: translateY(0%);
		transform: translateY(0%);
	}
	.services-ctg .child-categories li a{		
		flex-direction: column;
		align-items: normal;
	}
	.services-ctg .child-categories li a span:after{

		width: 12px;
		height: 12px;
		margin-top:5px;
	}
	.services-ctg .child-categories li a span:before{
		bottom:0;
	}
	.copy-link {
		font-size:20px;
	} 
	.project-gallery-masonry { 
		grid-template-columns: repeat(1, 1fr);  
	}
	.masonry-item.box-double {
		grid-column: span 2; 
	}
	.project-gallery-masonry .project-gallery-item { 
		margin-bottom: 7.5px !important; 
	}
	.backto {
		width: 25px;
		height: 25px; 
		margin-top: -25px;
	}
	.detailstitle .backto { 
		margin-top: -30px;
	}
}
@media (max-width: 1200px) {
	.project-gallery-masonry { 
		grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); 
	}
} 
@media (min-width: 1201px) and (max-width: 1500px) {
	.project-gallery-masonry { 
		grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	}
} 
@media (min-width: 1501px) and (max-width: 1800px) {
	.project-gallery-masonry { 
		grid-template-columns: repeat(auto-fill, minmax(265px, 1fr));
	}
}
/*********End mobile style ********/
/* Key Frame */
@keyframes wheel_animation { 
	0% {
		opacity: 0;
		top: 2px;
	}
	50% {
		opacity: 1;
		top: 50%;
	}
	100% {
		opacity: 0;
		top: 33px;
	}
}


/* New  Css */

/* Cards style */
.team-member .card-content {
  padding: 50px 28px;
  color: transparent;
  background-color: transparent;
  position: absolute;
  z-index: 996;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  overflow: hidden;
 opacity: 0;
	justify-content: flex-end;
	-webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
	color:#FFF !important;
}
.team-member:hover .card-content {
 opacity: 1;
 background: rgba(0, 0, 0, 6.7);
	background: linear-gradient(180deg,rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.69) 100%);
	 
	-webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  height: 100%;
	     
} 
  
.team-member:hover .card-text{
	transform: translateY(-70px);
		-webkit-transition: all 0.1s ease-in-out;
  -moz-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
.mode .card-text h2, .mode  .card-text span, .mode  .card-text >p,
.card-text  .heading :is(h1, h2, h3, h4, h5, h6){
	color:#FFF !important;
}  
body .mode .card-content svg path, body .mode .card-content svg rect {
    fill:#FFF !important;
}

/* Accordions Style */

.accordions details{
	    box-shadow: 2px 8px 10px 0px rgba(0, 0, 0, 0.04); 
}
.accordions details summary{
	 background: var(--third-color) !important;
}

.bgmix {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
    transform: scale(1.1);
    animation: scaleImage .5s ease-out forwards;
	overflow:hidden;
}

.mix {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;   
    text-transform: uppercase;
    color: #fff;
    background-color: #000;
    mix-blend-mode:exclusion;
    opacity: 0;
    animation: fadeInText .8s .2s ease-out forwards;
}

@keyframes scaleImage {
    100% {
        transform: scale(1);
    }
}

@keyframes fadeInText {
    100% {
        opacity: 1;
    }
}