@import url('https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wght@8..144,100..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Zalando+Sans:ital,wght@0,200..900;1,200..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=TASA+Orbiter:wght@400..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Reddit+Sans:ital,wght@0,200..900;1,200..900&family=TASA+Orbiter:wght@400..800&display=swap');
    :root {
    /* PALETA DE COLORES  */
        /* Colores principales */
            --primary-color: #015dab;
            --primary-dark: #014a88;
            --primary-light: #e6f0fa;
			--primary-lighter: #f0f7ff;	
			--primary-glow:#1a94ff;
		/*Colores secundarios*/				
			--accent-color: #1a94ff; 
			--accent-color-light:#5cb0ff;	
        /* Colores neutros */
            --text-color: #333333;
            --text-light: #666666;
            --text-lighter: #888888;
			--text-white:#ffffff;
		/*Color Background*/	
            --background-color: #ffffff;
			--background-gray:#e0e6eb;
			--background-gray-light: #f3f5f7;
			--background-dark: #0a2540;
			--background-blue: #E1F1FF;					
            --border-color: #e0e0e0;	
			--card-color: #ffffff;
        /* Colores de estado */
            --success-color: #1e7b59;
            --warning-color: #ffc107;
            --error-color: 	#a82936;
			--info-color: #17a2b8;		          
        /* Tamaños de fuente */
            --font-size-xs: 0.75rem;    /* 12px */
            --font-size-sm: 0.875rem;   /* 14px */
            --font-size-md: 1rem;     /* 16px */
            --font-size-lg: 1.125rem;   /* 18px */
            --font-size-xl: 1.25rem;    /* 20px */
            --font-size-2xl: 1.5rem;    /* 24px */
            --font-size-3xl: 1.875rem;  /* 30px */
            --font-size-4xl: 2.25rem;   /* 36px */
            --font-size-5xl: 3rem;      /* 48px */
			--font-size-6xl: 3.5rem;            
        /* Pesos de fuente */
            --font-weight-light: 300;
            --font-weight-normal: 400;
            --font-weight-medium: 500;
            --font-weight-semibold: 600;
            --font-weight-bold: 700;
			--font-weight-extrabold: 800;            
        /* Alturas de línea  */
            --line-height-tight: 1.25;
            --line-height-normal: 1.5;
            --line-height-relaxed: 1.75;
        /*  ESPACIADO  */
            --spacing-xs: 0.25rem;   /* 4px */
            --spacing-sm: 0.5rem;    /* 8px */
            --spacing-md: 1rem;      /* 16px */
            --spacing-lg: 1.5rem;    /* 24px */
            --spacing-xl: 2rem;      /* 32px */
            --spacing-2xl: 3rem;     /* 48px */
            --spacing-3xl: 4rem;     /* 64px */
            --spacing-4xl: 6rem;     /* 96px */
			--spacing-5xl: 8rem;
			--spacing-6xl: 10rem;
        /*  BORDES Y RADIOS  */
            --border-radius-sm: 0.25rem;  /* 4px */
            --border-radius-md: 0.375rem; /* 6px */
            --border-radius-lg: 0.5rem;   /* 8px */
            --border-radius-xl: 0.75rem;  /* 12px */
            --border-radius-2xl: 1rem;    /* 16px */
			--border-radius-3xl: 1.875rem;  /* 30px */            
            --border-width: 1px;
            --border-width-thick: 2px;
        /*  SOMBRAS  */
            --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
            --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
            --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
            --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
        /*  TRANSICIONES  */
            --transition-fast: 150ms ease-in-out;
            --transition-normal: 300ms ease-in-out;
            --transition-slow: 500ms ease-in-out;
        }
		 
		/*.dark-mode {
			/* Colores principales 
			--primary-color: hsl(208,99%,60%);
			--primary-dark: #3385d6;
			--primary-light: #0f1f2f;
			--primary-lighter: #1a2a3a;
			--primary-glow: #33a0ff;    
			/* Colores secundarios 
			--accent-color: #1a94ff;
			--accent-color-light: #5cb0ff;    
			/* Colores neutros 
			--text-color: #f0f8ff;
			--text-light: #c2e0ff;
			--text-lighter: #99ccff;
			--text-white: #ffffff;    
			/* Color Background 
			--background-color: #000000;
			--background-gray: #0a0a0a;
			--background-gray-light: #111111;
			--background-blue: #001b33;    
			--border-color: #1a1a1a;   
			--card-color:#212121;
			/* Colores de estado  
			--success-color: #00cc88;
			--warning-color: #ffaa33;
			--error-color: #ff4444;
			--info-color: #00aaff;   
			/* SOMBRAS MEJORADAS  
			--shadow-sm:0 4px 8px -1px rgba(102,179,255, 1);
			--shadow-md: 0 1px 3px 1px rgba(0, 0, 255, 0.4);
			--shadow-lg: 0 5px 5px 5px rgba(1,93,171, 0.5);
			--shadow-xl: 0 20px 30px -5px rgba(1,93,171, 0.7);    
		}
		.dark-mode .section-title, .dark-mode .section-subtitle { -shadow: 0 2px 4px rgba(224,136,252, 0.5);	}
		.dark-mode .form-control, .dark-mode .form-select {	background: #0a0a0a; border-color: #2a2a2a; color: var(--text-color); }
		.dark-mode .form-control:focus, .dark-mode .form-select:focus {	border-color: var(--primary-color);	box-shadow: 0 0 0 0.2rem rgba(77, 166, 255, 0.25); background: #0a0a0a;	}
		.dark-mode .carousel-item:nth-child(1) { background: linear-gradient(135deg, hsl(208,99%,34%) 0%, hsl(208,99%,27%) 100%); }
        .dark-mode .carousel-item:nth-child(2) { background: linear-gradient(135deg, hsl(208,99%,34%) 0%, hsl(208,99%,27%) 100%); }	
        .dark-mode .carousel-item:nth-child(3) { background: linear-gradient(135deg, hsl(208,99%,34%) 0%, hsl(208,99%,27%) 100%); }	
		.dark-mode .cta-glow{ background: radial-gradient(circle, hsl(208,100%,30%) 0%, transparent 70%); }
		.dark-mode .premium-cta {background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));}
		*/
		
		
