:root { 
            background: #000618; 
        	} 
			html, body {
				font-optical-sizing: auto; 
				font-style: normal;
				background-color: #000618; 
				font-family: "Inter", sans-serif;
			}
			h1, h2, h3, h4, h5, h6 {  
				font-family: "Manrope", sans-serif;
				letter-spacing: -0.5px;
			}
			/*Top Banner*/
			.top-banner {
				background-image: linear-gradient(90deg, #0150F4 0%, #00D5D8 100%);
            	padding: 0.5rem 1rem;
            	font-size: 0.85rem;
			}
			.top-banner a {
				color: var(--brand-cyan);
				text-decoration: none;
			}
			.top-banner a:hover {
				text-decoration: underline;
			}
			.main-wrapper::before {
				content: '';
				position: absolute;
				top: 0;    
				left: 0;   
				width: 100%;
				height: 100%; 
				background-image: url('../images/home-hero.webp');
				background-size: cover;
				z-index: 0;
			} 
			.video-background {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				object-fit: cover;  
				opacity: 0.4;        
				z-index: 0;  
				mix-blend-mode: soft-light;
			}
			.text-gradient span:nth-child(1){
				background: linear-gradient(90deg, #01E3D6, #013FFA);
				background-clip: text;
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent; 
			}
			.text-gradient span:nth-child(2){
				color: #015DF3;
			}
			.text-gradient span:nth-child(3){
				background: linear-gradient(90deg, #013FFA, #01E3D6);
				background-clip: text;
				-webkit-background-clip: text;
				-webkit-text-fill-color: transparent; 
			}
			.text-cyan {
				background: linear-gradient(90deg, #0150F4 0%, #00D5D8 100%);
				-webkit-background-clip: text;
				background-clip: text;
				color: transparent !important; 
			}
			.hero-button { 
				background: linear-gradient(90deg, #0039FB 0%, #00E5D6 100%);
				border: 0;
				color: #fff;
				font-weight: 700;
				padding: 0.75rem 1.5rem;
				transition: all 0.3s ease;
				box-shadow: 0 4px 20px rgba(0, 212, 255, 0.2);
				border-radius: 0.5rem; 
				background-size: 105% 105%; 
				background-position: center; 
			} 
			.hero-link{
				color: #FFF;
				text-align: center;
				font-size: 16px;
				font-weight: 600;
				text-decoration: none;
			}
			.accordion {
			  --bs-accordion-border-radius: 15px;  
			  --bs-accordion-border-color: rgba(0, 0, 0, 0);  
			  background-color: transparent;  
			} 
			.accordion-item {
			  margin-bottom: 16px;
			  border: none; 
			  border-radius: 16px;  
			  background-color: #ffffff;   
			} 
			.accordion-header {} 
			.accordion-button {
			  background-color: transparent !important;  
			  color: #333;  
			  font-weight: 500;  
			  padding: 24px;  
			  border-radius: 15px !important;  
			  box-shadow: none !important;  
			  transition: background-color 0.2s ease-in-out; 
			  border: none;  
			} 
			.accordion-button:not(.collapsed) {
			  background-color: transparent !important;  
			  color: #333;  
			  border-bottom-left-radius: 0;  
			  border-bottom-right-radius: 0;  
			  box-shadow: none;  
			} 
			.accordion-button::after {
			  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23333'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e") !important; /* Color oscuro para la flecha */
			  transform: rotate(0deg);  
			  transition: transform 0.2s ease-in-out;  
			} 
			.accordion-button:not(.collapsed)::after {
				transform: rotate(180deg);  
				filter: invert(0); 
			} 
			.accordion-body {
				padding: 20px 25px;   
				border-bottom-left-radius: 15px;  
				border-bottom-right-radius: 15px;   
			}
			@keyframes scroll {
				from {
					transform: translateX(0);
				}
				to {
					transform: translateX(-50%);
				}
			}
			.logo-scroller {
				overflow: hidden;
				-webkit-mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
				mask: linear-gradient(90deg, transparent, white 20%, white 80%, transparent);
			}
			.logo-list {
				display: flex;
				flex-wrap: nowrap;
				gap: 3rem; 
				animation: scroll 30s linear infinite; 
				align-items: center;
				opacity: 0.5;
			}
			.partner-logo {
				flex-shrink: 0; 
				font-size: 1.1rem;
				font-weight: 500;
				color: #a0a0a0;
			}
			.partner-logo img { 
				filter: grayscale(1);
			}
			.partner-logo img:hover { 
				filter: grayscale(0);
			}
			.nav-how-it-works {
				background-color: #000618;  
				border-radius: 50rem;     
				padding:8px 0px;         
				display: inline-flex;     
			}
			.nav-how-it-works .nav-link {
				background-color: transparent;
				color: #fff;               
				border: none;
				border-radius: 50rem;     
				padding: 0.5rem 1.5rem;
				margin: 0;
				font-weight: 500;
				transition: background-color 0.3s ease, color 0.3s ease; 
			} 
			.nav-how-it-works .nav-link.active {
				background: linear-gradient(90deg, #0150F4, #00D5D8);
				color: #fff; 
			}
			.step-number {
				width: 40px;
				height: 40px;
				background-color: #212529; 
				color: #fff;
				border-radius: 50%; 
				display: flex;
				align-items: center;
				justify-content: center;
				font-weight: bold;
				font-size: 1.1rem;
				flex-shrink: 0; 
			}
			.nav-how-it-works .nav-link {
				background-color: #000618; 
				color: #fff;
				border-radius: 50rem; 
				padding: 0.5rem 1rem;
				margin: 0 0.5rem;
				border: none;
				font-weight: 500;
			} 
			.nav-how-it-works .nav-link.active {
				background-color: #0d6efd;  
				color: #fff;
			}
			.step-number {
				width: 60px;
				height: 60px;
				background-color: #000618; 
				color: #fff;
				border-radius: 50%; 
				display: flex;
				align-items: center;
				justify-content: center;
				font-weight: bold;
				font-size: 1.1rem;
				flex-shrink: 0; 
			}
			#cardScroller { 
				scroll-behavior: smooth;
	 
				&::-webkit-scrollbar {
					display: none;
				} 
				scrollbar-width: none; 
				-ms-overflow-style: none;
			}
			.card-img-overlay {
				background: linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.7) 100%);
			}
			.btn-nav {
				width: 4rem;  
				height: 4rem; 
				display: inline-flex;
				align-items: center;
				justify-content: center;
				padding: 0;
			}
			section.space {
				margin-top:120px;
				margin-bottom: 120px;
			}
			.dark-light {
				color: rgba(0, 6, 24, 0.80);
			} 
			.gradient-badge {
				background: linear-gradient(90deg, #0150F4, #00D5D8);  
				color: #ffffff;
				font-weight: 600;
				font-size: 12px;    
				letter-spacing: 0.5px;    
				display: inline-block;
			}
			.card-title-badge {
				display: inline-block; 
				background-color: rgba(255, 255, 255, 0.25); 
				color: #ffffff;
				font-size: 12px;
				font-weight: 500;
				text-transform: uppercase;
				letter-spacing: 1.6px;
				padding: 6px 12px;
				border-radius: 0.40rem;  
			}
			p.card-text {
				font-family: 'Inter';
				font-weight: 300; 
				font-size: 15px;
			} 
			
			.scroll-section {
				display: flex; 
				min-height: 100vh; 
			}
			.left-panel {
				position: sticky;
				top: 0; 
				height: 100vh; 
				display: flex;
				flex-direction: column;
				justify-content: center; 
				padding-left: 3rem; 
				background-color: #f8f9fa; 
				border-right: 1px solid #dee2e6;
			}
			.left-panel .nav-item {
				font-size: 1.25rem; 
				margin-bottom: 0.75rem; 
				color: #6c757d; 
				cursor: pointer;
				transition: all 0.3s ease;
				position: relative;
				padding-left: 1.5rem;
			}
			.left-panel .nav-item.active {
				font-weight: bold;
				color: #212529; 
			}
			.left-panel .nav-item.active::before {
				height: 100%; 
				background-color: #0d6efd;  
			} 
			.right-content {
				flex-grow: 1;  
				padding: 2rem 3rem;  
				background-color: #fff;
			} 
			.content-section {
				min-height: 100vh;  
				display: flex;
				flex-direction: column;
				justify-content: center;
				padding: 4rem 0;
				border-bottom: 1px solid #eee;  
			} 
			.content-section:last-child {
				border-bottom: none;
			}
		@media (max-width: 991.98px) {  
            .scroll-section {
                flex-direction: column; 
            }
            .left-panel {
                position: relative; 
                height: auto; 
                padding: 1rem;
                border-right: none;
                border-bottom: 1px solid #dee2e6;
                justify-content: flex-start; 
            }
            .left-panel .nav-item {
                padding-left: 0;
                font-size: 1rem;
                text-align: center;
            }
            .left-panel .nav-item::before {
                display: none; 
            }
            .left-panel .nav-links {
                display: flex;
                flex-wrap: wrap;
                justify-content: center;
                gap: 0.5rem 1.5rem; 
            }
            .right-content {
                padding: 1.5rem;
            }
            .content-section {
                min-height: auto; 
                padding: 2rem 0;
            }
        }
			.feature-card {
				border: none;
				border-radius: 1.5rem;  
				padding: 2rem;
				width: 100%;
				height: 100%; 
				display: flex;
				flex-direction: column;
				overflow: hidden;  
				position: relative;  
				min-height: 280px;
			}
			.card-dark-blue {
				background-color: #0a2a6b; 
				color: white;
			} 
			.card-bright-blue {
				background-color: #0063f7; 
				color: white;
			} 
			.card-light {
				background-color: #f1f3f5; 
				color: #212529;
			}
			.card-light h4 {
				font-weight: 700;
				color: #111;
			}
			.card-light p {
				color: #495057;
				font-weight: 500;
			}
			.card-cta-gradient {
				background-image: linear-gradient(135deg, #002D72 0%, #007BFF 100%);
				color: white;
			} 
			.card-dark-blue .content-overlay {
				position: relative;
				z-index: 2;  
				height: 100%; 
				display: flex;
				flex-direction: column;
				justify-content: flex-start;  
			}
			.feature-icon-box {
				display: inline-flex;
				align-items: center;
				justify-content: center;
				width: 60px;
				height: 60px;
				background-color: rgba(255, 255, 255, 0.1);  
				border-radius: 0.75rem;
				margin-bottom: 1.5rem;
			}
			.feature-icon-box i {
				font-size: 1.75rem;
				color: #fff;
			}
			.card-bright-blue h4, .card-bright-blue p {
				color: white;
			} 
			.card-cta-gradient .btn-light {
				color: #0063f7; 	
				font-weight: 700;
				border-radius: 0.75rem;
			}
			.coverage-video-bg {
				position: absolute;
				bottom: 0;
				left: 0;
				width: 100%;
				height: 70%;  
				object-fit: cover;
				z-index: 1;
				opacity: 0.8;  
			}
			.coverage-gradient-overlay {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				z-index: 2;  
				background: linear-gradient(
					180deg, 
					#0A2A6B 0%,   
					#002D72 60%,   
					rgba(0, 45, 114, 0.7) 100% 
				);
			}
			.coverage-text-content {
				position: relative;
				z-index: 3; 
				color: white;
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center;
				text-align: center;
				height: 100%;  
				padding: 2.5rem 2rem;  
			}
			.coverage-text-content h3 {
				margin-bottom: 0;
				line-height: 1.4;
				font-size: 1.8rem; 
			}
			.card-split-layout {  
			}
			.top-text-section {
				color: white;
				padding: 2.5rem 2rem;  
				text-align: center;
				flex-grow: 1; 
				border-top-left-radius: 1.5rem;
				border-top-right-radius: 1.5rem;
			}
			.top-text-section h3 {
				margin-bottom: 0;
				line-height: 1.4;
				font-size: 1.8rem;
			}
			.bottom-video-section {
				height: 150px;  
				position: relative;  
				overflow: hidden;
				background-color: #015CF2;
				border-bottom-left-radius: 1.5rem;
				border-bottom-right-radius: 1.5rem;
				isolation: isolate; 
			}
			.globe-video-element {
				position: absolute;
				top: -80px;
				left: 50%;
				transform: translateX(-50%);
				width: 60%;
				object-fit: cover;
				mix-blend-mode: plus-lighter;
				opacity: 1;
			}
			.coverage-video-bg {
				position: absolute;
				bottom: 0;
				left: 0;
				width: 100%;
				height: 70%;  
				object-fit: cover;
				mix-blend-mode: hard-light;
				z-index: 1; 
				mask-image: linear-gradient(to top, 
					white 70%, 
					transparent 100%
				);
				-webkit-mask-image: linear-gradient(to top, 
					white 70%, 
					transparent 100%
				);
			}
			.video-mask-container {
				position: absolute;
				bottom: 0;
				left: 0;
				width: 100%;
				height: 70%;  
				z-index: 1;  
				mask-image: 
					linear-gradient(to top, white 70%, transparent 100%),
					linear-gradient(to top, white 100%, white 100%),
					linear-gradient(to top, white 70%, transparent 100%);
				mask-size: 30% 100%, 40% 100%, 30% 100%;
				mask-position: 0 0, 30% 0, 70% 0;
				mask-repeat: no-repeat;
				-webkit-mask-image: 
					linear-gradient(to top, white 70%, transparent 100%),
					linear-gradient(to top, white 100%, white 100%),
					linear-gradient(to top, white 70%, transparent 100%);
				-webkit-mask-size: 30% 100%, 40% 100%, 30% 100%;
				-webkit-mask-position: 0 0, 30% 0, 70% 0;
				-webkit-mask-repeat: no-repeat;
			}
			.cta-background {
				background: url('../images/cta-box.png');
				background-size: cover; 
				backdrop-filter: blur(10px);
				-webkit-backdrop-filter: blur(10px);
				border: 1px solid rgba(255, 255, 255, 0.2); 
				box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
			}
			.icon-circle {
				width: 48px;
				height: 48px;
			}
			.btn-gradient-primary {
				background-image: linear-gradient(to right, #0d6efd 0%, #00c6ff 100%);
				border: none;
				color: white;
				font-weight: bold;
			}
			.btn-gradient-primary:hover {
				background-image: linear-gradient(to right, #0b5ed7 0%, #00a5e0 100%);
				color: white;
			}
			/*Mega Menu*/ 
			.dropdown-header {
				font-size: 0.75rem;
				font-weight: 700;
				text-transform: uppercase;
				letter-spacing: 0.5px;
				color: var(--bs-gray-600);
				margin: 1rem 0rem 0rem 0rem;
				padding-left: 1rem;
				font-family: "Inter", sans-serif;
			}
			.navbar .nav-item.dropdown.megamenu {
				position: relative;
			}
			.navbar .megamenu .dropdown-menu {
				width: 900px; 
				max-width: 95vw;
				left: 50%;
				transform: translateX(-50%); 
				border: none;
				border-radius: 1rem;
				box-shadow: 0 1rem 3rem rgba(0,0,0,0.1);
				padding: 1rem;
			}
			.navbar .megamenu.megamenu-sm .dropdown-menu {
				width: 620px;
			}
			.megamenu-heading {
				font-size: 0.75rem;
				font-weight: 700;
				text-transform: uppercase;
				letter-spacing: 0.5px;
				color: var(--bs-gray-600);
				margin-bottom: 0.75rem;
				padding-left: 0.75rem;
				font-family: "Inter", sans-serif;
			}
			.megamenu-item {
				display: flex; 
				align-items: center;
				gap: 0.75rem; 
				padding: 0.6rem 0.75rem; 
				border-radius: 0.5rem; 
				color: var(--bs-dark);
				text-decoration: none;
				transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out;
			}
			.megamenu-item i {
				width: 20px;
				text-align: center;
				font-size: 1.1rem;
				color: var(--bs-primary);
			}
			.megamenu-item:hover {
				color: var(--bs-primary);
				background-color: var(--bs-gray-100);
			}
            .navbar .navbar-nav .dropdown-menu {
                border-radius: 8px;
                border: none;
				box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.1);
				margin-top: -1px;
            }
			.navbar .navbar-nav .dropdown-menu.menu { 
                border: none;
				box-shadow: none;
				padding-bottom: 18px;
            }
			.navbar-toggler:focus,
			.navbar-toggler:active {
				outline: none !important;
				box-shadow: none !important;
			}
			
			
			footer {
				background: url('../images/hero2.png') center top/cover no-repeat;
				padding-top: 240px !important;
			}
		
			.navbar .nav-link:focus,
			.navbar .nav-link:focus-visible,
			.navbar .dropdown-toggle:focus,
			.navbar .dropdown-toggle:focus-visible {
			  outline: none !important;
			  box-shadow: none !important;
			}
			
			.map-pin-flag {
			  border: 2px solid white;
			  border-radius: 50%; 
			  width: 40px;
			  height: 40px;
			  object-fit: cover; 
			  position: relative;
			}
			
			.map-pin {
			  position: absolute;
			  z-index: 10;
			  display: flex;
			  flex-direction: column;
			  align-items: center; 
			}
			
			.map-pin-location-marker {
			  animation: bob 3s infinite ease-in-out;
			}
			
			@keyframes bob {
			  0% {
				transform: translateY(0px);
			  }
			  50% {
				transform: translateY(-8px); 
			  }
			  100% {
				transform: translateY(0px);
			  }
			}
			
			.globe-video { 
				width: 800px;
				object-fit: cover;
				mix-blend-mode: lighten;
				opacity: 0.5;
				position: absolute;
				bottom: -120px;
				left: 30%;
				z-index: 0;
			}
			
			.stat-item { 
				display: flex;
				flex-direction: column;
				justify-content: center;
				align-items: center; 
				box-shadow: 0px 6.52px 39.13px 0px #0b072308;
				width: 100%;
				border-radius: 24px;
				background: rgba(255, 255, 255, 0.1);
				backdrop-filter: blur(10px);
				-webkit-backdrop-filter: blur(10px);
				border: 1px solid rgba(255, 255, 255, 0.2);
				box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
			}
			
			.nav_blur::before {
				content: "";
				position: absolute;
				inset: 0;
				backdrop-filter: blur(16px);
				-webkit-backdrop-filter: blur(16px);
				background-color: rgba(192, 201, 255, 0.2);
				z-index: -1;
				pointer-events: none;
			}
			
			textarea.form-control {
				height:120px !important;
			}
			
			section#api-coverage {
				background:url('../images/home-hero.webp') #000; 
				background-position: top; 
				background-size: cover;
			}
			
			.feature-video {
				position: absolute;
				top: 0;
				left: 31%;
				width: 120%;
				height: 100%;
				object-fit: cover;
				opacity: 0.6;
				z-index: 0;
				mix-blend-mode: plus-lighter;
			}
			
			.feature-card.blue {
				background: #001876;
				background-size: cover; 
				backdrop-filter: blur(10px);
				-webkit-backdrop-filter: blur(10px);
				border: 1px solid rgba(255, 255, 255, 0.2);
				box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
			}
			
			.feature-card.light-blue { 
				background: #015CF2;
				background-size: cover; 
				backdrop-filter: blur(10px);
				-webkit-backdrop-filter: blur(10px);
				border: 1px solid rgba(255, 255, 255, 0.2);
				box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
			}
			
			.feature-card.light {
				background: #f1f6fd;
				background-size: cover; 
				backdrop-filter: blur(10px);
				-webkit-backdrop-filter: blur(10px);
				border: 1px solid rgba(255, 255, 255, 0.2);
				box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
			}
			
			section.section-features { 
				background: url('../images/home-hero.webp') #000 bottom no-repeat;
			}