/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.7.1773742132
Updated: 2026-03-17 10:08:52

*/

/*==================================
  Root Variables
===================================*/
:root {
  --primary-color: #1A4DC6;  
  --text-color: #323E59;
  --text-color-light: rgba(50 62 89 / 85%);  
}

/*==================================
  BASIC CSS RESET
===================================*/
*,
*::before,
*::after { margin: 0; padding: 0; box-sizing: border-box; }
html { font-size: 16px;  scroll-behavior: smooth; }
body { line-height: 1.6; color: var(--text-color); background-color: #fff; -webkit-font-smoothing: antialiased; font-size: 16px;  }
input, button, textarea, select { font: inherit; border: none; outline: none; }

/*==================================
  TYPOGRAPHY
===================================*/
h1, h2, h3, h4, h5, h6, .elementor-heading-title { margin-bottom: 10px; line-height: 1.25; font-weight: 700; }
h1 { font-size: 64px; }
h2 { font-size: 48px; }
h3 { font-size: 28px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 18px; } 

a { color: inherit; text-decoration: none; transition: color 0.3s ease; }
a:focus { outline: none; }
a:hover { color: var(--primary-color); }

p { font-size: 16px; font-weight: normal; line-height: 1.6; }
p:not(:last-child) { margin-bottom: 10px; }
p:empty { display: none; }

.font-medium .elementor-heading-title { font-weight: 500;}
/*==================================
  Section Titles
===================================*/
.section-title h2,
.section-title h2.elementor-heading-title { font-size: 64px;}


/*==================================
  General CSS
===================================*/
.section-space { padding: 100px 20px; }
.bg-blue { background-color: var(--primary-color);}
.bg-blue .elementor-heading-title { color: #ffffff; }
.bg-blue .elementor-widget-text-editor { color: #ffffff;}
.bg-blue p { color: #ffffff; }

/*==================================
  Button Styles
===================================*/
/* Base Button */
.site-btn .elementor-button { padding: 0; background-color: transparent; color: rgba(255 255 255 / 85% ); font-size: 20px; line-height: 1.3; font-weight: 700; text-transform: uppercase;  letter-spacing: 1px; transition: 0.3s all ease-in-out;}
.site-btn .elementor-button:hover { color: #ffffff;}
.site-btn .elementor-button .elementor-button-content-wrapper { gap: 24px; align-items: center;}
.site-btn .elementor-button .elementor-button-icon { width: 90px; height: 90px; border: 3px solid var(--primary-color); border-radius: 50%; background-color: rgba(26 77 198 / 15%); display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; backdrop-filter: blur(16px);}
.site-btn .elementor-button .elementor-button-icon:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--primary-color); transition: 0.3s all ease-in-out; transform: scale(0); opacity: 0; border-radius: 50%; }
.site-btn .elementor-button:hover .elementor-button-icon { border: 0; }
.site-btn .elementor-button:hover .elementor-button-icon:after { transform: scale(1); opacity: 1; }
.site-btn .elementor-button .elementor-button-icon svg { width: 36px; height: 36px; z-index: 1; }

/*==================================
  Header
===================================*/
body:has(.offcanvas--open) { overflow: hidden; }

/* .header { position: absolute; top: 0; left: 0; width: 100%; height: 100%;} */

.header .header-top{ align-items: center; position: relative; z-index: 100;}
.project-template-default .header .header-top { background-color: rgb(30 34 38 / 65%); }
.header .header-top.active .social_list { display: none;}
.header .header-top .logo-wrap { max-width: 370px; padding: 0; }
.header .header-top .logo-wrap img { width: 100%; }
.header .header-top .menu-wrap { padding-right: 70px; gap: 48px; }
.header .header-top .menu-wrap .menu-wrap--right { max-width: 200px; }

.header .elementor-nav-menu--main .elementor-nav-menu li a { font-size: 20px; font-weight: 500; line-height: 1.3; text-align: center; position: relative; padding: 10px 30px; }
.header .elementor-nav-menu--main .elementor-nav-menu li a:before { content: ''; position: absolute; top: 50%; left: 0px; width: 4px; height: 13px; background-color: var(--primary-color); opacity: 0; transform: translateY(-50%) translateX(calc(30px - 0px)); transition: 0.3s all ease-in-out; }
.header .elementor-nav-menu--main .elementor-nav-menu li a:hover:before,
.header .elementor-nav-menu--main .elementor-nav-menu li.current-menu-item a:before { transform: translateY(-50%) translateX(calc(30px - 10px)); opacity: 1;}

.social_list .elementor-grid { gap: 40px; display: flex;}
.social_list .elementor-grid .elementor-grid-item a { font-size: 16px; font-weight: 900; color: #BFBFBF; letter-spacing: 1.5px; line-height: 1.5;  background-color: transparent; width: 22px; height: 22px;}
.social_list .elementor-grid .elementor-grid-item a svg { fill : #BFBFBF; width: 22px; height: 22px;}
.social_list .elementor-grid .elementor-grid-item a:hover svg { fill: var(--primary-color); }

.hamburger{ width: 32px; height: 24px; position: relative; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; }
.hamburger span { display: block; position: absolute; height: 3px; width: 25px; background: #BFBFBF; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; }
.hamburger span:nth-child(1) { top: 0px;}
.hamburger span:nth-child(2) { margin-left: 6px; top: 10px;}
.hamburger span:nth-child(3) { top: 20px;}
.hamburger.open span:nth-child(1) {     top: 10px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); transform: rotate(135deg); } 
.hamburger.open span:nth-child(2) { opacity: 0; left: -60px;}
.hamburger.open span:nth-child(3) { top: 10px; -webkit-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); }


/* Offcanvas Header */
.header-widget--grid { display: flex; flex-flow: wrap; gap: 24px;}
.header-widget--grid .header-widget--col { flex: 0 0 calc((100% - 48px) / 3); max-width: calc((100% - 48px) / 3); width: 100%;  gap: 0; }
.header-widget--grid .header-widget--col .elementor-heading-title { font-size: 20px; text-transform: uppercase; font-weight: 700; line-height: 1.5; color: #ffffff; margin-bottom:20px ; letter-spacing: 1.5px; }
.header-widget--grid .header-widget--col .elementor-widget-text-editor,
.header-widget--grid .header-widget--col .elementor-widget-text-editor ul li a  { font-size: 16px; font-weight: 400; color: #86898F; line-height: 1.5; letter-spacing: 1.5px;}
.header-widget--grid .header-widget--col .elementor-widget-text-editor ul li a { text-decoration: underline;}
.header-widget--grid .header-widget--col .elementor-widget-text-editor ul li a:hover { color: #ffffff; }
.header-widget--grid .header-widget--col .elementor-widget-text-editor ul li { list-style: none; }
.header-widget--grid .header-widget--col .elementor-widget-text-editor ul li:not(:last-child) { margin-bottom: 16px; }

.offcanvas { background-color: #1E2226; padding: 200px 20px 100px ; position: fixed; width: 100%; height: 100%; z-index: 90; opacity: 0; visibility: hidden; transition: 0.3s all ease-in-out; transform: translateY(-100%); overflow-y: auto; -webkit-overflow-scrolling: touch; }
.offcanvas > .e-con-inner { background-color: #1E2226; padding-block: 100px; } 
.offcanvas--open { opacity: 1; visibility: visible; transform: translateY(0);}
/* .offcanvas:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #1E2226; z-index: -1;} */

.offcanvas-nav ul.elementor-nav-menu li:not(:last-child) { margin-bottom: 20px;}
.offcanvas-nav ul.elementor-nav-menu li a { color: #BFBFBF; font-size: 64px; line-height: 1.23 !important; font-weight: 700; transition: 0.3s all ease-in-out; padding:0 0 0 96px!important; }
.offcanvas-nav ul.elementor-nav-menu li a:hover,
.offcanvas-nav ul.elementor-nav-menu li.current-menu-item a { padding-left: calc(96px + 30px) !important; color: #ffffff;}
.offcanvas-nav ul.elementor-nav-menu li a:before { content: ''; position: absolute; top: -9px; left: 0; width: 96px; height: 96px; background-image: url(images/arrow-right-white.svg); background-repeat: no-repeat; transition: 0.3s all ease-in-out; transform: scale(0); opacity: 0; background-size: 36px 36px; background-position: center center; background-color: var(--primary-color); border-radius: 50%; }
.offcanvas-nav ul.elementor-nav-menu li a:hover:before,
.offcanvas-nav ul.elementor-nav-menu li.current-menu-item a:before  { transform: scale(1); opacity: 1;}

@media only screen and (max-width:1499px), only screen and (max-height:700px) {
  .offcanvas-nav ul.elementor-nav-menu li a { font-size: 34px; padding: 0 0 0 48px !important; }
  .offcanvas-nav ul.elementor-nav-menu li:not(:last-child) { margin-bottom: 10px; }
  .offcanvas-nav ul.elementor-nav-menu li a:before { width: 48px; height: 48px; background-size: 18px 18px; top: -3px; }
  .offcanvas-nav ul.elementor-nav-menu li a:hover, 
  .offcanvas-nav ul.elementor-nav-menu li.current-menu-item a { padding-left: calc(48px + 20px) !important;}	
}

/*==================================
  Header Version 2
===================================*/
.header-v2 .elementor-nav-menu li a { font-size: 20px; line-height: 1.25; font-weight: 500; color: #ffffff; padding-block: 0; position: relative; }
.header-v2 .elementor-nav-menu li a:before { content: ''; position: absolute; top: 50%; left: 0; width: 4px; height: 15px; background-color: var(--primary-color); opacity: 0; visibility: hidden; transition: 0.3s all ease-in-out; transform: translateX(20px) translateY(-50%);}
.header-v2 .elementor-nav-menu li a:hover:before,
.header-v2 .elementor-nav-menu li.current-menu-item a:before { opacity: 1 !important; visibility: visible; transform: translateX(7px) translateY(-50%);}

.header-v2.header .header-top .menu-wrap  { max-width: 300px;}
.header-v2 .elementor-social-icons-wrapper { display: flex; align-items: center; gap: 40px;}
.header-v2 .elementor-social-icons-wrapper .elementor-grid-item a.elementor-social-icon { background-color: transparent; position: relative; height: auto; width: auto;}
.header-v2 .elementor-social-icons-wrapper .elementor-grid-item a.elementor-social-icon:before { content: '.'; position: absolute; bottom: -2px; right: -8px; color: #BFBFBF;  }
.header-v2 .elementor-social-icons-wrapper .elementor-grid-item a.elementor-social-icon svg { fill: #BFBFBF;}
.header-v2 .elementor-social-icons-wrapper .elementor-grid-item a.elementor-social-icon:hover svg { fill: #ffffff;}

/* Hero Section */
.hero-section-v2 .hero-slide { position: relative; min-height: 100vh; padding: 200px 20px 100px; justify-content: center; display: flex; }
.hero-section-v2 .hero-slide:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(30 34 38 / 60%); }
.hero-section-v2 .hero-slide--inner {max-width: 1000px; margin-inline: auto; text-align: center; color: #ffffff;}
.hero-v2-navigation { position: absolute; bottom: 50px; gap: 100px;}

/*==================================
  Hero Section
===================================*/
.hero-section { position: relative; background-color: rgba(30 34 38 / 100%); min-height: 100vh; padding: 200px 20px 100px; overflow: hidden; }
.hero-section:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/overlay-banner.jpg); background-size: cover; background-position: center; background-repeat: no-repeat; opacity: 0.05;}
.hero-section h1 { color: #ffffff; margin-bottom: 30px;}
.hero-section .elementor-widget-text-editor,
.hero-section p { color: #ffffff; }
.hero-section.e-con .elementor-widget-text-editor { margin-bottom: 30px;}

.hero-section .site-btn { margin-top: auto; }
.hero-section .site-btn .elementor-button {  color: #BFBFBF;}
.hero-section .site-btn .elementor-button:hover {  color: #ffffff;}
.hero-section .hero-left { padding-left: calc((100% - 1400px) / 2);}

.badge .elementor-heading-title { font-size: 16px; font-weight: 700; color: #ffffff; background-color: var(--primary-color); text-transform: uppercase; line-height: normal; padding: 12px 15px; border-radius: 30px; display: inline-flex; align-items: center; letter-spacing: 1px; }
.badge.white .elementor-heading-title {  color: var(--primary-color); background-color: #ffffff; }

/* .hero-section .slick-slider { margin:0 -15px; } */
.hero-section .gallery-slider { padding-left: 250px; }


/* .hero-section .slick-slider .slick-slide { max-width: 440px; width: 100%; padding-inline:40px; transition: 0.3s all ease-in-out; }
.hero-section .slick-slider .slick-slide img { border-radius: 32px; width: 100%; width: 440px; height: 480px; aspect-ratio: 440 / 480; height: auto; object-fit: cover; object-position: center; transition: 0.3s all ease-in-out; }
.hero-section .slick-slider .slick-slide.slick-active img { aspect-ratio: 400 / 480; } 
.hero-section .slick-slider .slick-track { display: flex; align-items: flex-end; min-height: 480px; } */

/* .hero-section .slick-slider .slick-list { overflow: visible;} */
.hero-section .slick-slider .slick-slide {max-width: 440px;width: 100%;padding-inline: 20px;}
.hero-section .slick-slider .slick-slide img {border-radius: 32px;width: 100%;width: 440px;height: 480px;aspect-ratio: 440 / 480;height: auto;object-fit: cover;object-position:center;transition: 0.3s all ease-in-out;}
.hero-section .slick-slider .slick-slide.slick-active img { aspect-ratio: 400 / 480;}
.hero-section .slick-slider .slick-track { display: flex; align-items: flex-end; min-height: 480px; }

.custom-nav { display: flex; gap: 30px; align-items: center; justify-content: center; }
.slick-dots { list-style: none; display: flex; gap: 20px; }
.slick-dots li { width: 12px; height: 12px; display: flex; align-items: center; justify-content: center;}
.slick-dots li button { border: 0; border-radius: 0; font-size: 0; padding: 0;   transform: rotate(45deg); background-color: #BFBFBF; width: 8px; height: 8px; transform: rotate(45deg); transition: 0.3s all ease-in-out;}
.slick-dots li button:hover,
.slick-dots li.slick-active button { background-color: var(--primary-color);  transform: rotate(45deg) scale(2); }
.custom-nav .slick-arrow { width: 90px; height: 90px; background-size: 36px 36px; background-position: center center; border-radius: 50%; background-repeat: no-repeat; position: relative; z-index: 1; background-color: rgb(26 77 198 / 15%); border: 3px solid var(--primary-color); transition: 0.3s all ease-in-out;}
.custom-nav .slick-arrow:hover { background-color: var(--primary-color); }
.custom-nav .custom-prev-btn { background-image: url(images/arrow-left-white.svg); }
.custom-nav .custom-next-btn { background-image: url(images/arrow-right-white.svg); }


/*==================================
  Counter Section
===================================*/
.counter-top { padding: 100px 20px 0; background-image: url(images/pattern.svg); background-repeat: no-repeat; background-size: auto;}
.counter-middle { padding-top: 40px; padding-bottom: 80px;}
.counter-bottom { padding: 0px 20px 100px; background-image: url(images/pattern-reverse.svg); background-repeat: no-repeat; background-size: auto; }

.bg-blue.counter-section h4.elementor-heading-title { font-weight: 500; color: rgba(255 255 255 / 85%) ;}
.counter-grid { padding-bottom: 80px; }
.counter-grid .e-con-inner{ display: flex; gap: 24px;}
.counter-grid .e-con-inner .elementor-widget-counter { flex: 0 0 calc((100% - 48px) / 3); max-width: calc((100% - 48px) / 3); width: 100%; }
.counter-grid .e-con-inner .elementor-widget-counter:not(:last-child) { border-right: 1px solid rgba(255 255 255 / 65%);}
.counter-grid .elementor-widget-counter .elementor-counter-title { color: rgba(255 255 255 / 85%); font-size: 16px; font-weight: 700; letter-spacing: 1px; line-height: 1.3; text-transform: uppercase;}
.counter-grid .elementor-widget-counter .elementor-counter-number-wrapper { color: #ffffff; margin-bottom: 15px; font-size: 96px; font-weight: 500; }
.bg-blue .site-btn .elementor-button .elementor-button-icon { background-color: rgba(255 255 255 / 15%); border: 0; }
.bg-blue .site-btn .elementor-button:hover .elementor-button-icon svg path { stroke: var(--primary-color);}
.bg-blue .site-btn .elementor-button .elementor-button-icon:after { background-color: #ffffff; }

.counter-slider { padding-right: calc((100% - 1400px) / 2);}
.counter-slider .counter-slide { position: relative; width: 100%; overflow: hidden; padding: 0; }
/* .counter-slider .counter-slide:after { content: ''; position: absolute; inset: 0; width: 100%; height: 100%; background-color: rgba(26, 77, 198, 0.05); z-index: 0;} */
.counter-slider .counter-slide .elementor-widget-image,
.counter-slider .counter-slide .elementor-widget-video { aspect-ratio: 829 / 494; max-width: 829px; position: relative; z-index: 1; }
.counter-slider .counter-slide .elementor-open-lightbox,
.counter-slider .counter-slide .elementor-open-lightbox .elementor-custom-embed-image-overlay { width: 100%; height: 100%; position: relative;}

.counter-slider .counter-slide .elementor-widget-video .elementor-open-inline { height: 100%; width: 100%;  }

.counter-slider .counter-slide img,
.counter-slider .counter-slide video,
.counter-slider .counter-slide .elementor-open-lightbox  { width: 100%; height: 100%; object-fit: cover; object-position: center;  /* filter: grayscale(1); -webkit-filter: grayscale(1); backdrop-filter: blur(11px); */ transition: 0.3s all ease-in-out; }
.counter-slide .elementor-custom-embed-image-overlay:before { content: ''; position: absolute; inset: 0; width: 100%; height: 100%; backdrop-filter: blur(11px);background-color: rgba(26, 77, 198, 0.05); z-index: 1;}
.counter-slider .counter-slide img,
.counter-slide .elementor-custom-embed-image-overlay img { filter: grayscale(1); -webkit-filter: grayscale(1); position: relative;}
.counter-slide .elementor-custom-embed-image-overlay .elementor-custom-embed-play { z-index: 1 ;}
.counter-slide .elementor-custom-embed-image-overlay .elementor-custom-embed-play svg { fill: none; }



.bg-blue .custom-nav .slick-arrow {  background-color: rgba(255 255 255 / 15%); border: 0; backdrop-filter: blur(16px); }
.bg-blue .custom-nav .slick-arrow:hover,
.bg-blue .custom-nav .slick-arrow.slick-disabled { background-color: rgba(255 255 255 / 100%); }
.bg-blue .custom-nav .slick-arrow.custom-prev-btn:hover,
.bg-blue .custom-nav .slick-arrow.custom-prev-btn.slick-disabled { background-image: url(images/arrow-left.svg);}
.bg-blue .custom-nav .slick-arrow.custom-next-btn:hover,
.bg-blue .custom-nav .slick-arrow.custom-next-btn.slick-disabled { background-image: url(images/arrow-right.svg);}
.bg-blue .slick-dots li button { background-color: #ffffff; }
.bg-blue .slick-dots li button:hover, 
.bg-blue .slick-dots li.slick-active button { background-color: #ffffff; transform: rotate(45deg) scale(2); }


/*==================================
  Proejcts
===================================*/
.projects-section { position: relative; overflow: hidden;}
/* .projects-section:before { content: ''; position: absolute; top: 0; left: 0; width: calc((100% - 1400px) / 2); height: 100%; background-color: #ffffff; z-index: 2;} */
.projects-section .swiper { overflow: visible;}
.projects-section h4.elementor-heading-title { font-weight: 500; }

.e-filter .e-filter-item { font-weight: 700; font-size: 16px; line-height: 1.25; text-transform: uppercase; display: flex; flex-direction: row; justify-content: center; align-items: center; padding: 11px 14px; gap: 10px; background-color: rgba(26, 77, 198, 0.1); backdrop-filter: blur(16px); border-radius: 30px; color: #53648C; transition: 0.3s all ease-in-out; letter-spacing: 0.05em;}
.e-filter .e-filter-item:hover, 
.e-filter .e-filter-item[aria-pressed=true] { background-color: var(--primary-color); color: #ffffff !important;}

.projects_loop { position: relative;}
.projects_loop .elementor-swiper-button { width: 90px; height: 90px; border-radius: 50%; position: relative; background-color: rgb(26 77 198 / 100%); z-index: 1; backdrop-filter: blur(16px); transition: 0.3s all ease-in-out; display: flex; align-items: center; justify-content: center; }
.projects_loop .elementor-swiper-button.swiper-button-disabled { background-color: rgb(26 77 198 / 25%); opacity: 1 !important; }
.projects_loop .elementor-swiper-button{  left: auto !important; transform: none !important;}
.projects_loop .elementor-swiper-button svg { fill: transparent !important; width: 36px !important; height: 36px !important;}
.projects_loop .elementor-swiper-button.elementor-swiper-button-prev { top: -165px !important; right: 114px; }
.projects_loop .elementor-swiper-button.elementor-swiper-button-next { top: -165px !important; right: 0; }

.projects-item { position: relative;}
.projects-item:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255 255 255 / 85%); z-index: 1; opacity: 0; transform: scale(0) ; transition: 0.3s all ease-in-out;}
.projects-item:hover:before { opacity: 1; transform: scale(1) ; }
.projects-item:after { content: ''; position: absolute; inset: 0; width: 100%; height: 100%; background-color: rgba(26, 77, 198, 0.05); }

.projects-item .projects_front { position: relative;}
.projects-item .projects_front .elementor-widget-image img { filter: grayscale(1); -webkit-filter: grayscale(1);  transition: 0.3s all ease-in-out; }
.projects-item:hover .projects_front .elementor-widget-image img { filter: grayscale(0); -webkit-filter: grayscale(0);}

.projects-item .projects_front .elementor-widget-post-info { position: absolute; top: auto; bottom: 40px; left: 40px; padding: 11px 15px; backdrop-filter: blur(16px); background: rgba(26, 77, 198, 0.85); font-size: 16px; letter-spacing: 0.05em; text-transform: uppercase; color: #FFFFFF; line-height: 1.25; border-radius: 30px; width: fit-content; transition: 0.3s all ease-in-out; opacity: 1;}
.projects-item:hover .projects_front .elementor-widget-post-info { opacity: 0;}

.projects-item .projects_hover { position: absolute; top: 0; left: 0; width: 100%; z-index: 2; height: 100%; overflow: hidden; }
.projects-item .projects_hover .projects_hover--top { position: absolute; top: 40px; right: 40px; width: auto;}
.projects-item .projects_hover .projects_hover--top a { width: 90px; height: 90px; border-radius: 50%; background-color: var(--primary-color); display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; transition: 0.3s transform ease-in-out; opacity: 0; transform: scale(0); transition-delay: 0.7s;}
.projects-item .projects_hover .projects_hover--top a:hover { background-color: #ffffff; }
.projects-item .projects_hover .projects_hover--top a:hover svg path { stroke: var(--primary-color);}
.projects-item:hover .projects_hover .projects_hover--top a { opacity: 1; transform: scale(1); }

.projects-item .projects_hover .projects_hover--bottom .elementor-widget-post-info {  padding: 11px 15px; backdrop-filter: blur(16px); background: rgba(26, 77, 198, 0.85); font-size: 16px; letter-spacing: 0.05em; text-transform: uppercase; color: #FFFFFF; line-height: 1.25; border-radius: 30px; width: fit-content; transform: translateY(50px); opacity: 0; visibility: hidden; transition: transform 0.35s ease, opacity 0.35s ease;}
.projects-item:hover .projects_hover .projects_hover--bottom .elementor-widget-post-info { transform: translateY(0); opacity: 1; visibility: visible; transition-delay: 0.2s; }

.projects-item .projects_hover .projects_hover--bottom .elementor-heading-title { font-weight: 700; font-size: 32px; line-height: 39px; color: var(--primary-color); margin-bottom: 0;}

.projects-item .projects_hover .projects_hover--bottom { position: absolute; bottom: 40px;  width: calc(100% - 80px); left: 40px;}
.projects-item .projects_hover .projects_hover--bottom .elementor-widget-heading {  transform: translateY(50px); opacity: 0; visibility: hidden; transition: transform 0.35s ease, opacity 0.35s ease; }
.projects-item:hover .projects_hover .projects_hover--bottom .elementor-widget-heading { transform: translateY(0); opacity: 1; visibility: visible; transition-delay: 0.4s;}

.projects-item .projects_hover .projects_hover--bottom .elementor-widget-theme-post-excerpt {  font-weight: 400; font-size: 16px; line-height: 24px; color: var(--text-color); transform: translateY(50px); opacity: 0; visibility: hidden; transition: transform 0.35s ease, opacity 0.35s ease;}
.projects-item:hover .projects_hover .projects_hover--bottom .elementor-widget-theme-post-excerpt { transform: translateY(0); opacity: 1; visibility: visible; transition-delay: 0.6s;}



/*==================================
  Hoai Section
===================================*/
.hoai-section { position: relative; background-color: var(--primary-color); background-image: url(images/combined-pattern.svg); background-repeat: no-repeat; background-size: auto; padding: 100px 0 ;}
.hoai-section h4.elementor-heading-title { font-weight: 500;}
.hoai-checklist { margin-top: 50px; }
.hoai-checklist .elementor-icon-box-title{ position: relative; font-weight: 700; font-size: 20px; line-height: 24px; letter-spacing: 0.05em; text-decoration-line: underline; text-decoration-thickness: 0.5px; text-underline-offset: 3px; text-decoration-color: rgba(255 255 255 / 50%); text-transform: uppercase; color: rgba(255, 255, 255, 0.85);}

.hoai-slider-wrapper { margin-top: 100px; margin-bottom: 50px; overflow: hidden;}
.hoai-slide .elementor-icon-box-wrapper .elementor-icon-box-icon { width: 132px; height: 132px; background: rgba(255, 255, 255, 0.15); backdrop-filter: blur(16px); display: flex; align-items: center; justify-content: center; margin-inline: auto; border-radius: 50%;}
.hoai-slide.slick-current .elementor-icon-box-wrapper .elementor-icon-box-icon { background-color: #ffffff; }

.hoai-slide .elementor-icon-box-wrapper .elementor-icon-box-icon svg { width: 40px; height: 40px;}
.hoai-slide.slick-current .elementor-icon-box-wrapper .elementor-icon-box-icon svg path { fill: #1AB2C6; }
.hoai-slide .elementor-icon-box-wrapper .elementor-icon-box-content .elementor-icon-box-title { font-size: 22px; line-height: 1.4; text-align: center; color: #ffffff; /* padding-bottom: 80px; */ white-space: nowrap; }
.hoai-slide .elementor-icon-box-wrapper .elementor-icon-box-content .elementor-icon-box-description { opacity: 0; }
.hoai-slide.slick-current .elementor-icon-box-wrapper .elementor-icon-box-content .elementor-icon-box-description { opacity: 1;}


.timeline-slider { position: relative; z-index: 1; }
.timeline-slider .slick-list { overflow: visible;}
.timeline-item { text-align: center; position: relative; }
.timeline-dot.slick-slide.slick-active span.dot-circle { width: 40px; height: 40px; background-color: var(--primary-color); display: flex; align-items: center; justify-content: center; margin-inline: auto; border-radius: 50%; border: 4px solid rgba(255 255 255 / 15%); position: relative;  z-index: 1;}
.timeline-dot.slick-slide.slick-current span.dot-circle { border-color: rgba(255 255 255 / 100%);}

.timeline-dot.slick-current span.dot-circle:before { content: ''; position: absolute; top: 50%; left: 50%; width: 22px; height: 22px; background: #ffffff; border-radius: 50%; transform: translate(-50%, -50%) scale(0); opacity: 0; transition: 0.3s all ease-in-out;}
.timeline-dot.slick-current span.dot-circle:before { transform: translate(-50%, -50%) scale(1);  opacity: 1 }

.timeline-dot.slick-slide.slick-current ~ .slick-slide span.dot-circle { border-color: rgba(255 255 255 / 15%); }


/* .timeline-wrapper { position: relative; top: -140px; } */
.timeline-dot { position: relative; min-height: 40px;}
.timeline-dot.slick-slide:before { background-color: rgba(255 255 255 / 100%); }
.timeline-dot.slick-active:before { background-color: rgba(255 255 255 / 15%); }
.timeline-dot:before { content: ''; position: absolute; top: 50%; left: 0; width: 100%; height: 2px; background-color: rgba(255 255 255 / 15%); transform: translateY(-50%); }
.timeline-dot:after { content: ''; position: absolute; top: 50%; left: 0; width: 50%; height: 2px; background-color: rgba(255 255 255 / 100%); transform: translateY(-50%); opacity: 0; }
.timeline-dot.slick-current:after { opacity: 1;}

.timeline-dot.slick-slide.slick-active ~ .timeline-dot:before { background-color: rgb(255 255 255 / 15%); }


/*==================================
  Team
===================================*/
.team-section h4.elementor-heading-title { font-weight: 500; }

.team-card .team-card__image img { filter: grayscale(1); -webkit-filter: grayscale(1);  transition: 0.3s all ease-in-out;}
.team-card:hover .team-card__image img { filter: grayscale(0); -webkit-filter: grayscale(0); }

.team-card__content { text-align: center; margin-top: 30px;}
.team-card__content .elementor-heading-title { margin-bottom: 0; font-size: 16px; letter-spacing: 0.05em; text-transform: uppercase; color: #FFFFFF; }
.team-card__content .elementor-heading-title a {  padding: 11px 15px; backdrop-filter: blur(16px); background-color: rgba(26, 77, 198, 0.85);  line-height: 1.25; border-radius: 30px; display: inline-block; transition: 0.3s all ease-in-out;}
.team-card__content .elementor-heading-title a:hover { background-color: rgba(26, 77, 198, 1); }
.team-card__content .elementor-widget-post-info ul { justify-content: center; } 
.team-card__content .elementor-widget-post-info ul li { font-weight: 500; font-size: 16px; line-height: 24px; color: var(--text-color); }
.team-card__content .elementor-widget-theme-post-excerpt { font-weight: 500; font-size: 16px; line-height: 24px; text-align: center; color: rgba(50, 62, 89, 0.85); }

/*==================================
  Testimonials Section
===================================*/
.tm-section { position: relative; background-color: var(--primary-color); background-image: url(images/pattern.svg); background-repeat: no-repeat; background-size: auto; padding: 140px 20px; }
.tm-section .tm-item .elementor-widget-text-editor,
.tm-section .tm-item .elementor-widget-text-editor p { font-weight: 500; font-size: 24px; line-height: 36px; text-align: center; color: rgba(255, 255, 255, 0.85); margin-bottom: 0;}
.tm-section .tm-slider .slick-track { display: flex;}

/* Arrows */
.tm-arrow { width: 90px; height: 90px; border-radius: 50%; position: relative; background: rgba(255, 255, 255, 1); z-index: 1;  backdrop-filter: blur(16px); transition: 0.3s all ease-in-out; display: flex; align-items: center; justify-content: center;}
.tm-arrow.is-disabled { background: rgba(255, 255, 255, 0.15); }
.tm-arrow:hover { background-color: #ffffff; }
.tm-arrow:not(.is-disabled) svg path,
.tm-arrow:hover svg path { stroke:var(--primary-color); }
.tm-arrow .elementor-icon-wrapper,
.tm-arrow .elementor-icon-wrapper svg  { width:36px; height: 36px; }
.testimonial-prev,
.testimonial-next { cursor: pointer; }

/* Progress bar */
.testimonial-progress-wrap { display: flex; align-items: center; gap: 24px; margin-top: 20px; }
.tp-current,
.tp-total { font-size: 24px; letter-spacing: 2px; color: #fff; font-weight: 600; }
.tp-bar { min-width: 350px; height: 4px; background: rgba(255,255,255,0.3); position: relative; overflow: hidden; }
.tp-fill { position: absolute; left: 0; top: 0; height: 100%; width: 0%; background: #fff; transition: width 0.4s ease; }


/*==================================
  Footer
===================================*/
footer { position: relative; background-color: rgba(30 34 38 / 100%); padding: 0px 20px; }
footer:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/overlay-banner.jpg); background-size: cover; background-position: center; background-repeat: no-repeat; opacity: 0.05;}

.footer_top .elementor-nav-menu--main ul.elementor-nav-menu { justify-content: space-between; padding: 100px 0;}
.footer_top .elementor-nav-menu--main ul.elementor-nav-menu:after { display: none;}
.footer_top .elementor-nav-menu--main ul.elementor-nav-menu li { width: auto; flex-grow: initial; }
.footer_top .elementor-nav-menu--main ul.elementor-nav-menu li a { font-size: 20px; color: rgba(255 255 255 / 45%); font-weight: 700; line-height: 1.5; letter-spacing: 1.5px; text-transform: uppercase; width: auto; padding: 0; transition: 0.3s all ease-in-out;}
.footer_top .elementor-nav-menu--main ul.elementor-nav-menu li a:hover,
.footer_top .elementor-nav-menu--main ul.elementor-nav-menu li.current-menu-item a { color: #ffffff; }

.ft-widget { row-gap: 40px; }
.ft-widget:not(:last-child) { margin-bottom: 20px;}
.ft-widget .elementor-heading-title { font-size: 16px; line-height: 1.5; font-weight: 600; color: #f3f3f3;}
.ft-widget .elementor-widget-text-editor { color: rgba(255 255 255 / 65%); font-size: 16px; font-weight: 600; line-height: 1.5; }
.ft-widget ul { list-style: none;}
.ft-widget ul li:not(:last-child) { margin-bottom: 40px; }
.ft-widget ul li a { text-decoration: underline;}
.ft-widget ul li a:hover { color: #ffffff;}

.footer_bottom { justify-content: space-between; margin-top: -85px; }
.footer_bottom .elementor-heading-title {  color: #fff; font-size: 40px; font-weight: 700; line-height: 1.2; }

.footer-logo { width: 464px; height: 464px; display: flex; align-items: center; justify-content: center; background-color: var(--primary-color); position: relative; z-index: 1; }
.footer-logo:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/pattern.svg); z-index: -1; }
.footer-logo img { width: 175px; height: 175px;}

.footer-v2 .ft-widget ul li:not(:last-child) { margin-bottom: 0;}
.footer-v2 .ft-widget ul li:nth-child(2) { margin-bottom: 40px; }
.footer-v2 .ft-widget .elementor-heading-title { color: rgba(255 255 255 / 65%); margin-bottom: 0; }
.footer-v2 .footer_bottom { margin-top: 0px;}
.footer-v2 .footer_bottom .footer-logo { margin-top: -225px;}

/*==================================
  About Us
===================================*/
.pagetitle_inner { position: relative; background-color: rgba(30 34 38 / 100%); min-height: 800px; padding: 200px 20px 100px; }
.pagetitle_inner:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/about-banner.jpg); background-size: cover; background-position: center; background-repeat: no-repeat; opacity: 0.05;}

.our-vision { position: relative; background-color: var(--primary-color); background-image: url(images/pattern.svg); background-repeat: no-repeat; background-size: auto; padding: 140px 20px; }

.behind-section { position: relative; z-index: 2;}
.behind-section:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/pattern-white.svg); background-size: auto; background-position: top center; background-repeat: no-repeat; }
.behind-section:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background-image: url(images/pattern-white-reverse.svg); background-size: auto; background-position: bottom center; background-repeat: no-repeat; z-index: -1; }

.gallery-grid { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 24px; grid-row-gap: 24px; }
.gallery-grid .elementor-widget-image { position: relative;}
.gallery-grid .elementor-widget-image:before { content: ''; position: absolute; inset: 0; width: 100%; height: 100%; background-color: rgba(26 77 198 / 50%); }
.gallery-grid .elementor-widget-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; filter: grayscale(1); -webkit-filter: grayscale(1); transition: 0.3s all ease-in-out;}
.gallery-grid .elementor-widget-image:hover img { filter: grayscale(0); -webkit-filter: grayscale(0);  }
.gallery-grid .elementor-widget-image:nth-child(1) { grid-area: 1 / 1 / 3 / 2;  width: 812px; height: 812px; object-fit: cover; object-position: center; aspect-ratio: 1 / 1; }
.gallery-grid .elementor-widget-image:nth-child(2) { grid-area: 1 / 2 / 2 / 3; width: 564px; height: 394px; object-fit: cover; object-position: center; aspect-ratio: 564 / 394;}
.gallery-grid .elementor-widget-image:nth-child(3) { grid-area: 2 / 2 / 3 / 3; width: 564px; height: 394px; object-fit: cover; object-position: center; aspect-ratio: 564 / 394;}


.milestone-section { position: relative;}
.milestone-section:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/combined-pattern.svg); background-size: auto; background-position: top center; background-repeat: no-repeat; }
/* .milestone-section:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background-image: url(images/pattern-reverses.svg); background-size: auto; background-position: bottom center; background-repeat: no-repeat; z-index: -1; } */
.milestones-grid { display: flex; gap: 24px; }
.milestones-grid .elementor-widget-icon-box { flex: 0 0 calc((100% - 24px) / 2); max-width: calc((100% - 24px) / 2); width: 100%; background: rgba(255, 255, 255, 0.05); backdrop-filter: blur(16px); padding: 80px 15px; }
.milestones-grid .elementor-widget-icon-box .elementor-icon-box-icon { width: 132px; height: 132px; background-color: #ffffff; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-inline: auto; margin-top: 50px; }
.milestones-grid .elementor-widget-icon-box .elementor-icon-box-icon svg{ width: 48px; height: 48px; }
.milestones-grid .elementor-widget-icon-box .elementor-icon-box-content .elementor-icon-box-title { font-weight: 700; font-size: 24px; line-height: 29px; text-align: center; color: #FFFFFF; margin-bottom: 24px;}
.milestones-grid .elementor-widget-icon-box .elementor-icon-box-content .elementor-icon-box-description { position: relative; font-weight: 400; font-size: 16px; line-height: 24px; text-align: center; color: rgba(255, 255, 255, 0.85); padding-top: 64px; margin-bottom: 50px;}
.milestones-grid .elementor-widget-icon-box .elementor-icon-box-content .elementor-icon-box-description:before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 40px; height: 40px; background-color: #ffffff; border: 9px solid var(--primary-color); border-radius: 50%;  }

.cta-section { position: relative; padding: 120px 20px;}
.cta-section .site-btn { margin-top: 20px; }
.cta-section .site-btn .elementor-button { color: var(--text-color);} 
.cta-section .site-btn .elementor-button:hover { color: var(--primary-color);} 
.cta-section .site-btn .elementor-button .elementor-button-icon { border: 0; }
.cta-section .site-btn .elementor-button .elementor-button-icon svg path { stroke: var(--primary-color); }
.cta-section .site-btn .elementor-button:hover .elementor-button-icon svg path { stroke: #ffffff;}

/*==================================
  Project Page
===================================*/
.project-hero { height: 100vh; position: relative; }
.project-hero:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #1E2226; z-index: 1; opacity: .5; }
.project-hero .project-nav-wrap { position: absolute; bottom: 100px; right: 0; }
.project-hero .slick-track { height: 100vh; }
.project-hero .project-slider-nav { justify-content: end; z-index: 1; position: relative; }
.project-hero .custom-nav .slick-arrow { background-color: rgba(255, 255, 255, 0.15); backdrop-filter: blur(16px);  border: 0;}
.project-hero .custom-nav .slick-arrow:not(.slick-disabled) { background-color: var(--primary-color); }
.project-slider .project-slide img { filter: grayscale(1); -webkit-filter: grayscale(1); }
.project-slider .slick-dots li button { background-color: #ffffff; }

.badge.white .elementor-post-info li { font-size: 16px; font-weight: 700; color: var(--primary-color); background-color: #ffffff; text-transform: uppercase; line-height: normal; padding: 12px 15px; border-radius: 30px; display: inline-flex; align-items: center; letter-spacing: 1px; }

.proejct-brief { position: relative; z-index: 3;}
.proejct-brief:before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/pattern.svg); background-size: auto; background-position: top center; background-repeat: no-repeat; z-index: -1;}
.proejct-brief:after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/pattern-reverse.svg); background-size: auto; background-position: bottom center; background-repeat: no-repeat;  z-index: -1;}
.proejct-brief .elementor-widget-theme-post-excerpt,
.proejct-brief p { color: rgba(255 255 255 / 85%); }
.proejct-brief .site-btn .elementor-button { color: #ffffff; }

.project-details { list-style: none; max-width: 450px; margin-top: 30px; margin-bottom: 50px;}
.project-details li { display: flex; justify-content: space-between; }
.project-details li strong { font-weight: 700; font-size: 20px; line-height: 24px; letter-spacing: 0.05em; text-transform: uppercase; color: #FFFFFF; }
.project-details li:not(:last-child) { margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid rgba(255 255 255 / 65%); }

.story-section { position: relative; background-color: #F3F3F3; background-image: url(images/pattern-white.svg); background-repeat: no-repeat; background-size: auto; }
.story-section .e-con-inner { max-width: 1200px; width: 100%; margin-inline: auto;}
.story-section .elementor-widget-text-editor,
.story-section .elementor-widget-text-editor p { font-size: 24px; font-weight: 500; line-height: 1.5; color: rgba(50 62 89 / 85%); }

.cta-project { position: relative;  background-image: url(images/pattern.svg); background-repeat: no-repeat; background-size: auto; padding: 120px 20px;}
.btn-group {display: flex; align-items: center; justify-content: space-between; margin-top: 50px; }

.project-gallery-grid { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 24px; grid-row-gap: 24px; }
.project-gallery-grid .gallery-item { position: relative;}
.project-gallery-grid .gallery-item:nth-child(1) { grid-area: 1 / 1 / 3 / 2;  width: 812px; height: 812px; object-fit: cover; object-position: center; aspect-ratio: 1 / 1; }
.project-gallery-grid .gallery-item:nth-child(2) { grid-area: 1 / 2 / 2 / 3; width: 564px; height: 394px; object-fit: cover; object-position: center; aspect-ratio: 564 / 394;}
.project-gallery-grid .gallery-item:nth-child(3) { grid-area: 2 / 2 / 3 / 3; width: 564px; height: 394px; object-fit: cover; object-position: center; aspect-ratio: 564 / 394; }
.project-gallery-grid .gallery-item img { width: 100%; height: 100%; object-fit: cover; object-position: center; filter: grayscale(1); -webkit-filter: grayscale(1); transition: 0.3s all ease-in-out; position: relative;}
.project-gallery-grid .gallery-item:before { content: ''; position: absolute; inset: 0; width: 100%; height: 100%; background-color: rgba(26 77 198 / 50%); }
.project-gallery-grid .gallery-item:hover img { filter: grayscale(0); -webkit-filter: grayscale(0); }

.full-gallery-grid { display: flex; gap: 24px; }
.full-gallery-grid .gallery-item { position: relative;}
.full-gallery-grid .gallery-item img { width: 100%; height: 100%; aspect-ratio: 1 / 1; object-fit: cover; object-position: center; filter: grayscale(1); -webkit-filter: grayscale(1); transition: 0.3s all ease-in-out; position: relative;}
.full-gallery-grid .gallery-item:hover img { filter: grayscale(0); -webkit-filter: grayscale(0); }


/*==================================
  Responsive CSS  
===================================*/
@media only screen and (max-width:1649px) {
	.hero-v2-navigation { gap: 50px; bottom: 0px;}
}
@media only screen and (max-width:1499px) {
	
}
@media only screen and (max-width:1365px) {
	
}
@media only screen and (max-width:1279px) {
	
}
@media only screen and (max-width:1169px) {
	
}
@media only screen and (max-width:1023px) {
	
}
@media only screen and (max-width:767px) {
	
}
@media only screen and (max-width:639px) {
	
}
@media only screen and (max-width:575px) {
	
}
@media only screen and (max-width:479px) {
	
}