.dark-mode {
    /* Colores principales */
    --primary-color: hsl(208, 70%, 65%);
    --primary-dark: hsl(208, 60%, 55%);
    --primary-light: hsl(210, 25%, 15%);
    --primary-lighter: hsl(210, 20%, 20%);
    --primary-glow: hsl(208, 80%, 70%);    
    /* Colores secundarios */
    --accent-color: hsl(208, 75%, 65%);
    --accent-color-light: hsl(208, 80%, 75%);    
    /* Colores neutros  */
    --text-color: hsl(0, 0%, 100%);
    --text-light: hsl(0, 0%, 90%);
    --text-lighter: hsl(0, 0%, 80%);
    --text-white: hsl(0, 0%, 100%);    
    /* Color Background  */
    --background-color: hsl(220, 15%, 8%);
    --background-gray: hsl(220, 12%, 10%);
    --background-gray-light: hsl(220, 10%, 12%);
    --background-blue: hsl(220, 20%, 12%);
    --border-color: hsl(220, 8%, 18%);
    --card-color: hsl(220, 12%, 14%);    
    /* Colores de estado  */
    --success-color: hsl(160, 70%, 50%);
    --warning-color: hsl(40, 80%, 55%);
    --error-color: hsl(0, 70%, 70%);
    --info-color: hsl(200, 80%, 60%);    
    /* Sombras mejoradas  */
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.25);
    --shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.2);
    --shadow-xl: 0 16px 32px rgba(0, 0, 0, 0.15);
}
.dark-mode .section-title, .dark-mode .section-subtitle { text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4); }
.dark-mode .form-control, .dark-mode .form-select { background: var(--background-gray); border-color: var(--border-color); color: var(--text-color); transition: all var(--transition-fast); }
.dark-mode .form-control:focus, .dark-mode .form-select:focus { border-color: var(--primary-color); box-shadow: 0 0 0 0.2rem rgba(77, 166, 255, 0.15); background: var(--background-gray); }
.dark-mode .carousel-item:nth-child(1), .dark-mode .carousel-item:nth-child(2), .dark-mode .carousel-item:nth-child(3) { background: linear-gradient(135deg, hsl(208, 40%, 25%) 0%, hsl(208, 35%, 20%) 100%); }
.dark-mode .cta-glow { background: radial-gradient(circle, hsla(208, 60%, 30%, 0.4) 0%, transparent 70%); }
.dark-mode .premium-cta { background: linear-gradient(135deg, var(--primary-light), var(--primary-lighter)); }
.dark-mode .tecnologia-card, .dark-mode .servicio-card, .dark-mode .success-card, .dark-mode .nosotros-card, .dark-mode .contact-card, .dark-mode .contact-form { background: var(--card-color); border: 1px solid var(--border-color); }
.dark-mode .metric-card { background: var(--background-gray-light); border: 1px solid var(--border-color); }
.dark-mode .comparison-table .table thead th { background: var(--primary-light); color: var(--text-color); }
.dark-mode .comparison-table thead th:first-child { background: linear-gradient(135deg, var(--primary-dark), var(--primary-color)); color: var(--text-white); }
.dark-mode .comparison-table tbody td:first-child { background-color: var(--background-gray); }
.dark-mode .btn-hero.outline { border-color: rgba(255, 255, 255, 0.3); color: var(--text-color); }
.dark-mode .btn-hero.outline:hover { background: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.5); }
.dark-mode .btn-premium.outline { border-color: rgba(255, 255, 255, 0.3); }
.dark-mode .btn-premium.outline:hover { background: var(--text-white); color: var(--primary-color); }
.dark-mode .navbar { background-color: var(--background-color); border-bottom: 1px solid var(--border-color); }
.dark-mode .nav-link { color: var(--text-light); }
.dark-mode .nav-link:hover, .dark-mode .nav-link:focus { color: var(--primary-color); background-color: var(--primary-light); }
.dark-mode .tecnologia-section { background: var(--background-gray); }
.dark-mode .servicios-section { background: linear-gradient(135deg, var(--primary-light) 0%, var(--background-color) 100%); }
.dark-mode .beneficio-section { background: linear-gradient(135deg, var(--background-blue) 0%, var(--background-color) 100%); }
.dark-mode .exito-section { background-color: var(--background-gray); }
.dark-mode .nosotros-section { background: linear-gradient(135deg, var(--background-color) 0%, var(--primary-light) 100%); }
.dark-mode .clients-section { background-color: var(--background-gray); }
.dark-mode .contact-section { background: linear-gradient(135deg, var(--primary-light) 0%, var(--background-color) 100%); }
.dark-mode .highlight-quote { background: var(--primary-light); border-left-color: var(--primary-color); }
.dark-mode .key-service-card { background: var(--card-color); border-color: var(--primary-light); }
.dark-mode .servicios-adicionales { background: var(--background-blue); }
.dark-mode .modelo-beneficios { background: var(--card-color); }
.dark-mode .results-showcase { background: linear-gradient(135deg, var(--background-blue), transparent); }
.dark-mode .nosotros-diferencial { background: var(--background-blue); }
.dark-mode .form-select {   
    background: var(--background-gray) 
                url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") 
                no-repeat right 0.75rem center/16px 12px;    
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}
.dark-mode .form-select:focus { border-color: var(--primary-color); box-shadow: 0 0 0 0.2rem rgba(1, 93, 171, 0.15); opacity: 1; }
.dark-mode .form-select::-ms-expand {display: none; }



        .required {
            color: var(--error-color);
        }  
		.text-success {
			color: var(--success-color) !important;
		}
		.text-danger {
			color: var(--error-color) !important;
		}
		* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
		html{
			scroll-behavior:smooth;
		}
        body {		
            font-family:"Nunito Sans","Reddit Sans","TASA Orbiter", "Zalando Sans","TASA Orbiter","Roboto Flex", sans-serif;
            font-size: var(--font-size-md);
            line-height: var(--line-height-normal);
            color: var(--text-color);
            background-color: var(--background-color);
            padding-top: 80px; 			
			transition: background-color var(--transition-normal), color var(--transition-normal);
        }
	/*Sección Menu*/
        .navbar {
            background-color: var(--background-color);
            box-shadow: var(--shadow-md);
            padding: var(--spacing-sm) var(--spacing-md);
            font-size: var(--font-size-lg);
            transition: all var(--transition-normal);
        }        
        .navbar-brand img {
            width: auto;
            height: 80px;
            transition: height var(--transition-normal);
        }        
        .nav-link {
            color: var(--text-color);
            font-weight: var(--font-weight-medium);
            padding: var(--spacing-sm) var(--spacing-md);
            transition: color var(--transition-fast);
            border-radius: var(--border-radius-md);
			position: relative;
        }        
        .nav-link:hover, .nav-link:focus {
            color: var(--primary-color);
            background-color: var(--primary-light);
			font-style:italic;
            font-weight:bold;
        } 
		.nav-link.active {
            color: var(--primary-color);
            font-weight: var(--font-weight-bold);
        }        
        .nav-link.active::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 50%;
            transform: translateX(-50%);
            width: 30px;
            height: 3px;
            background-color: var(--primary-color);
            border-radius: var(--border-radius-sm);
        }	
	/*Dark Mode Toogle*/
        .dark-mode-toggle {
            border-color: var(--primary-color);
			background: rgba(1, 93, 171, 0.1);
            color: var(--primary-color);
            font-weight: var(--font-weight-medium);
            border-radius: var(--border-radius-md);
            transition: all var(--transition-fast);
			border-radius:var(--border-radius-3xl);
			border-style:solid;
			padding: var(--spacing-sm) var(--spacing-md);
        }        
        .dark-mode-toggle:hover {
            background-color: var(--primary-color);
            color: var(--text-white);
			transform: translateY(-2px);
            box-shadow: var(--shadow-md);
        }
	/*Hero Section*/
        .hero-section {
            min-height: 81vh;
            display: flex;
            align-items: center;
            background: linear-gradient(135deg, var(--background-dark) 0%, var(--primary-color) 100%);
            color: var(--text-white);
            position: relative;
            overflow: hidden;
            padding: 0;
        } 
        .hero-carousel {
            height: 80vh;
            width: 100%;
        }        
        .carousel-item {
            height: 80vh;
            background-size: cover;
            background-position: center;
            position: relative;
        }
        .carousel-item::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: 
                radial-gradient(circle at 20% 80%, rgba(26, 148, 255, 0.15) 0%, transparent 50%),
                radial-gradient(circle at 80% 20%, rgba(1, 93, 171, 0.1) 0%, transparent 50%),
                radial-gradient(circle at 40% 40%, rgba(1, 93, 171, 0.08) 0%, transparent 50%);
            z-index: 1;
        } 
		.carousel-content {
            position: absolute;
            top: 50%;
            left: 0;
            right: 0;
            transform: translateY(-50%);
            text-align: center;
            padding:  0 var(--spacing-md);
            z-index: 2;
        }
		.hero-tagline {
            font-size: var(--font-size-lg);
            font-weight: var(--font-weight-medium);
            color: var(--primary-glow);
            margin-bottom: var(--spacing-md);
            text-transform: uppercase;
            letter-spacing: 1.5px;
        }
		.hero-title {
			font-size: var(--font-size-6xl);
            font-weight: var(--font-weight-extrabold);
            margin-bottom: var(--spacing-lg);
            line-height: var(--line-height-tight);
            text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
            background: var(--text-white);
            background-clip: text;
        }        
        .hero-subtitle {
            font-size: var(--font-size-xl);
            margin-bottom: var(--spacing-2xl);
            opacity: 0.9;
            line-height: var(--line-height-normal);
            text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
            max-width: 1000px;
            margin-left: auto;
            margin-right: auto;			
        }
		.hero-buttons {
            display: flex;
            justify-content: center;
            gap: var(--spacing-md);
            flex-wrap: wrap;
            margin-bottom: var(--spacing-2xl);
        }
		.hero-benefits {
            display: flex;
            justify-content: center;
            gap: var(--spacing-2xl);
            flex-wrap: wrap;
        }
		 .hero-benefit {
            display: flex;
            align-items: center;
            gap: var(--spacing-sm);
            color: rgba(255, 255, 255, 0.8);
            font-size: var(--font-size-sm);
        }
		.hero-benefit i {
            color: var(--primary-glow);
        }
		.btn-hero {
            padding: var(--spacing-md) var(--spacing-xl);
            border-radius: var(--border-radius-2xl);
            font-weight: var(--font-weight-semibold);
            text-decoration: none;
            transition: all var(--transition-normal);
            border: none;
            font-size: var(--font-size-lg);
        }
		.btn-hero.primary {
            background: var(--primary-glow);
            color: var(--text-white);
            box-shadow: 0 8px 25px rgba(26, 148, 255, 0.3);
        }
		.btn-hero.primary:hover {
            transform: translateY(-3px);
            box-shadow: 0 12px 30px rgba(26, 148, 255, 0.4);
            background: linear-gradient(135deg, var(--primary-glow), var(--primary-dark));
            color: var(--text-white);
        }
		.btn-hero.outline {
            background: transparent;
            color: var(--text-white);
            border: var(--border-width-thick) solid rgba(255, 255, 255, 0.7);
        }
		.btn-hero.outline:hover {
            background: rgba(255, 255, 255, 0.1);
            border-color: var(--text-white);
            transform: translateY(-3px);
            color: var(--text-white);
        }	
		.carousel-indicators {
            bottom: 30px;
        }        
        .carousel-indicators button {
            width: 12px;
            height: 12px;
            border-radius: 50%;
            margin: 0 5px;
            background-color: rgba(255, 255, 255, 0.5);
            border: none;
            transition: all var(--transition-fast);
        }
        .carousel-indicators button.active {
            background-color: var(--text-white);
            transform: scale(1.2);
        }
        .carousel-control-prev, .carousel-control-next {
            width: 60px;
            height: 60px;
            background-color: rgba(255, 255, 255, 0.2);
            border-radius: 50%;
            top: 50%;
            transform: translateY(-50%);
            opacity: 0.8;
            transition: var(--transition-normal);
            z-index: 10;
        }
		.carousel-control-prev {
            left: 30px;
        }        
        .carousel-control-next {
            right: 30px;
        }
		.carousel-control-prev:hover, .carousel-control-next:hover {
            opacity: 1;
            background-color: rgba(255, 255, 255, 0.4);
            transform: translateY(-50%) scale(1.1);
        }        
        .carousel-control-prev-icon, .carousel-control-next-icon {
            width: 25px;
            height: 25px;
            filter: brightness(0) invert(1);
        }
		.carousel-item:nth-child(1) {
            background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
        }
        .carousel-item:nth-child(2) {
            background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
        }	
        .carousel-item:nth-child(3) {
			background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
        }		
	/* Secciones */
        .section {
			padding: var(--spacing-5xl) 0;
        }
		.container {
			max-width: 1400px; 
		} 
		.section-title {
            text-align: center;
            font-size: var(--font-size-5xl);
            font-weight: var(--font-weight-bold);
            color: var(--primary-color);
            margin-bottom: var(--spacing-md);
            position: relative;
        }  
		.section-intro{
            text-align: center;
            font-size: var(--font-size-xl);
            color: var(--text-light);
            margin-bottom: var(--spacing-3xl);
            max-width: 1000px;
            margin-left: auto;
            margin-right: auto;
		}	
		.section-subtitle{
			font-size:var(--font-size-4xl);
			font-weight:var(--font-weight-bold);
			text-align:center;
		}		
		.highlight-text {
			background: linear-gradient(135deg, var(--primary-color), var(--primary-glow));
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
			background-clip: text;
			margin-bottom: 0;
		}	
		.highlite-text{
			background: linear-gradient(135deg, var(--primary-color), var(--primary-dark));
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
			background-clip: text;
			margin-bottom: 0;
			font-size:var(--font-size-md);
		}		
		.tecnologia-section {
			background:  var(--background-gray-light) ;
		}				
		.servicios-section {
			background: linear-gradient(135deg, var(--primary-light) 0%, var(--background-color) 100%);
		}		
		.beneficio-section{
			background:linear-gradient(135deg, var(--background-blue) 0%, var(--background-color) 100%);				
		}
		.exito-section{
			background-color: var(--background-gray-light);
		}
		.nosotros-section {
			background: linear-gradient(135deg, var(--background-color) 0%, var(--primary-light) 100%);
		}
		.clients-section {
            overflow: hidden;
			background-color: var(--background-gray-light);
        } 
		.contact-section {
            background: linear-gradient(135deg, var(--primary-light) 0%, var(--background-color) 100%);
            position: relative;
            overflow: hidden;
        }		
	/*Quotes*/
		.highlight-quote {
			background: var(--primary-lighter);
			border-left: 4px solid var(--primary-glow);
			padding: var(--spacing-lg);
			border-radius: var(--border-radius-lg);
			margin-bottom: var(--spacing-3xl) ;
			position: relative;
		}
		.highlight-quote i.bi-quote {
			position: absolute;
			top: -10px;
			left: -10px;
			background: var(--primary-glow);
			color: var(--text-white);
			width: 30px;
			height: 30px;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: var(--font-size-sm);
			font-weight: bold;
		}
		.highlight-quote p {
			color: var(--text-color);
			font-size: var(--font-size-md);
			line-height: var(--line-height-relaxed);
			margin-bottom: 0;
			font-style: italic;
			padding-left: var(--spacing-sm);
		}
		.key-service-card {
			display: flex;
			align-items: flex-start;
			gap: var(--spacing-lg);
			background: var(--background-color);
			border: 2px solid var(--primary-light);
			border-radius: var(--border-radius-xl);
			padding: var(--spacing-xl);
			margin-bottom: var(--spacing-3xl);
			box-shadow: var(--shadow-sm);
			transition: all var(--transition-normal);
		}
		.key-service-card:hover {
			border-color: var(--primary-color);
			box-shadow: var(--shadow-md);
			transform: translateY(-2px);
		}
		.key-service-icon {
			background: var(--primary-light);
			color: var(--primary-color);
			width: 60px;
			height: 60px;
			border-radius: var(--border-radius-lg);
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: var(--font-size-2xl);
			flex-shrink: 0;
		}
		.key-service-content {
			flex: 1;
		}
		.key-service-title {
			color: var(--primary-color);
			font-weight: var(--font-weight-semibold);
			font-size: var(--font-size-lg);
			margin-bottom: var(--spacing-sm);
		}
		.key-service-description {
			color: var(--text-color);
			font-size: var(--font-size-md);
			line-height: var(--line-height-relaxed);
			margin-bottom: var(--spacing-md);
		}
		.key-service-features {
			display: flex;
			flex-wrap: wrap;
			gap: var(--spacing-sm);
		}
		.feature-tag {
			background: var(--background-blue);
			color: var(--primary-dark);
			padding: var(--spacing-xs) var(--spacing-sm);
			border-radius: var(--border-radius-md);
			font-size: var(--font-size-xs);
			font-weight: var(--font-weight-medium);
			border: 1px solid var(--primary-light);
		}		
	/*Botones*/
		.btn-saber-mas {
            background: linear-gradient(135deg, var(--accent-color-light), var(--primary-color));
            color: var(--text-white);
            border: none;
			padding: var(--spacing-sm) var(--spacing-md);
            border-radius: var(--border-radius-lg);
            font-weight: var(--font-weight-medium);
            transition: all var(--transition-fast);
            margin-top: var(--spacing-md);
            width: 100%;
			display: flex;
            align-items: center;
            justify-content: center;
            gap: var(--spacing-sm);
        }
        .btn-saber-mas:hover {
            background: var(--primary-dark);
            transform: translateY(-2px);
            box-shadow: var(--shadow-md);
			color: var(--text-white);
        }	
		.premium-cta {
            position: relative;
            background: linear-gradient(135deg, var(--primary-glow), var(--primary-color));
            padding: var(--spacing-3xl) var(--spacing-xl);
            border-radius: var(--border-radius-xl);
            color: var(--text-white);
            text-align: center;
            overflow: hidden;
            margin-bottom: var(--spacing-3xl);
        }		
		.cta-background {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }        
        .cta-glow {
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: radial-gradient(circle, var(--primary-glow) 0%, transparent 70%);
            animation: rotate 20s linear infinite;
        }        
        @keyframes rotate {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }        
        .cta-content {
            position: relative;
            z-index: 2;
        }        
        .cta-title {
            font-size: var(--font-size-3xl);
            font-weight: var(--font-weight-bold);
            margin-bottom: var(--spacing-md);
        }        
        .cta-subtitle {
            font-size: var(--font-size-lg);
            opacity: 0.9;
            margin-bottom: var(--spacing-xl);
        }        
        .cta-buttons {
            display: flex;
            gap: var(--spacing-md);
            justify-content: center;
            flex-wrap: wrap;
        }        
        .btn-premium {
            padding: var(--spacing-md) var(--spacing-xl);
            border-radius: var(--border-radius-2xl);
            font-weight: var(--font-weight-semibold);
            text-decoration: none;
            transition: all var(--transition-normal);
            border: none;
            font-size: var(--font-size-md);
			text-transform: uppercase;			
        }        
        .btn-premium.primary {
            background: var(--card-color);
            color: var(--primary-color);
        }        
        .btn-premium.primary:hover {
            transform: translateY(-3px);
            box-shadow: 0 10px 30px rgba(255, 255, 255, 0.3);
        }        
        .btn-premium.outline {
            background: transparent;
            color: var(--text-white);
			border: var(--border-width-thick) solid white;
        }        
        .btn-premium.outline:hover {
            background: var(--card-color);
            color: var(--primary-color);
            transform: translateY(-3px);
        }		
		.btn-primary-custom {
            background: linear-gradient(135deg, var(--accent-color), var(--accent-color));
            border: none;
            color: var(--text-white);
            font-weight: var(--font-weight-bold);
            padding: var(--spacing-md) var(--spacing-xl);
            border-radius: var(--border-radius-2xl);
            transition: all var(--transition-normal);
            font-size: var(--font-size-lg);
            box-shadow: 0 4px 12px rgba(139, 95, 191, 0.3);
            position: relative;
            overflow: hidden;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
			gap: var(--spacing-sm);
			text-transform: uppercase;
        }        
        .btn-primary-custom:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 20px rgba(139, 95, 191, 0.4);
            background: linear-gradient(135deg, var(--accent-color), var(--primary-dark));
            color: var(--text-white);
        }        
        .btn-primary-custom:active {
            transform: translateY(-1px);
        } 
        .btn-secondary-custom {
            background: transparent;
            border: 1px solid var(--border-color);
            color: var(--text-light);
            font-weight: var(--font-weight-medium);
            padding: var(--spacing-sm) var(--spacing-lg);
            border-radius: var(--border-radius-lg);
            transition: all 0.3s ease;
        }
        .btn-secondary-custom:hover {
            background: var(--background-gray-light);
            border-color: var(--primary-color);
            color: var(--primary-color);
        }
	/*Sección XLYNK tecnologia*/           
        .tecnologia-grid {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
			gap: var(--spacing-xl);
			margin-bottom: var(--spacing-3xl);
		}       
        .tecnologia-card {
			background: var(--background-color);
			border-radius: var(--border-radius-xl);
			padding: var(--spacing-xl);
			box-shadow: var(--shadow-md);
			height: 100%;
			text-align: center;
			transition: transform var(--transition-normal), box-shadow var(--transition-normal);
		}    
		.tecnologia-card:hover {
			transform: translateY(-5px);
			box-shadow: var(--shadow-lg);
		}
        .tecnologia-icon {
			width: 80px;
			height: 80px;
			border-radius: 50%;
			background: var(--primary-light);
			display: flex;
			align-items: center;
			justify-content: center;
			margin: 0 auto var(--spacing-lg);
			color: var(--primary-color);
			font-size: var(--font-size-2xl);
			transition: transform var(--transition-normal);
		}        
        .tecnologia-card:hover .tecnologia-icon {
			transform: scale(1.1);
		}
		.tecnologia-card-title {
			font-size: var(--font-size-xl);
			font-weight: var(--font-weight-bold);
			color: var(--primary-color);
			margin-bottom: var(--spacing-md);
		}
		.tecnologia-card-description {
			color: var(--text-color);
			line-height: var(--line-height-normal);
			margin-bottom: var(--spacing-sm);
		}        
        .caracteristicas-section {
			background: var(--background-color);
			border-radius: var(--border-radius-xl);
			padding: var(--spacing-2xl);
			box-shadow: var(--shadow-md);
			margin-bottom: var(--spacing-3xl);
		}
		.caracteristicas-title {
			font-size: var(--font-size-3xl);
			font-weight: var(--font-weight-bold);
			color: var(--primary-color);
			text-align: center;
			margin-bottom: var(--spacing-xl);
		}
		.caracteristicas-grid {
			display: grid;      
			grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
			gap: var(--spacing-lg);
		}
		.caracteristica-item {
			display: flex;
			align-items: flex-start;
			gap: var(--spacing-md);
			padding: var(--spacing-md);
			transition: background-color var(--transition-fast);
			border-radius: var(--border-radius-lg);
		}
		.caracteristica-item:hover {
			background-color: var(--primary-light);
		}
		.caracteristica-icon {
			color: var(--primary-glow);
			font-size: var(--font-size-lg);
			flex-shrink: 0;
		}
		.caracteristica-content h4 {
			font-size:var(--font-size-xl);
			font-weight: var(--font-weight-semibold);
			color: var(--primary-color);
			margin-bottom: var(--spacing-xs);
		}
		.caracteristica-content p {
			color: var(--text-color);
			margin-bottom: 0;
			font-size: var(--font-size-md);
		} 
		.dashboard-section {
			background: var(--background-blue);
			border-radius: var(--border-radius-xl);
			padding: var(--spacing-2xl);
			margin-bottom: var(--spacing-3xl);
		}
		.dashboard-content {
			display: flex;
			align-items: center;
			gap: var(--spacing-2xl);
		}
		.dashboard-text {
			flex: 1;
		}
		.dashboard-title {
			font-size: var(--font-size-3xl);
			font-weight: var(--font-weight-bold);
			color: var(--primary-color);
			margin-bottom: var(--spacing-lg);
		}
		.dashboard-features {
			list-style: none;
			padding: 0;
			margin: 0;
		}
		.dashboard-features li {
			display: flex;
			align-items: center;
			gap: var(--spacing-sm);
			margin-bottom: var(--spacing-md);
			color: var(--text-color);
		}
		.dashboard-features li i {
			color: var(--primary-glow);
			font-size: var(--font-size-lg);
		}
		.dashboard-image {
			flex: 1;
			text-align: center;
			background: var(--background-color);
			border-radius: var(--border-radius-lg);
			padding: var(--spacing-lg);
		}
		.dashboard-image img {
			max-width: 100%;
			height: auto;
		}
		.image-dashboarde {
			background: var(--primary-color);
			padding: var(--spacing-xl);
			border-radius: var(--border-radius-lg);
		}
		.dahsboard-logo {
			width: 100%;
			max-width: 400px;
			height: auto;
		}
	/*Sección Servicios*/	
		.servicios-grid {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
			gap: var(--spacing-xl);
			margin-bottom: var(--spacing-3xl);
		}
		.servicio-card {
			background: var(--background-color);
			border-radius: var(--border-radius-xl);
			padding: var(--spacing-xl);
			box-shadow: var(--shadow-md);
			transition: transform var(--transition-normal), box-shadow var(--transition-normal);
			height: 100%;
			display: flex;
			flex-direction: column;
		}
		.servicio-card:hover {
			transform: translateY(-5px);
			box-shadow: var(--shadow-lg);
		}
		.servicio-icon {
			width: 80px;
			height: 80px;
			border-radius: 50%;
			background: var(--primary-light);
			display: flex;
			align-items: center;
			justify-content: center;
			margin-bottom: var(--spacing-lg);
			color: var(--primary-color);
			font-size: var(--font-size-2xl);
			transition: transform var(--transition-normal);
		}
		.servicio-card:hover .servicio-icon {
			transform: scale(1.1);
		}
		.servicio-title {
			font-size: var(--font-size-xl);
			font-weight: var(--font-weight-bold);
			color: var(--primary-color);
			margin-bottom: var(--spacing-md);
		}
		.servicio-description {
			color: var(--text-color);
			margin-bottom: var(--spacing-md);
			line-height: var(--line-height-normal);
		}
		.servicio-features {
			list-style: none;
			padding: 0;
			margin: 0 0 var(--spacing-lg) 0;
			flex-grow: 1;
		}
		.servicio-features li {
			display: flex;
			align-items: flex-start;
			gap: var(--spacing-sm);
			margin-bottom: var(--spacing-sm);
			color: var(--text-color);
		}
		.servicio-features li i {
			color: var(--success-color);
			font-size: var(--font-size-md);
			flex-shrink: 0;
			margin-top: 2px;
		}
		.btn-servicio {
			background: linear-gradient(135deg, var(--accent-color), var(--accent-color));
			border: none;
			color: var(--text-white);
			font-weight: var(--font-weight-medium);
			padding: var(--spacing-md) var(--spacing-lg);
			border-radius: var(--border-radius-lg);
			transition: all var(--transition-normal);
			text-decoration: none;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			width: 100%;
		}
		.btn-servicio:hover {
			background: linear-gradient(135deg, var(--accent-color), var(--primary-dark));
			transform: translateY(-2px);
			box-shadow: var(--shadow-md);
			color: var(--text-white);
		}
		.servicios-adicionales {
			background: var(--background-blue);
			border-radius: var(--border-radius-xl);
			padding: var(--spacing-2xl);
			margin-bottom:var(--spacing-3xl);
		}
		.servicio-adicional {
			padding: var(--spacing-lg);
		}
		.adicional-icon {
			width: 60px;
			height: 60px;
			border-radius: 50%;
			background: var(--primary-color);
			display: flex;
			align-items: center;
			justify-content: center;
			margin: 0 auto var(--spacing-md) auto;
			color:var(--text-white);
			font-size: var(--font-size-lg);
		}
		.servicio-adicional h4 {
			font-size: var(--font-size-lg);
			font-weight: var(--font-weight-semibold);
			color: var(--primary-color);
			margin-bottom: var(--spacing-sm);
		}
		.servicio-adicional p {
			color: var(--text-color);
			font-size: var(--font-size-sm);
			margin-bottom: 0;
		}
	/*Sección Beneficios*/
		.modelo-beneficios {
			background: var(--background-color);
			border-radius: var(--border-radius-xl);
			padding: var(--spacing-2xl);
			box-shadow: var(--shadow-md);
			margin-bottom:var(--spacing-3xl);
		}
		.beneficio-item {
			display: flex;
			align-items: flex-start;
			gap: var(--spacing-md);
			margin-bottom: var(--spacing-lg);
			padding: var(--spacing-md);
			border-radius: var(--border-radius-lg);
			transition: background-color var(--transition-fast);
		}
		.beneficio-item:hover {
			background-color: var(--primary-light);
		}
		.beneficio-icon {
			width: 50px;
			height: 50px;
			border-radius: 50%;
			background: var(--primary-color);
			display: flex;
			align-items: center;
			justify-content: center;
			color:var(--text-white);
			font-size: var(--font-size-lg);
			flex-shrink: 0;
		}
		.beneficio-content h4 {
			font-size: var(--font-size-lg);
			font-weight: var(--font-weight-semibold);
			color: var(--primary-color);
			margin-bottom: var(--spacing-xs);
		}
		.beneficio-content p {
			color: var(--text-color);
			margin-bottom: 0;
			font-size: var(--font-size-sm);
		}
		.modelo-visual {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: var(--spacing-sm);
			flex-wrap: wrap;
		}
		.visual-card {
			background: var(--background-gray-light);
			border-radius: var(--border-radius-lg);
			padding: var(--spacing-lg);
			width: 250px;
			text-align: center;
			box-shadow: var(--shadow-sm);
		}
		.visual-card.destacado {
			background: linear-gradient(135deg, var(--primary-light), var(--background-blue));
			border: 2px solid var(--primary-color);
		}
		.visual-card h4 {
			font-size: var(--font-size-md);
			font-weight: var(--font-weight-semibold);
			color: var(--primary-color);
			margin-bottom: var(--spacing-md);
		}
		.costo-item {
			display: flex;
			justify-content: space-between;
			margin-bottom: var(--spacing-sm);
			padding-bottom: var(--spacing-xs);
			border-bottom: 1px solid var(--border-color);
		}
		.costo-total {
			display: flex;
			justify-content: space-between;
			margin-top: var(--spacing-md);
			padding-top: var(--spacing-sm);
			border-top: 2px solid var(--border-color);
			font-weight: var(--font-weight-bold);
		}
		.arrow {
			font-size: var(--font-size-2xl);
			color: var(--primary-color);
		}	
	/*Tabla Comparativa*/
		.comparison-table {
            background: var(--background-color);
            border-radius: var(--border-radius-xl);
            overflow: hidden;
            box-shadow: var(--shadow-lg);
            transition: all var(--transition-normal);
			margin-bottom: var(--spacing-2xl);
        }
		.comparison-table .table {
			background: var(--background-color);
            margin-bottom: 0;
            border-collapse: separate;
            border-spacing: 0;
        }	
		.comparison-table thead th {
            border: none;
            padding: var(--spacing-lg);
            font-weight: var(--font-weight-semibold);
            font-size: var(--font-size-lg);
            text-align: left;
        }
		.comparison-table .table thead th {
			background: var(--background-blue);
			color:var(--primary-color);
			border: none;
			padding: var(--spacing-md);
			font-weight: var(--font-weight-semibold);
			font-size: var(--font-size-xl);
		}
		.comparison-table thead th:first-child {
            border-radius: var(--border-radius-xl) 0 0 0;
            text-align: left;
            background: linear-gradient(135deg, var(--primary-dark), var(--primary-color));
			color:var(--text-white);
        }
		.comparison-table thead th:last-child {
            border-radius: 0 var(--border-radius-xl) 0 0;
        }
		.comparison-table tbody tr {
            transition: all var(--transition-fast);
        }        
        .comparison-table tbody tr:hover {
            background-color: var(--primary-lighter);
        }
		.comparison-table tbody td {
            padding: var(--spacing-lg);
            border-bottom: 1px solid var(--border-color);
            font-size: var(--font-size-md);
			background: var(--background-color);
        }
		.comparison-table tbody td:first-child {
            font-weight: var(--font-weight-semibold);
            color: var(--text-color);
            text-align: left;
            border-right: 1px solid var(--border-color);
            background-color: var(--background-gray-light);
        }
		.comparison-table tbody tr:last-child td {
            border-bottom: none;
        }
        
        .comparison-table tbody tr:last-child td:first-child {
            border-radius: 0 0 0 var(--border-radius-xl);
        }
		.comparison-table tbody tr:last-child td:last-child {
            border-radius: 0 0 var(--border-radius-xl) 0;
        }        
        .comparison-table .badge-traditional,
        .comparison-table .badge-xlynk {
            display: inline-flex;
            align-items: left;
            gap: var(--spacing-sm);
            padding: var(--spacing-sm) var(--spacing-md);
            border-radius: var(--border-radius-lg);
            font-weight: var(--font-weight-semibold);
            font-size: var(--font-size-md);
        }
	/*Casos de exito*/
		.success-card {
            border: none;
			border-radius:var(--border-radius-xl);
            transition: all var(--transition-normal);
            position: relative;
            overflow: hidden;
			background:var(--background-color);
			box-shadow:var(-shadow-md);
			height:100%;
			margin-bottom:var(--spacing-xs);
			display:flex;
			flex-direction:column;
        }
		.success-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: var(--spacing-xs);
            background: linear-gradient(90deg, var(--primary-color), var(--primary-light));
            transition: left var(--transition-normal);
        }        
        .success-card:hover::before {
            left: 0;
        }        
        .success-card:hover {
			transform: translateY(-8px);
			box-shadow: var(--shadow-xl);
        }
		.success-card .card-body{
			display:flex;
			flex-direction:column;
			height:100%;
			flex-grow:1;
			padding: var(--spacing-xl);
		}
		.success-header {
            display: flex;
            align-items: center;
            gap: var(--spacing-md);
			margin-bottom:var(--spacing-lg);
        }
		.success-icon {
            width: 60px;
            height: 60px;
            border-radius: var(--border-radius-lg);
            background-color:var(--primary-light);
			/* background: linear-gradient(135deg, var(--primary-dark), var(--primary-light));*/
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--primary-color);
            font-size: var(--font-size-2xl);
			flex-shrink: 0;
        }
		.success-badge {
            background: var(--primary-light);
            color: var(--primary-color);
            padding: var(--spacing-sm) var(--spacing-md);
            border-radius: var(--border-radius-lg);
            font-size: var(--font-size-md);
            font-weight: var(--font-weight-semibold);
			 width: 100%;
			display: flex;
            align-items: center;
            justify-content: center;
        }		 
		.success-headline {
            font-size: var(--font-size-xl);
            font-weight: var(--font-weight-bold);
            line-height: var(--line-height-tight);
            margin-bottom: var(--spacing-md);
            color: var(--text-color);
        }     
		.success-description {
            color: var(--text-color);
            opacity: 0.9;
            margin-bottom: var(--spacing-lg);
            line-height: var(--line-height-normal);
        }
		.success-features {
            margin-bottom: var(--spacing-lg);
        }
        .feature-item {
            display: flex;
            align-items: center;
            gap: var(--spacing-md);
            margin-bottom: var(--spacing-sm);
            padding: var(--spacing-sm);
            border-radius: var(--border-radius-md);
            transition: background-color var(--transition-fast);
        }
		.feature-item:hover {
            background-color: var(--primary-light);
        }
		.feature-item i {
            font-size: var(--font-size-lg);
            flex-shrink: 0;
			color:var(--primary-glow);
        }
		.feature-item span {
            font-size: var(--font-size-md);
            color: var(--text-color);
			font-weight:var(--font-weight-semibold);
        }
		.results {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: var(--spacing-md);
            padding-top: var(--spacing-lg);
            border-top: var(--border-width) solid var(--border-color);
			margin-top:auto;
        }        
        .result-item {
            display: flex;
            align-items: center;
            gap: var(--spacing-md);
        }        
        .result-icon {
            width: 36px;
            height: 36px;
            border-radius: var(--border-radius-md);
            background: var(--primary-color);
            display: flex;
            align-items: center;
            justify-content: center;
            color: var(--text-white);
            font-size: var(--font-size-md);
            flex-shrink: 0;
			opacity:0.8;
        }
		.result-text {
            display: flex;
            flex-direction: column;
        }        
        .result-text strong {
            font-size: var(--font-size-sm);
            color: var(--primary-color);
            font-weight: var(--font-weight-semibold);
        }        
        .result-text span {
            font-size: var(--font-size-xs);
            color: var(--text-color);
            opacity: 0.7;
        }        	
		.results-showcase {
            background: linear-gradient(135deg, var(--background-blue), transparent);
            padding: var(--spacing-2xl) var(--spacing-xl);
            border-radius: var(--border-radius-xl);
            margin-bottom:  var(--spacing-2xl);
        } 	
		.metric-card {
			background: var(--background-color);
            padding: var(--spacing-xl);
            border-radius: var(--border-radius-xl);
            text-align: center;
            transition: all var(--transition-normal);
            border: var(--border-width) solid rgba(255, 255, 255, 0.8);
			height:100%;
			box-shadow:var(--shadow-sm);
		}   
		.metric-card:hover {
			transform: translateY(-5px);
			box-shadow: var(--shadow-md);
		}
		.metric-icon-wrapper {
            width: 80px;
            height: 80px;
            border-radius: 50%;
            background: linear-gradient(135deg, var(--primary-color), var(--primary-glow));
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto var(--spacing-lg);
            color: var(--text-white);
            font-size: var(--font-size-3xl);
        }			
	/*Modales*/
        .modal-caso-exito .modal-content {
            border-radius: var(--border-radius-xl);
            border: none;
            box-shadow: var(--shadow-xl);
            overflow: hidden;
			animation: modalAppear 0.4s ease-out;
        }
        .modal-caso-exito .modal-header {
            background: linear-gradient(135deg, var(--primary-color), var(--primary-glow));
            color: var(--text-white);
            border-bottom: none;
            padding: var(--spacing-lg) var(--spacing-xl);
            position: relative;
        }
        .modal-caso-exito .modal-header::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 4px;
            background: linear-gradient(90deg, var(--primary-glow), var(--primary-light));
        }
        .modal-caso-exito .modal-title {
            font-size: var(--font-size-2xl);
            font-weight: var(--font-weight-bold);
            display: flex;
            align-items: center;
            gap: var(--spacing-sm);
        }
        .modal-caso-exito .modal-title i {
            font-size: var(--font-size-3xl);
        }
        .modal-caso-exito .btn-close {
            filter: invert(1);
            opacity: 0.8;
            transition: opacity 0.3s ease;
        }
        .modal-caso-exito .btn-close:hover {
            opacity: 1;
        }
        .modal-caso-exito .modal-body {
            padding: var(--spacing-xl);
            background: var(--background-color);
        }
        .modal-caso-exito .modal-footer {
            border-top: 1px solid var(--border-color);
            padding: var(--spacing-lg) var(--spacing-xl);
            background: var(--background-gray-light);
        }		
        .caso-detalle {
            margin-bottom: var(--spacing-xl);
            padding: var(--spacing-lg);
            border-radius: var(--border-radius-lg);
            background: var(--background-gray-light);
            border-left: 4px solid var(--primary-color);
        }
        .caso-detalle h5 {
            color: var(--primary-color);
            font-weight: var(--font-weight-semibold);
            margin-bottom: var(--spacing-md);
            display: flex;
            align-items: center;
            gap: var(--spacing-sm);
        }
        .caso-detalle h5 i {
            font-size: var(--font-size-xl);
        }
        .caso-detalle p {
            color: var(--text-color);
            margin-bottom: 0;
			line-height: var(--line-height-normal);
        }
        .caso-detalle ul {
            margin-bottom: 0;
            padding-left: var(--spacing-lg);
        }
        .caso-detalle li {
            margin-bottom: var(--spacing-sm);
            line-height: var(--line-height-normal);
            color: var(--text-color);
        }
        .caso-resultados {
            background: linear-gradient(135deg, var(--primary-light), #ffffff);
            padding: var(--spacing-xl);
            border-radius: var(--border-radius-lg);
            margin-top: var(--spacing-lg);
            border: 1px solid rgba(1, 93, 171, 0.1);
            position: relative;
            overflow: hidden;
        }
        .caso-resultados::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 4px;
            background: linear-gradient(90deg, var(--primary-color), var(--primary-glow));
        }
        .caso-resultados h5 {
            color: var(--primary-color);
            font-weight: var(--font-weight-semibold);
            margin-bottom: var(--spacing-lg);
            display: flex;
            align-items: center;
            gap: var(--spacing-sm);
            font-size: var(--font-size-xl);
        }
        .caso-resultados h5 i {
            font-size: var(--font-size-2xl);
        }
        .caso-resultados ul {
            margin-bottom: 0;
        }
        .caso-resultados li {
            margin-bottom: var(--spacing-md);
            padding: var(--spacing-sm);
            background: rgba(255, 255, 255, 0.7);
            border-radius: var(--border-radius-lg);
            display: flex;
            align-items: center;
            gap: var(--spacing-sm);
            transition: all 0.3s ease;
        }
        .caso-resultados li:hover {
            background: rgba(255, 255, 255, 0.9);
            transform: translateX(5px);
        }
        .caso-resultados li strong {
            color: var(--primary-color);
            font-weight: var(--font-weight-semibold);
        }
        .caso-resultados li::before {
            content: '✓';
            color: var(--primary-glow);
            font-weight: bold;
            font-size: var(--spacing-md);
        }
		@keyframes modalAppear {
            from {
                opacity: 0;
                transform: translateY(-50px) scale(0.9);
            }
            to {
                opacity: 1;
                transform: translateY(0) scale(1);
            }
        }	
	/*Clientes*/  				
        .clients-carousel {
            position: relative;
            width: 100%;
            overflow: hidden;
            padding: var(--spacing-xl) 0;
        }        
        .clients-track {
            display: flex;
            animation: scroll 30s linear infinite;
            width: calc(200px * 40); 
        }		
		.client-logo {
            flex: 0 0 200px;
            height: 120px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 var(--spacing-lg);
            padding: var(--spacing-lg);
            background:white;
            border-radius: var(--border-radius);
            box-shadow: var(--shadow-light);
            transition: var(--transition);
        }        
        .client-logo:hover {
            transform: scale(1.05);
            box-shadow: var(--shadow-medium);
        }        
        .client-logo img {
            max-height: 70px;
            max-width: 160px;
            filter: none;
            transition: var(--transition);
        }		
        @keyframes scroll {
            0% {
                transform: translateX(0);
            }
            100% {
                transform: translateX(calc(-200px * 26.63)); 
            }
        }    
        .clients-carousel:hover .clients-track {
            animation-play-state: paused;
        }	
	/*Nosotros*/
		.card-icon {
            width: 70px;
            height: 70px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto var(--spacing-lg);
            background-color: rgba(1, 93, 171, 0.1);
            font-size: var(--font-size-3xl);
            color: var(--primary-color);
        }
		.nosotros-card {
			background: var(--background-color);
			border-radius: var(--border-radius-xl);
			padding: var(--spacing-xl);
			box-shadow: var(--shadow-md);
			transition: transform var(--transition-normal), box-shadow var(--transition-normal);
			height: 100%;
			display: flex;
			flex-direction: column;
			align-items: center;
		}
		.nosotros-card:hover {
			transform: translateY(-5px);
			box-shadow: var(--shadow-lg);
		}
		.nosotros-icon {
			width: 80px;
			height: 80px;
			border-radius: 50%;
			background: var(--primary-light);
			display: flex;
			align-items: center;
			justify-content: center;
			margin-bottom: var(--spacing-lg);
			color: var(--primary-color);
			font-size: var(--font-size-2xl);
			transition: transform var(--transition-normal);
		}
		.nosotros-card:hover .nosotros-icon {
			transform: scale(1.1);
		}
		.nosotros-card-title {
			font-size: var(--font-size-xl);
			font-weight: var(--font-weight-bold);
			color: var(--primary-color);
			margin-bottom: var(--spacing-md);
		}
		.nosotros-card-description {
			color: var(--text-color);
			line-height: var(--line-height-normal);
			margin-bottom: 0;
		}
		.nosotros-values {
			width: 100%;
		}
		.value-item {
			display: flex;
			align-items: center;
			gap: var(--spacing-md);
			margin-bottom: var(--spacing-md);
			padding: var(--spacing-sm);
			border-radius: var(--border-radius-md);
			transition: background-color var(--transition-fast);
		}
		.value-item:hover {
			background-color: var(--primary-light);
		}
		.value-item i {
			color: var(--primary-glow);
			font-size: var(--font-size-lg);
			flex-shrink: 0;
		}
		.value-item span {
			font-weight: var(--font-weight-medium);
			color: var(--text-color);
		}
		.nosotros-diferencial {
			background: var(--background-blue);
			border-radius: var(--border-radius-xl);
			padding: var(--spacing-2xl);
			margin: var(--spacing-3xl) 0;
		}
		.diferencial-title {
			font-size: var(--font-size-2xl);
			font-weight: var(--font-weight-bold);
			color: var(--primary-color);
			margin-bottom: var(--spacing-lg);
		}
		.diferencial-description {
			color: var(--text-color);
			margin-bottom: var(--spacing-lg);
			line-height: var(--line-height-normal);
		}
		.diferencial-items {
			margin-bottom: var(--spacing-lg);
		}
		.diferencial-item {
			display: flex;
			align-items: flex-start;
			gap: var(--spacing-md);
			margin-bottom: var(--spacing-md);
		}
		.diferencial-item i {
			color: var(--success-color);
			font-size: var(--font-size-lg);
			flex-shrink: 0;
			margin-top: 2px;
		}
		.diferencial-item span {
			color: var(--text-color);
			line-height: var(--line-height-normal);
		}
		.diferencial-visual {
			background: var(--background-color);
			border-radius: var(--border-radius-xl);
			padding: var(--spacing-xl);
			box-shadow: var(--shadow-md);
			height: 100%;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
		}
		.visual-icon {
			width: 100px;
			height: 100px;
			border-radius: 50%;
			background: linear-gradient(135deg, var(--primary-color), var(--primary-glow));
			display: flex;
			align-items: center;
			justify-content: center;
			margin-bottom: var(--spacing-lg);
			color: var(--text-white);
			font-size: var(--font-size-3xl);
		}
		.diferencial-visual h4 {
			font-size: var(--font-size-xl);
			font-weight: var(--font-weight-bold);
			color: var(--primary-color);
			margin-bottom: var(--spacing-md);
			text-align: center;
		}
		.diferencial-visual p {
			color: var(--text-color);
			text-align: center;
			line-height: var(--line-height-normal);
			margin-bottom: 0;
		}
	/*Contacto*/				
		.contact-card, .contact-form {
            background-color: var(--background-color);
            border-radius: var(--border-radius-xl);
            padding: var(--spacing-2xl);
            box-shadow: var(--shadow-lg);
            height: 100%;
            transition: all var(--transition-normal);
            border: 1px solid rgba(255, 255, 255, 0.8);
            backdrop-filter: blur(10px);
        }        
        .contact-card h3, .contact-form h3 {
            color: var(--primary-color);
            font-weight: var(--font-weight-semibold);
            margin-bottom: var(--spacing-lg);
            position: relative;
            padding-bottom: var(--spacing-md);
        }        
        .contact-item {
            display: flex;
            align-items: flex-start;
            margin-bottom: var(--spacing-lg);
            padding: var(--spacing-md);
            border-radius: var(--border-radius-lg);
            transition: all var(--transition-fast);
            border: 1px solid transparent;
        }        
        .contact-item:hover {
            background-color: var(--primary-light);
            border-color: var(--primary-color);
            transform: translateX(5px);
        }        
        .contact-icon {
            background: linear-gradient(135deg, var(--primary-color), var(--primary-glow));
            color: var(--text-white);
            width: 44px;
            height: 44px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: var(--spacing-md);
            flex-shrink: 0;
            transition: all var(--transition-fast);
            font-size: var(--font-size-lg);
        }        
        .contact-item:hover .contact-icon {
            transform: scale(1.1) rotate(5deg);
        }        
        .contact-details h4 {
            font-weight: var(--font-weight-semibold);
            margin-bottom: var(--spacing-xs);
            font-size: var(--font-size-md);
            color: var(--text-color);
        }        
        .contact-details p, .contact-details a {
            color: var(--text-light);
            margin-bottom: 0;
            text-decoration: none;
            font-size: var(--font-size-sm);
            line-height: var(--line-height-normal);
        }        
        .contact-details a:hover {
            color: var(--primary-color);
        }        
        .form-intro {
            color: var(--text-light);
            font-size: var(--font-size-md);
            margin-bottom: var(--spacing-lg);
            line-height: var(--line-height-normal);
        }        
        .form-tabs {
            display: flex;
            border-bottom: 2px solid var(--border-color);
            margin-bottom: var(--spacing-lg);
            border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
            overflow: hidden;
            background: var(--background-gray-light);
        }        
        .form-tab {
            flex: 1;
            text-align: center;
            padding: var(--spacing-md) var(--spacing-sm);
            background: var(--background-gray-light);
            border: none;
            cursor: pointer;
            transition: all var(--transition-fast);
            font-weight: var(--font-weight-medium);
            color: var(--text-light);
            position: relative;
            font-size: var(--font-size-sm);
            display: flex;
            align-items: center;
            justify-content: center;
        }        
        .form-tab.active {
            background: var(--primary-color);
            color: var(--card-color);
            font-weight: var(--font-weight-semibold);
        }        
        .form-tab:hover:not(.active) {
            background: var(--primary-light);
            color: var(--primary-color);
        }        
        .form-content {
            display: none;
            animation: fadeIn 0.5s ease;
        }        
        .form-content.active {
            display: block;
        }        
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }        
        .form-control{
            border: 1px solid var(--border-color);
            border-radius: var(--border-radius-lg);
            padding: var(--spacing-md);
            font-size: var(--font-size-sm);
            transition: all var(--transition-fast);
            background: var(--background-color);
        }
		.form-select{
			border: 1px solid var(--border-color);
			border-radius:var(--border-radius-lg);
			padding: var(--spacing-md);
			font-size:var(--font-size-sm);
			transition:all var(--transition-fast);			
			background: var(--background-color) 
                url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23333' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") 
                no-repeat right 0.75rem center/16px 12px;
			color: var(--text-color);
			opacity:0.7;
			appearance: none;
			-webkit-appearance: none;
			-moz-appearance: none;
		}   
		.form-select:focus {
			border-color: #015dab;
			box-shadow: 0 0 0 0.2rem rgba(1, 93, 171, 0.15);
		}
		.form-select::-ms-expand {
			display: none;
		}		
        .form-control:focus, .form-select:focus {
            border-color: var(--primary-color);
            box-shadow: 0 0 0 0.2rem rgba(1, 93, 171, 0.15);
            transform: translateY(-2px);
        }        
        .form-control::placeholder {
            color: var(--text-color);
            opacity: 0.7;
        }      
        .form-check {
            margin-bottom: var(--spacing-sm);
            display: flex;
            align-items: flex-start;
        }        
        .form-check-input {
            margin-right: var(--spacing-sm);
            margin-top: var(--spacing-xs);
        }        
        .form-check-label {
            color: var(--text-light);
            font-size: var(--font-size-md);
            line-height: var(--line-height-normal);
        } 
        .contact-info-dynamic {
            transition: all var(--transition-normal);
        }        
        .contact-info-ventas, .contact-info-soporte {
            display: none;
        }        
        .contact-info-ventas.active, .contact-info-soporte.active {
            display: block;
            animation: fadeIn 0.5s ease;
        }	
	/* Footer */
        .footer {
            background-color: var(--background-dark);
            color: var(--text-white);
            padding: var(--spacing-3xl) var(--spacing-xl);
            margin-top: auto;
        }        
        .footer-logo {
            height: 80px;
            margin-bottom: var(--spacing-lg);
        }        
        .footer-link {
            color: var(--text-white);
            text-decoration: none;
            transition: var(--transition-fast);
            display: block;
            margin-bottom: var(--spacing-sm);
        }        
        .footer-link:hover {
            color: var(--primary-color);
            padding-left: var(--spacing-xs);
        }
		.footer h2{
			font-size:var(--font-size-2xl);
		}
		.social-icons{
			color:var(--background-dark);			
		}

