/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Aug 05 2025 | 15:38:21 */
/* Global CSS */

* {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

body {
    padding: 0;
    margin: 0;
    width: 100%;
/*     overflow-x: hidden; */
    position: relative;
    background-color: #00020F;
    scroll-behavior: smooth;
}
	
html {
    height: 100%;
    width: 100%;
    overflow-x: hidden;
    scroll-behavior: smooth;
	margin:0 !important;
}
header,
footer {
    display: none !important;
}
	
ol,
ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* .main-service {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.main-service::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 0%;
  width: 100%;
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, #0094DE 50%, rgba(255,255,255,0) 100%);
  transition: height 0.5s ease;
  z-index: -1;
}

.main-service:hover::before {
  height: 100%;
} */
.portfolio-btn a {
  position: relative;
  display: inline-block;
  border-radius: 100px;
  text-decoration: none;
  color: #fff;
  background: #FFFFFF0D;
  z-index: 1;
}

.portfolio-btn a::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 100px;
  padding: 1px; 
  background: linear-gradient(180deg, #0094DE 50.18%, #1A4FFF 100%);
  -webkit-mask: 
    linear-gradient(#fff 0 0) content-box, 
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  z-index: -1;
}
.value-icon-box-s .elementor-icon-box-title {
  position: relative;
}
.value-icon-box-s .elementor-icon  {
    background: linear-gradient(180deg, rgba(0, 148, 222, 0.05) 50.18%, rgba(0, 148, 222, 0.1) 100%) !important;
}
/* Initial line */
.value-icon-box-s .elementor-icon-box-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: clamp(-15px, -2.222vw, -32px);
  width: 50%;
  height: 1px;
  border-bottom: 0.5px solid transparent;
  border-image-source: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.08) 0%,
    rgba(255, 255, 255, 0.32) 50%,
    rgba(255, 255, 255, 0.08) 100%
  );
  border-image-slice: 1;
  transition: width 0.5s ease;
}

/* Hover effect on .main-service expands the line */
.main-service:hover .value-icon-box-s .elementor-icon-box-title::after {
  width: 100%;
}

.s-border-line {
  border: 0.5px solid transparent; /* Needed for border-image to apply */
  border-image-source: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #0094DE 50%, rgba(255, 255, 255, 0) 100%);
  border-image-slice: 1; /* Required for gradient to fill the border */
}

.approach-box .elementor-icon  {
    background: linear-gradient(180deg, rgba(0, 148, 222, 0.05) 50.18%, rgba(0, 148, 222, 0.1) 100%) !important;
}
.box-line-image {
  border: 0.75px solid transparent; /* Ensure the border exists */
  border-image-source: linear-gradient(149.35deg, #0094DE 0%, rgba(0, 148, 222, 0) 100%);
  border-image-slice: 1; /* Required to apply the gradient */
}
.value-icon-box .elementor-icon  {
    background: linear-gradient(180deg, rgba(0, 148, 222, 0.05) 50.18%, rgba(0, 148, 222, 0.1) 100%) !important;
}
.image-wrapper > div {
  display: none;
}

.mobile-menu a.elementor-item-active {
	border-radius:10px !important;
}
	.elementor-widget-off-canvas .e-off-canvas__main {
    height: 100vh !important;
}
	.header-Scrolled .navbar-1 {
    background: #FFFFFF03 !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
    transition: all 0.3s ease-in-out;
    backdrop-filter: blur(14.399999618530273px) !important;

}

.feature-accordion {
  position: relative;
  padding-left: 20px; /* optional, ensures content doesn't overlap */
}

/* Light base vertical bar */
.feature-accordion::before {
  content: "";
  position: absolute;
  top: 0;
  left: -40px; /* adjust this value if the bar is too far or too close */
  width: 4px;
  height: 100%;
  background-color: #ccc;
  z-index: 0;
}

/* The dynamic glow blocks for active accordions */
.feature-accordion .glow-indicator {
  position: absolute;
  left: -40px; /* same as the bar */
  width: 4px;
  height: 0; /* set dynamically via JS */
  background-color: #0094DE;
  box-shadow: 0px 0px 25px 0px #0094DE;
  z-index: 2;
  transition: all 0.3s ease;
}
/* .image-display img {
  display: none ;
  max-width: 100% !important;
} */
.top-line {
  position: relative;
}

.top-line::before {
  content: "";
  position: absolute;
  top: 0; /* Position it at the top */
  left: 50%;
  transform: translateX(-50%);
  width: 60%;
  height: 1px;
  border-top: 0.73px solid;
  border-image-source: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    #0094DE 50%,
    rgba(255, 255, 255, 0) 100%
  );
  border-image-slice: 1;
}

