.elementor-377 .elementor-element.elementor-element-aa16dfc{--display:flex;--flex-direction:row-reverse;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap-reverse;--align-items:center;border-style:solid;--border-style:solid;border-width:0px 0px 01px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:01px;--border-left-width:0px;border-color:#ECECEC;--border-color:#ECECEC;--border-radius:0px 0px 0px 0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-377 .elementor-element.elementor-element-1696280{--display:flex;}.elementor-377 .elementor-element.elementor-element-1696280.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-377 .elementor-element.elementor-element-ab40c54{text-align:end;}.elementor-377 .elementor-element.elementor-element-ab40c54 img{width:50%;}.elementor-377 .elementor-element.elementor-element-bf28181{--display:flex;}.elementor-377 .elementor-element.elementor-element-bf28181.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-377 .elementor-element.elementor-element-0c3b582 .elementor-menu-toggle{margin:0 auto;}.elementor-377 .elementor-element.elementor-element-0c3b582 .elementor-nav-menu .elementor-item{font-family:"Gibbson", Sans-serif;font-size:16px;font-weight:400;text-transform:uppercase;}.elementor-377 .elementor-element.elementor-element-0c3b582 .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-secondary );fill:var( --e-global-color-secondary );padding-left:33px;padding-right:33px;}.elementor-377 .elementor-element.elementor-element-0c3b582 .elementor-nav-menu--main .elementor-item:hover,
					.elementor-377 .elementor-element.elementor-element-0c3b582 .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-377 .elementor-element.elementor-element-0c3b582 .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-377 .elementor-element.elementor-element-0c3b582 .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-secondary );fill:var( --e-global-color-secondary );}.elementor-377 .elementor-element.elementor-element-0c3b582 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-377 .elementor-element.elementor-element-0c3b582 .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-primary );}.elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-framed .elementor-item:before,
					.elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-primary );}.elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-framed .elementor-item:before{border-width:1px;}.elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-framed.e--animation-draw .elementor-item:before{border-width:0 0 1px 1px;}.elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-framed.e--animation-draw .elementor-item:after{border-width:1px 1px 0 0;}.elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-framed.e--animation-corners .elementor-item:before{border-width:1px 0 0 1px;}.elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-framed.e--animation-corners .elementor-item:after{border-width:0 1px 1px 0;}.elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-underline .elementor-item:after,
					 .elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-overline .elementor-item:before,
					 .elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-double-line .elementor-item:before,
					 .elementor-377 .elementor-element.elementor-element-0c3b582 .e--pointer-double-line .elementor-item:after{height:1px;}.elementor-377 .elementor-element.elementor-element-6c6d39b{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:center;}.elementor-widget-button .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-377 .elementor-element.elementor-element-e9bab91 .elementor-button{background-color:var( --e-global-color-primary );font-family:"Gibbson", Sans-serif;font-size:17px;font-weight:700;text-transform:uppercase;letter-spacing:1px;border-radius:0px 0px 0px 0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-377 .elementor-element.elementor-element-e1f442c{padding:5px 5px 5px 5px;border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-secondary );text-align:center;}.elementor-377 .elementor-element.elementor-element-e1f442c .elementor-heading-title{font-family:"Gibbson", Sans-serif;font-size:18px;font-weight:400;color:var( --e-global-color-secondary );}.elementor-377 .elementor-element.elementor-element-51ef6eb{padding:5px 5px 5px 5px;border-style:solid;border-width:1px 1px 1px 1px;border-color:var( --e-global-color-secondary );text-align:center;}.elementor-377 .elementor-element.elementor-element-51ef6eb .elementor-heading-title{font-family:"Gibbson", Sans-serif;font-size:18px;font-weight:400;color:var( --e-global-color-secondary );}.elementor-widget-icon.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-widget-icon.elementor-view-framed .elementor-icon, .elementor-widget-icon.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-primary );}.elementor-377 .elementor-element.elementor-element-d36d90c .elementor-icon-wrapper{text-align:center;}.elementor-377 .elementor-element.elementor-element-d36d90c.elementor-view-stacked .elementor-icon{background-color:#747474;}.elementor-377 .elementor-element.elementor-element-d36d90c.elementor-view-framed .elementor-icon, .elementor-377 .elementor-element.elementor-element-d36d90c.elementor-view-default .elementor-icon{color:#747474;border-color:#747474;}.elementor-377 .elementor-element.elementor-element-d36d90c.elementor-view-framed .elementor-icon, .elementor-377 .elementor-element.elementor-element-d36d90c.elementor-view-default .elementor-icon svg{fill:#747474;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}@media(max-width:1024px){.elementor-377 .elementor-element.elementor-element-aa16dfc{--justify-content:space-evenly;--align-items:flex-end;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-377 .elementor-element.elementor-element-0c3b582 .elementor-nav-menu--main .elementor-item{padding-left:12px;padding-right:12px;}.elementor-377 .elementor-element.elementor-element-d36d90c .elementor-icon{font-size:28px;}.elementor-377 .elementor-element.elementor-element-d36d90c .elementor-icon svg{height:28px;}}@media(max-width:767px){.elementor-377 .elementor-element.elementor-element-aa16dfc{--justify-content:center;--flex-wrap:wrap;}.elementor-377 .elementor-element.elementor-element-1696280{--width:46%;}.elementor-377 .elementor-element.elementor-element-1696280.e-con{--order:-99999 /* order start hack */;}.elementor-377 .elementor-element.elementor-element-ab40c54{text-align:center;}.elementor-377 .elementor-element.elementor-element-ab40c54 img{width:70%;}.elementor-377 .elementor-element.elementor-element-6c6d39b{--width:46%;--flex-direction:row-reverse;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap-reverse;--justify-content:center;--gap:0px 14px;--row-gap:0px;--column-gap:14px;}.elementor-377 .elementor-element.elementor-element-6c6d39b.e-con{--order:-99999 /* order start hack */;}.elementor-377 .elementor-element.elementor-element-e1f442c{padding:5px 5px 5px 5px;}.elementor-377 .elementor-element.elementor-element-e1f442c .elementor-heading-title{font-size:18px;line-height:18px;}.elementor-377 .elementor-element.elementor-element-51ef6eb{padding:5px 5px 5px 5px;}.elementor-377 .elementor-element.elementor-element-51ef6eb .elementor-heading-title{font-size:18px;line-height:18px;}.elementor-377 .elementor-element.elementor-element-d36d90c{margin:5px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-377 .elementor-element.elementor-element-d36d90c .elementor-icon-wrapper{text-align:center;}.elementor-377 .elementor-element.elementor-element-d36d90c .elementor-icon{font-size:29px;}.elementor-377 .elementor-element.elementor-element-d36d90c .elementor-icon svg{height:29px;}}@media(min-width:768px){.elementor-377 .elementor-element.elementor-element-1696280{--width:20%;}.elementor-377 .elementor-element.elementor-element-bf28181{--width:48%;}.elementor-377 .elementor-element.elementor-element-6c6d39b{--width:38%;}}@media(max-width:1024px) and (min-width:768px){.elementor-377 .elementor-element.elementor-element-1696280{--width:25%;}.elementor-377 .elementor-element.elementor-element-6c6d39b{--width:70%;}}/* Start custom CSS for container, class: .elementor-element-aa16dfc *//* Initial header background */
.sticky-header {
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
  background-color: transparent;
}

/* On scroll */
.elementor-sticky--effects.sticky-header {
  background-color: #1c1c1c; /* Change to your desired color */
  box-shadow: 0 2px 10px rgba(0,0,0,0.2);
}

.elementor-sticky--effects .elementor-nav-menu--main .elementor-item {
  color: #ffffff !important;
  fill: #ffffff !important; /* for SVG icons if any */
}

/* Force white text and border color on sticky header for language switcher */
.elementor-sticky--effects .elementor-element.elementor-widget-heading,
.elementor-sticky--effects .elementor-widget-button,
.elementor-sticky--effects .elementor-widget-button .elementor-button {
  color: #ffffff !important;
  border-color: #ffffff !important;
}

/* Optional: background transparent or brand blue on hover */
.elementor-sticky--effects .elementor-widget-button .elementor-button:hover {
  background-color: #0465C8 !important;
  color: #ffffff !important;
  border-color: #0465C8 !important;
}

/* Fix AR/EN Heading Text Color inside Sticky Header */
.elementor-sticky--effects .elementor-widget-heading .elementor-heading-title {
  color: #ffffff !important;
  border-color: #ffffff !important; /* if there's a box */
}



/* Default logo (before scroll) */
.header-logo img {
  filter: brightness(0) invert(1); /* White version */
  transition: all 0.3s ease;
}

/* Default menu text (white) */
.header-nav .elementor-item {
  color: #ffffff;
  transition: color 0.3s ease;
}

/* Sticky Header - Dark Background */
.elementor-sticky--effects .header-logo img {
  filter: none; /* Original logo color (dark) */
}

.elementor-sticky--effects .header-nav .elementor-item {
  color: #ffffff; /* or #000000 depending on your dark bg */
}


/* Default header logo */
.elementor-sticky--effects .elementor-element-1696280 img{
  content: url('https://www.hattansecurity.ae/wp-content/uploads/2025/07/hattan-logo-arabic-new.png'); 
  transition: all 0.3s ease;
}

/* Sticky logo on scroll */
.elementor-sticky--effects .elementor-element-ab40c54 img {
  content: url('https://www.hattansecurity.ae/wp-content/uploads/2025/07/white-hattan-logo-arabic-new.png'); /* dark bg logo */
}


/* Change logo on sticky header */
.elementor-element-ab40c54 img {
  content: url('https://www.hattansecurity.ae/wp-content/uploads/2025/07/hattan-logo-arabic-new.png');
  transition: all 0.3s ease-in-out;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Gibbson';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://www.hattansecurity.ae/wp-content/uploads/2025/07/gibson-regular.ttf') format('truetype');
}
@font-face {
	font-family: 'Gibbson';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://www.hattansecurity.ae/wp-content/uploads/2025/07/gibson-medium.ttf') format('truetype');
}
@font-face {
	font-family: 'Gibbson';
	font-style: italic;
	font-weight: 500;
	font-display: auto;
	src: url('https://www.hattansecurity.ae/wp-content/uploads/2025/07/gibson-mediumitalic.ttf') format('truetype');
}
@font-face {
	font-family: 'Gibbson';
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url('https://www.hattansecurity.ae/wp-content/uploads/2025/07/gibson-bold.ttf') format('truetype');
}
@font-face {
	font-family: 'Gibbson';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://www.hattansecurity.ae/wp-content/uploads/2025/07/gibson-semibold.ttf') format('truetype');
}
@font-face {
	font-family: 'Gibbson';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://www.hattansecurity.ae/wp-content/uploads/2025/07/gibson-semibold.ttf') format('truetype');
}
/* End Custom Fonts CSS */