/* ===== RESPONSIVE MEDIA QUERIES ===== */

/* DISPOSITIVOS MUY PEQUEÑOS (hasta 320px) */
@media (max-width: 320px) {
    .hero-section { min-height: 60vh !important; }
    .hero-carousel, .carousel-item { height: 60vh !important; }    
    .hero-title { font-size: var(--font-size-2xl); }
    .hero-subtitle { font-size: var(--font-size-sm); }
    .hero-tagline, .hero-benefit { display: none; }    
    .btn-hero { padding: var(--spacing-md); width: 100%; font-size: var(--font-size-sm); }    
    .hero-buttons { gap: var(--spacing-sm); flex-direction: column; margin-bottom: var(--spacing-xl); }    
    .section { padding: var(--spacing-2xl) 0; }
    .section-title { font-size: var(--font-size-2xl) !important; }
    .section-intro { font-size: var(--font-size-sm); }
    .section-subtitle { font-size: var(--font-size-2xl) !important; }    
    .tecnologia-grid { grid-template-columns: 1fr; }
    .tecnologia-card { padding: var(--spacing-lg); }
    .tecnologia-icon { width: 60px; height: 60px; font-size: var(--font-size-lg); }
    .tecnologia-card-title { font-size: var(--font-size-lg); }    
    .premium-cta { padding: var(--spacing-xl) var(--spacing-md); }
    .cta-title { font-size: var(--font-size-xl); }
    .cta-subtitle { font-size: var(--font-size-sm); }
    .cta-buttons { flex-direction: column; }
    .btn-premium { padding: var(--spacing-md); font-size: var(--font-size-sm); width: 100%; margin-bottom:var(--spacing-md); }
    .comparison-table { font-size: var(--font-size-sm); overflow-x: auto; margin-bottom: var(--spacing-lg); }
    .comparison-table .table { min-width: 550px; }
    .comparison-table thead th, .comparison-table tbody td { padding: var(--spacing-sm); font-size: var(--font-size-sm); }
    .comparison-table .badge-traditional, .comparison-table .badge-xlynk { padding: var(--spacing-xs) var(--spacing-sm); font-size: var(--font-size-sm); }    
    .success-card .card-body { padding: var(--spacing-lg); }
    .success-headline { font-size: var(--font-size-lg); }    
    .metric-card { padding: var(--spacing-md); }
    .metric-icon-wrapper { width: 50px; height: 50px; font-size: var(--font-size-lg); }    
    .contact-card, .contact-form { padding: var(--spacing-lg); }
    .contact-item { padding: var(--spacing-sm); margin-bottom: var(--spacing-md); }    
    .navbar-brand img { height: 50px; }
    .nav-link { font-size: var(--font-size-md); padding: var(--spacing-sm); }    
    .carousel-control-prev, .carousel-control-next { width: 35px; height: 35px; }
    .carousel-control-prev { left: 5px; }
    .carousel-control-next { right: 5px; }    
    .form-tabs { flex-direction: column; }
    .form-tab { padding: var(--spacing-md); font-size: var(--font-size-sm); }    
    .modelo-beneficios { padding: var(--spacing-md); }
    .caso-resultados { padding: var(--spacing-sm); }
    .caso-resultados ul { padding-left: 0; }    
    .modal-caso-exito .modal-header { padding: var(--spacing-md); }
    .modal-caso-exito .modal-body { padding: var(--spacing-sm); }
    .modal-caso-exito .modal-title { font-size: var(--font-size-lg); }    
    .btn-primary-custom, .btn-saber-mas { font-size: var(--font-size-md); padding: var(--spacing-xs) var(--spacing-lg); }
    .nosotros-diferencial { padding: var(--spacing-md); }
}
/* DISPOSITIVOS PEQUEÑOS (321px - 549px) */
@media (min-width: 321px) and (max-width: 549px) {
    .hero-section { min-height: 70vh !important; }
    .hero-carousel, .carousel-item { height: 70vh !important; }    
    .container { padding-left: var(--spacing-lg); padding-right: var(--spacing-lg); }    
    .hero-title { font-size: var(--font-size-3xl); }
    .hero-subtitle { font-size: var(--font-size-md); }
    .btn-hero { padding: var(--spacing-md); width: 100%; font-size: var(--font-size-md); }
    .hero-tagline, .hero-benefit { display: none; }    
    .section { padding: var(--spacing-3xl) 0; }
    .section-title { font-size: var(--font-size-3xl); }
    .section-intro { font-size: var(--font-size-md); }    
    .tecnologia-grid { grid-template-columns: 1fr; }
    .tecnologia-card { padding: var(--spacing-lg); }
    .tecnologia-icon { width: 70px; height: 70px; font-size: var(--font-size-xl); }    
    .premium-cta { padding: var(--spacing-xl) var(--spacing-lg); }
    .cta-title { font-size: var(--font-size-2xl); }
    .cta-subtitle { font-size: var(--font-size-md); }
    .cta-buttons { flex-direction: column; }
    .btn-premium { padding: var(--spacing-md) var(--spacing-lg); font-size: var(--font-size-md); width: 100%; margin-bottom:var(--spacing-md); }
    .comparison-table { font-size: var(--font-size-md); overflow-x: auto; margin-bottom: var(--spacing-lg); }
    .comparison-table .table { min-width: 600px; }
    .comparison-table thead th, .comparison-table tbody td { padding: var(--spacing-sm) var(--spacing-xs); font-size: var(--font-size-md); }    
    .contact-form { padding: var(--spacing-lg); }
    .form-tabs { flex-direction: column; }
    .form-tab { padding: var(--spacing-md); font-size: var(--font-size-md); }    
    .nosotros-diferencial { padding: var(--spacing-md); }
}
/* DISPOSITIVOS MEDIANOS PEQUEÑOS (550px - 768px) */
@media (min-width: 550px) and (max-width: 768px) {
    .container { padding-left: var(--spacing-xl); padding-right: var(--spacing-xl); }    
    .hero-title { font-size: var(--font-size-4xl); }
    .hero-tagline { font-size: var(--font-size-md); }    
    .section-title { font-size: var(--font-size-4xl); }
    .section-subtitle { font-size: var(--font-size-2xl); }    
    .tecnologia-grid { grid-template-columns: repeat(2, 1fr); gap: var(--spacing-lg); }
    .tecnologia-card { padding: var(--spacing-lg); }    
    .caracteristicas-grid { grid-template-columns: repeat(2, 1fr); }
    .dashboard-content { gap: var(--spacing-xl); }    
    .premium-cta { padding: var(--spacing-2xl) var(--spacing-xl); }
    .cta-buttons { flex-wrap: wrap; flex-direction: row; justify-content: center; }
    .cta-title { font-size: var(--font-size-2xl); }
    .cta-subtitle { font-size: var(--font-size-md); }
    .btn-premium { padding: var(--spacing-md) var(--spacing-lg); font-size: var(--font-size-md); width: 70%; margin-bottom:var(--spacing-md); }
    .comparison-table { font-size: var(--font-size-md); overflow-x: auto; margin-bottom: var(--spacing-lg); }
    .comparison-table .table { min-width: 650px; }
    .comparison-table thead th, .comparison-table tbody td { padding: var(--spacing-md) var(--spacing-xs); font-size: var(--font-size-md); }    
    .success-card .card-body { padding: var(--spacing-xl); }
    .results { grid-template-columns: 1fr 1fr; }
}
/* TABLETS (769px - 862px) */
@media (min-width: 769px) and (max-width: 862px) {
    .container { max-width: 100%; padding-left: var(--spacing-lg); padding-right: var(--spacing-lg); }    
    .hero-title { font-size: var(--font-size-4xl); }
    .hero-subtitle { font-size: var(--font-size-lg); }    
    .section { padding: var(--spacing-3xl) 0; }
    .section-title { font-size: var(--font-size-3xl); }
    .section-intro { font-size: var(--font-size-lg); }    
    .tecnologia-grid { grid-template-columns: 1fr !important; gap: var(--spacing-lg); }
    .tecnologia-card { padding: var(--spacing-xl); display: flex; flex-direction: column; align-items: center; text-align: center; }
    .tecnologia-icon { width: 80px; height: 80px; font-size: var(--font-size-2xl); }
    .tecnologia-card-title { font-size: var(--font-size-xl); }
    .tecnologia-card-description { font-size: var(--font-size-md); }    
    .caracteristicas-grid { grid-template-columns: 1fr; }
    .caracteristica-item { padding: var(--spacing-lg); }    
    .dashboard-content { flex-direction: column; text-align: center; gap: var(--spacing-xl); }
    .dashboard-text, .dashboard-image { flex: none; width: 100%; }
    .dashboard-image { order: -1; margin-bottom: var(--spacing-xl); }
    .comparison-table { font-size: var(--font-size-md); margin-bottom: var(--spacing-xl); }    
    .premium-cta { padding: var(--spacing-2xl) var(--spacing-xl); }
    .cta-title { font-size: var(--font-size-2xl); }
    .cta-subtitle { font-size: var(--font-size-lg); }    
    .success-card .card-body { padding: var(--spacing-xl); }
    .results { grid-template-columns: 1fr; }    
    .contact-card, .contact-form { padding: var(--spacing-xl); }
}
/* DISPOSITIVOS MEDIANOS (863px - 992px) */
@media (min-width: 863px) and (max-width: 992px) {
    .container { max-width: 100%; padding-left: var(--spacing-xl); padding-right: var(--spacing-xl); }    
    .tecnologia-grid { grid-template-columns: repeat(2, 1fr); gap: var(--spacing-lg); }    
    .hero-title { font-size: var(--font-size-5xl); }
    .section-title { font-size: var(--font-size-4xl); }    
    .caracteristicas-grid { grid-template-columns: repeat(2, 1fr); }
    .dashboard-content { gap: var(--spacing-xl); }   
    .comparison-table { font-size: var(--font-size-md); }    
    .premium-cta { padding: var(--spacing-2xl) var(--spacing-xl); }
}
/* DISPOSITIVOS GRANDES (993px - 1200px) */
@media (min-width: 993px) and (max-width: 1200px) {
    .container { max-width: 100%; padding-left: var(--spacing-xl); padding-right: var(--spacing-xl); }    
    .tecnologia-grid { grid-template-columns: repeat(3, 1fr); gap: var(--spacing-xl); }    
    .hero-title { font-size: var(--font-size-5xl); }
    .section-title { font-size: var(--font-size-4xl); }    
    .caracteristicas-grid { grid-template-columns: repeat(2, 1fr); }
    .dashboard-content { gap: var(--spacing-2xl); }
    .comparison-table { font-size: var(--font-size-md); }    
    .premium-cta { padding: var(--spacing-3xl) var(--spacing-2xl); }
    .cta-glow { width: 250%; height: 250%; top: -75%; left: -75%; }    
    .servicios-grid { grid-template-columns: 1fr !important; gap: var(--spacing-xl); max-width: 700px; margin-left: auto; margin-right: auto; }
    .servicio-card { padding: var(--spacing-xl); }
    .servicio-features li { font-size: var(--font-size-md); }
}
/*Navbar*/
@media (min-width: 1201px) {
    .navbar-expand-lg .navbar-toggler { display: none; }    
    .navbar-expand-lg .navbar-collapse { display: flex !important; flex-basis: auto; }
}
/* DISPOSITIVOS MUY GRANDES (1201px - 1399px) */
@media (min-width: 1201px) and (max-width: 1399px) {
    .container { max-width: 1320px; }    
    .hero-title { font-size: var(--font-size-5xl); }
    .section-title { font-size: var(--font-size-5xl); }    
    .tecnologia-grid { grid-template-columns: repeat(3, 1fr); gap: var(--spacing-2xl); }    
    .premium-cta { padding: var(--spacing-4xl) var(--spacing-3xl); }
}
/* PANTALLAS MUY GRANDES (+2000px) */
@media (min-width: 2000px) {
    .container { max-width: 85%; }    
    body { font-size: 1vw;  }
    .hero-title { font-size: 3.5vw; }
	.hero-subtitle{ font-size:1.25vw; }
	.hero-tagline{ font-size:1.125vw;}
	.hero-benefit{font-size:0.875vw;}
	.btn-hero{font-size:1.125vw;}
    .section-title { font-size: 3vw; }
    .section-intro { font-size: 1.25vw; max-width: 70%; }    
	.highlight-quote{font-size: 1vw}	
	.tecnologia-card-title{font-size:1.25vw;}
    .tecnologia-grid { grid-template-columns: repeat(auto, 1fr); gap: 2vw; }
	.tecnologia-card { padding: var(--spacing-2xl); }
	.caracteristicas-title{font-size:1.875vw;}
    .tecnologia-icon { width: 100px; height: 100px; font-size: var(--font-size-3xl); }    
    .premium-cta { padding: var(--spacing-4xl) var(--spacing-3xl); }
    .cta-title { font-size: var(--font-size-4xl); }
    .cta-subtitle { font-size: var(--font-size-xl); }
    .btn-premium { padding: var(--spacing-lg) var(--spacing-2xl); font-size: var(--font-size-xl); }   
    .comparison-table { font-size: var(--font-size-lg); }
    .comparison-table thead th, .comparison-table tbody td { padding: var(--spacing-lg); }    
    .success-card .card-body { padding: var(--spacing-2xl); }
    .contact-card, .contact-form { padding: var(--spacing-2xl); }
}