.bottom-line::after {
	content:"";
  border: 0.5px solid;
  border-image-source: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(0, 148, 222, 0.32) 50%, rgba(255, 255, 255, 0) 100%);
  border-image-slice: 1;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 1px;
  width: 90%;

}
.white-center-border::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 100%;
  border-left: 0.5px solid transparent;
  border-image-source: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.08) 0%,
    rgba(255, 255, 255, 0.32) 50%,
    rgba(255, 255, 255, 0.08) 100%
  );
  border-image-slice: 1;
}

.value-icon-box .elementor-icon-box-title {
  position: relative;
}

.value-icon-box .elementor-icon-box-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: clamp(-15px,-2.222vw,-32px);
  width: 100%;
  height: 1px;
  border-bottom: 0.5px solid transparent;
  border-image-source: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.08) 0%,
    rgba(255, 255, 255, 0.32) 50%,
    rgba(255, 255, 255, 0.08) 100%
  );
  border-image-slice: 1;
}
.value-icon-box .elementor-icon-box-description {
	padding-top:clamp(15px,2.222vw,32px) !important;
}

.white-border::after {
	position:absolute;
	content:"";
  border-top: 0.5px solid transparent;
  border-image-source: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.08) 0%,
    rgba(255, 255, 255, 0.32) 50%,
    rgba(255, 255, 255, 0.08) 100%
  );
  border-image-slice: 1;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
	width:58%;
}
.box-line {
  border-top: 0.5px solid;
  border-image-source: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #0094DE 50%, rgba(255, 255, 255, 0) 100%);
  border-image-slice: 1;
  border-left: 0;
  border-right: 0;
  border-bottom: 0;
}



.box-line-2 {
  position: relative;
}

.box-line-2::after {
  content: "";
  position: absolute;
  top: -10px;
  left: 0;
  width: 100%;
  height: 1px; /* thickness of the line */
  border-top: 0.5px solid transparent;
  border-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #0094DE 50%, rgba(255, 255, 255, 0) 100%);
  border-image-slice: 1;
}
.wprimary-btn {
  transition: background-color 0.3s ease;
}

.wprimary-btn:hover {
  background-color: #6D6493; 
}

.text-gradiant {
  background: linear-gradient(270deg, rgba(255, 255, 255, 0.96) 0%, #FFFFFF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.blue-color {
  background: #0094DE;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.cursor-circle {
    width: 10px;
    height: 10px;
    background: #fff;
    border-radius: 50%;
    position: absolute;
    pointer-events: none;
    z-index: 9999;
    transition: transform 0.1s ease, background-color 0.1s ease;
}

.swiper-slide-active .slider-inner-box p {
	color:#fff !important;
}

.swiper-slide-active .slider-inner-box {
  background-color:#012245 !important;
}

.grey-colour {
	color:#D7D7D7;
} 

.border {
  position: relative;
  display: inline-block;
	color:#0094DE;
}

span.border {
    padding-left: clamp(100px,10.417vw,150px);
}

.border::before {
    content: '';
    position: absolute;
    left: 0;
    border: 3.5px solid transparent;
    border-image-source: linear-gradient(90deg, #0094DE 43.39%, rgba(255, 255, 255, 0) 93.9%);
    border-image-slice: 1;
    width: clamp(100px,10.417vw,150px);
    transform: translatey(-50%);
    top: 50%;
}


.primary-button a {
    width: auto;
    background: #0094DE;
    display: flex;
    justify-content: center !important;
    align-items: center;
    transition: all 0.3s ease-in-out !important;
}

.primary-button {
    justify-content: center !important;
    align-items: center !important;
}

.primary-button a:hover {
    color: #0094DE !important;
    border-color: #0094DE !important;
    background-color: transparent !important;
    transition: all 0.3s ease-in-out !important;
}

.primary-button .elementor-button-icon svg {
    width: clamp(16px,1.389vw,20px);
    height: clamp(12px,1.111vw,16px);
    transition: all 0.3s ease-in-out !important;
}

.primary-button a:hover .elementor-button-icon svg {
    transform: rotate(180deg);
    transition: all 0.3s ease-in-out !important;
}
.primary-button a:hover .elementor-button-icon path {
    fill: #0094DE;
    transition: all 0.3s ease-in-out !important;
}

.feature-content-box {
    transition: all 0.3s ease-in-out !important;
}

.feature-content-box:hover {
    background-color: #0094DE !important;
}

.feature-content-box:hover .feature-box p,
.feature-content-box:hover .feature-box h3,
.feature-content-box:hover .feature-box {
    color: #fff !important;
    transition: all 0.3s ease-in-out !important;
}
.feature-content-box:hover .feature-box .elementor-icon {
    background-color: #FFFFFF !important;
    transition: all 0.3s ease-in-out !important;
}

.feature-content-box:hover .feature-box .elementor-icon svg path {
  fill: #0094DE;
    transition: all 0.3s ease-in-out !important;
}

.feature-content-box:hover .feature-btn {
    fill: #fff !important;
    transition: all 0.3s ease-in-out !important;
}
.feature-btn a {
    width: auto;
    display: flex;
    justify-content: center !important;
    align-items: center;
    transition: all 0.3s ease-in-out !important;
}
.feature-btn {
    justify-content: center !important;
    align-items: center !important;
    transition: all 0.3s ease-in-out !important;
}

.feature-btn .elementor-button-icon svg {
    width: clamp(13px,1.111vw,16px);
    height: clamp(10px,0.903vw,13px);
    transition: all 0.3s ease-in-out !important;
}
.feature-content-box:hover .elementor-button-icon svg {
    transform: rotate(180deg);
    width: auto;
    transition: all 0.3s ease-in-out !important;
}

.feature-content-box .elementor-button-icon path {
    fill: #253757 !important;
}
.feature-content-box:hover .elementor-button-icon path {
    fill: #fff !important;
}

.feature-content-box:hover span.elementor-button-text {
    color: #fff !important;
    transition: all 0.3s ease-in-out !important;
}
.secondary-btn a {
    display: flex;
    justify-content: center !important;
    align-items: center;
    transition: all 0.3s ease-in-out !important;
}

.secondary-btn {
    justify-content: center !important;
    align-items: center !important;
}

.secondary-btn a:hover {
    color: #fff !important;
    border-color: #fff !important;
    background-color: transparent !important;
    transition: all 0.3s ease-in-out !important;
}

.secondary-btn .elementor-button-icon svg {
    width: clamp(16px,1.389vw,20px);
    height: clamp(12px,1.111vw,16px);
    transition: all 0.3s ease-in-out !important;
}

.secondary-btn a:hover .elementor-button-icon svg {
    transform: rotate(180deg);
    transition: all 0.3s ease-in-out !important;
}
.secondary-btn a:hover .elementor-button-icon path {
    fill: #fff;
    transition: all 0.3s ease-in-out !important;
}
.secondary-btn .elementor-button-icon path {
    fill: #0094DE;
    transition: all 0.3s ease-in-out !important;
}
@keyframes services-rotation {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.about-us-key {
  display: flex;
  animation: services-rotation 13s linear infinite !important;
  animation: services-rotation;
}





@media (max-width: 767px) {
.feature-accordion::before {
    left: -20px;
}


/* The dynamic glow blocks for active accordions */
.feature-accordion .glow-indicator {
  left: -20px;
}
}