/* ===== MEJORAS GENERALES DE ESPACIADO ===== */
@media (max-width: 768px) {
    html, body { overflow-x: hidden; width: 100%; position: relative; }    
    .row { margin-left: -var(--spacing-sm); margin-right: -var(--spacing-sm); }    
    .col, [class*="col-"] { padding-left: var(--spacing-sm); padding-right: var(--spacing-sm); }    
    .section { padding: var(--spacing-3xl) 0; }    
    .mb-4, .mb-5, .mb-6 { margin-bottom: var(--spacing-lg) !important; }
    .mt-4, .mt-5, .mt-6 { margin-top: var(--spacing-lg) !important; }
    .py-4, .py-5, .py-6 { padding-top: var(--spacing-lg) !important; padding-bottom: var(--spacing-lg) !important; }    
    .key-service-card { flex-direction: column; text-align: center; padding: var(--spacing-lg); }
    .key-service-features { justify-content: center; }
    .highlight-quote { padding: var(--spacing-md); }    
    .servicios-grid { grid-template-columns: 1fr; }
    .servicio-card { padding: var(--spacing-lg);  margin-bottom: var(--spacing-md); }
    .servicio-features { display: flex; flex-direction: column; gap: var(--spacing-sm); }
    .servicio-features li { display: block !important; margin-bottom: var(--spacing-sm); padding: var(--spacing-sm); background: var(--background-gray-light); border-radius: var(--border-radius-md); line-height: 1.5; }
    .servicio-features li i { display: inline-block; margin-right: var(--spacing-sm); vertical-align: middle; }
    .servicio-features li strong, .servicio-features li span { display: inline !important; }    
    .servicio-icon { width: 70px; height: 70px; font-size: var(--font-size-xl); }    
    .modelo-visual { flex-direction: column; gap: var(--spacing-md); }
    .arrow { transform: rotate(90deg); }
}
/* ===== MEJORAS ESPECÍFICAS===== */
@media (max-width: 1200px) {
    .dashboard-content { gap: var(--spacing-xl); }
    .dashboard-title { font-size: var(--font-size-2xl); }    
    .servicios-grid { grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: var(--spacing-xl); }    
    .modal-caso-exito .modal-footer { padding: var(--spacing-md) 0; flex-direction: column; gap: var(--spacing-md); }
    .modal-caso-exito .modal-footer .btn { width: 90%; margin: 0; padding: var(--spacing-md) var(--spacing-lg); }
    .modal-caso-exito .modal-header { padding: var(--spacing-md); }
    .modal-caso-exito .modal-body { padding: var(--spacing-sm); }
    .modal-caso-exito .modal-title { font-size: var(--font-size-lg); }    
    .nosotros-diferencial { padding: var(--spacing-md); }
    .caso-resultados { padding: var(--spacing-sm); }
    .caso-resultados ul { padding-left: 0; }    
    .btn-primary-custom, .btn-saber-mas { font-size: var(--font-size-md); padding: var(--spacing-md) var(--spacing-lg); }
	.modelo-visual { gap: var(--spacing-md); }
	.navbar-expand-lg .navbar-toggler { display: block; }   
    .navbar-expand-lg .navbar-collapse { flex-basis: 100%; flex-grow: 1; }
}
@media (max-width: 992px) {
    .tecnologia-grid { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: var(--spacing-lg); }    
    .caracteristicas-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }    
    .dashboard-content { flex-direction: column; text-align: center; }
    .dashboard-text, .dashboard-image { flex: none; width: 100%; }
    .dashboard-image { order: -1; margin-bottom: var(--spacing-xl); }
    .dashboard-features { display: inline-block; text-align: left; }
}
@media (max-width: 768px) {
    .tecnologia-section { padding: var(--spacing-3xl) 0; }
    .tecnologia-header { margin-bottom: var(--spacing-2xl); }    
    .tecnologia-grid { grid-template-columns: 1fr; gap: var(--spacing-lg); }
    .tecnologia-card { padding: var(--spacing-lg); }
    .tecnologia-icon { width: 70px; height: 70px; font-size: var(--font-size-xl); }    
    .caracteristicas-section { padding: var(--spacing-xl); }
    .caracteristicas-title { font-size: var(--font-size-2xl); }
    .caracteristicas-grid { grid-template-columns: 1fr; }    
    .dashboard-section { padding: var(--spacing-xl); }
    .dashboard-title { font-size: var(--font-size-xl); }
    .image-dashboarde { padding: 1.5rem; }    
    .nosotros-card { padding: var(--spacing-lg); margin-bottom: var(--spacing-lg); }
    .nosotros-icon { width: 70px; height: 70px; font-size: var(--font-size-xl); }    
    .diferencial-visual { margin-top: var(--spacing-xl); padding: var(--spacing-lg); }
    .visual-icon { width: 80px; height: 80px; font-size: var(--font-size-2xl); }
    .modal-caso-exito .modal-footer { padding: var(--spacing-md); flex-direction: column; gap: var(--spacing-md); }
    .modal-caso-exito .modal-footer .btn { width: 100%; }
    .modal-caso-exito .modal-body { padding: var(--spacing-sm); max-height: 50vh; overflow-y: auto; }    
    .caso-detalle, .caso-resultados { padding: var(--spacing-md); margin-bottom: var(--spacing-lg); }
    .caso-resultados li { flex-direction: column; align-items: flex-start; gap: var(--spacing-xs); padding: var(--spacing-sm); }
}
/* TABLETS HORIZONTALES (778px - 992px) */
@media (min-width: 778px) and (max-width: 992px) {
    .servicios-grid { grid-template-columns: 1fr !important; gap: var(--spacing-lg); max-width: 600px; margin-left: auto; margin-right: auto; }    
    .servicio-card { padding: var(--spacing-lg); margin-bottom: var(--spacing-md); }    
    .servicio-icon { width: 70px; height: 70px; font-size: var(--font-size-xl); margin-bottom: var(--spacing-md); }    
    .servicio-title { font-size: var(--font-size-lg); }
    .servicio-description { font-size: var(--font-size-md); }
}
/* DISPOSITIVOS PEQUEÑOS HORIZONTALES (hasta 777px) */
@media (max-width: 777px) {
    .servicios-grid { grid-template-columns: 1fr; gap: var(--spacing-lg); }    
    .servicio-card { padding: var(--spacing-lg); }    
    .servicio-icon { width: 60px; height: 60px; font-size: var(--font-size-lg); }
}
/* DISPOSITIVOS MEDIANOS (851px - 992px) */
@media (min-width: 851px) and (max-width: 992px) {
    .caracteristicas-grid { grid-template-columns: repeat(2, 1fr); gap: var(--spacing-lg); }    
    .caracteristica-item { padding: var(--spacing-md); gap: var(--spacing-sm); }    
    .caracteristica-icon { font-size: var(--font-size-md); }
    .caracteristica-content h4 { font-size: var(--font-size-lg); }
    .caracteristica-content p { font-size: var(--font-size-sm); }
}





































