rf-v4.10-ecosistema50%
This commit is contained in:
@@ -1,220 +0,0 @@
|
|||||||
# INSTRUCTIVO TÉCNICO Y DE DISEÑO: REFACTORIZACIÓN DEFINITIVA WEB "IDE CONSULTORES"
|
|
||||||
|
|
||||||
Este documento contiene las especificaciones técnicas (HTML5, CSS3, JavaScript), de interfaz (UI/UX) y de redacción comercial (Copywriting) para guiar la corrección y reestructuración total del sitio web demo de **IDE Consultores**.
|
|
||||||
|
|
||||||
El objetivo es eliminar todo aspecto genérico o sintético ("aspecto de IA") y sustituirlo por una presencia digital auténtica, minimalista, ejecutiva y orientada a la conversión, donde convivan fluidamente el storytelling sistémico y la búsqueda de soluciones técnicas directas.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 1. PRINCIPIOS DE DISEÑO Y DIRECTRICES TÉCNICAS GLOBALES
|
|
||||||
|
|
||||||
1. **Estilo Visual e Identidad:**
|
|
||||||
|
|
||||||
* **Minimalismo ejecutivo:** Espacios en blanco amplios, composiciones geométricas limpias, sin saturación de gradientes ni fondos oscuros pesados.
|
|
||||||
* **Tipografía:** Jerarquía estricta. Fuentes sans-serif modernas y legibles (`Poppins` para títulos principales / `Inter` o `Mulish` para texto de lectura y metadatos).
|
|
||||||
* **Paleta Cromática del Ecosistema: (variables en styles.css)**
|
|
||||||
* **Color Institucional / Base:** --ide-primary y --ide-accent
|
|
||||||
* **IDE Excellence:** --ide-excellence.
|
|
||||||
* **IDE Projects:** --ide-projects.
|
|
||||||
* **IDE Digital:** --ide-digital.
|
|
||||||
* **IDE Academy:** --ide-academy
|
|
||||||
|
|
||||||
|
|
||||||
2. **Componentes Globales Estandarizados:**
|
|
||||||
|
|
||||||
* **Ensanchar el sitio:** Utilizar mas los anchos de la pantalla para optimizar el contenido de cada sección.
|
|
||||||
* **Buscador predictivo superior:** Agregar un botón de búsqueda (`<button class="search-btn"><svg class="icon-search">...</svg></button>`) ubicado permanentemente en el header junto al botón principal. Debe permitir la búsqueda rápida de términos clave (*ISO 9001, Productividad, Telecomunicaciones, FTTH, PMO, Procesos, IA, Capacitación*).
|
|
||||||
* **Botón CTA Unificado:** Unificar el botón **HABLEMOS →** (`.btn-cta-unificado`). Mismo padding, border-radius (estilo píldora), color corporativo y flecha circular en todas las páginas (header, cierres de sección y footer). No utilizar textos largos como "VER CÓMO AFRONTAMOS ESTE DESAFÍO".
|
|
||||||
* **Footer Global Idéntico:** Unificar un único footer en todas las páginas con la siguiente estructura:
|
|
||||||
* Izquierda: Logotipo IDE Consultores + lema `"Convertimos la gestión en una ventaja competitiva"`.
|
|
||||||
* Centro: Navegación directa (`Inicio` | `Por dónde empezar` | `Soluciones` | `Ecosistema` | `Insights` | `Nosotros`).
|
|
||||||
* Derecha: Datos de contacto reales (`info@ideconsultores.com.ar` | Sedes: Salta y Jujuy | Teléfonos: `+54 9 388 4880536` y `+54 9 387 6132059`).
|
|
||||||
* Inferior: Enlaces legales (`Política de privacidad` y `Términos y condiciones`) + Redes sociales validadas (LinkedIn, Instagram y Facebook; verificar que el enlace de Facebook no tenga etiqueta de YouTube).
|
|
||||||
|
|
||||||
3. **Tratamiento de Contenidos:**
|
|
||||||
|
|
||||||
* **Insercion de imagenes de fondos:** Aplicar estilos, layers de colores, degrades y demases efectos visuales y respecto de la imagen que se insertará dejar un placeholder para que luego se escoga del repositorio cual es el archivo de imagen mas adecuado.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 2. ARQUITECTURA DEL SITIO Y RUTAS
|
|
||||||
|
|
||||||
/
|
|
||||||
├── index.html -> INICIO (Conexión sistémica, pilares, ámbitos de experiencia y Brújula)
|
|
||||||
├── desafios.html -> POR DÓNDE EMPEZAR (Identificación de problemas organizacionales)
|
|
||||||
├── soluciones.html -> SOLUCIONES (Las 6 familias de soluciones + Nivel 2 concreto)
|
|
||||||
├── ecosistema.html -> ECOSISTEMA (Infinito interactivo + Nivel 2 desplegable de unidades)
|
|
||||||
├── insights.html -> INSIGHTS (Artículos de opinión, tendencias y herramientas descargables)
|
|
||||||
└── nosotros.html -> NOSOTROS (Somos IDE: Socios reales, propósito y Trabajá con nosotros)
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 3. TAREAS DE REFACTORIZACIÓN POR PANTALLA
|
|
||||||
|
|
||||||
### PANTALLA 1: INICIO (`index.html`)
|
|
||||||
|
|
||||||
1. **Header / Hero Section:**
|
|
||||||
|
|
||||||
* **Mensaje Central:** Invertir la jerarquía. El claim rector debe ser **"CONECTAMOS EL TODO"**.
|
|
||||||
* **Pregunta de tensión:** `¿Qué pasa cuando dejamos de mirar los problemas por separado?`
|
|
||||||
* **Texto descriptivo (sintetizado):**
|
|
||||||
|
|
||||||
> *"En IDE entendemos cómo funciona el sistema para identificar dónde intervenir, integrar las capacidades necesarias y generar valor en el conjunto."*
|
|
||||||
* **Fondo visual:** Reemplazar la animación de malla ("efecto pecera") por un fondo estático limpio con degradado hacia el texto para máxima legibilidad, acompañado de una cinta de infinito sutil con halos en los cuatro colores del ecosistema.
|
|
||||||
* **Elementos UI:** Input o botón directo con lupa para el buscador rápido + botón **HABLEMOS →**.
|
|
||||||
|
|
||||||
2. **Sección Cuatro Pilares (Ecosistema):**
|
|
||||||
|
|
||||||
* **Título:** `"Cuatro capacidades, un mismo propósito: generar impacto."` (en un solo renglón, sin eyebrow redundante).
|
|
||||||
* **Diseño:** Grilla 2x2 apaisada o 4 columnas limpias con tarjeta estilizada: foto real de contexto superior, ola de color distintiva, ícono vectorial y títulos en mayor escala:
|
|
||||||
* *IDE Excellence:* `PARA FORTALECER LA GESTIÓN`
|
|
||||||
* *IDE Projects:* `PARA CONVERTIR PROYECTOS EN RESULTADOS`
|
|
||||||
* *IDE Digital:* `PARA INTEGRAR TECNOLOGÍA CON PROPÓSITO`
|
|
||||||
* *IDE Academy:* `PARA DESARROLLAR CAPACIDADES`
|
|
||||||
|
|
||||||
3. **Sección Ámbitos de Experiencia:**
|
|
||||||
|
|
||||||
* **Estructura:** Título a la izquierda y tarjetas interactivas a la derecha.
|
|
||||||
* **Bajada:** `"Comprendemos las particularidades de cada sector para adaptar la intervención sin perder de vista el conjunto."`
|
|
||||||
* **Ajuste fotográfico:** Cambiar la foto de fondo de *Industria & Servicios* por una planta industrial/metalmecánica o línea de montaje (no alimenticia).
|
|
||||||
* **Incorporación obligatoria:** Añadir la tarjeta de **Telecomunicaciones**.
|
|
||||||
* **Comportamiento UI:** Las tarjetas solo muestran el título por defecto; el texto descriptivo aparece exclusivamente en estado `:hover`:
|
|
||||||
* *Agro & Alimentos* $\rightarrow$ `"Fortalecer operaciones y generar valor sostenible."`
|
|
||||||
* *Industria & Servicios* $\rightarrow$ `"Optimizar la gestión y potenciar la eficiencia operativa."`
|
|
||||||
* *Telecomunicaciones* $\rightarrow$ `"Impulsar conectividad eficiente mediante operaciones y proyectos integrados."`
|
|
||||||
* *Sector Salud* $\rightarrow$ `"Fortalecer la calidad, la seguridad y la experiencia del paciente."`
|
|
||||||
* *Educación & Gobierno* $\rightarrow$ `"Fortalecer la gestión y generar mejores resultados."`
|
|
||||||
|
|
||||||
4. **Sección Incomodidad Productiva & Brújula IDE:**
|
|
||||||
|
|
||||||
* Unificar ambas secciones en un solo bloque para optimizar la altura de la página.
|
|
||||||
* **Título:** `"¿Qué impacto tendrá esa mejora en el conjunto?"`
|
|
||||||
* **Cuerpo:** `"Una mejora puede resolver una necesidad puntual. En IDE vamos un paso más allá: ¿qué impacto tendrá esa mejora en el conjunto?"`
|
|
||||||
* **Brújula IDE:** Ubicar el componente interactivo en paralelo con una marca de agua suave de brújula.
|
|
||||||
|
|
||||||
5. **Cierre de Conversión:**
|
|
||||||
|
|
||||||
* Módulo limpio: `"¿Qué desafío querés transformar?"` + botón **HABLEMOS →**.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### PANTALLA 2: POR DÓNDE EMPEZAR / DESAFÍOS (`desafios.html`)
|
|
||||||
|
|
||||||
1. **Cabecera Asimétrica:**
|
|
||||||
|
|
||||||
* Texto a la izquierda (en 2 líneas): `"¿Qué está pasando en tu organización?"`
|
|
||||||
* Bajada: `"A veces el desafío es evidente. Otras, aparece como una señal, una necesidad de cambio o una oportunidad. Empecemos por comprenderlo para identificar dónde intervenir."`
|
|
||||||
* Gráfico a la derecha: Cinta de infinito pausada interconectando Estrategia, Procesos, Tecnología, Personas y Resultados.
|
|
||||||
|
|
||||||
2. **Grilla de Señales y Desafíos:**
|
|
||||||
|
|
||||||
* Tarjetas simplificadas sin textos densos. Sustituir el botón de texto por un selector circular `+` o flecha unificada:
|
|
||||||
1. *"La organización creció y necesitamos ordenar los procesos."*
|
|
||||||
2. *"Necesitamos mejorar la eficiencia y los resultados."*
|
|
||||||
3. *"Queremos desarrollar a nuestras personas y fortalecer equipos."*
|
|
||||||
4. *"Buscamos incorporar tecnología o avanzar en la transformación digital."*
|
|
||||||
5. *"Necesitamos fortalecer la calidad, el cumplimiento o la gestión de riesgos."*
|
|
||||||
6. *Tarjeta de escape:* *"No sé exactamente qué necesito."* $\rightarrow$ `INICIAR BRÚJULA IDE →`
|
|
||||||
|
|
||||||
3. **Modales de Diagnóstico:**
|
|
||||||
|
|
||||||
* Eliminar cajas monocromáticas y etiquetas pesadas tipo "Contexto y diagnóstico".
|
|
||||||
* Estructura limpia: Preguntas disparadoras del cliente, capacidades que intervienen (etiquetas de color) y botón directo de contacto.
|
|
||||||
|
|
||||||
4. **Cierre:**
|
|
||||||
|
|
||||||
* `"¿Tu situación es diferente? Conversemos..."` + botón **HABLEMOS →**.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### PANTALLA 3: ECOSISTEMA (`ecosistema.html`)
|
|
||||||
|
|
||||||
1. **Hero del Ecosistema:**
|
|
||||||
|
|
||||||
* **Foco Absoluto:** El infinito vectorial como protagonista sobre fondo neutro (eliminar fotos de paisajes).
|
|
||||||
* **Animación Funcional:** Ciclo de iluminación suave cada 4 segundos mostrando combinaciones reales de capacidades (e.g., *Excellence + Digital* para "sistemas de gestión con tableros en tiempo real").
|
|
||||||
* **Acción:** Al hacer clic en un nodo o tarjeta de capacidad, desplazarse suavemente y abrir el Nivel 2 correspondiente debajo (sin abrir ventanas modales flotantes).
|
|
||||||
|
|
||||||
2. **Arquitectura Nivel 2 (Despliegue en la misma página):**
|
|
||||||
|
|
||||||
* Configurar anclas y URLs directas (e.g., `/ecosistema#excellence`).
|
|
||||||
* **IDE Excellence:**
|
|
||||||
* Título: `"Procesos más eficientes, organizaciones más confiables."`
|
|
||||||
* Copys revisados: Sustituir "certificación" por *"preparación y acompañamiento para certificar"* (norma ética de consultoría).
|
|
||||||
* Chips de normas: `ISO 9001` | `ISO 14001` | `ISO 45001` | `ISO 21001` | `Mejora de procesos` | `RNE / RNPA`.
|
|
||||||
* Tarjetas de soluciones con íconos vectoriales y marcas de agua suaves.
|
|
||||||
* **IDE Projects:**
|
|
||||||
* Título: `"Convertimos iniciativas en resultados concretos."`
|
|
||||||
* Ciclo de vida: `1. Planificación y diseño` $\rightarrow$ `2. Ejecución y coordinación` $\rightarrow$ `3. Control y seguimiento` $\rightarrow$ `4. Cierre y resultados`.
|
|
||||||
* Sectores clave: Incluir en primer término **Telecomunicaciones (Despliegue de redes FTTH y proyectos de conectividad)**, seguido de Industria, Construcción, Organizaciones educativas y Empresas de servicios.
|
|
||||||
* **IDE Digital:**
|
|
||||||
* Título: `"Digitalizamos procesos para generar más valor."`
|
|
||||||
* Servicios: Automatización de procesos, Integración de plataformas, Dashboards de BI, Soluciones a medida, IA aplicada y Capacitación digital.
|
|
||||||
* *Ajuste crítico:* Retirar logotipos no autorizados de terceros (SAP, WTM, TOA) salvo que exista validación documental escrita de alianzas.
|
|
||||||
* **IDE Academy:**
|
|
||||||
* Tarjeta con botón de redirección directa al sitio específico de Academy (`/academy` o página dedicada).
|
|
||||||
|
|
||||||
3. **Preguntas Frecuentes (FAQ):**
|
|
||||||
|
|
||||||
* Acordeón desplegable nativo (`<details><summary>...`) que resuelva objeciones comerciales reales: alcance geográfico, contratación independiente de capacidades y seguimiento post-implementación.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### PANTALLA 4: IDE ACADEMY (`academy.html`)
|
|
||||||
|
|
||||||
1. **Estilo:** Paleta borgoña (`#C21E3A`), estética formativa moderna y académica.
|
|
||||||
2. **Diferenciales ("Aprender con IDE"):** Tarjetas conectadas por una línea guía sutil con íconos vectoriales (*Contexto Real*, *Aprender Haciendo*, *Mirada Integral*, *Intercambio que Enriquece*, *Aplicación que Continúa*).
|
|
||||||
3. **Próximas Experiencias:** Carrusel o grilla de 3 cursos destacados con metadatos clave (modalidad sincrónica/presencial, duración en horas, nivel de complejidad y fecha).
|
|
||||||
4. **Formación In-Company:** Distribución en 3 columnas: (1) Texto conceptual, (2) Bullets de formatos (Cursos, Workshops, Programas, Rutas de aprendizaje) y (3) Fotografía real de capacitación en planta/oficina.
|
|
||||||
5. **Ajuste de contenido:** **Eliminar** la sección *"Quiénes facilitan el aprendizaje"* en Academy para no duplicar los perfiles de los socios que ya se presentan en la página institucional.
|
|
||||||
6. **Campus y Recursos:** Bloque dividido al 50%: botón de acceso a *Campus IDE (LMS)* y botón a *Herramientas descargables (plantillas Excel, Business Model Canvas, etc.)*.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### PANTALLA 5: SOLUCIONES (`soluciones.html`)
|
|
||||||
|
|
||||||
1. **Hero:** Continuidad visual con la cabecera de Desafíos (paso de la detección a la ejecución).
|
|
||||||
2. **Las Seis Familias:** Grilla de 6 tarjetas con diseño minimalista e íconos de trazo fino:
|
|
||||||
* *Procesos y gestión*
|
|
||||||
* *Proyectos e innovación*
|
|
||||||
* *Tecnología e IA*
|
|
||||||
* *Personas y desarrollo*
|
|
||||||
* *Calidad, riesgos y cumplimiento*
|
|
||||||
* *Sostenibilidad y valor*
|
|
||||||
3. **Modales de Solución:** Ventana limpia con resumen ejecutivo, listado estructurado de normas/servicios en bullets y botón directo de contacto.
|
|
||||||
4. **Soluciones Relacionadas:** Módulo inferior que refuerza la sinergia con las cuatro unidades del Ecosistema antes del CTA final.
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
### PANTALLA 6: SOMOS IDE & TRABAJÁ CON NOSOTROS (`nosotros.html`)
|
|
||||||
|
|
||||||
1. **Apertura:** Claim institucional: `"Vemos organizaciones. Entendemos sistemas. Conectamos el todo."` junto a la foto grupal real `team4.jpg`.
|
|
||||||
2. **Filosofía de Trabajo:** Síntesis visual mediante íconos y textos breves de los Principios Guía (*Mirada Sistémica*, *Rigor con sentido práctico*, *Personas como parte del Sistema*, *Capacidades que permanecen*).
|
|
||||||
3. **Equipo Directivo (Perfiles Reales de los 4 Socios):**
|
|
||||||
* Reemplazar maquetas previas por las fotografías reales:
|
|
||||||
* **Claudia Raquel Andrés (`CRA.png`):** Socia Fundadora | Estrategia y Gestión de la Calidad.
|
|
||||||
* **José Alberto Pugliese (`JAP.png`):** Socio | Proyectos y Metodologías Ágiles.
|
|
||||||
* **Miguel Ángel Rojas (`MAR.png`):** Socio | Operaciones, Infraestructura y Mejora Continua.
|
|
||||||
* **Víctor Ulises Barrionuevo (`VUB.png`):** Socio | Telecomunicaciones y Operaciones de Red.
|
|
||||||
* **Tarjeta de Red de Especialistas:** Incluir como quinto elemento la tarjeta: *"Y una red de consultores y especialistas que nos permite llevar la mejor solución a cada desafío"*.
|
|
||||||
* **Enlaces a LinkedIn:** Ícono vectorial en tono oscuro/monocromático con enlace verificado a cada perfil:
|
|
||||||
* Claudia Raquel Andrés: `https://www.linkedin.com/in/claudia-raquel-andres/`
|
|
||||||
* José Alberto Pugliese: `https://www.linkedin.com/in/ing-josé-pugliese-706445413/`
|
|
||||||
* Miguel Ángel Rojas: `https://www.linkedin.com/in/ingenieromiguelrojas/`
|
|
||||||
* Víctor Ulises Barrionuevo: `www.linkedin.com/in/victor-ulises-barrionuevo`
|
|
||||||
4. **Eliminación:** Quitar la sección *"Estándares Globales"*.
|
|
||||||
5. **Trabajá con Nosotros:** Formulario limpio con campos: Nombre y apellido, Email, Teléfono, Ciudad/País, Área de interés, Mensaje, campo para CV/LinkedIn y casilla de consentimiento legal. Acompañar con la frase de cierre: `"El cambio también se construye en equipo."`
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
## 4. CHECKLIST DE CONTROL DE CALIDAD PARA LA IA DE CÓDIGO
|
|
||||||
|
|
||||||
- [ ] ¿El header tiene el buscador predictivo (lupa) de forma fija junto al botón de contacto?
|
|
||||||
- [ ] ¿El botón "HABLEMOS →" mantiene idéntico tamaño, padding, radio de borde y tipografía en todo el sitio?
|
|
||||||
- [ ] ¿Se eliminaron los fondos con movimiento rápido ("efecto pecera") y el grafo de 35 nodos?
|
|
||||||
- [ ] ¿La categoría "Telecomunicaciones" y los proyectos FTTH están integrados en Ámbitos de Experiencia y en IDE Projects?
|
|
||||||
- [ ] ¿Se reemplazaron todas las fotos del equipo por los archivos `CRA.png`, `JAP.png`, `MAR.png`, `VUB.png` y `team4.jpg`?
|
|
||||||
- [ ] ¿Los perfiles de los socios tienen sus enlaces de LinkedIn correctos en formato monocromático?
|
|
||||||
- [ ] ¿En IDE Excellence se corrigió la redacción a "preparación para certificar" en lugar de adjudicarse la certificación?
|
|
||||||
- [ ] ¿Se eliminó la sección duplicada de facilitadores en IDE Academy?
|
|
||||||
- [ ] ¿El footer es exactamente igual y homogéneo en todas las páginas?
|
|
||||||
-295
@@ -1,295 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="es">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Animación Nodos Infinito - Pulsos Aleatorios</title>
|
|
||||||
<style>
|
|
||||||
/* Estilos generales solo para visualizar en este ejemplo */
|
|
||||||
body {
|
|
||||||
background-color: #0f172a;
|
|
||||||
margin: 0;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
min-height: 100vh;
|
|
||||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
.mi-seccion-web {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding: 4rem 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.animacion-infinito {
|
|
||||||
width: 50%;
|
|
||||||
min-width: 300px;
|
|
||||||
max-width: 1000px;
|
|
||||||
aspect-ratio: 2 / 1;
|
|
||||||
position: relative;
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
.capa-svg-lineas {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.capa-html-nodos {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 2;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Estilos de los Nodos */
|
|
||||||
.nodo-circulo {
|
|
||||||
position: absolute;
|
|
||||||
border-radius: 50%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
pointer-events: auto;
|
|
||||||
transition: filter 0.3s ease;
|
|
||||||
overflow: hidden;
|
|
||||||
border: 2px solid rgba(255, 255, 255, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.nodo-circulo:hover {
|
|
||||||
filter: brightness(1.2);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nodo-contenido {
|
|
||||||
color: white;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: clamp(0.6rem, 1.5vw, 1.2rem);
|
|
||||||
text-align: center;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nodo-contenido img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
object-fit: cover;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Estilos de las líneas base SVG */
|
|
||||||
.linea-base {
|
|
||||||
fill: none;
|
|
||||||
stroke-width: 1.5;
|
|
||||||
opacity: 0.35; /* Un poco más tenues para resaltar la luz */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* NUEVO: Estilo Brillante (Leve) para los datos */
|
|
||||||
.linea-pulso {
|
|
||||||
fill: none;
|
|
||||||
stroke: #ffffff;
|
|
||||||
stroke-width: 2.5;
|
|
||||||
stroke-linecap: round;
|
|
||||||
stroke-dasharray: 18 250; /* Pulso de luz corto, separación larga */
|
|
||||||
/* Efecto glow con doble sombra: un núcleo brillante y un halo difuso */
|
|
||||||
filter: drop-shadow(0 0 3px rgba(255, 255, 255, 0.9)) drop-shadow(0 0 8px rgba(135, 206, 250, 0.7));
|
|
||||||
opacity: 0.9;
|
|
||||||
mix-blend-mode: screen; /* Fusión luminosa con el fondo */
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<section class="mi-seccion-web">
|
|
||||||
<div class="animacion-infinito">
|
|
||||||
<svg class="capa-svg-lineas" viewBox="0 0 1000 500" preserveAspectRatio="xMidYMid meet">
|
|
||||||
<defs id="svg-defs"></defs>
|
|
||||||
<g id="grupo-lineas"></g>
|
|
||||||
</svg>
|
|
||||||
<div class="capa-html-nodos" id="grupo-nodos"></div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
const nodosData = [
|
|
||||||
{ id: 'tl', x0: 200, y0: 125, r: 50, color: '#16a085', html: '<span>LOGO A</span>' },
|
|
||||||
{ id: 'bl', x0: 200, y0: 375, r: 50, color: '#2980b9', html: '<span>LOGO B</span>' },
|
|
||||||
{ id: 'tr', x0: 800, y0: 125, r: 50, color: '#c0392b', html: '<span>LOGO C</span>' },
|
|
||||||
{ id: 'br', x0: 800, y0: 375, r: 50, color: '#f39c12', html: '<span>LOGO D</span>' },
|
|
||||||
{ id: 'c', x0: 500, y0: 250, r: 65, color: '#000000', html: '<span>NÚCLEO</span>'}
|
|
||||||
];
|
|
||||||
|
|
||||||
const conexiones = [
|
|
||||||
{ id: 'arcL', from: 'tl', to: 'bl', type: 'vertical', curveOut: -120 },
|
|
||||||
{ id: 'c1', from: 'tl', to: 'c', type: 'horizontal', curveOut: 0 },
|
|
||||||
{ id: 'c2', from: 'bl', to: 'c', type: 'horizontal', curveOut: 0 },
|
|
||||||
{ id: 'arcR', from: 'tr', to: 'br', type: 'vertical', curveOut: 120 },
|
|
||||||
{ id: 'c3', from: 'tr', to: 'c', type: 'horizontal', curveOut: 0 },
|
|
||||||
{ id: 'c4', from: 'br', to: 'c', type: 'horizontal', curveOut: 0 }
|
|
||||||
];
|
|
||||||
|
|
||||||
const contenedorNodos = document.getElementById('grupo-nodos');
|
|
||||||
const grupoLineas = document.getElementById('grupo-lineas');
|
|
||||||
const svgDefs = document.getElementById('svg-defs');
|
|
||||||
const nodosMap = {};
|
|
||||||
|
|
||||||
// 1. Crear Nodos HTML
|
|
||||||
nodosData.forEach(nodo => {
|
|
||||||
nodosMap[nodo.id] = nodo;
|
|
||||||
nodo.floatOffset = Math.random() * 10;
|
|
||||||
|
|
||||||
const el = document.createElement('div');
|
|
||||||
el.className = 'nodo-circulo';
|
|
||||||
el.id = `node-${nodo.id}`;
|
|
||||||
el.style.backgroundColor = nodo.color;
|
|
||||||
el.style.width = `${(nodo.r * 2 / 1000) * 100}%`;
|
|
||||||
el.style.height = `${(nodo.r * 2 / 500) * 100}%`;
|
|
||||||
|
|
||||||
const content = document.createElement('div');
|
|
||||||
content.className = 'nodo-contenido';
|
|
||||||
content.innerHTML = nodo.html;
|
|
||||||
|
|
||||||
el.appendChild(content);
|
|
||||||
contenedorNodos.appendChild(el);
|
|
||||||
nodo.el = el;
|
|
||||||
});
|
|
||||||
|
|
||||||
// 2. Crear Líneas y Gradientes
|
|
||||||
const offsetsLineas = [-12, -6, 0, 6, 12]; // Distancias de las 5 líneas paralelas
|
|
||||||
|
|
||||||
conexiones.forEach(conn => {
|
|
||||||
const n1 = nodosMap[conn.from];
|
|
||||||
const n2 = nodosMap[conn.to];
|
|
||||||
const gradId = `grad-${conn.from}-${conn.to}`;
|
|
||||||
|
|
||||||
// Gradiente
|
|
||||||
const esHorizontal = conn.type === 'horizontal';
|
|
||||||
const grad = document.createElementNS('http://www.w3.org/2000/svg', 'linearGradient');
|
|
||||||
grad.setAttribute('id', gradId);
|
|
||||||
grad.setAttribute('x1', '0%');
|
|
||||||
grad.setAttribute('y1', '0%');
|
|
||||||
grad.setAttribute('x2', esHorizontal ? '100%' : '0%');
|
|
||||||
grad.setAttribute('y2', esHorizontal ? '0%' : '100%');
|
|
||||||
|
|
||||||
const stop1 = document.createElementNS('http://www.w3.org/2000/svg', 'stop');
|
|
||||||
stop1.setAttribute('offset', '0%');
|
|
||||||
stop1.setAttribute('stop-color', n1.color);
|
|
||||||
|
|
||||||
const stop2 = document.createElementNS('http://www.w3.org/2000/svg', 'stop');
|
|
||||||
stop2.setAttribute('offset', '100%');
|
|
||||||
stop2.setAttribute('stop-color', n2.color);
|
|
||||||
|
|
||||||
grad.appendChild(stop1);
|
|
||||||
grad.appendChild(stop2);
|
|
||||||
svgDefs.appendChild(grad);
|
|
||||||
|
|
||||||
// Crear 5 líneas base paralelas
|
|
||||||
conn.pathsBase = [];
|
|
||||||
offsetsLineas.forEach(offset => {
|
|
||||||
const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
|
|
||||||
path.classList.add('linea-base');
|
|
||||||
path.setAttribute('stroke', `url(#${gradId})`);
|
|
||||||
grupoLineas.appendChild(path);
|
|
||||||
conn.pathsBase.push({ el: path, offset: offset });
|
|
||||||
});
|
|
||||||
|
|
||||||
// NUEVO: Crear 3 pulsos de luz dinámicos por conexión
|
|
||||||
conn.pulsos = [];
|
|
||||||
for (let i = 0; i < 3; i++) {
|
|
||||||
const pathPulso = document.createElementNS('http://www.w3.org/2000/svg', 'path');
|
|
||||||
pathPulso.classList.add('linea-pulso');
|
|
||||||
grupoLineas.appendChild(pathPulso);
|
|
||||||
|
|
||||||
conn.pulsos.push({
|
|
||||||
el: pathPulso,
|
|
||||||
currentOffset: offsetsLineas[Math.floor(Math.random() * offsetsLineas.length)], // Elige línea al azar
|
|
||||||
dash: Math.random() * 500, // Desfase inicial
|
|
||||||
speed: 1.0 + Math.random() * 1.5 // Velocidad ligeramente distinta para cada uno
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// Lógica para que los pulsos salten de línea aleatoriamente cada cierto tiempo
|
|
||||||
setInterval(() => {
|
|
||||||
conexiones.forEach(conn => {
|
|
||||||
conn.pulsos.forEach(p => {
|
|
||||||
if (Math.random() > 0.4) { // 60% de probabilidad de saltar de carril
|
|
||||||
p.currentOffset = offsetsLineas[Math.floor(Math.random() * offsetsLineas.length)];
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}, 1200);
|
|
||||||
|
|
||||||
// 3. Lógica de animación
|
|
||||||
function animarFrame() {
|
|
||||||
const tiempo = Date.now() * 0.001;
|
|
||||||
|
|
||||||
// Flotación de nodos
|
|
||||||
nodosData.forEach(nodo => {
|
|
||||||
nodo.x = nodo.x0 + Math.sin(tiempo * 1.2 + nodo.floatOffset) * 12;
|
|
||||||
nodo.y = nodo.y0 + Math.cos(tiempo * 1.5 + nodo.floatOffset) * 12;
|
|
||||||
|
|
||||||
nodo.el.style.left = `${(nodo.x / 1000) * 100}%`;
|
|
||||||
nodo.el.style.top = `${(nodo.y / 500) * 100}%`;
|
|
||||||
});
|
|
||||||
|
|
||||||
// Recalcular trazados y animar datos
|
|
||||||
conexiones.forEach(conn => {
|
|
||||||
const n1 = nodosMap[conn.from];
|
|
||||||
const n2 = nodosMap[conn.to];
|
|
||||||
const isHoriz = conn.type === 'horizontal';
|
|
||||||
|
|
||||||
const calcularRuta = (offsetX, offsetY) => {
|
|
||||||
let cp1x, cp1y, cp2x, cp2y;
|
|
||||||
if (isHoriz) {
|
|
||||||
const distanciaX = n2.x - n1.x;
|
|
||||||
cp1x = n1.x + distanciaX * 0.45;
|
|
||||||
cp1y = n1.y;
|
|
||||||
cp2x = n2.x - distanciaX * 0.45;
|
|
||||||
cp2y = n2.y;
|
|
||||||
} else {
|
|
||||||
cp1x = n1.x + conn.curveOut;
|
|
||||||
cp1y = n1.y;
|
|
||||||
cp2x = n2.x + conn.curveOut;
|
|
||||||
cp2y = n2.y;
|
|
||||||
}
|
|
||||||
return `M ${n1.x + offsetX} ${n1.y + offsetY}
|
|
||||||
C ${cp1x + offsetX} ${cp1y + offsetY},
|
|
||||||
${cp2x + offsetX} ${cp2y + offsetY},
|
|
||||||
${n2.x + offsetX} ${n2.y + offsetY}`;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Líneas base acompañando el movimiento
|
|
||||||
conn.pathsBase.forEach(p => {
|
|
||||||
p.el.setAttribute('d', calcularRuta(isHoriz ? 0 : p.offset, isHoriz ? p.offset : 0));
|
|
||||||
});
|
|
||||||
|
|
||||||
// Pulsos de luz viajando y cambiando de línea
|
|
||||||
conn.pulsos.forEach(p => {
|
|
||||||
p.dash -= p.speed; // Avanza la animación
|
|
||||||
p.el.setAttribute('d', calcularRuta(isHoriz ? 0 : p.currentOffset, isHoriz ? p.currentOffset : 0));
|
|
||||||
p.el.style.strokeDashoffset = p.dash;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
requestAnimationFrame(animarFrame);
|
|
||||||
}
|
|
||||||
|
|
||||||
animarFrame();
|
|
||||||
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@@ -1,18 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
||||||
<!-- Creator: CorelDRAW -->
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="32px" height="32px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
|
||||||
viewBox="0 0 1.2 1.2"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer"/>
|
|
||||||
<g id="_3033983200656">
|
|
||||||
<path fill="#275868" d="M0.58 0.62c0.02,-0.15 -0.05,-0.19 -0.15,-0.29 -0.04,-0.04 -0.06,0 -0.09,0.03 -0.04,0.06 -0.06,0.14 -0.02,0.22 0.03,0.06 0.1,0.12 0.14,0.16 0.04,0.03 0.1,0.11 0.15,0.14 0.08,0.04 0.17,0.02 0.23,-0.02 0.08,-0.07 0.04,-0.08 -0.04,-0.16 -0.1,-0.1 -0.13,-0.08 -0.22,-0.08z"/>
|
|
||||||
<path fill="#275868" d="M0.81 0.39c0.01,-0.11 -0.02,-0.16 -0.08,-0.21 -0.02,-0.02 -0.04,-0.05 -0.07,-0.07 -0.04,-0.04 -0.07,-0.01 -0.09,0.02 -0.05,0.06 -0.06,0.15 -0.02,0.22 0.02,0.06 0.1,0.12 0.14,0.16 0.03,0.04 0.1,0.12 0.15,0.14 0.13,0.07 0.32,-0.04 0.26,-0.11 -0.03,-0.03 -0.11,-0.11 -0.16,-0.13 -0.05,-0.03 -0.08,-0.02 -0.13,-0.02z"/>
|
|
||||||
<path fill="#275868" d="M0.19 0.92c0.02,0.01 0.08,0.07 0.09,0.09 0.03,0.01 0.06,0.09 0.15,0.11 0.09,0.02 0.17,-0.01 0.21,-0.06 0.04,-0.04 0.02,-0.05 -0.01,-0.08 -0.04,-0.04 -0.1,-0.11 -0.15,-0.13 -0.05,-0.02 -0.07,0 -0.12,-0.01 0.02,-0.14 -0.05,-0.18 -0.14,-0.27 -0.02,-0.02 -0.04,-0.05 -0.08,-0.01 -0.08,0.07 -0.09,0.21 -0.01,0.3 0.02,0.01 0.06,0.05 0.06,0.06z"/>
|
|
||||||
<path fill="#275868" fill-opacity="0.501961" d="M1.06 0c-0.22,0.05 -0.17,0.29 -0.17,0.3 0.02,0.02 0.11,0.02 0.15,0.01 0.19,-0.04 0.17,-0.27 0.15,-0.29 -0.01,-0.02 -0.03,-0.02 -0.06,-0.02 -0.03,0 -0.05,0 -0.07,0z"/>
|
|
||||||
<path fill="#275868" fill-opacity="0.501961" d="M0.28 1.01c-0.01,-0.02 -0.07,-0.08 -0.09,-0.09l-0.08 0.09c-0.05,0.06 -0.15,0.12 -0.1,0.17 0.05,0.05 0.1,-0.02 0.14,-0.06l0.09 -0.09c0.03,-0.03 0.02,-0.03 0.04,-0.02z"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.0 KiB |
@@ -1,11 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="20px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.53 0.43">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2940433240064">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.33 0.08c0.03,0 0.06,0 0.08,0 0.01,0 0.02,0 0.03,-0.01 0.02,-0.01 0.02,-0.04 -0.01,-0.04 0,-0.01 -0.09,0 -0.11,0 -0.01,-0.02 -0.05,-0.04 -0.08,-0.02 -0.03,0.01 -0.01,0.02 -0.04,0.02 -0.02,0 -0.04,0 -0.06,0 -0.02,0 -0.04,-0.01 -0.05,0 -0.01,0.02 -0.01,0.04 0,0.05 0.01,0 0.08,0 0.11,0 0.01,0.01 0.01,0.02 0.02,0.03 0.01,0.02 0.01,0.01 0.02,0.02l0 0.24c-0.02,0.01 -0.13,0 -0.15,0.01 -0.02,0.01 -0.01,0.04 0.01,0.05 0.01,0 0.28,0 0.32,0 0.02,0 0.03,0 0.03,-0.02 0.01,-0.01 0,-0.03 -0.01,-0.03 -0.02,-0.01 -0.12,0 -0.15,-0.01l0 -0.24c0.01,0 0.01,-0.01 0.02,-0.01 0.01,-0.01 0.02,-0.02 0.02,-0.04z" />
|
|
||||||
<path fill="currentColor" d="M0.05 0.27c0,-0.01 0.05,-0.1 0.06,-0.1 0,0 0.05,0.09 0.05,0.1l-0.11 0zm-0.05 0.01c0.01,0.03 0.03,0.05 0.06,0.06 0.06,0.02 0.14,-0.01 0.15,-0.06 0,-0.01 -0.01,-0.03 -0.01,-0.04l-0.06 -0.11c-0.01,-0.01 -0.02,-0.02 -0.03,-0.02 -0.02,0 -0.03,0.01 -0.03,0.02 -0.02,0.03 -0.03,0.05 -0.04,0.07 -0.02,0.03 -0.04,0.06 -0.04,0.08z" />
|
|
||||||
<path fill="currentColor" d="M0.37 0.27c0,-0.01 0.02,-0.05 0.03,-0.06 0,0 0.02,-0.04 0.03,-0.04 0,0 0.01,0.02 0.01,0.02 0.01,0.01 0.04,0.07 0.04,0.08l-0.11 0zm-0.05 0.01c0,0.01 0.02,0.03 0.02,0.04 0.05,0.05 0.17,0.04 0.19,-0.03 0.01,-0.02 0,-0.03 -0.01,-0.05l-0.06 -0.1c-0.01,-0.02 -0.01,-0.03 -0.03,-0.03 -0.02,0 -0.02,0.01 -0.03,0.02l-0.06 0.11c-0.01,0.01 -0.02,0.02 -0.02,0.04z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.8 KiB |
@@ -1,13 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="21px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.47 0.41">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2940952191808">
|
|
||||||
<path fill="currentColor" d="M0.27 0.21l0.02 0c0.01,0.02 0,0.12 0,0.15 0,0.02 0,0.03 0.01,0.04 0.01,0.01 0.01,0.01 0.02,0.01l0.08 0c0.03,0 0.07,0.01 0.07,-0.03 0,-0.03 0,-0.07 0,-0.1 -0.01,-0.03 -0.03,-0.04 -0.04,-0.07 -0.02,-0.07 0.01,-0.15 -0.05,-0.15l-0.09 0 -0.02 0c-0.01,0.01 -0.01,0.14 0,0.15z" />
|
|
||||||
<path fill="currentColor" d="M0.21 0.21c0,-0.01 0,-0.06 0,-0.08 0,-0.01 0,-0.02 0,-0.04 0,-0.01 0,-0.02 -0.01,-0.03l-0.02 0 -0.09 0c-0.05,0 -0.02,0.09 -0.05,0.15 -0.01,0.03 -0.03,0.04 -0.03,0.08 -0.01,0.02 -0.01,0.06 -0.01,0.09 0,0.04 0.04,0.03 0.07,0.03 0.03,0 0.09,0.01 0.1,-0.01 0.01,-0.01 0.01,-0.02 0.01,-0.04 0,-0.04 -0.01,-0.13 0,-0.15 0.01,-0.01 0.02,0 0.03,0z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.21 0.21l0.06 0c-0.01,-0.01 -0.01,-0.14 0,-0.15l-0.07 0c0.01,0.01 0.01,0.02 0.01,0.03 0,0.02 0,0.03 0,0.04 0,0.02 0,0.07 0,0.08z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.09 0.06l0.09 0c0,-0.04 0,-0.06 -0.05,-0.06 -0.05,0 -0.04,0.02 -0.04,0.06z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.29 0.06l0.09 0c0,-0.04 0.01,-0.06 -0.04,-0.06 -0.05,0 -0.05,0.02 -0.05,0.06z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.5 KiB |
@@ -1,12 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="21px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.44 0.5">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2977413034848">
|
|
||||||
<path fill="currentColor" d="M0.36 0.39c0,0.01 0,0.03 0,0.04 0,0.02 0,0.02 -0.03,0.02l-0.19 0c-0.02,0 -0.07,0 -0.08,-0.01 -0.02,-0.02 -0.01,-0.05 0.02,-0.05 0.02,0 0.27,0 0.28,0zm-0.31 -0.04l0 -0.26c0,-0.02 0.01,-0.04 0.04,-0.04l0.27 0c0.02,0 0.03,0.01 0.03,0.03l0 0.23c0,0.04 -0.03,0.03 -0.07,0.03l-0.23 0c-0.03,0 -0.03,0.01 -0.04,0.01zm0.35 0.02c0.04,-0.02 0.04,-0.05 0.04,-0.08 0,-0.04 0,-0.08 0,-0.12 0,-0.06 0.01,-0.15 -0.06,-0.17 -0.02,0 -0.2,0 -0.23,0 -0.04,0 -0.08,0 -0.11,0.01 -0.02,0.01 -0.04,0.04 -0.04,0.07 0,0.08 0,0.16 0,0.24 0,0.07 -0.02,0.15 0.06,0.17 0.02,0.01 0.28,0.01 0.34,0.01 0.02,0 0.03,0 0.03,-0.02 0.01,-0.01 0,-0.02 0,-0.02 -0.01,-0.01 -0.01,-0.01 -0.02,-0.01 -0.01,-0.01 -0.01,-0.06 -0.01,-0.08z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.14 0.22c0.01,0 0.11,0 0.13,0 0.02,0 0.05,-0.01 0.06,0 0.02,0.01 0.01,0.04 0,0.04 -0.02,0.01 -0.11,0 -0.14,0 -0.02,0 -0.07,0.01 -0.06,-0.03 0,-0.01 0,-0.01 0.01,-0.01zm0 -0.09c0.02,-0.01 0.11,0 0.13,0 0.02,0 0.05,-0.01 0.06,0 0.02,0.01 0.01,0.04 0,0.04 -0.02,0 -0.11,0 -0.13,0 -0.02,0 -0.05,0 -0.06,0 -0.02,-0.01 -0.02,-0.04 0,-0.04zm-0.09 0.22c0.01,0 0.01,-0.01 0.04,-0.01l0.23 0c0.04,0 0.07,0.01 0.07,-0.03l0 -0.23c0,-0.02 -0.01,-0.03 -0.03,-0.03l-0.27 0c-0.03,0 -0.04,0.02 -0.04,0.04l0 0.26z" />
|
|
||||||
<path fill="currentColor" d="M0.14 0.22c-0.01,0 -0.01,0 -0.01,0.01 -0.01,0.04 0.04,0.03 0.06,0.03 0.03,0 0.12,0.01 0.14,0 0.01,0 0.02,-0.03 0,-0.04 -0.01,-0.01 -0.04,0 -0.06,0 -0.02,0 -0.12,0 -0.13,0z" />
|
|
||||||
<path fill="currentColor" d="M0.14 0.13c-0.02,0 -0.02,0.03 0,0.04 0.01,0 0.04,0 0.06,0 0.02,0 0.11,0 0.13,0 0.01,0 0.02,-0.03 0,-0.04 -0.01,-0.01 -0.04,0 -0.06,0 -0.02,0 -0.11,-0.01 -0.13,0z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.1 KiB |
@@ -1,11 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="19px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.41 0.53">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2940954527360">
|
|
||||||
<path fill="currentColor" d="M0.06 0.38c-0.01,0.01 -0.02,0.02 -0.04,0.04 -0.01,0.02 -0.02,0.04 -0.02,0.07 0,0.04 0.01,0.04 0.04,0.04l0.34 0c0.03,0 0.03,-0.02 0.03,-0.05 -0.02,-0.09 -0.11,-0.15 -0.12,-0.11 -0.01,0.02 -0.03,0.12 -0.04,0.13 0,-0.01 -0.03,-0.11 -0.03,-0.11 0,-0.01 0.03,-0.03 0.03,-0.04 0,-0.03 -0.03,-0.02 -0.05,-0.02 -0.02,0 -0.05,0 -0.04,0.02 0,0.01 0.03,0.03 0.03,0.04 0,0.01 -0.03,0.1 -0.03,0.11 -0.01,-0.01 -0.02,-0.06 -0.02,-0.07 -0.02,-0.07 -0.01,-0.1 -0.08,-0.05z" />
|
|
||||||
<path fill="currentColor" d="M0.28 0.16c0.01,0.05 -0.03,0.09 -0.08,0.09 -0.04,0 -0.08,-0.04 -0.07,-0.09l0.15 0zm-0.2 -0.05c-0.01,0 -0.04,-0.01 -0.05,0.02 0,0.03 0.04,0.03 0.05,0.03 0,0.02 0,0.03 0.01,0.06 0.03,0.08 0.14,0.11 0.21,0.04 0.04,-0.05 0.03,-0.08 0.03,-0.1 0.01,0 0.03,0 0.03,-0.01 0.02,-0.01 0.02,-0.03 0,-0.04 -0.01,0 -0.03,0 -0.04,0 0,-0.01 0,-0.04 -0.01,-0.05 -0.03,-0.1 -0.08,-0.04 -0.11,-0.04 -0.02,-0.01 -0.07,-0.06 -0.1,0.04 -0.01,0.01 -0.01,0.04 -0.02,0.05z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.28 0.16l-0.15 0c-0.01,0.05 0.03,0.09 0.07,0.09 0.05,0 0.09,-0.04 0.08,-0.09z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.5 KiB |
@@ -1,16 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="21px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.42 0.48">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976811641856">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.34 0.23c0,0 0,-0.02 0,-0.03 0.02,0 0.04,0 0.04,-0.02 0,-0.02 -0.02,-0.02 -0.04,-0.02 0,-0.02 0,-0.04 0,-0.05l0 0.12z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.09 0.24c-0.01,-0.02 -0.01,-0.11 0,-0.13 -0.01,0.01 -0.01,0.03 -0.01,0.05 -0.02,0 -0.04,0 -0.04,0.02 0,0.02 0.02,0.02 0.04,0.02 0,0.02 0,0.03 0.01,0.04z" />
|
|
||||||
<path fill="currentColor" d="M0.26 0.12c0.04,-0.01 0.06,0.05 0.02,0.06 -0.02,0 -0.03,-0.01 -0.04,-0.02 0,-0.02 0.01,-0.03 0.02,-0.04zm-0.12 0c0.04,-0.01 0.06,0.05 0.02,0.06 -0.02,0 -0.03,-0.01 -0.04,-0.02 0,-0.02 0.01,-0.03 0.02,-0.04zm-0.06 -0.01c0,0.02 0,0.11 0,0.13 0.01,0.06 0.08,0.05 0.13,0.05 0.02,0 0.08,0 0.09,-0.01 0.02,0 0.04,-0.02 0.05,-0.05l0 -0.12c-0.01,-0.02 -0.02,-0.04 -0.04,-0.05 -0.02,0 -0.05,0 -0.08,0l-0.04 0c-0.05,0 -0.1,0 -0.11,0.05z" />
|
|
||||||
<path fill="currentColor" d="M0.1 0.48c0,-0.03 -0.01,-0.06 0.02,-0.06 0.03,0 0.03,0.04 0.03,0.06l0.04 0c0,-0.03 -0.01,-0.06 0.02,-0.06 0.03,0 0.03,0.03 0.03,0.06l0.04 0c0,-0.03 -0.01,-0.06 0.02,-0.06 0.03,0 0.03,0.03 0.03,0.06 0.03,0 0.08,0.01 0.09,-0.02 0.01,-0.03 0,-0.08 -0.02,-0.1 -0.03,-0.04 -0.12,-0.03 -0.19,-0.03 -0.08,0 -0.15,-0.01 -0.19,0.04 -0.02,0.02 -0.03,0.07 -0.02,0.09 0.01,0.03 0.07,0.02 0.1,0.02z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.19 0.48l0.05 0c0,-0.03 0,-0.06 -0.03,-0.06 -0.03,0 -0.02,0.03 -0.02,0.06z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.28 0.48l0.05 0c0,-0.03 0,-0.06 -0.03,-0.06 -0.03,0 -0.02,0.03 -0.02,0.06z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.1 0.48l0.05 0c0,-0.02 0,-0.06 -0.03,-0.06 -0.03,0 -0.02,0.03 -0.02,0.06z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.19 0.06l0.04 0c0,-0.02 0.01,-0.06 -0.02,-0.06 -0.03,0 -0.02,0.03 -0.02,0.06z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.2 KiB |
@@ -1,12 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="20px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.51 0.41">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2940947042400">
|
|
||||||
<path fill="currentColor" d="M0.34 0.34c-0.03,0 -0.03,-0.04 0,-0.04l0.02 0c0.03,0 0.03,0.04 0,0.04l-0.02 0zm-0.09 0c-0.04,0 -0.04,-0.04 0,-0.04l0.01 0c0.04,0 0.04,0.04 0,0.04l-0.01 0zm-0.1 0c-0.03,0 -0.03,-0.04 0,-0.04l0.02 0c0.03,0 0.03,0.04 0,0.04l-0.02 0zm0.17 -0.17c0.05,-0.02 0.07,0.05 0.02,0.07 -0.04,0.02 -0.07,-0.06 -0.02,-0.07zm-0.15 0c0.05,-0.02 0.07,0.05 0.02,0.07 -0.05,0.02 -0.07,-0.06 -0.02,-0.07zm0.11 -0.09l-0.05 0c-0.06,-0.01 -0.11,-0.01 -0.14,0.03 -0.02,0.03 -0.01,0.1 -0.01,0.14 0,0.06 -0.01,0.11 0.03,0.14 0.03,0.03 0.1,0.02 0.14,0.02 0.05,0 0.12,0.01 0.15,-0.02 0.04,-0.03 0.03,-0.08 0.03,-0.14 0,-0.04 0.01,-0.11 -0.01,-0.15 -0.03,-0.03 -0.08,-0.02 -0.14,-0.02z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0 0.29c0,0.02 0.04,0.02 0.05,0 0,-0.01 0,-0.08 0,-0.09 0,-0.03 -0.04,-0.03 -0.05,0 0,0 0,0.08 0,0.09z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.46 0.29c0,0.02 0.04,0.02 0.05,0 0,-0.01 0,-0.08 0,-0.09 -0.01,-0.03 -0.04,-0.03 -0.05,0 0,0 0,0.08 0,0.09z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.23 0.08l0.05 0c0,-0.03 0.01,-0.08 -0.03,-0.08 -0.03,0 -0.02,0.05 -0.02,0.08z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.6 KiB |
@@ -1,10 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.99 0.99">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976458852848">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.67 0.26c0.03,-0.01 0.07,0 0.07,0.04 0,0.02 -0.09,0.23 -0.1,0.26 -0.03,0.07 -0.03,0.06 -0.14,0.1 -0.09,0.04 -0.25,0.13 -0.25,0.03 0,-0.02 0.09,-0.23 0.1,-0.26 0.03,-0.08 0.06,-0.07 0.14,-0.1 0.06,-0.03 0.12,-0.05 0.18,-0.07zm0.31 0.32c0.05,-0.3 -0.17,-0.54 -0.41,-0.57 -0.29,-0.05 -0.52,0.16 -0.56,0.4 -0.06,0.3 0.16,0.53 0.41,0.57 0.29,0.05 0.52,-0.16 0.56,-0.4z" />
|
|
||||||
<path fill="currentColor" d="M0.48 0.44c0.08,-0.03 0.1,0.09 0.03,0.11 -0.04,0.02 -0.07,-0.01 -0.07,-0.04 -0.02,-0.04 0.01,-0.06 0.04,-0.07zm0.19 -0.18c-0.06,0.02 -0.12,0.04 -0.18,0.07 -0.08,0.03 -0.11,0.02 -0.14,0.1 -0.01,0.03 -0.1,0.24 -0.1,0.26 0,0.1 0.16,0.01 0.25,-0.03 0.11,-0.04 0.11,-0.03 0.14,-0.1 0.01,-0.03 0.1,-0.24 0.1,-0.26 0,-0.04 -0.04,-0.05 -0.07,-0.04z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1,10 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="23px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.59 0.63">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976885525776">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.43 0.47c0.01,-0.01 0.03,-0.01 0.04,-0.01 0.02,0 0.03,0 0.03,0.02 0.01,0.02 0.01,0.06 -0.01,0.06 0,0.01 -0.06,0.01 -0.07,-0.01 0,0 -0.01,-0.05 0.01,-0.06zm-0.18 0.02c0,-0.02 0.01,-0.03 0.03,-0.03 0.04,0 0.06,0 0.06,0.03 0,0.03 0,0.06 -0.03,0.06 -0.06,0 -0.06,0 -0.06,-0.06zm-0.15 -0.02c0.01,-0.01 0.03,-0.01 0.04,-0.01 0.01,0 0.02,0 0.03,0.02 0,0.02 0,0.06 -0.01,0.06 -0.01,0.01 -0.06,0.01 -0.07,-0.01 0,0 -0.01,-0.05 0.01,-0.06zm0.32 -0.14c0,-0.03 0.01,-0.04 0.03,-0.04 0.04,0 0.05,0 0.05,0.04 0,0.03 0.01,0.05 -0.02,0.05 -0.06,0 -0.06,0 -0.06,-0.05zm-0.15 -0.03c0.01,-0.01 0.02,-0.01 0.04,-0.01 0.01,0 0.02,0.01 0.02,0.02 0.01,0.01 0.01,0.06 0,0.07 -0.01,0 -0.07,0.01 -0.07,-0.01 -0.01,-0.01 -0.01,-0.03 -0.01,-0.04 0,-0.02 0,-0.03 0.02,-0.03zm-0.19 0.03c0,-0.03 0.01,-0.04 0.03,-0.04 0.04,0 0.06,0 0.06,0.04 0,0.03 0,0.05 -0.03,0.05 -0.05,0 -0.06,0 -0.06,-0.05zm-0.08 -0.12c0,0.04 0,0.31 0,0.36 0,0.03 0.02,0.05 0.04,0.05 0.02,0.01 0.05,0.01 0.08,0.01l0.36 0c0.02,0 0.06,0 0.08,-0.01 0.02,-0.01 0.03,-0.03 0.03,-0.05 0,-0.12 0,-0.24 0,-0.36 -0.01,0 -0.26,0 -0.29,0 -0.08,0 -0.24,0 -0.3,0z" />
|
|
||||||
<path fill="currentColor" d="M0 0.21c0.06,0 0.22,0 0.3,0 0.03,0 0.28,0 0.29,0 0,-0.04 0,-0.09 -0.02,-0.11 -0.02,-0.02 -0.07,-0.01 -0.1,-0.02 -0.01,-0.01 0.01,-0.08 -0.05,-0.08 -0.05,0 -0.04,0.06 -0.04,0.08l-0.17 0c0,-0.02 0.01,-0.08 -0.04,-0.08 -0.06,0 -0.04,0.06 -0.04,0.08 -0.07,0.01 -0.14,-0.03 -0.13,0.13z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.9 KiB |
@@ -1,12 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="18px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.5 0.38">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976967527888">
|
|
||||||
<path fill="currentColor" d="M0.35 0.31c0,-0.04 0.06,-0.04 0.06,0 0,0.04 -0.06,0.04 -0.06,0zm-0.19 -0.03c0.02,-0.01 0.04,0.01 0.04,0.02 0,0.02 -0.01,0.03 -0.02,0.04 -0.04,0.01 -0.06,-0.05 -0.02,-0.06zm0.3 -0.07l0 0.06c0,0.01 0,0.02 -0.01,0.02 0,-0.01 -0.01,-0.02 -0.01,-0.02 -0.03,-0.03 -0.05,-0.03 -0.06,-0.03 -0.01,-0.01 -0.01,-0.02 0,-0.03l0.08 0zm-0.08 -0.1c0.01,0 0.02,0 0.03,0 0.02,0 0.02,0.01 0.02,0.01 0.03,0.03 0.03,0.03 0.03,0.06l-0.08 0 0 -0.07zm-0.33 -0.05c0.01,0 0.03,0.01 0.04,0 0,-0.01 0,-0.02 0.01,-0.02l0.17 0c0.08,0 0.07,-0.01 0.07,0.07l0 0.13c0,0.02 -0.01,0.02 -0.01,0.03 -0.01,0.01 -0.01,0.02 -0.02,0.02l-0.07 0c0,0 0,0 -0.01,0 0,-0.01 0,-0.02 -0.02,-0.04 -0.01,0 -0.02,-0.01 -0.04,-0.01 -0.05,0 -0.06,0.04 -0.07,0.05 -0.02,0 -0.01,-0.02 -0.01,-0.03 0,-0.01 0,-0.04 0,-0.05 0.01,0 0.02,0.01 0.03,0 0.01,-0.01 0.01,-0.02 0,-0.03 -0.01,-0.01 -0.05,0 -0.07,0 -0.02,-0.01 -0.05,-0.01 -0.05,0.01 0,0.03 0.03,0.02 0.05,0.02 0,0.02 0,0.06 0,0.08 0.01,0.01 0.01,0.02 0.02,0.03 0.01,0.01 0.02,0 0.03,0.01 0.02,0.03 0.03,0.05 0.07,0.05 0.04,0 0.06,-0.03 0.07,-0.05l0.07 0c0.01,0 0.01,0.01 0.01,0.02 0.03,0.03 0.08,0.03 0.11,0.01 0.01,-0.01 0.01,-0.02 0.02,-0.03 0.03,-0.01 0.05,-0.02 0.05,-0.06 0,-0.03 0,-0.07 0,-0.11 0,-0.01 0,-0.03 -0.01,-0.04 -0.01,-0.01 -0.02,-0.01 -0.03,-0.02 -0.04,-0.04 -0.05,-0.02 -0.08,-0.02 -0.01,-0.02 0,-0.07 -0.05,-0.08 -0.01,0 -0.22,0 -0.23,0 -0.02,0 -0.03,0.01 -0.04,0.02 -0.01,0.01 -0.01,0.02 -0.01,0.04z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.05 0.06l0 0.04c-0.01,0 -0.03,0 -0.04,0 0.03,0 0.1,0 0.13,0 0.01,0 0.02,0 0.03,0.01 0.01,0.01 0.01,0.02 0,0.03 -0.01,0 -0.11,0 -0.12,0l0 0.04c0.02,0 0.06,-0.01 0.07,0 0.01,0.01 0.01,0.02 0,0.03 -0.01,0.01 -0.02,0 -0.03,0 0,0.01 0,0.04 0,0.05 0,0.01 -0.01,0.03 0.01,0.03 0.01,-0.01 0.02,-0.05 0.07,-0.05 0.02,0 0.03,0.01 0.04,0.01 0.02,0.02 0.02,0.03 0.02,0.04 0.01,0 0.01,0 0.01,0l0.07 0c0.01,0 0.01,-0.01 0.02,-0.02 0,-0.01 0.01,-0.01 0.01,-0.03l0 -0.13c0,-0.08 0.01,-0.07 -0.07,-0.07l-0.17 0c-0.01,0 -0.01,0.01 -0.01,0.02 -0.01,0.01 -0.03,0 -0.04,0z" />
|
|
||||||
<path fill="currentColor" d="M0.05 0.14c0.01,0 0.11,0 0.12,0 0.01,-0.01 0.01,-0.02 0,-0.03 -0.01,-0.01 -0.02,-0.01 -0.03,-0.01 -0.03,0 -0.1,0 -0.13,0 -0.01,0 -0.01,0.02 0,0.03 0,0.01 0.03,0.01 0.04,0.01z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.38 0.21c-0.01,0.01 -0.01,0.02 0,0.03 0.01,0 0.03,0 0.06,0.03 0,0 0.01,0.01 0.01,0.02 0.01,0 0.01,-0.01 0.01,-0.02l0 -0.06 -0.08 0z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.8 KiB |
@@ -1,12 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.68 0.68">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976967631392">
|
|
||||||
<path fill="currentColor" d="M0.57 0.19c-0.01,0.03 -0.04,0.05 -0.08,0.04 -0.03,-0.01 -0.05,-0.04 -0.04,-0.08 0.02,-0.08 0.14,-0.04 0.12,0.04zm-0.28 -0.02c-0.01,0.01 -0.02,0.03 -0.02,0.05 -0.01,0.01 -0.02,0.03 -0.03,0.05 0,0.02 -0.01,0.03 -0.01,0.05 -0.01,0.02 -0.02,0.05 -0.01,0.06 0.04,0.01 0.07,0.04 0.08,0.09 0.02,0 0.09,-0.03 0.11,-0.03 0.04,-0.02 0.07,-0.03 0.1,-0.05 0.09,-0.06 0.16,-0.14 0.17,-0.25 0,-0.04 0,-0.1 -0.02,-0.12 -0.02,-0.02 -0.09,-0.02 -0.12,-0.02 -0.08,0.01 -0.14,0.04 -0.19,0.09 -0.02,0.02 -0.04,0.05 -0.06,0.08z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.3 0.47c0,0.03 -0.01,0.13 0,0.16 0.01,0.01 0.03,0.03 0.06,0.01 0.01,0 0.02,-0.01 0.02,-0.01 0.04,-0.02 0.11,-0.06 0.12,-0.08 0.02,-0.03 0.01,-0.13 0.01,-0.16 -0.03,0.02 -0.06,0.03 -0.1,0.05 -0.02,0 -0.09,0.03 -0.11,0.03z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.16 0.57c-0.01,0.02 -0.03,0.03 -0.06,0.03 -0.03,0.01 -0.03,-0.02 -0.02,-0.05 0.02,-0.06 0.1,-0.02 0.08,0.02zm0.07 0.01c0.02,-0.07 -0.04,-0.13 -0.1,-0.13 -0.13,-0.01 -0.14,0.19 -0.13,0.21 0.02,0.03 0.07,0.02 0.1,0.02 0.07,-0.02 0.12,-0.04 0.13,-0.1z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.22 0.38c-0.01,-0.01 0,-0.04 0.01,-0.06 0,-0.02 0.01,-0.03 0.01,-0.05 0.01,-0.02 0.02,-0.04 0.03,-0.05 0,-0.02 0.01,-0.04 0.02,-0.05 -0.04,0.01 -0.12,-0.01 -0.16,0.01 -0.02,0.01 -0.04,0.06 -0.07,0.09 -0.01,0.04 -0.04,0.06 -0.02,0.09 0,0.01 0.01,0.01 0.02,0.02 0.01,0.01 0.13,0 0.16,0z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.9 KiB |
@@ -1,18 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
||||||
<!-- Creator: CorelDRAW -->
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="31px" height="32px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
|
||||||
viewBox="0 0 46.41 48.45"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
|
||||||
<defs>
|
|
||||||
<linearGradient id="id0" gradientUnits="userSpaceOnUse" x1="51.18" y1="44.8" x2="2.75" y2="-12.47">
|
|
||||||
<stop offset="0" stop-opacity="1" stop-color="#0E4251"/>
|
|
||||||
<stop offset="1" stop-opacity="1" stop-color="#2BAC90"/>
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer"/>
|
|
||||||
<path fill="url(#id0)" d="M23.07 26.54c1.46,4.22 -2.77,6.21 -5.1,3.6 -2.48,-2.78 0.87,-6.18 4.05,-4.57 -0.65,0.77 -2.16,1.93 -2.11,3.15 1.57,0.08 1.57,-1.34 3.16,-2.18zm0.95 -2.42c-0.23,-1.39 0.34,-2.13 1.01,-2.88 0.8,-0.91 1.15,-1.49 1.9,-2.29l6.64 -5.95c0.74,-0.6 1.27,-1.32 2,-2.2 1.29,-1.57 2.51,-3.21 4.07,-4.15 -0.78,1.78 -4.06,5.06 -5.46,6.96 -1.6,2.17 -7.24,11.14 -10.16,10.51zm10.65 -14.33c-0.48,-5.29 3.54,-9.54 5.21,-8.38 0.95,0.66 0.6,2.63 1.11,3.58 1.33,0.72 2.49,-0.02 4.13,1.01 0.31,1.77 -1.15,3.17 -2.65,4.28 -1.44,1.07 -3.05,1.61 -5.28,1.77 0.2,-0.35 6.9,-8.08 2.61,-6.94 -1.45,0.38 -4.04,4.04 -5.13,4.68zm-8.3 7.98c-0.37,0.86 -0.59,0.92 -1.3,1.56 -2.35,2.12 -2.1,3.35 -2.22,5.34 -5.55,-2.7 -8.83,3.31 -5.3,6.64 1.57,1.48 4.21,1.37 5.71,0 1.96,-1.8 1.25,-3.55 0.59,-5.8 0.71,-0.2 1.03,-0.08 1.81,-0.4 0.84,-0.35 0.67,-0.49 1.57,-0.79l3.43 -3.88c0.94,-1.17 4.68,-6.9 5.32,-7.21 1.77,-0.13 3.6,-0.09 5.16,-0.8 2.13,-0.96 6.02,-3.72 5.15,-6.52 -0.53,-1.71 -2.46,-1.73 -4.41,-1.79 -0.06,-1.91 -0.51,-3.9 -2.44,-4.1 -2.99,-0.33 -5.63,4.52 -5.94,7.04 -0.36,2.97 1.15,3.57 -0.98,5.2 -4.68,-2.23 -8.23,-3.66 -13.75,-2.15 -3.74,1.02 -7.96,3.61 -10.17,6.69 1.52,-2.64 3.52,-4.68 6.32,-6.11 4.41,-2.25 5.79,-1.64 10.99,-1.44 -0.14,-0.11 -0.23,-0.2 -0.47,-0.34 -4.48,-2.74 -13.64,0.78 -17.43,3.26 -1.61,1.04 -2.8,2.54 -3.84,4.07 -2.29,3.35 -3.03,7.94 -2.07,12.49 1.31,6.16 4.57,7.91 5.72,10.14 -1.74,-1.13 -4.27,-3.98 -5.34,-6.34 -2.2,-4.87 -0.72,-8.72 -1.37,-10.06 -0.84,2.69 -1.49,3.38 -0.85,6.84 1.19,6.54 3.28,11.93 8.8,15.39 5.69,3.56 13.25,2.47 18.71,-1.25 1.69,-1.15 2.93,-2.58 4.3,-3.85 -1.42,2.47 -3.84,4.59 -6.48,6.1 -3.48,1.99 -6.53,1.85 -10.81,1.41l1.26 0.77c4.67,1.83 12.68,-1.1 16.47,-3.64 1.15,-0.77 3.09,-2.62 3.85,-3.83 3.3,-5.27 3.52,-12.14 0.16,-17.9 -0.56,-0.96 -0.92,-1.52 -1.57,-2.38 -0.3,-0.4 -0.83,-1.28 -1.41,-1.52 -0.5,-0.2 -0.88,-0.07 -0.53,0.72 0.35,0.8 1.17,1.49 1.7,2.27 0.68,1 1.29,2.01 1.88,3.29 1.16,2.55 1.69,5.76 1.16,8.85 -0.86,5.05 -4.26,9.88 -9.42,11.48 1.36,-1.32 2.85,-3.01 4.26,-4.11 1.88,-1.46 3.26,-2.24 4.03,-4.68l-0.93 0.89c-0.61,0.75 -1.35,1.55 -2.29,1.92 2.59,-3.63 5.21,-13.24 1.34,-16.66 0.99,6.25 1.52,11.01 -3.11,15.84 -0.73,0.76 -1.23,1.49 -2.01,2.18 -1.37,1.2 -2.77,2.48 -4.87,3.51 -9.11,4.46 -19.57,-0.51 -21.68,-8.37l4.55 4.72c1.39,1.7 2.19,4.02 4.98,4.15 -0.94,-0.44 -2.94,-2.42 -3.41,-3.36 3.67,1.4 10.53,5.38 15.68,2.28 0.61,-0.37 1.29,-0.99 1.59,-1.13 -6.26,1.77 -12.69,1.4 -17.04,-3.49 -0.38,-0.42 -0.73,-0.64 -1.12,-1.1 -6.26,-7.39 -8.28,-16.07 -0.73,-23.85 1.15,-1.18 3.47,-3 5.27,-3.14 -0.53,0.28 -2.03,1.62 -2.44,2.01 -0.86,0.83 -1.19,1.54 -2.26,2.42 -2.06,1.7 -3.28,1.96 -4.19,5.02 0.46,-0.6 2.47,-2.54 3.11,-2.93 -2.17,4.76 -5.02,11.76 -1.08,16.51 -2.32,-9.83 0.94,-14.25 5.9,-18.8 4.95,-4.55 12.99,-6.1 19.75,-2.01 -2.15,2.46 -2.19,1.13 -5.02,0.1 -2.51,-0.92 -5.38,-1.54 -8.17,-1.19 -0.9,0.11 -1.88,0.34 -2.64,0.83 -0.74,0.48 -0.35,0.17 -0.68,0.65l0.72 0.14c0.19,-0.02 0.63,-0.15 0.75,-0.19 1.93,-0.55 3.97,-0.59 5.98,-0.3 2.76,0.4 4.17,1.39 6.27,2.3 -0.46,0.83 -1.49,2.14 -2.47,2.39zm-12.74 17.79c4.85,1.67 4.4,1.02 9.19,0.61 -0.94,0.72 -3.05,1.43 -4.65,1.29 -0.9,-0.08 -1.75,-0.35 -2.47,-0.63 -0.36,-0.14 -0.69,-0.25 -1.04,-0.43 -0.43,-0.21 -0.14,-0.02 -0.47,-0.27l-0.56 -0.57zm-3.76 -2.87c2.99,5.96 10.94,7.78 15.75,2.69 1.3,-1.38 1.94,-3.01 2.8,-5.08 0.23,2.61 -1.03,4.81 -2.23,6.14 -3.92,4.34 -11.66,3.66 -14.9,-0.87 -0.44,-0.62 -1.23,-2.06 -1.42,-2.88zm5.93 2.55c-3.59,-0.81 -6.54,-4.46 -6.38,-9 0.17,-4.39 3.07,-7.38 6.2,-8.53 -0.23,0.15 -1.6,1.39 -1.74,1.55 -3.66,4.11 -3.28,10.61 0.19,14.28 0.34,0.36 0.5,0.5 0.86,0.85 0.17,0.16 0.29,0.28 0.41,0.4 0.09,0.08 0.26,0.36 0.3,0.29 0.03,-0.04 0.11,0.1 0.16,0.16zm11.51 -10.83c-0.55,1.12 0.11,1.33 0.28,2.84 0.28,2.64 -0.8,5.41 -2.93,6.92 -3.08,2.2 -7.7,1.06 -9.67,-1.06 -3.16,-3.4 -2.72,-10.5 3.64,-12.05 3.45,-0.84 3.85,0.98 4.94,-0.44 -1.08,-1.21 -3.73,-0.77 -5.34,-0.6 2.12,-1.52 5.67,-0.51 6.61,-1.17 -0.21,-0.63 0.46,-0.3 -0.76,-0.72l-3.44 -0.05c-4.57,0.81 -6.76,3.86 -8.27,7.62 -0.3,-1.7 0.93,-3.87 1.8,-5.18l1.46 -1.48c6.14,-4.05 8.44,-0.68 10.62,-1.34 -0.02,-0.62 0.42,-0.63 -1.69,-1.26 -5.48,-1.65 -11.24,-0.31 -14.36,4.08 -3.56,5.02 -2.38,13.72 1.5,17.1 4.3,3.75 12.04,4.2 16.78,0.38 3.9,-3.14 5.28,-9.6 3.41,-14.81 -0.05,-0.16 -0.36,-0.95 -0.43,-1.05 -0.7,-1.05 0.13,-0.5 -0.92,-0.59 -0.55,0.93 0.19,1.51 0.46,2.66 -0.73,-0.93 -0.88,-1.89 -1.58,-1.55 -1.44,0.69 3.21,3.58 1.64,9.29 -0.84,3.04 -3.07,5.77 -5.64,6.58 4.67,-3.6 4.93,-10.17 2.78,-13.37 -0.71,-1.05 0.03,-0.34 -0.89,-0.75zm7.83 -8.82c-0.13,0.69 0.9,1.65 1.39,2.46 0.54,0.88 0.99,2.06 1.29,2.94 -0.84,-0.53 -1.21,-1.46 -1.69,-2.04l-1.55 -1.44c-0.85,-0.47 -0.25,-0.26 -0.55,-0.11 -1.47,1.13 1.85,1.48 4.24,6.55 1.88,4 1.13,5.53 1.03,9.84 2.11,-3.9 1.13,-8.45 -0.34,-12.7 -0.32,-0.92 -2.22,-6.42 -3.82,-5.5zm-4.19 -2c-0.32,-0.77 -0.25,-0.79 -1.1,-1.21 -0.55,-0.27 -0.89,-0.37 -1.55,-0.46 0.41,0.53 0.56,0.54 1.1,1.17 0.66,0.78 0.37,0.75 1.55,0.5z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 5.7 KiB |
@@ -1,11 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.57 0.57">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2940947098032">
|
|
||||||
<path fill="currentColor" d="M0.25 0.08c0.06,-0.02 0.12,0 0.17,0.04 0.03,0.02 0.07,0.07 0.08,0.13 0.02,0.13 -0.07,0.23 -0.18,0.25 -0.13,0.02 -0.22,-0.07 -0.24,-0.17 -0.02,-0.07 0.01,-0.13 0.04,-0.17 0.03,-0.05 0.07,-0.07 0.13,-0.08zm0.01 -0.08c-0.06,0.01 -0.12,0.03 -0.16,0.07l-0.03 0.03c-0.04,0.04 -0.08,0.14 -0.07,0.22 0.02,0.16 0.16,0.27 0.32,0.25 0.09,-0.01 0.18,-0.07 0.22,-0.14 0,-0.01 0.01,-0.03 0.02,-0.05 0.07,-0.21 -0.11,-0.41 -0.3,-0.38z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.28 0.2c0.05,-0.01 0.09,0.04 0.1,0.08 0,0.05 -0.04,0.09 -0.09,0.1 -0.05,0 -0.09,-0.04 -0.09,-0.09 0,-0.05 0.03,-0.09 0.08,-0.09zm0 -0.07c-0.05,0 -0.09,0.02 -0.11,0.05 -0.02,0.01 -0.03,0.03 -0.03,0.05 -0.01,0.02 -0.02,0.05 -0.01,0.07 0,0.02 0,0.04 0.01,0.06 0.05,0.1 0.18,0.13 0.27,0.04 0.02,-0.03 0.04,-0.08 0.04,-0.12 -0.01,-0.1 -0.09,-0.16 -0.17,-0.15z" />
|
|
||||||
<path fill="currentColor" d="M0.27 0.25c-0.04,0.02 -0.02,0.09 0.03,0.07 0.04,-0.02 0.02,-0.08 -0.03,-0.07z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.4 KiB |
@@ -1,19 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.81 0.82">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2940953415216">
|
|
||||||
<path fill="currentColor" d="M0.41 0.08c0.01,0 0.21,0 0.25,0 0.05,0 0.08,-0.01 0.08,0.05l0 0.5c0,0.04 0.01,0.1 -0.03,0.11 -0.01,0 -0.22,0 -0.25,0 -0.06,0 -0.08,0.01 -0.08,-0.05l0 -0.51c0,-0.05 -0.01,-0.09 0.03,-0.1zm-0.1 0.66c-0.05,0 -0.14,0 -0.19,0 -0.04,0 -0.04,-0.01 -0.04,-0.05l0 -0.28c0,-0.2 -0.02,-0.18 0.09,-0.18 0.16,0 0.14,-0.01 0.14,0.05 0,0.07 0,0.43 0,0.46zm-0.01 -0.59c-0.01,0.01 -0.16,0 -0.2,0 -0.05,0.01 -0.1,0.05 -0.1,0.1 0,0.14 0,0.27 0,0.41 0,0.03 0,0.07 0.01,0.09 0.03,0.09 0.13,0.06 0.24,0.06 0.13,0 0.27,0 0.4,0 0.08,0 0.12,0.01 0.15,-0.05 0.02,-0.04 0.01,-0.15 0.01,-0.19 0,-0.14 0,-0.28 0,-0.41 0,-0.08 0,-0.12 -0.06,-0.15 -0.03,-0.01 -0.14,-0.01 -0.19,-0.01 -0.1,0 -0.21,-0.02 -0.24,0.06 -0.02,0.03 -0.01,0.06 -0.02,0.09z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.58 0.54c0,-0.01 0,-0.04 0,-0.05 0,-0.02 0.01,-0.03 0.02,-0.03 0.02,0 0.08,-0.01 0.08,0.02 0.01,0.01 0.01,0.04 0.01,0.05 -0.01,0.04 -0.03,0.03 -0.08,0.03 -0.01,0 -0.02,-0.01 -0.03,-0.02zm-0.15 0c0,-0.01 0,-0.04 0,-0.05 0,-0.04 0.02,-0.03 0.07,-0.03 0.02,0 0.03,0 0.03,0.02 0.01,0.01 0.01,0.07 -0.02,0.08 0,0 -0.07,0.01 -0.08,-0.02zm0.15 -0.15c0,-0.01 0,-0.04 0,-0.05 0,-0.04 0.03,-0.03 0.07,-0.03 0.02,0 0.03,0 0.04,0.02 0.01,0.09 -0.03,0.08 -0.08,0.08 -0.01,0 -0.02,-0.01 -0.03,-0.02zm-0.15 0c0,-0.01 0,-0.04 0,-0.05 0,-0.02 0.01,-0.03 0.02,-0.03 0.01,0 0.04,0 0.05,0 0.02,0 0.03,0 0.03,0.02 0.01,0.02 0.01,0.07 -0.02,0.08 -0.01,0 -0.03,0 -0.05,0 -0.01,0 -0.03,0 -0.03,-0.02zm0.17 -0.23c0.02,-0.01 0.04,-0.01 0.05,-0.01 0.04,0.01 0.04,0.03 0.04,0.07 0,0.04 -0.03,0.04 -0.07,0.04 -0.04,0 -0.04,-0.02 -0.04,-0.07 0,-0.02 0.01,-0.03 0.02,-0.03zm-0.15 0c0.01,-0.01 0.03,-0.01 0.05,-0.01 0.04,0.01 0.04,0.02 0.03,0.07 0,0.04 -0.02,0.04 -0.06,0.04 -0.05,0 -0.04,-0.03 -0.04,-0.07 0,-0.02 0,-0.03 0.02,-0.03zm-0.04 -0.08c-0.04,0.01 -0.03,0.05 -0.03,0.1l0 0.51c0,0.06 0.02,0.05 0.08,0.05 0.03,0 0.24,0 0.25,0 0.04,-0.01 0.03,-0.07 0.03,-0.11l0 -0.5c0,-0.06 -0.03,-0.05 -0.08,-0.05 -0.04,0 -0.24,0 -0.25,0z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.17 0.46c0.01,0 0.04,0 0.05,0 0.02,0 0.03,0.01 0.03,0.02 0.01,0.01 0.01,0.04 0.01,0.05 -0.01,0.04 -0.03,0.03 -0.07,0.03 -0.04,0 -0.04,-0.02 -0.04,-0.07 0,-0.02 0.01,-0.03 0.02,-0.03zm0 -0.15c0.01,-0.01 0.03,0 0.05,0 0.04,0 0.04,0.02 0.04,0.06 0,0.05 -0.02,0.04 -0.07,0.04 -0.02,0 -0.03,0 -0.03,-0.02 -0.01,0 -0.02,-0.07 0.01,-0.08zm0.14 0.43c0,-0.03 0,-0.39 0,-0.46 0,-0.06 0.02,-0.05 -0.14,-0.05 -0.11,0 -0.09,-0.02 -0.09,0.18l0 0.28c0,0.04 0,0.05 0.04,0.05 0.05,0 0.14,0 0.19,0z" />
|
|
||||||
<path fill="currentColor" d="M0.58 0.54c0.01,0.01 0.02,0.02 0.03,0.02 0.05,0 0.07,0.01 0.08,-0.03 0,-0.01 0,-0.04 -0.01,-0.05 0,-0.03 -0.06,-0.02 -0.08,-0.02 -0.01,0 -0.02,0.01 -0.02,0.03 0,0.01 0,0.04 0,0.05z" />
|
|
||||||
<path fill="currentColor" d="M0.17 0.46c-0.01,0 -0.02,0.01 -0.02,0.03 0,0.05 0,0.07 0.04,0.07 0.04,0 0.06,0.01 0.07,-0.03 0,-0.01 0,-0.04 -0.01,-0.05 0,-0.01 -0.01,-0.02 -0.03,-0.02 -0.01,0 -0.04,0 -0.05,0z" />
|
|
||||||
<path fill="currentColor" d="M0.43 0.54c0.01,0.03 0.08,0.02 0.08,0.02 0.03,-0.01 0.03,-0.07 0.02,-0.08 0,-0.02 -0.01,-0.02 -0.03,-0.02 -0.05,0 -0.07,-0.01 -0.07,0.03 0,0.01 0,0.04 0,0.05z" />
|
|
||||||
<path fill="currentColor" d="M0.6 0.16c-0.01,0 -0.02,0.01 -0.02,0.03 0,0.05 0,0.07 0.04,0.07 0.04,0 0.07,0 0.07,-0.04 0,-0.04 0,-0.06 -0.04,-0.07 -0.01,0 -0.03,0 -0.05,0.01z" />
|
|
||||||
<path fill="currentColor" d="M0.58 0.39c0.01,0.01 0.02,0.02 0.03,0.02 0.05,0 0.09,0.01 0.08,-0.08 -0.01,-0.02 -0.02,-0.02 -0.04,-0.02 -0.04,0 -0.07,-0.01 -0.07,0.03 0,0.01 0,0.04 0,0.05z" />
|
|
||||||
<path fill="currentColor" d="M0.45 0.16c-0.02,0 -0.02,0.01 -0.02,0.03 0,0.04 -0.01,0.07 0.04,0.07 0.04,0 0.06,0 0.06,-0.04 0.01,-0.05 0.01,-0.06 -0.03,-0.07 -0.02,0 -0.04,0 -0.05,0.01z" />
|
|
||||||
<path fill="currentColor" d="M0.17 0.31c-0.03,0.01 -0.02,0.08 -0.01,0.08 0,0.02 0.01,0.02 0.03,0.02 0.05,0 0.07,0.01 0.07,-0.04 0,-0.04 0,-0.06 -0.04,-0.06 -0.02,0 -0.04,-0.01 -0.05,0z" />
|
|
||||||
<path fill="currentColor" d="M0.43 0.39c0,0.02 0.02,0.02 0.03,0.02 0.02,0 0.04,0 0.05,0 0.03,-0.01 0.03,-0.06 0.02,-0.08 0,-0.02 -0.01,-0.02 -0.03,-0.02 -0.01,0 -0.04,0 -0.05,0 -0.01,0 -0.02,0.01 -0.02,0.03 0,0.01 0,0.04 0,0.05z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 4.5 KiB |
@@ -1,11 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="23px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.47 0.5">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976458665616">
|
|
||||||
<path fill="currentColor" d="M0.05 0.18c0,-0.02 0.02,-0.05 0.03,-0.05 0.04,0 0.04,0.02 0.09,0 0.04,-0.02 0.03,-0.06 0.04,-0.08 0.01,0 0.04,0 0.06,0 0.01,0.02 0,0.06 0.03,0.08 0.02,0 0.03,0.01 0.05,0.01 0.01,0 0.03,-0.02 0.04,-0.01 0.01,0 0.03,0.04 0.03,0.05 0,0.01 -0.05,0.02 -0.05,0.07 0,0.02 0.01,0.03 0.02,0.04 0.01,0.01 0.02,0.02 0.03,0.03 0,0.01 -0.02,0.05 -0.03,0.05 -0.04,0 -0.04,-0.02 -0.09,0 -0.03,0.02 -0.02,0.04 -0.03,0.07 -0.02,0.01 -0.05,0.01 -0.06,0 -0.01,0 0,-0.05 -0.04,-0.07 -0.05,-0.02 -0.05,0 -0.09,0 0,0 -0.03,-0.04 -0.03,-0.05 0,0 0.04,-0.03 0.04,-0.04 0.01,-0.01 0.01,-0.05 0,-0.06l-0.03 -0.03c0,-0.01 0,-0.01 -0.01,-0.01zm-0.05 0.01c0,0.02 0.02,0.03 0.03,0.04 0,0 0.02,0.01 0.02,0.01 0,0.02 -0.01,0.02 -0.01,0.03 -0.03,0.02 -0.06,0.03 -0.03,0.09 0.01,0.01 0.02,0.03 0.03,0.04 0.03,0.05 0.08,0 0.1,0.01 0.01,0.01 0.01,0.01 0.01,0.03 0.01,0.01 0.01,0.02 0.01,0.02 0.01,0.04 0.06,0.04 0.11,0.04 0.06,-0.01 0.04,-0.07 0.06,-0.08 0.01,-0.02 0.03,0 0.05,0 0.02,0.01 0.04,0 0.05,-0.01 0.02,-0.02 0.05,-0.07 0.04,-0.1 0,-0.01 -0.01,-0.02 -0.01,-0.02 -0.04,-0.04 -0.05,-0.03 -0.02,-0.06 0.04,-0.03 0.04,-0.05 0.02,-0.09 -0.06,-0.12 -0.09,-0.04 -0.13,-0.06 -0.02,-0.01 0,-0.07 -0.06,-0.08 -0.02,0 -0.04,0 -0.06,0 -0.07,0.01 -0.04,0.07 -0.06,0.08 -0.02,0.01 -0.04,0 -0.06,0 -0.04,-0.01 -0.06,0.02 -0.07,0.05 -0.01,0.02 -0.02,0.04 -0.02,0.06z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.22 0.18c0.05,-0.01 0.08,0.02 0.09,0.05 0.02,0.11 -0.13,0.12 -0.15,0.04 -0.01,-0.05 0.02,-0.08 0.06,-0.09zm-0.17 0c0.01,0 0.01,0 0.01,0.01l0.03 0.03c0.01,0.01 0.01,0.05 0,0.06 0,0.01 -0.04,0.04 -0.04,0.04 0,0.01 0.03,0.05 0.03,0.05 0.04,0 0.04,-0.02 0.09,0 0.04,0.02 0.03,0.07 0.04,0.07 0.01,0.01 0.04,0.01 0.06,0 0.01,-0.03 0,-0.05 0.03,-0.07 0.05,-0.02 0.05,0 0.09,0 0.01,0 0.03,-0.04 0.03,-0.05 -0.01,-0.01 -0.02,-0.02 -0.03,-0.03 -0.01,-0.01 -0.02,-0.02 -0.02,-0.04 0,-0.05 0.05,-0.06 0.05,-0.07 0,-0.01 -0.02,-0.05 -0.03,-0.05 -0.01,-0.01 -0.03,0.01 -0.04,0.01 -0.02,0 -0.03,-0.01 -0.05,-0.01 -0.03,-0.02 -0.02,-0.06 -0.03,-0.08 -0.02,0 -0.05,0 -0.06,0 -0.01,0.02 0,0.06 -0.04,0.08 -0.05,0.02 -0.05,0 -0.09,0 -0.01,0 -0.03,0.03 -0.03,0.05z" />
|
|
||||||
<path fill="currentColor" d="M0.23 0.23c0.04,-0.01 0.04,0.04 0.02,0.04 -0.04,0.01 -0.05,-0.04 -0.02,-0.04zm-0.01 -0.05c-0.04,0.01 -0.07,0.04 -0.06,0.09 0.02,0.08 0.17,0.07 0.15,-0.04 -0.01,-0.03 -0.04,-0.06 -0.09,-0.05z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.8 KiB |
@@ -1,18 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
||||||
<!-- Creator: CorelDRAW -->
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="32px" height="32px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
|
||||||
viewBox="0 0 31.72 31.94"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
|
||||||
<defs>
|
|
||||||
<linearGradient id="id0" gradientUnits="userSpaceOnUse" x1="34.29" y1="30.1" x2="2.58" y2="-8.78">
|
|
||||||
<stop offset="0" stop-opacity="1" stop-color="#0E4251"/>
|
|
||||||
<stop offset="1" stop-opacity="1" stop-color="#2BAC90"/>
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer"/>
|
|
||||||
<path fill="url(#id0)" d="M17.1 21.27c0.2,0.5 0.14,0.57 0.91,0.52 0.44,-0.03 0.78,-0.16 1.18,-0.35 2.13,-0.98 3.31,-4.2 2.63,-6.85 -1.04,-4.12 -7.11,-7.81 -11.2,-1.75 -2.32,3.43 -0.5,6.47 2.66,8.42 1.82,1.12 2.43,1.59 3.52,3.03 0.88,1.19 1.58,3.07 1.2,4.99 -0.41,2.04 -2.98,2.15 -3.97,0.88 -1.16,-1.48 0.16,-3.49 -1.75,-4.62 -0.79,-0.47 -2.09,-0.45 -2.79,0.06 -0.95,0.69 -2.05,2.93 -4.03,0.97 -0.57,-0.56 -1.2,-1.12 -0.76,-2.29 0.4,-1.05 2.56,-1.95 1.86,-4.2 -0.73,-2.35 -2.16,-1.37 -4.35,-2.06 -1.72,-0.53 -1.6,-3.48 -0.16,-4.1 2.03,-0.86 3.55,0.42 4.44,-1.96 0.35,-0.92 0.22,-1.61 -0.23,-2.4 -0.65,-1.14 -1.03,-0.88 -1.49,-1.81 -0.75,-1.55 1.1,-3.5 2.57,-3.15 1.69,0.41 1.83,2.77 4.48,1.92 2.55,-0.82 1.2,-2.66 1.96,-4.45 0.58,-1.36 3.5,-1.56 4.12,0.07 0.31,0.83 -0.31,3.79 1.97,4.43 2.31,0.65 3.31,-1.72 4.49,-1.99 1.49,-0.33 3.24,1.61 2.53,3.11 -0.58,1.23 -2.64,1.94 -1.71,4.33 1.25,3.24 5.83,-0.19 5.49,4.23 -0.27,3.67 -4.98,0.29 -5.64,4.09 -0.41,2.44 1.86,2.86 2.02,4.45 0.13,1.41 -1.73,3.3 -3.47,2.16 -0.71,-0.46 -0.78,-1.09 -1.77,-1.52 -0.89,-0.39 -2.2,-0.48 -2.39,0.67 0.97,0.72 0.93,-0.45 2.31,0.41 0.78,0.48 0.8,1.03 1.79,1.49 2,0.95 3.73,-0.72 4.28,-1.84 1.12,-2.25 -1.02,-3.4 -1.58,-4.35 -0.46,-0.77 -0.33,-1.84 0.46,-2.35 0.96,-0.61 6.11,0.47 4.84,-4.68 -0.64,-2.62 -2.34,-1.59 -4.44,-2.17 -0.89,-0.25 -1.37,-1.14 -1.07,-2.1 0.31,-1.02 4.15,-3.51 0.58,-6.26 -3.48,-2.67 -4.55,2.91 -6.9,1.1 -1.35,-1.04 0.54,-5.86 -4.47,-5.31 -4.09,0.46 -1.25,5.34 -4.09,5.63 -1.99,0.21 -3.27,-4.34 -6.67,-0.76 -1.59,1.67 -0.82,3.36 0.4,4.49 1.64,1.51 0.97,3.18 -1.43,3.32 -2.11,0.12 -3.39,0.88 -3.43,3.14 -0.04,2.39 1.23,3.21 3.43,3.3 2.77,0.13 2.78,1.73 1.42,3.34 -1.2,1.42 -1.99,2.68 -0.42,4.53 2.81,3.32 5.1,-0.7 6.38,-0.83 0.94,-0.09 1.58,0.44 1.74,1.34 0.42,2.23 0,3.76 2.34,4.28 5.17,1.15 6.31,-6.37 -0.22,-10.81 -2.43,-1.65 -6.01,-3.88 -3.02,-7.93 3.96,-5.39 11.14,-0.6 9.01,5.18 -1.07,2.9 -2.8,2.07 -3.56,3.01z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.7 KiB |
@@ -1,17 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
||||||
<!-- Creator: CorelDRAW -->
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="61px" height="48px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
|
||||||
viewBox="0 0 3.25 2.57"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer"/>
|
|
||||||
<g id="_3033909382768">
|
|
||||||
<path fill="#275868" fill-opacity="0.501961" d="M1.01 0.64c0.05,0.04 0.12,0.04 0.24,0.17 0.19,0.18 0.25,0.49 0.15,0.74 -0.03,0.05 -0.06,0.09 -0.07,0.13 0.04,0.04 0.19,0.09 0.29,0.22 0.02,-0.03 0.21,-0.01 0.26,-0.01 0.01,-0.14 -0.03,-0.25 0.08,-0.32 0.07,-0.04 0.25,-0.02 0.35,-0.02 0.1,0 0.28,-0.03 0.35,0.03 0.11,0.09 0.05,0.17 0.08,0.31 0.05,0 0.11,0.01 0.16,-0.01l0 -1.52c-0.04,-0.01 -1.82,-0.02 -1.87,0 -0.01,0.06 0.01,0.25 -0.02,0.28z"/>
|
|
||||||
<path fill="#275868" d="M1.01 0.64c0.03,-0.03 0.01,-0.22 0.02,-0.28 0.05,-0.02 1.83,-0.01 1.87,0l0 1.52c-0.05,0.02 -0.11,0.01 -0.16,0.01l-0.86 0c-0.05,0 -0.24,-0.02 -0.26,0.01 0.01,0.02 0.05,0.07 0.09,0.15 0.02,0.04 0.05,0.15 0.07,0.17 0.26,0.02 0.58,0.01 0.85,0.01 0.13,0 0.3,0.02 0.41,-0.03 0.09,-0.04 0.17,-0.12 0.19,-0.23 0.03,-0.09 0.03,-1.59 0.01,-1.69 -0.07,-0.32 -0.39,-0.27 -0.59,-0.27 -0.23,0 -1.59,-0.02 -1.7,0 -0.26,0.07 -0.29,0.3 -0.26,0.59 0.05,0.02 0.11,0 0.17,0.01 0.05,0.01 0.11,0.03 0.15,0.03z"/>
|
|
||||||
<path fill="#275868" d="M0.43 1.89c-0.16,0.02 -0.28,0.13 -0.34,0.22 -0.07,0.1 -0.14,0.32 -0.04,0.41 0.08,0.07 0.4,0.05 0.51,0.05 0.19,0 0.37,0 0.56,0 0.18,0 0.39,0.04 0.42,-0.14 0.02,-0.16 -0.08,-0.33 -0.15,-0.4 -0.11,-0.1 -0.22,-0.14 -0.42,-0.14 -0.15,0 -0.41,-0.02 -0.54,0z"/>
|
|
||||||
<path fill="#275868" d="M0.69 0.87c-0.58,0.14 -0.37,0.94 0.17,0.84 0.2,-0.05 0.39,-0.25 0.33,-0.51 -0.04,-0.2 -0.25,-0.39 -0.5,-0.33z"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.0 KiB |
@@ -1,19 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
||||||
<!-- Creator: CorelDRAW -->
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="29px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
|
||||||
viewBox="0 0 1.51 1.26"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer"/>
|
|
||||||
<g id="_3033971521472">
|
|
||||||
<path fill="#275868" fill-opacity="0.501961" d="M1 0.96c-0.01,-0.01 -0.01,-0.07 -0.01,-0.09 0,-0.07 0.04,-0.06 0.12,-0.06 0.08,0 0.06,0.04 0.06,0.12 0,0.08 -0.04,0.06 -0.11,0.06 -0.03,0 -0.06,0 -0.06,-0.03zm-0.72 0c-0.01,-0.01 -0.01,-0.07 -0.01,-0.09 0,-0.07 0.04,-0.06 0.12,-0.06 0.08,0 0.06,0.04 0.06,0.12 0,0.08 -0.04,0.06 -0.11,0.06 -0.03,0 -0.06,0 -0.06,-0.03zm0.35 0c0,-0.02 0,-0.07 0,-0.09 0,-0.07 0.04,-0.06 0.12,-0.06 0.08,0 0.06,0.03 0.06,0.13 0,0.03 0,0.05 -0.03,0.05 -0.05,0.01 -0.14,0.01 -0.15,-0.03zm0.81 -0.61c-0.05,0.02 -0.5,0.3 -0.54,0.3 0,-0.04 -0.01,-0.12 0.02,-0.16 -0.03,0.01 -0.01,0 -0.02,0 0,-0.04 0,-0.11 0.01,-0.14 -0.04,0.02 -0.1,0.05 -0.14,0.08l-0.34 0.19c-0.02,0.01 -0.04,0.03 -0.07,0.03 0,-0.04 -0.01,-0.12 0.02,-0.16 -0.02,0.01 -0.01,0 -0.01,0 0,-0.09 0,-0.19 0,-0.28 0,-0.09 0.01,-0.18 -0.07,-0.21 -0.03,0 -0.11,0 -0.14,0 -0.04,0 -0.09,-0.01 -0.12,0.02 -0.06,0.04 -0.04,0.16 -0.04,0.24l0 0.83c0,0.09 0.03,0.16 0.12,0.17 0.05,0.01 1.03,0 1.11,0 0.1,0 0.17,0 0.2,-0.07 0.02,-0.05 0.01,-0.21 0.01,-0.28 0,-0.18 0,-0.37 0,-0.56z"/>
|
|
||||||
<path fill="#275868" d="M0.92 0.49c-0.03,0.04 -0.02,0.12 -0.02,0.16 0.04,0 0.49,-0.28 0.54,-0.3 0.02,-0.02 0.06,-0.01 0.07,-0.06 0.01,-0.05 -0.02,-0.08 -0.06,-0.08 -0.03,-0.01 -0.07,0.02 -0.09,0.03l-0.27 0.15c-0.03,0.02 -0.15,0.09 -0.17,0.1z"/>
|
|
||||||
<path fill="#275868" d="M0.38 0.49c-0.03,0.04 -0.02,0.12 -0.02,0.16 0.03,0 0.05,-0.02 0.07,-0.03l0.34 -0.19c0.04,-0.03 0.1,-0.06 0.14,-0.08 0.03,-0.02 0.06,-0.03 0.06,-0.07 0,-0.04 -0.03,-0.07 -0.06,-0.08 -0.05,0 -0.47,0.27 -0.53,0.29z"/>
|
|
||||||
<path fill="#275868" d="M0.63 0.96c0.01,0.04 0.1,0.04 0.15,0.03 0.03,0 0.03,-0.02 0.03,-0.05 0,-0.1 0.02,-0.13 -0.06,-0.13 -0.08,0 -0.12,-0.01 -0.12,0.06 0,0.02 0,0.07 0,0.09z"/>
|
|
||||||
<path fill="#275868" d="M0.28 0.96c0,0.03 0.03,0.03 0.06,0.03 0.07,0 0.11,0.02 0.11,-0.06 0,-0.08 0.02,-0.12 -0.06,-0.12 -0.08,0 -0.12,-0.01 -0.12,0.06 0,0.02 0,0.08 0.01,0.09z"/>
|
|
||||||
<path fill="#275868" d="M1 0.96c0,0.03 0.03,0.03 0.06,0.03 0.07,0 0.11,0.02 0.11,-0.06 0,-0.08 0.02,-0.12 -0.06,-0.12 -0.08,0 -0.12,-0.01 -0.12,0.06 0,0.02 0,0.08 0.01,0.09z"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.7 KiB |
@@ -1,10 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="20px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.66 0.78">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2940943070608">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.27 0.09c-0.29,0.05 -0.21,0.49 0.08,0.44 0.11,-0.02 0.2,-0.13 0.18,-0.26 -0.02,-0.11 -0.13,-0.2 -0.26,-0.18z" />
|
|
||||||
<path fill="currentColor" d="M0.58 0.09c0.01,-0.01 0.04,-0.03 0.04,-0.05 0,-0.02 -0.01,-0.04 -0.03,-0.04 -0.03,0 -0.04,0.02 -0.06,0.03 -0.04,0.05 -0.06,0.05 -0.01,0.1 0.16,0.17 0.01,0.5 -0.26,0.45 -0.1,-0.02 -0.13,-0.07 -0.15,-0.08 -0.02,-0.01 -0.04,-0.01 -0.05,0.01 -0.02,0.01 -0.07,0.05 -0.06,0.09 0.01,0.01 0.03,0.03 0.05,0.02 0.02,-0.01 0.03,-0.03 0.04,-0.04 0.03,0.01 0.05,0.04 0.08,0.05 0.04,0.02 0.07,0.02 0.1,0.03l0 0.05c-0.03,0 -0.13,-0.01 -0.15,0 -0.04,0.01 -0.05,0.07 0.01,0.07l0.36 0c0.06,0 0.06,-0.07 0.01,-0.07 -0.04,-0.01 -0.11,0 -0.15,0l0 -0.05c0.03,-0.01 0.06,-0.01 0.09,-0.03 0.08,-0.03 0.15,-0.09 0.18,-0.17 0.03,-0.06 0.04,-0.13 0.03,-0.21 0,-0.03 -0.01,-0.06 -0.03,-0.09 -0.01,-0.03 -0.03,-0.05 -0.04,-0.07z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.3 KiB |
@@ -1,18 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
||||||
<!-- Creator: CorelDRAW -->
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="32px" height="26px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
|
||||||
viewBox="0 0 6.68 5.4"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
|
||||||
<defs>
|
|
||||||
<linearGradient id="id0" gradientUnits="userSpaceOnUse" x1="6.39" y1="5.64" x2="1.37" y2="-2.03">
|
|
||||||
<stop offset="0" stop-opacity="1" stop-color="#0E4251"/>
|
|
||||||
<stop offset="1" stop-opacity="1" stop-color="#2BAC90"/>
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer"/>
|
|
||||||
<path fill="url(#id0)" d="M6.12 5.01l0.07 -0.5 0.06 0.26c0.02,0.18 0.03,0.22 -0.13,0.24zm-0.18 0c-0.1,0.01 -0.18,-0.01 -0.25,-0.03 -0.07,-0.35 0.24,-0.82 0.2,-1.07 -0.02,-0.11 -0.14,-0.27 0.03,-0.34 0.25,-0.09 0.12,0.21 0.13,0.43 0.01,0.25 0.02,0.06 -0.03,0.16 -0.14,0.22 0.08,0.39 -0.08,0.85zm-4.51 -2.29c0.97,0.06 1.58,1.33 2.72,0.36 0.24,-0.2 0.78,-0.68 1.06,-0.7 0.08,0.69 0.13,1.09 -0.3,1.42 -0.34,0.26 -0.86,0.44 -1.39,0.44 -0.54,0.01 -1.85,-0.24 -2.04,-0.65 -0.06,-0.13 -0.08,-0.71 -0.05,-0.87zm4 -0.88c0.28,0.05 0.24,0.04 0.3,0.12l-0.49 0.18c-0.4,-0.63 -1.9,-0.24 -2.13,-0.63 0.07,-0.09 0.12,-0.11 0.33,-0.1 0.12,0.01 0.22,0.05 0.32,0.09 0.55,0.19 1.1,0.24 1.67,0.34zm-5.25 -0.33c0.12,-0.15 1.27,-0.59 1.54,-0.7 1.83,-0.79 1.41,-0.79 2.46,-0.34 0.38,0.16 2.22,0.93 2.32,1.04 -0.05,0.17 -0.2,0.2 -0.36,0.28 -0.22,0.11 -0.23,0.01 -0.42,-0.06 -0.21,-0.08 -0.76,-0.14 -1.01,-0.18 -0.37,-0.06 -0.61,-0.11 -0.95,-0.24 -0.32,-0.12 -0.69,-0.13 -0.82,0.17 -0.1,0.58 1.77,0.26 2.15,0.72 -0.07,0.06 -0.32,0.19 -0.44,0.27 -0.26,0.17 -0.56,0.46 -0.81,0.62 -0.13,0.09 -0.31,0.19 -0.5,0.19 -0.61,0.02 -2.09,-1.32 -2.1,-0.43 -0.01,0.71 0,0.94 0.57,1.2 0.99,0.44 2.36,0.56 3.24,-0.14 0.54,-0.43 0.36,-0.87 0.31,-1.63l0.51 -0.19 0 1.3c-0.18,0.15 -0.23,0.15 -0.17,0.45 0.1,0.46 -0.59,1.23 0.13,1.34 0.01,0.01 0.01,0.02 0.01,0.03l0.03 0.09c0.02,0.1 0,0.04 0.03,0.1 0.2,-0.07 0.08,-0.11 0.19,-0.2 0.15,-0.11 0.55,0.11 0.17,-1.04 -0.11,-0.33 0.15,-0.65 -0.23,-0.76l0.01 -1.4c0.11,-0.03 0.3,-0.11 0.4,-0.16 0.85,-0.46 -0.77,-0.9 -1.38,-1.18 -2.04,-0.93 -1.47,-0.84 -3.47,0.01 -0.35,0.15 -1.52,0.57 -1.59,0.81 0,0.28 0.13,0.32 0.36,0.42l1.62 0.65c1.07,0.46 1.22,0.73 1.9,0.37 0.15,-0.08 0.2,-0.14 0.13,-0.21 -0.34,-0.07 -0.38,0.43 -1.03,0.1 -0.34,-0.17 -0.6,-0.27 -0.95,-0.43 -0.33,-0.14 -0.65,-0.26 -0.98,-0.39 -0.21,-0.08 -0.81,-0.26 -0.87,-0.48z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.7 KiB |
@@ -1,11 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="19px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.57 0.44">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976979072368">
|
|
||||||
<path fill="currentColor" d="M0.02 0.1c0.01,0.01 0.19,0 0.22,0 0.02,0 0.06,0 0.07,0.01 0,0.01 0,0.03 -0.01,0.03 0,0.01 -0.01,0.01 -0.03,0.01 -0.02,0 -0.21,0 -0.22,0 0,0.01 0,0.01 0,0.01 0.01,0.01 0.18,0.08 0.2,0.09 0.03,0.01 0.05,0 0.08,-0.01 0.04,-0.02 0.09,-0.03 0.13,-0.05 0.01,-0.01 0.1,-0.04 0.1,-0.04 0.01,-0.01 0.01,-0.03 0.01,-0.04 -0.01,-0.01 -0.12,-0.05 -0.14,-0.06 -0.02,-0.01 -0.04,-0.01 -0.06,-0.02 -0.08,-0.04 -0.08,-0.04 -0.15,-0.01l-0.2 0.08z" />
|
|
||||||
<path fill="currentColor" d="M0.1 0.23c-0.01,0.03 0,0.06 0,0.09 0,0.03 -0.01,0.04 0.01,0.06 0.06,0.09 0.32,0.08 0.36,-0.01 0.01,-0.02 0.01,-0.06 0.01,-0.08 0,-0.07 0,-0.06 -0.02,-0.05 -0.04,0.02 -0.08,0.03 -0.12,0.05 -0.05,0.02 -0.08,0.01 -0.13,-0.01 -0.01,-0.01 -0.1,-0.05 -0.11,-0.05z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.05 0.16c0,0 0,0 0,-0.01 0.01,0 0.2,0 0.22,0 0.02,0 0.03,0 0.03,-0.01 0.01,0 0.01,-0.02 0.01,-0.03 -0.01,-0.01 -0.05,-0.01 -0.07,-0.01 -0.03,0 -0.21,0.01 -0.22,0 -0.03,0.01 -0.02,0.04 -0.02,0.07 0,0.04 0,0.25 0,0.26 0.01,0.02 0.05,0.02 0.05,-0.01 0,-0.03 0,-0.06 0,-0.09l0 -0.13c0,0 0,-0.03 0,-0.04z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.5 KiB |
@@ -1,11 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="21px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.48 0.42">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976799046176">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.45 0.37l0 -0.25c-0.01,0 0,0.01 -0.01,0.01l-0.1 0.1c-0.01,0.01 -0.02,0.03 -0.04,0.03 -0.01,0 -0.02,-0.01 -0.03,-0.02 -0.01,-0.01 -0.05,-0.05 -0.06,-0.06 -0.02,0.02 -0.07,0.09 -0.09,0.09 -0.03,0 -0.03,-0.02 -0.03,-0.03l-0.04 0.04c0,-0.05 0,-0.09 0,-0.13 0,-0.02 0,-0.13 -0.01,-0.13 0.01,0.03 0,0.14 0,0.19 0,0.03 0.01,0.06 0.01,0.09 -0.01,0.09 0,0.07 0.11,0.07l0.29 0z" />
|
|
||||||
<path fill="currentColor" d="M0.45 0.37l-0.29 0c-0.11,0 -0.12,0.02 -0.11,-0.07 0,-0.03 -0.01,-0.06 -0.01,-0.09 0,-0.05 0.01,-0.16 0,-0.19 0,-0.02 -0.02,-0.03 -0.03,-0.01 -0.01,0.01 -0.01,0.04 -0.01,0.06l0 0.25c0,0.03 0,0.04 0.01,0.06 0.01,0.01 0.02,0.02 0.03,0.03 0.03,0.01 0.09,0.01 0.13,0.01l0.25 0c0.02,0 0.05,0 0.06,-0.01 0.01,-0.02 -0.01,-0.04 -0.03,-0.04z" />
|
|
||||||
<path fill="currentColor" d="M0.09 0.24c0,0.01 0,0.03 0.03,0.03 0.02,0 0.07,-0.07 0.09,-0.09 0.01,0.01 0.05,0.05 0.06,0.06 0.01,0.01 0.02,0.02 0.03,0.02 0.02,0 0.03,-0.02 0.04,-0.03l0.1 -0.1c0.01,0 0,-0.01 0.01,-0.01 -0.01,-0.04 -0.03,-0.03 -0.04,-0.02l-0.11 0.11c-0.01,-0.01 -0.06,-0.07 -0.07,-0.08 -0.02,-0.01 -0.03,0 -0.04,0.01l-0.1 0.1z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.5 KiB |
@@ -1,10 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.48 0.48">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2977419749904">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.11 0.32c-0.04,0 -0.04,-0.04 0,-0.04 0.06,0 0.06,0.04 0,0.04zm0 -0.08c-0.01,0 -0.03,-0.01 -0.03,-0.02 0.01,-0.03 0.04,-0.02 0.07,-0.02 0.04,0 0.04,0.04 0,0.04l-0.04 0zm0 -0.09c-0.01,0 -0.03,0 -0.03,-0.02 0,-0.01 0.02,-0.02 0.03,-0.02l0.11 0c0.04,0 0.04,0.04 0,0.04l-0.11 0zm0.1 0.3c-0.03,-0.06 -0.04,-0.11 -0.01,-0.18 0.01,-0.02 0.03,-0.04 0.05,-0.06 0.04,-0.02 0.06,-0.02 0.08,-0.03 0.01,-0.02 0.01,-0.13 0,-0.14 -0.01,-0.05 -0.06,-0.04 -0.11,-0.04 -0.05,0 -0.1,0 -0.15,0 -0.05,0 -0.07,0.02 -0.07,0.07 0,0.1 0,0.2 0,0.3 0,0.05 0.01,0.08 0.07,0.08 0.04,0 0.09,0 0.14,0z" />
|
|
||||||
<path fill="currentColor" d="M0.29 0.34c0.02,-0.01 0.03,0.01 0.04,0.02 0.02,-0.02 0.03,-0.04 0.05,-0.06 0.01,-0.01 0.03,-0.01 0.02,0.01 0,0.01 -0.03,0.05 -0.04,0.06 -0.02,0.04 -0.02,0.04 -0.06,0 -0.01,-0.01 -0.02,-0.01 -0.01,-0.03zm-0.07 0.03c0.01,0.06 0.07,0.12 0.15,0.11 0.06,-0.01 0.11,-0.07 0.1,-0.15 0,-0.06 -0.07,-0.12 -0.14,-0.1 -0.06,0 -0.12,0.07 -0.11,0.14z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.4 KiB |
@@ -1,18 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
||||||
<!-- Creator: CorelDRAW -->
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="26px" height="32px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
|
||||||
viewBox="0 0 11 13.74"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
|
||||||
<defs>
|
|
||||||
<linearGradient id="id0" gradientUnits="userSpaceOnUse" x1="13.35" y1="11.47" x2="-0.57" y2="-2.3">
|
|
||||||
<stop offset="0" stop-opacity="1" stop-color="#0E4251"/>
|
|
||||||
<stop offset="1" stop-opacity="1" stop-color="#2BAC90"/>
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer"/>
|
|
||||||
<path fill="url(#id0)" d="M10.61 1.59c-0.47,1.82 -0.73,3.24 -0.73,5.24 0,0.9 0.06,1.92 0.22,2.76 0.15,0.75 0.52,1.89 0.07,2.58 -0.89,1.37 -5.8,1.29 -7.61,1.1 -1.25,-0.13 -1.62,0.09 -1.82,-1.2 -0.34,-2.16 -0.78,-9.2 0.32,-10.8 0.9,-1.29 7.19,-0.98 9.07,-0.62 0.57,0.11 0.64,0.31 0.48,0.94zm-6.57 -1.51c-2.29,0.14 -3.46,0.21 -3.79,2.52 -0.39,2.7 -0.29,6.18 0.05,8.93 0.13,1 0.18,1.83 1.17,2 1.72,0.31 6.84,0.4 8.45,-0.64 1.85,-1.2 -0.1,-3.21 0.41,-8.02 0.09,-0.91 0.24,-1.78 0.46,-2.63 0.27,-1.03 0.5,-1.76 -0.73,-1.97 -1.97,-0.32 -4.01,-0.32 -6.02,-0.19zm-2.09 2.42c-0.08,0.3 0.19,0.54 0.46,0.65 0.48,-0.28 0.28,-0.36 0.61,-0.55 -0.03,0.44 -0.24,0.8 -0.72,0.72 -0.67,-0.12 -0.63,-1.09 -0.02,-1.2 0.4,-0.07 0.34,0.13 0.52,-0.28 -1.6,-0.44 -1.75,1.55 -0.65,1.8 0.63,0.14 1.12,-0.22 1.19,-0.75 0.05,-0.39 -0.14,-0.53 -0.02,-0.76 0.12,-0.25 0.37,-0.28 0.39,-0.57 -0.4,-0.21 -0.93,0.77 -1.3,1.16 -0.11,-0.16 -0.29,-0.37 -0.46,-0.22zm4.57 8.74c-1.83,0.33 -2.58,-0.43 -3,-0.21 0.07,0.36 0.19,0.37 1.15,0.55 1.51,0.29 2.05,-0.15 3.12,-0.22 0.54,-0.03 1.22,0.28 1.43,0.23 0.09,-0.28 -0.06,-0.33 -0.37,-0.44 -0.87,-0.3 -1.49,-0.07 -2.33,0.09zm-2.82 -6.25c0.02,0.01 0.05,0 0.06,0.03 0.07,0.14 0.55,-0.03 0.61,-0.05 1.33,-0.37 1.86,0.99 4.12,0.21 0.41,-0.14 0.46,-0.09 0.49,-0.45 -0.34,-0.1 -1.48,0.58 -2.68,0.2 -0.54,-0.18 -1.61,-0.6 -2.38,-0.21 -0.3,0.15 -0.14,-0.01 -0.22,0.27zm0.03 4.43c0.25,0.12 0.76,-0.19 1.33,-0.13 0.39,0.04 0.89,0.26 1.3,0.38 0.48,0.14 1,0.14 1.49,0.04 0.83,-0.15 1.1,-0.22 1.13,-0.61 -0.56,-0.1 -1.37,0.63 -2.7,0.2 -0.81,-0.26 -1.12,-0.5 -2.07,-0.29 -0.36,0.08 -0.49,0.05 -0.48,0.41zm-0.03 -2.07c0.27,0.41 0.19,-0.11 1.29,-0.05 0.83,0.05 1.37,0.69 2.8,0.44 0.25,-0.04 0.43,-0.09 0.66,-0.16 0.36,-0.11 0.48,-0.07 0.51,-0.38 -0.29,-0.21 -0.88,0.16 -1.25,0.22 -1.57,0.25 -2.55,-0.97 -3.82,-0.29 -0.25,0.14 -0.11,-0.05 -0.19,0.22zm0.03 -4.36c0.22,0.12 0.9,-0.15 1.33,-0.12 1.03,0.1 1.45,0.87 3.44,0.25 0.39,-0.12 0.46,-0.1 0.47,-0.43 -0.56,-0.12 -1.29,0.63 -2.69,0.18 -0.78,-0.25 -1.2,-0.49 -2.06,-0.28 -0.66,0.16 -0.5,0.23 -0.49,0.4zm-1.52 5.9c0.76,-0.3 1.06,0.86 0.43,1.12 -0.71,0.3 -1.26,-0.78 -0.43,-1.12zm-0.17 -0.32c-1.14,0.49 -0.51,2.23 0.7,1.78 1.16,-0.43 0.49,-2.29 -0.7,-1.78zm-0.17 -3.78c-0.08,0.3 0.19,0.54 0.46,0.65 0.48,-0.28 0.28,-0.35 0.61,-0.55 -0.03,0.45 -0.24,0.8 -0.72,0.72 -0.67,-0.12 -0.63,-1.09 -0.02,-1.2 0.4,-0.07 0.34,0.13 0.52,-0.27 -1.6,-0.45 -1.75,1.54 -0.65,1.79 0.63,0.14 1.12,-0.22 1.19,-0.75 0.05,-0.39 -0.14,-0.53 -0.02,-0.76 0.12,-0.24 0.37,-0.27 0.39,-0.57 -0.4,-0.21 -0.93,0.77 -1.3,1.16 -0.12,-0.15 -0.29,-0.37 -0.46,-0.22zm0 2.12c-0.08,0.3 0.19,0.54 0.46,0.65 0.48,-0.28 0.28,-0.36 0.61,-0.56 -0.03,0.45 -0.24,0.81 -0.72,0.72 -0.67,-0.12 -0.63,-1.08 -0.02,-1.19 0.4,-0.07 0.34,0.13 0.52,-0.28 -1.6,-0.44 -1.75,1.54 -0.65,1.8 0.63,0.14 1.12,-0.22 1.19,-0.75 0.05,-0.39 -0.14,-0.53 -0.02,-0.77 0.12,-0.24 0.37,-0.27 0.39,-0.56 -0.4,-0.21 -0.93,0.77 -1.3,1.16 -0.12,-0.16 -0.29,-0.37 -0.46,-0.22z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 3.7 KiB |
@@ -1,14 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="17px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.35 0.5">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976967528752">
|
|
||||||
<path fill="currentColor" d="M0.13 0l0.09 0c0.03,0 0.05,0.02 0.06,0.04l0 0c0.05,0 0.07,0.04 0.07,0.09l0 0.3c0,0.05 -0.02,0.07 -0.07,0.07l-0.21 0c-0.05,0 -0.07,-0.02 -0.07,-0.07l0 -0.3c0,-0.05 0.02,-0.09 0.07,-0.09 0.01,-0.02 0.03,-0.04 0.06,-0.04zm0 0.05c-0.03,0.01 -0.02,0.04 0,0.05 0.01,0 0.08,0 0.09,0 0.02,-0.01 0.03,-0.04 0,-0.05 -0.01,0 -0.08,0 -0.09,0zm0.03 0.31c0,-0.02 0.01,-0.03 0.01,-0.03 0.01,0 0.04,0 0.05,0 0.02,0 0.06,-0.01 0.07,0.02 0,0.03 -0.03,0.03 -0.06,0.03 -0.03,0 -0.07,0 -0.07,-0.02zm-0.03 0c-0.02,0.05 -0.08,0.02 -0.07,-0.01 0.01,-0.05 0.08,-0.03 0.07,0.01zm0.03 -0.09c-0.01,-0.04 0.04,-0.04 0.05,-0.04 0.03,0 0.07,0 0.08,0.02 0.01,0.04 -0.04,0.03 -0.06,0.03 -0.02,0 -0.06,0.01 -0.07,-0.01zm-0.03 0c-0.02,0.04 -0.08,0.02 -0.07,-0.02 0.01,-0.02 0.02,-0.03 0.04,-0.02 0.02,0 0.03,0.02 0.03,0.04zm-0.07 -0.19c-0.03,0 -0.03,0.01 -0.03,0.04l0 0.28c0,0.08 -0.02,0.07 0.14,0.07 0.17,0 0.15,0.01 0.15,-0.07l0 -0.28c0,-0.03 0,-0.04 -0.03,-0.04 -0.01,0.02 -0.01,0.02 -0.02,0.04 -0.02,0.03 -0.06,0.03 -0.1,0.03 -0.03,0 -0.07,0 -0.09,-0.04 -0.01,-0.01 -0.01,-0.01 -0.02,-0.03z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.16 0.36c0,-0.02 0.01,-0.03 0.01,-0.03 0.01,0 0.04,0 0.05,0 0.02,0 0.06,-0.01 0.07,0.02 0,0.03 -0.03,0.03 -0.06,0.03 -0.03,0 -0.07,0 -0.07,-0.02zm-0.03 0c-0.02,0.05 -0.08,0.02 -0.07,-0.01 0.01,-0.05 0.08,-0.03 0.07,0.01zm0.03 -0.09c-0.01,-0.04 0.04,-0.04 0.05,-0.04 0.03,0 0.07,0 0.08,0.02 0.01,0.04 -0.04,0.03 -0.06,0.03 -0.02,0 -0.06,0.01 -0.07,-0.01zm-0.03 0c-0.02,0.04 -0.08,0.02 -0.07,-0.02 0.01,-0.02 0.02,-0.03 0.04,-0.02 0.02,0 0.03,0.02 0.03,0.04zm-0.07 -0.19c-0.03,0 -0.03,0.01 -0.03,0.04l0 0.28c0,0.08 -0.02,0.07 0.14,0.07 0.17,0 0.15,0.01 0.15,-0.07l0 -0.28c0,-0.03 0,-0.04 -0.03,-0.04 -0.01,0.02 -0.01,0.02 -0.02,0.04 -0.02,0.03 -0.06,0.03 -0.1,0.03 -0.03,0 -0.07,0 -0.09,-0.04 -0.01,-0.01 -0.01,-0.01 -0.02,-0.03z" />
|
|
||||||
<path fill="currentColor" d="M0.16 0.27c0.01,0.02 0.05,0.01 0.07,0.01 0.02,0 0.07,0.01 0.06,-0.03 -0.01,-0.02 -0.05,-0.02 -0.08,-0.02 -0.01,0 -0.06,0 -0.05,0.04z" />
|
|
||||||
<path fill="currentColor" d="M0.16 0.36c0,0.02 0.04,0.02 0.07,0.02 0.03,0 0.06,0 0.06,-0.03 -0.01,-0.03 -0.05,-0.02 -0.07,-0.02 -0.01,0 -0.04,0 -0.05,0 0,0 -0.01,0.01 -0.01,0.03z" />
|
|
||||||
<path fill="currentColor" d="M0.13 0.27c0,-0.02 -0.01,-0.04 -0.03,-0.04 -0.02,-0.01 -0.03,0 -0.04,0.02 -0.01,0.04 0.05,0.06 0.07,0.02z" />
|
|
||||||
<path fill="currentColor" d="M0.13 0.36c0.01,-0.04 -0.06,-0.06 -0.07,-0.01 -0.01,0.03 0.05,0.06 0.07,0.01z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.9 KiB |
@@ -1,18 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
||||||
<!-- Creator: CorelDRAW -->
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="26px" height="32px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
|
||||||
viewBox="0 0 10.49 12.9"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
|
||||||
<defs>
|
|
||||||
<linearGradient id="id0" gradientUnits="userSpaceOnUse" x1="-2.14" y1="10.86" x2="10.93" y2="-2.26">
|
|
||||||
<stop offset="0" stop-opacity="1" stop-color="#0E4251"/>
|
|
||||||
<stop offset="1" stop-opacity="1" stop-color="#2BAC90"/>
|
|
||||||
</linearGradient>
|
|
||||||
</defs>
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer"/>
|
|
||||||
<path fill="url(#id0)" d="M5.03 8.05c0.7,-0.05 0.51,-0.24 0.51,-0.29 -0.31,-0.16 -1.11,0.08 -1.34,0.24 0.23,0.05 0.55,0.07 0.83,0.05zm2.27 0.11c0.16,1 1.32,3.61 2.25,3.79 0.02,-0.52 -0.3,-0.49 -0.08,-0.79 0.26,0.02 0.19,-0.02 0.29,0.24 0.03,0.08 0.1,0.36 0.09,0.48 -0.02,0.33 -0.3,0.45 -0.61,0.31 -0.51,-0.23 -0.74,-0.68 -1.06,-1.15 -1.56,-2.36 -0.76,-3.29 -1.71,-3.4 0.14,1.47 1.94,4.57 3.03,4.92 1.07,0.34 0.68,-0.91 0.17,-1.73 -0.25,-0.39 -1,-1.43 -1.3,-1.72 -0.33,-0.33 -0.8,-0.86 -1.07,-0.95zm-3.9 -6.3c0.12,0.49 -0.99,0.67 -1,2.29 -0.01,1.04 0.57,1.73 1.16,2.12 0.42,0.27 0.69,0.5 1.17,0.15 0.27,-0.2 0.61,-0.54 0.79,-0.87 0.57,-1 0.45,-2.12 -0.29,-3.01 -0.12,-0.14 -0.26,-0.29 -0.43,-0.42 -0.26,-0.2 -0.71,-0.43 -1.16,-0.52 -0.79,-0.16 -0.81,0.03 -1.21,0.4 -0.22,0.21 -0.5,0.59 -0.67,0.94 -0.46,0.93 -0.37,1.6 0.11,2.51 0.38,0.74 0.97,1.39 1.92,1.31 -3.1,-1.56 -1.16,-5.01 -0.39,-4.9zm-1.6 0.42c0.21,-0.32 0.34,-0.47 0.58,-0.68 -0.77,0.09 -1.08,0.72 -1.09,1.55l0.51 -0.87zm4.38 4.86c0.15,-1.22 1.26,-3.56 0.06,-4.91 -0.09,-0.11 -0.21,-0.22 -0.29,-0.29 -0.12,-0.12 -0.18,-0.16 -0.32,-0.25 -0.54,-0.35 -1.19,-0.45 -1.9,-0.41 0.73,0.36 0.92,0.25 1.52,0.85 0.42,0.41 0.73,0.81 0.87,1.45 0.17,0.75 0.08,1.35 -0.25,1.99 -0.47,0.89 -0.72,0.83 -1.09,1.2l1.4 0.37zm0.78 0.37c0.09,-1.04 0.56,-1.43 0.85,-2.31 0.55,-1.72 -0.25,-3.42 -1.74,-4.34 -1.51,-0.95 -3.51,-0.56 -4.57,0.6 -0.53,0.58 -0.97,1.06 -1.13,2.02 -0.16,0.98 0.07,1.92 0.46,2.63 0.28,0.52 0.97,1.28 1.63,1.44 -0.18,-0.24 -0.79,-0.6 -1.15,-1.48 -0.44,-1.07 -0.13,-1.37 -0.27,-2.37 -0.13,-0.95 -0.05,-1.48 0.48,-2.03 0.22,-0.23 0.56,-0.37 0.94,-0.42 1.09,-0.14 0.43,-0.08 1.05,-0.24 1.21,-0.3 2.82,0.32 3.38,1.74 0.7,1.75 -0.34,2.91 -0.41,4.49 0.08,0.06 -0.02,0 0.13,0.09l0.35 0.18zm-5.57 -2.37c0.01,0.7 0.44,1.3 0.77,1.69 1.54,1.87 2.65,0.12 3.52,0.65 0.46,0.28 0.18,1.02 -1.22,0.85l-2.05 -0.46c-1.73,-0.58 -2.83,-2.82 -2.25,-4.79 0.39,-1.35 1.18,-2.11 2.3,-2.67 1.84,-0.93 4.02,-0.23 5.17,1.53 1.73,2.63 -0.46,4.39 -0.35,5.75 1.14,0.97 2.55,2.38 3.09,3.81 0.24,0.63 0.14,1.38 -0.58,1.4 -0.93,0.01 -1.99,-1.52 -2.4,-2.17 -0.74,-1.19 -0.93,-1.7 -1.25,-3.25 -2.06,-0.8 -2.25,-0.22 -3.06,-0.48 -0.82,-0.26 -1.51,-1.18 -1.69,-1.86z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 3.0 KiB |
@@ -1,12 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.51 0.51">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976456766784">
|
|
||||||
<path fill="currentColor" d="M0.15 0.06c0.04,-0.01 0.08,0 0.11,0.01 0.07,0.05 0.08,0.21 -0.05,0.24 -0.07,0.01 -0.15,-0.02 -0.16,-0.1 -0.01,-0.08 0.02,-0.14 0.1,-0.15zm0.12 0.28l0.01 -0.01c0.02,-0.01 0.04,-0.03 0.05,-0.05l0.01 0c0,-0.01 0,0 0,-0.01 0,-0.01 0.01,-0.03 0.02,-0.06 0,-0.02 0,-0.05 -0.01,-0.08 0,-0.04 -0.03,-0.07 -0.06,-0.1 -0.1,-0.07 -0.28,-0.02 -0.29,0.13 -0.01,0.14 0.08,0.21 0.21,0.2 0.03,-0.01 0.04,-0.01 0.06,-0.02z" />
|
|
||||||
<path fill="currentColor" d="M0.37 0.29c0,0 0.01,0 0,0 0,0 0,0 0,0 0,0.01 0,0.01 0,0.01 -0.01,0.02 0,0.03 0.01,0.04 0.02,0.01 0.07,0.04 0.08,0.06 0.02,0.05 -0.05,0.09 -0.08,0.04l-0.03 -0.04c-0.02,-0.03 -0.03,-0.04 -0.06,-0.03 0,0 0,0 0,0l0 0c0,0.01 0,0.01 0,0.01 -0.01,0.01 -0.01,0.02 0,0.03 0.02,0.02 0.05,0.07 0.06,0.08 0.04,0.03 0.1,0.03 0.14,0 0.03,-0.04 0.03,-0.1 0,-0.14 -0.02,-0.01 -0.06,-0.04 -0.08,-0.06 -0.01,-0.01 -0.02,-0.01 -0.04,0z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.27 0.34c0.01,0.01 0.02,0.02 0.02,0.03 0,0 0,0 0,0 0,0 0,0 0,0l0 0.01c0,0 0,0 0,-0.01l0 0c0,0 0,0 0,0 0.03,-0.01 0.04,0 0.06,0.03l0.03 0.04c0.03,0.05 0.1,0.01 0.08,-0.04 -0.01,-0.02 -0.06,-0.05 -0.08,-0.06 -0.01,-0.01 -0.02,-0.02 -0.01,-0.04 0,0 0,0 0,-0.01 0,0 0,0 0,0 0.01,0 0,0 0,0l0 0c0,0 0,0 0,0 0,0 0,0 0,0.01 -0.01,-0.01 -0.01,-0.01 -0.02,-0.02 0,0 -0.01,0 -0.01,-0.01 0,0.01 0,0 0,0.01l-0.01 0c-0.01,0.02 -0.03,0.04 -0.05,0.05l-0.01 0.01z" />
|
|
||||||
<path fill="currentColor" d="M0.16 0.11c-0.06,0.01 -0.06,0.07 -0.05,0.08 0,0.01 0.02,0.02 0.03,0.01 0.02,-0.01 0.01,-0.02 0.02,-0.03 0.01,-0.02 0.02,-0.01 0.03,-0.02 0.03,-0.01 0.02,-0.05 -0.03,-0.04z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.0 KiB |
@@ -1,12 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.63 0.63">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976451296560">
|
|
||||||
<g>
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.62 0.36c0.03,-0.17 -0.09,-0.33 -0.26,-0.36 -0.17,-0.02 -0.33,0.09 -0.36,0.26 -0.03,0.18 0.1,0.34 0.27,0.36 0.17,0.03 0.33,-0.09 0.35,-0.26z" />
|
|
||||||
<path fill="currentColor" d="M0.16 0.34l0.12 0c0.01,0 0.01,0.01 0.01,0.03 0,0.03 -0.01,0.08 0,0.1 0.01,0.01 0.03,0.02 0.04,0l0.1 -0.23c0.02,-0.05 0,-0.06 -0.05,-0.04 -0.03,0.01 -0.06,0.02 -0.09,0.04 -0.08,0.03 -0.18,0.06 -0.13,0.1z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 885 B |
@@ -1,11 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.85 0.85">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2940806952000">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.04 0.25c-0.03,0.03 -0.04,0.13 -0.04,0.19 0.01,0.32 0.37,0.53 0.67,0.33 0.09,-0.06 0.17,-0.19 0.18,-0.29l-0.01 0.02c-0.17,-0.05 -0.15,-0.04 -0.18,-0.13 -0.02,-0.05 -0.02,-0.08 0.03,-0.1 0.02,-0.01 0.09,-0.04 0.11,-0.04 -0.03,-0.07 -0.09,-0.13 -0.15,-0.17 -0.07,-0.04 -0.16,-0.06 -0.25,-0.06 0.03,0.07 0.08,0.1 0.02,0.17 -0.02,0.02 -0.03,0.04 0,0.08 0.02,0.03 0.04,0.04 0.01,0.07 -0.05,0.01 -0.1,-0.04 -0.13,0.02 -0.01,0.04 0.08,0.08 0.13,0.08 0.04,0.01 0.13,-0.01 0.15,0.07 0.02,0.09 -0.05,0.1 -0.08,0.14 -0.03,0.03 -0.03,0.13 -0.1,0.11 -0.03,0 -0.03,-0.05 -0.03,-0.08 0,-0.05 -0.01,-0.05 -0.03,-0.07 -0.05,-0.03 0.01,-0.12 -0.06,-0.16 -0.04,-0.02 -0.12,-0.03 -0.15,-0.06 -0.02,-0.02 -0.08,-0.1 -0.09,-0.12z" />
|
|
||||||
<path fill="currentColor" d="M0.04 0.25c0.01,0.02 0.07,0.1 0.09,0.12 0.03,0.03 0.11,0.04 0.15,0.06 0.07,0.04 0.01,0.13 0.06,0.16 0.02,0.02 0.03,0.02 0.03,0.07 0,0.03 0,0.08 0.03,0.08 0.07,0.02 0.07,-0.08 0.1,-0.11 0.03,-0.04 0.1,-0.05 0.08,-0.14 -0.02,-0.08 -0.11,-0.06 -0.15,-0.07 -0.05,0 -0.14,-0.04 -0.13,-0.08 0.03,-0.06 0.08,-0.01 0.13,-0.02 0.03,-0.03 0.01,-0.04 -0.01,-0.07 -0.03,-0.04 -0.02,-0.06 0,-0.08 0.06,-0.07 0.01,-0.1 -0.02,-0.17 -0.09,0 -0.17,0.04 -0.22,0.08 -0.04,0.03 -0.13,0.11 -0.14,0.17z" />
|
|
||||||
<path fill="currentColor" d="M0.85 0.48c-0.01,-0.05 0,-0.09 -0.01,-0.15 -0.01,-0.03 -0.02,-0.08 -0.04,-0.1 -0.02,0 -0.09,0.03 -0.11,0.04 -0.05,0.02 -0.05,0.05 -0.03,0.1 0.03,0.09 0.01,0.08 0.18,0.13l0.01 -0.02z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.9 KiB |
@@ -1,17 +0,0 @@
|
|||||||
<?xml version="1.0" encoding="UTF-8"?>
|
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
|
||||||
<!-- Creator: CorelDRAW -->
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="40px" height="48px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd"
|
|
||||||
viewBox="0 0 3.12 3.75"
|
|
||||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
|
||||||
xmlns:xodm="http://www.corel.com/coreldraw/odm/2003">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer"/>
|
|
||||||
<g id="_3032824761248">
|
|
||||||
<path fill="#275868" fill-opacity="0.501961" d="M0.15 3.75l2.82 0c-0.04,-0.02 -0.05,-0.01 -0.07,-0.06 -0.03,-0.07 0.07,-0.61 -0.41,-0.95 -0.07,-0.05 -0.23,-0.15 -0.33,-0.16 -0.04,0.04 -0.09,0.1 -0.14,0.15l-0.38 0.44c-0.07,0.06 -0.15,0.03 -0.19,-0.03l-0.38 -0.44c-0.04,-0.04 -0.08,-0.13 -0.15,-0.11 -0.29,0.06 -0.58,0.39 -0.66,0.72 -0.08,0.32 0.04,0.34 -0.11,0.44z"/>
|
|
||||||
<path fill="#275868" d="M2.22 1.1c0.07,0.41 -0.28,0.77 -0.66,0.77 -0.45,-0.01 -0.73,-0.44 -0.66,-0.78l1.32 0.01zm-1.32 -0.58c0.12,-0.06 0.26,-0.12 0.39,-0.18 0.25,-0.11 0.24,-0.13 0.39,-0.06 0.13,0.06 0.26,0.11 0.4,0.17 0.09,0.05 0.15,0.03 0.15,0.13 0,0.08 0,0.2 0,0.28 -0.07,0.01 -0.49,0.01 -0.56,0l0.01 -0.09 0.13 -0.02c0.05,-0.05 0.05,-0.16 0,-0.21l-0.13 -0.01c-0.01,-0.05 -0.01,-0.11 -0.03,-0.15 -0.04,-0.02 -0.14,-0.01 -0.18,0 -0.03,0.06 0,0.09 -0.03,0.14 -0.03,0.02 -0.09,0.01 -0.14,0.02 -0.03,0.07 -0.03,0.14 0,0.21 0.11,0.03 0.17,-0.03 0.15,0.11 -0.06,0.02 -0.48,0.01 -0.56,0l0.01 -0.34zm0.61 -0.52l-0.67 0.3c-0.15,0.06 -0.17,0.12 -0.17,0.31 0,0.52 -0.07,0.87 0.25,1.21 0.24,0.27 0.7,0.36 1.07,0.16 0.12,-0.06 0.18,-0.13 0.26,-0.22 0.18,-0.19 0.2,-0.45 0.2,-0.77 0,-0.15 0.01,-0.34 0,-0.48 -0.01,-0.15 -0.11,-0.19 -0.23,-0.24 -0.12,-0.05 -0.23,-0.1 -0.34,-0.15 -0.09,-0.04 -0.27,-0.14 -0.37,-0.12z"/>
|
|
||||||
<path fill="#275868" d="M0.15 3.75c0.15,-0.1 0.03,-0.12 0.11,-0.44 0.08,-0.33 0.37,-0.66 0.66,-0.72 0.07,-0.02 0.11,0.07 0.15,0.11l0.38 0.44c0.04,0.06 0.12,0.09 0.19,0.03l0.38 -0.44c0.05,-0.05 0.1,-0.11 0.14,-0.15 0.1,0.01 0.26,0.11 0.33,0.16 0.48,0.34 0.38,0.88 0.41,0.95 0.02,0.05 0.03,0.04 0.07,0.06 0.15,0 0.16,-0.04 0.15,-0.3 -0.01,-0.13 -0.05,-0.26 -0.09,-0.37 -0.15,-0.38 -0.49,-0.66 -0.87,-0.74 -0.13,-0.02 -0.13,0.04 -0.27,0.19 -0.02,0.03 -0.03,0.04 -0.05,0.06 -0.05,0.06 -0.24,0.29 -0.28,0.31 -0.07,-0.04 -0.34,-0.4 -0.43,-0.49 -0.09,-0.09 -0.12,-0.1 -0.33,-0.02 -0.31,0.12 -0.57,0.35 -0.7,0.68 -0.07,0.16 -0.12,0.43 -0.09,0.6 0.01,0.07 0.06,0.08 0.14,0.08z"/>
|
|
||||||
<path fill="#275868" fill-opacity="0.501961" d="M0.9 0.52l-0.01 0.34c0.08,0.01 0.5,0.02 0.56,0 0.02,-0.14 -0.04,-0.08 -0.15,-0.11 -0.03,-0.07 -0.03,-0.14 0,-0.21 0.05,-0.01 0.11,0 0.14,-0.02 0.03,-0.05 0,-0.08 0.03,-0.14 0.04,-0.01 0.14,-0.02 0.18,0 0.02,0.04 0.02,0.1 0.03,0.15l0.13 0.01c0.05,0.05 0.05,0.16 0,0.21l-0.13 0.02 -0.01 0.09c0.07,0.01 0.49,0.01 0.56,0 0,-0.08 0,-0.2 0,-0.28 0,-0.1 -0.06,-0.08 -0.15,-0.13 -0.14,-0.06 -0.27,-0.11 -0.4,-0.17 -0.15,-0.07 -0.14,-0.05 -0.39,0.06 -0.13,0.06 -0.27,0.12 -0.39,0.18z"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 3.1 KiB |
@@ -1,10 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.59 0.59">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976898771808">
|
|
||||||
<path fill="currentColor" d="M0.17 0.37c0.01,0 0,0 0.01,0.01 0.01,0 0.01,0 0.02,0.01 0.01,0.01 0.02,0.02 0.02,0.03 0.03,0.01 0.1,0.11 0.13,0.11 0.06,0.02 0.06,-0.11 0.05,-0.16 0.01,-0.01 0.1,-0.12 0.12,-0.13 0.01,0.01 0.03,0.03 0.06,0.01 0.04,-0.04 -0.05,-0.11 -0.09,-0.15 -0.04,-0.04 -0.12,-0.14 -0.15,-0.08 -0.02,0.03 0,0.04 0.01,0.06 -0.01,0.01 -0.08,0.07 -0.09,0.08 -0.04,0.03 -0.03,0.03 -0.06,0.02 -0.04,0 -0.12,0.01 -0.14,0.04 -0.01,0.03 0.01,0.04 0.02,0.06l0.08 0.07c0.01,0.02 0.01,0 0.01,0.02z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.17 0.37c-0.05,0.04 -0.11,0.11 -0.15,0.15 -0.05,0.05 0,0.1 0.06,0.05l0.14 -0.15c0,-0.01 -0.01,-0.02 -0.02,-0.03 -0.01,-0.01 -0.01,-0.01 -0.02,-0.01 -0.01,-0.01 0,-0.01 -0.01,-0.01z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1,10 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.64 0.64">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976811628848">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0 0.56c0.01,0.03 0.03,0.05 0.05,0.07 0.04,0.01 0.28,0.01 0.33,0.01 0.05,0 0.18,0.01 0.21,-0.02 0.02,-0.01 0.04,-0.03 0.05,-0.07 0,-0.02 0,-0.09 -0.01,-0.11 0,-0.03 -0.02,-0.06 -0.05,-0.07 -0.03,-0.01 -0.28,-0.01 -0.33,-0.01 -0.1,0 -0.24,-0.02 -0.25,0.09 0,0.02 0,0.1 0,0.11z" />
|
|
||||||
<path fill="currentColor" d="M0.56 0.14c0,-0.16 -0.09,-0.14 -0.24,-0.14 -0.06,0 -0.12,0 -0.18,0 -0.07,0 -0.11,0.01 -0.13,0.06 -0.01,0.03 -0.01,0.14 0,0.16 0.03,0.06 0.07,0.05 0.14,0.05 0.12,0 0.19,0.01 0.17,-0.2 0.15,0 0.17,-0.01 0.17,0.07 -0.03,0 -0.05,0 -0.07,0 -0.02,0.04 0.01,0.05 0.03,0.07 0.09,0.09 0.06,0.08 0.17,-0.02 0.05,-0.05 -0.02,-0.05 -0.06,-0.05z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.1 KiB |
@@ -1,11 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="23px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.9 0.84">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2940360262624">
|
|
||||||
<path fill="currentColor" d="M0.33 0.53c0.02,0.02 -0.01,0.05 0.03,0.07 0.02,0.02 0.15,0.02 0.17,0.01 0.04,-0.03 0.02,-0.05 0.03,-0.08 0.01,0 0.22,0 0.25,0 0,0.02 0,0.15 0,0.18 0,0.06 -0.03,0.04 -0.14,0.04l-0.53 0c-0.07,0 -0.06,-0.01 -0.06,-0.12 0,-0.11 -0.01,-0.1 0.03,-0.1l0.21 0c0.01,0 0.01,0 0.01,0zm0.48 -0.08c-0.03,0 -0.63,0 -0.69,0 -0.03,0 -0.04,0 -0.04,-0.02 0.01,-0.2 -0.02,-0.18 0.12,-0.18 0.19,0 0.39,0 0.57,0 0.02,0 0.03,0.01 0.04,0.03 0,0.01 0,0.15 0,0.17zm-0.47 -0.28c-0.01,-0.1 0.01,-0.08 0.07,-0.08 0.03,0 0.12,-0.01 0.14,0 0.01,0.02 0.01,0.06 0.01,0.08 -0.03,0 -0.21,0 -0.22,0zm-0.09 0c-0.06,0.01 -0.22,-0.04 -0.25,0.09 0,0.02 0,0.29 0,0.34 0,0.03 0,0.13 0.01,0.16 0.03,0.1 0.15,0.08 0.26,0.08 0.16,0 0.36,0 0.51,0 0.05,0 0.09,-0.04 0.1,-0.07 0.02,-0.04 0.01,-0.28 0.01,-0.34 0,-0.1 0.03,-0.23 -0.08,-0.26 -0.05,-0.01 -0.12,0 -0.17,0 -0.01,-0.07 0.02,-0.1 -0.03,-0.15 -0.04,-0.03 -0.11,-0.02 -0.16,-0.02 -0.05,0 -0.12,-0.01 -0.16,0.02 -0.05,0.05 -0.03,0.07 -0.04,0.15z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.33 0.53c0,0 0,0 -0.01,0l-0.21 0c-0.04,0 -0.03,-0.01 -0.03,0.1 0,0.11 -0.01,0.12 0.06,0.12l0.53 0c0.11,0 0.14,0.02 0.14,-0.04 0,-0.03 0,-0.16 0,-0.18 -0.03,0 -0.24,0 -0.25,0 -0.01,0.03 0.01,0.05 -0.03,0.08 -0.02,0.01 -0.15,0.01 -0.17,-0.01 -0.04,-0.02 -0.01,-0.05 -0.03,-0.07z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.81 0.45c0,-0.02 0,-0.16 0,-0.17 -0.01,-0.02 -0.02,-0.03 -0.04,-0.03 -0.18,0 -0.38,0 -0.57,0 -0.14,0 -0.11,-0.02 -0.12,0.18 0,0.02 0.01,0.02 0.04,0.02 0.06,0 0.66,0 0.69,0z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.9 KiB |
@@ -1,13 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="23px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.55 0.52">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2940953410368">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.21 0.18l0.08 0.13 -0.04 0c-0.01,0 -0.02,0 -0.03,0.02l-0.06 -0.12 0.03 0c0.01,0 0.02,-0.01 0.02,-0.02l0 -0.01z" />
|
|
||||||
<polygon fill="currentColor" fill-opacity="0.501961" points="0.21,0.07 0.34,0.07 0.34,0.13 0.21,0.13 " />
|
|
||||||
<rect fill="currentColor" width="0.21" height="0.21" rx="0.02" ry="0.02" />
|
|
||||||
<rect fill="currentColor" x="0.34" width="0.21" height="0.21" rx="0.02" ry="0.02" />
|
|
||||||
<rect fill="currentColor" x="0.22" y="0.31" width="0.21" height="0.21" rx="0.02" ry="0.02" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 972 B |
@@ -1,12 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="21px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.54 0.48">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976898797488">
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.07 0.4c-0.01,-0.03 0.01,-0.31 0,-0.37 -0.01,-0.04 -0.06,-0.04 -0.07,0l0 0.26c0,0.08 -0.01,0.17 0.07,0.18 0.03,0.01 0.3,0.01 0.37,0.01 0.04,0 0.1,0.01 0.1,-0.03 0.01,-0.05 -0.05,-0.04 -0.09,-0.04 -0.07,0 -0.35,0 -0.38,-0.01z" />
|
|
||||||
<path fill="currentColor" d="M0.23 0.16c-0.02,0 -0.03,0.01 -0.02,0.04 0,0.02 0.02,0.02 0.04,0.02 0.02,0 0.12,0 0.14,0 0.03,-0.01 0.04,-0.07 -0.03,-0.07 -0.03,0 -0.12,0 -0.13,0.01z" />
|
|
||||||
<path fill="currentColor" d="M0.16 0.04c-0.04,0.01 -0.03,0.06 0.01,0.06 0.01,0 0.1,0 0.11,0 0.04,-0.01 0.04,-0.06 -0.01,-0.07 -0.01,0 -0.1,0 -0.11,0.01z" />
|
|
||||||
<path fill="currentColor" d="M0.4 0.27c-0.02,0.01 -0.02,0.02 -0.03,0.03 0,0.02 0.01,0.03 0.02,0.04 0.01,0 0.08,0 0.1,0 0.03,-0.01 0.03,-0.05 0,-0.06 -0.01,-0.01 -0.08,-0.01 -0.09,-0.01z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1,10 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.48 0.48">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976972387648">
|
|
||||||
<path fill="currentColor" d="M0.27 0.24l-0.01 -0.01c0,-0.03 -0.01,-0.05 -0.02,-0.07 -0.01,-0.01 -0.02,-0.02 -0.02,-0.03 -0.03,-0.03 -0.06,-0.05 -0.12,-0.07 -0.01,0 -0.07,0 -0.08,0 -0.04,0.02 -0.01,0.11 0.01,0.14 0.01,0.02 0.01,0.02 0.03,0.03l0.01 0.02c0.03,0.02 0.06,0.04 0.1,0.04 0.01,0.01 0.03,0.01 0.04,0.01 0,0.01 0,0.1 0,0.12 0,0.02 -0.01,0.04 0.01,0.05 0.01,0.01 0.03,0.01 0.04,0 0.01,-0.01 0.01,-0.04 0.01,-0.05l0 -0.18z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.22 0.13c0,0.01 0.01,0.02 0.02,0.03 0.01,0.02 0.02,0.04 0.02,0.07l0.01 0.01c0.01,-0.01 0.06,0.01 0.13,-0.05 0.04,-0.03 0.08,-0.09 0.08,-0.16 0,-0.02 -0.01,-0.03 -0.03,-0.03 -0.01,0 -0.04,0 -0.05,0 -0.05,0 -0.08,0.02 -0.11,0.04 -0.02,0.02 -0.04,0.04 -0.05,0.06 -0.01,0.01 -0.01,0.03 -0.02,0.03z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1,12 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="20px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.51 0.43">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976811563136">
|
|
||||||
<path fill="currentColor" d="M0 0.4c0,0.01 0.02,0.02 0.03,0.03l0.17 0c0.02,0 0.03,0 0.05,-0.02 0.01,-0.01 0.01,-0.02 0.01,-0.04 0,-0.04 -0.01,-0.07 -0.03,-0.09 -0.02,-0.02 -0.04,-0.04 -0.07,-0.05 -0.06,-0.02 -0.12,0.01 -0.15,0.07 0,0.01 -0.01,0.03 -0.01,0.04 0,0.01 0,0.05 0,0.06z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.28 0.28c0.03,0.08 0,0.1 0.03,0.12 0,0 0.01,0.01 0.01,0.01 0.04,0.02 0.09,0.02 0.14,-0.01 0.01,0 0.02,-0.01 0.02,-0.02 0.02,-0.03 0.03,-0.05 0.03,-0.09 0,-0.03 0,-0.06 -0.05,-0.06 -0.04,0 -0.13,-0.01 -0.17,0 -0.01,0 -0.03,0.01 -0.03,0.02l0.02 0.03z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.3 0.09c0,0.05 0.04,0.08 0.09,0.08 0.05,0 0.08,-0.04 0.08,-0.09 -0.01,-0.05 -0.05,-0.09 -0.09,-0.08 -0.05,0.01 -0.09,0.04 -0.08,0.09z" />
|
|
||||||
<path fill="currentColor" d="M0.04 0.1c0.01,0.04 0.05,0.08 0.1,0.07 0.04,-0.01 0.08,-0.05 0.07,-0.1 0,-0.04 -0.04,-0.08 -0.09,-0.07 -0.05,0.01 -0.08,0.05 -0.08,0.1z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 1.4 KiB |
@@ -1,11 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="24px" height="21px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.63 0.56">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976885520304">
|
|
||||||
<path fill="currentColor" d="M0.33 0.3c0.04,-0.01 0.05,0.05 0.01,0.06 -0.02,0.01 -0.04,-0.01 -0.04,-0.02 -0.01,-0.02 0.01,-0.04 0.03,-0.04zm-0.22 0.03c0.01,-0.01 0.13,-0.08 0.14,-0.09 0.02,-0.01 0.12,-0.08 0.14,-0.09 0,0.01 0.05,0.09 0.05,0.09 -0.01,0.01 -0.03,0.02 -0.04,0.03 -0.02,-0.01 -0.03,-0.02 -0.05,-0.03 -0.04,0 -0.08,0.02 -0.09,0.05 -0.02,0.03 -0.01,0.03 -0.01,0.06 -0.01,0.01 -0.09,0.05 -0.1,0.05 0,-0.01 -0.04,-0.07 -0.04,-0.07zm0.31 -0.23c0,-0.01 0.06,-0.04 0.06,-0.04 0.01,0.01 0.09,0.15 0.09,0.15 -0.01,0.01 -0.06,0.04 -0.07,0.04 -0.01,-0.03 -0.03,-0.05 -0.04,-0.08 -0.01,-0.01 -0.04,-0.06 -0.04,-0.07zm-0.06 0.01l-0.3 0.18c-0.02,0.02 0,0.05 0,0.06 -0.01,0.01 -0.04,0.02 -0.05,0.03 -0.02,0.02 0,0.04 0.01,0.05 0.01,0.02 0.02,0.05 0.04,0.04 0.02,0 0.04,-0.02 0.06,-0.03 0.02,0.03 0.04,0.02 0.07,0 0.01,0 0.06,-0.03 0.07,-0.03l-0.05 0.11c0,0.02 0.01,0.04 0.02,0.04 0.02,0 0.03,-0.01 0.03,-0.03 0.02,-0.03 0.04,-0.09 0.05,-0.11l0.04 0c0.01,0 0.04,0.08 0.04,0.09 0.01,0.02 0.02,0.04 0.03,0.05 0.02,0 0.04,-0.01 0.04,-0.04l-0.05 -0.12c-0.01,-0.01 -0.01,-0.01 0,-0.02 0.01,-0.03 0.01,-0.04 0.01,-0.06l0.05 -0.03c0.01,0.01 0.01,0.02 0.03,0.02 0.01,0 0.1,-0.05 0.11,-0.06 0.03,-0.02 0.02,-0.04 0.01,-0.07 -0.02,-0.02 -0.03,-0.05 -0.05,-0.07 -0.01,-0.02 -0.05,-0.09 -0.06,-0.1 -0.01,-0.01 -0.02,-0.01 -0.04,-0.01l-0.1 0.07c-0.02,0.01 -0.01,0.01 -0.01,0.04z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.11 0.33c0,0 0.04,0.06 0.04,0.07 0.01,0 0.09,-0.04 0.1,-0.05 0,-0.03 -0.01,-0.03 0.01,-0.06 0.01,-0.03 0.05,-0.05 0.09,-0.05 0.02,0.01 0.03,0.02 0.05,0.03 0.01,-0.01 0.03,-0.02 0.04,-0.03 0,0 -0.05,-0.08 -0.05,-0.09 -0.02,0.01 -0.12,0.08 -0.14,0.09 -0.01,0.01 -0.13,0.08 -0.14,0.09z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.42 0.1c0,0.01 0.03,0.06 0.04,0.07 0.01,0.03 0.03,0.05 0.04,0.08 0.01,0 0.06,-0.03 0.07,-0.04 0,0 -0.08,-0.14 -0.09,-0.15 0,0 -0.06,0.03 -0.06,0.04z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.3 KiB |
@@ -1,15 +0,0 @@
|
|||||||
<?xml version='1.0' encoding='utf-8'?>
|
|
||||||
<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="18px" height="24px" version="1.1" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 0.34 0.45">
|
|
||||||
<g id="Capa_x0020_1">
|
|
||||||
<metadata id="CorelCorpID_0Corel-Layer" />
|
|
||||||
<g id="_2976972917408">
|
|
||||||
<path fill="currentColor" d="M0.26 0.41c-0.05,0 -0.12,0 -0.18,0 -0.01,0 -0.01,-0.01 -0.01,-0.02 0,-0.04 0,-0.18 0,-0.21 0.01,0 0.18,0 0.19,0 0.01,0.01 0.01,0.22 0,0.23zm-0.26 -0.23c0.01,0 0.02,0 0.03,0 0,0.03 0,0.18 0,0.22 0,0.01 0,0 -0.03,0.01l0 0.04 0.33 0c0.01,-0.02 0.01,-0.03 0.01,-0.04 -0.03,-0.01 -0.03,0 -0.03,-0.01 0,-0.06 0,-0.16 0,-0.22l0.02 0c0.01,-0.01 0.01,-0.03 0.01,-0.04l-0.34 0 0 0.04z" />
|
|
||||||
<path fill="currentColor" fill-opacity="0.501961" d="M0.1 0.29c0,-0.01 0.01,-0.01 0.02,-0.02 0,0 0,-0.01 0.01,-0.01l0.03 -0.03c0.02,-0.02 0.02,-0.02 0.04,-0.02 0,0.02 -0.02,0.05 -0.02,0.07l0.06 0 0 0.02 -0.07 0.07c-0.01,0.01 -0.01,0.01 -0.04,0.01 0.01,-0.02 0.02,-0.05 0.02,-0.07 -0.06,0 -0.05,0 -0.05,-0.02zm0.16 0.12c0.01,-0.01 0.01,-0.22 0,-0.23 -0.01,0 -0.18,0 -0.19,0 0,0.03 0,0.17 0,0.21 0,0.01 0,0.02 0.01,0.02 0.06,0 0.13,0 0.18,0z" />
|
|
||||||
<path fill="currentColor" d="M0.1 0.29c0,0.02 -0.01,0.02 0.05,0.02 0,0.02 -0.01,0.05 -0.02,0.07 0.03,0 0.03,0 0.04,-0.01l0.07 -0.07 0 -0.02 -0.06 0c0,-0.02 0.02,-0.05 0.02,-0.07 -0.02,0 -0.02,0 -0.04,0.02l-0.03 0.03c-0.01,0 -0.01,0.01 -0.01,0.01 -0.01,0.01 -0.02,0.01 -0.02,0.02z" />
|
|
||||||
<path fill="currentColor" d="M0.08 0.03c-0.01,0 -0.03,0 -0.04,0 0,0 0,0.02 0,0.02 0.01,0.01 0.05,0.01 0.06,0.01 0.01,0 0.05,0 0.05,-0.01 0.01,0 0.01,-0.02 0,-0.02 0,-0.01 -0.02,0 -0.03,0l0 -0.03 -0.04 0 0 0.03z" />
|
|
||||||
<path fill="currentColor" d="M0.22 0.03c-0.02,0 -0.05,-0.02 -0.04,0.03 0.01,0 0.1,0 0.11,0 0.01,-0.01 0.01,-0.02 0,-0.03 0,-0.01 -0.01,0 -0.03,0l0 -0.03 -0.04 0 0 0.03z" />
|
|
||||||
<path fill="currentColor" d="M0.04 0.09l0 0.02c0.02,0 0.09,0 0.11,0 0.01,-0.03 0,-0.03 -0.01,-0.03l-0.09 0c-0.01,0 -0.01,0 -0.01,0.01z" />
|
|
||||||
<path fill="currentColor" d="M0.18 0.09l0 0.02c0.02,0 0.09,0 0.11,0l0 -0.02c0,-0.01 0,-0.01 -0.01,-0.01l-0.09 0c-0.01,0 -0.01,0 -0.01,0.01z" />
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1.8 MiB |
Binary file not shown.
|
Before Width: | Height: | Size: 593 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 565 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 638 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 277 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 50 KiB |
@@ -1,110 +0,0 @@
|
|||||||
import os
|
|
||||||
import xml.etree.ElementTree as ET
|
|
||||||
from pathlib import Path
|
|
||||||
import shutil
|
|
||||||
|
|
||||||
def convertir_a_current_color(archivo_entrada, archivo_salida=None, backup=True):
|
|
||||||
"""
|
|
||||||
Convierte todos los colores fijos en un SVG a currentColor.
|
|
||||||
Preserva las opacidades y transparencias.
|
|
||||||
"""
|
|
||||||
|
|
||||||
if archivo_salida is None:
|
|
||||||
path = Path(archivo_entrada)
|
|
||||||
archivo_salida = path.parent / f"{path.stem}_color{path.suffix}"
|
|
||||||
|
|
||||||
try:
|
|
||||||
# Leer el archivo
|
|
||||||
with open(archivo_entrada, 'r', encoding='utf-8') as f:
|
|
||||||
contenido = f.read()
|
|
||||||
|
|
||||||
# Parsear XML
|
|
||||||
tree = ET.ElementTree(ET.fromstring(contenido))
|
|
||||||
root = tree.getroot()
|
|
||||||
|
|
||||||
# Registrar namespace
|
|
||||||
ET.register_namespace('', 'http://www.w3.org/2000/svg')
|
|
||||||
|
|
||||||
# Procesar TODOS los elementos con fill o stroke
|
|
||||||
elementos_modificados = 0
|
|
||||||
|
|
||||||
for elem in root.iter():
|
|
||||||
# Procesar fill
|
|
||||||
if 'fill' in elem.attrib:
|
|
||||||
fill = elem.get('fill')
|
|
||||||
# Si no es none, ni currentColor, ni url(), reemplazar
|
|
||||||
if fill and fill.lower() not in ['none', 'currentcolor'] and not fill.startswith('url'):
|
|
||||||
elem.set('fill', 'currentColor')
|
|
||||||
elementos_modificados += 1
|
|
||||||
|
|
||||||
# Procesar stroke
|
|
||||||
if 'stroke' in elem.attrib:
|
|
||||||
stroke = elem.get('stroke')
|
|
||||||
if stroke and stroke.lower() not in ['none', 'currentcolor'] and not stroke.startswith('url'):
|
|
||||||
elem.set('stroke', 'currentColor')
|
|
||||||
elementos_modificados += 1
|
|
||||||
|
|
||||||
# Limpiar metadata innecesaria (opcional)
|
|
||||||
for metadata in root.findall('.//metadata'):
|
|
||||||
parent = root.find('.//g') or root
|
|
||||||
if parent is not None:
|
|
||||||
parent.remove(metadata)
|
|
||||||
|
|
||||||
# Guardar el archivo
|
|
||||||
tree.write(archivo_salida, encoding='utf-8', xml_declaration=True)
|
|
||||||
|
|
||||||
print(f"✅ {Path(archivo_entrada).name} → {elementos_modificados} elementos convertidos")
|
|
||||||
return True
|
|
||||||
|
|
||||||
except Exception as e:
|
|
||||||
print(f"❌ Error con {archivo_entrada}: {str(e)}")
|
|
||||||
return False
|
|
||||||
|
|
||||||
def procesar_carpeta(carpeta):
|
|
||||||
"""
|
|
||||||
Procesa todos los SVG en una carpeta
|
|
||||||
"""
|
|
||||||
carpeta_path = Path(carpeta)
|
|
||||||
|
|
||||||
if not carpeta_path.exists():
|
|
||||||
print(f"❌ La carpeta {carpeta} no existe")
|
|
||||||
return
|
|
||||||
|
|
||||||
# Buscar todos los SVG (excepto los que ya tienen _color)
|
|
||||||
archivos = [f for f in carpeta_path.glob('*.svg') if '_color' not in f.name]
|
|
||||||
|
|
||||||
if not archivos:
|
|
||||||
print(f"⚠️ No se encontraron archivos SVG en {carpeta}")
|
|
||||||
return
|
|
||||||
|
|
||||||
print(f"🔍 Encontrados {len(archivos)} archivos")
|
|
||||||
print("=" * 50)
|
|
||||||
|
|
||||||
# Crear carpeta de backup
|
|
||||||
backup_dir = carpeta_path / 'backup_originales'
|
|
||||||
backup_dir.mkdir(exist_ok=True)
|
|
||||||
|
|
||||||
for archivo in archivos:
|
|
||||||
# Hacer backup
|
|
||||||
shutil.copy2(archivo, backup_dir / archivo.name)
|
|
||||||
|
|
||||||
# Generar nombre de salida (sobrescribir el original o crear nuevo)
|
|
||||||
# Opción 1: Sobrescribir el original (CUIDADO)
|
|
||||||
# salida = archivo
|
|
||||||
|
|
||||||
# Opción 2: Crear nuevo archivo con sufijo _color (RECOMENDADO)
|
|
||||||
salida = archivo.parent / f"{archivo.stem}_color{archivo.suffix}"
|
|
||||||
|
|
||||||
convertir_a_current_color(str(archivo), str(salida))
|
|
||||||
|
|
||||||
print("=" * 50)
|
|
||||||
print(f"💾 Backups guardados en: {backup_dir}")
|
|
||||||
print(f"📁 Archivos convertidos con sufijo '_color'")
|
|
||||||
|
|
||||||
# ============= EJECUTAR =============
|
|
||||||
|
|
||||||
if __name__ == "__main__":
|
|
||||||
# Cambia esta ruta a tu carpeta de iconos
|
|
||||||
CARPETA = "./iconos" # Tu ruta
|
|
||||||
|
|
||||||
procesar_carpeta(CARPETA)
|
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
@@ -0,0 +1,548 @@
|
|||||||
|
.animacion-infinito {
|
||||||
|
width: 80%;
|
||||||
|
min-width: 600px;
|
||||||
|
max-width: 1000px;
|
||||||
|
aspect-ratio: 2 / 1;
|
||||||
|
position: relative;
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.capa-svg-lineas {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 1;
|
||||||
|
/* Fuerza al navegador a usar la Tarjeta Gráfica (GPU) */
|
||||||
|
transform: translateZ(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.capa-html-nodos {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 10;
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nodo-circulo {
|
||||||
|
position: absolute;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15), inset 0 -4px 10px rgba(0,0,0,0.1);
|
||||||
|
transform: translate(-50%, -50%);
|
||||||
|
pointer-events: auto;
|
||||||
|
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||||
|
overflow: hidden;
|
||||||
|
background-color: #fff; /* Fondo por si usas logos PNG transparentes */
|
||||||
|
}
|
||||||
|
|
||||||
|
.nodo-circulo:hover {
|
||||||
|
transform: translate(-50%, -55%) scale(1.05);
|
||||||
|
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Estilos para insertar logos como pediste */
|
||||||
|
.nodo-contenido {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nodo-contenido img {
|
||||||
|
width: 70%; /* Ajusta el tamaño de tu logo aquí */
|
||||||
|
height: 70%;
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Estilos de las líneas base SVG */
|
||||||
|
.linea-base {
|
||||||
|
fill: none;
|
||||||
|
stroke-width: 1.5;
|
||||||
|
opacity: 0.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Estilo de los Pulsos */
|
||||||
|
.linea-pulso {
|
||||||
|
fill: none;
|
||||||
|
stroke: #ffffff;
|
||||||
|
stroke-width: 6;
|
||||||
|
stroke-linecap: round;
|
||||||
|
stroke-dasharray: 0 2000;
|
||||||
|
filter: drop-shadow(0 0 3px rgba(255, 255, 255, 1)) drop-shadow(0 0 8px rgba(255, 255, 255, 0.8));
|
||||||
|
opacity: 1;
|
||||||
|
/* Le avisa al navegador que esto es lo único que se va a animar */
|
||||||
|
will-change: stroke-dashoffset;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ==========================================================================
|
||||||
|
ECOSISTEMA IDE — Sección con 4 tarjetas y paneles expandibles in-place
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
/* ---------- Variables locales por unidad ---------- */
|
||||||
|
.ecosistema-section {
|
||||||
|
--unit: var(--ide-primary);
|
||||||
|
--unit-dark: var(--ide-primary-dark);
|
||||||
|
--unit-soft: rgba(30, 74, 94, 0.10);
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel--excellence,
|
||||||
|
.eco-card--excellence,
|
||||||
|
.eco-pill--excellence { --unit: var(--ide-excellence); --unit-dark: var(--ide-excellence-dark); --unit-soft: rgba(0, 158, 143, 0.10); }
|
||||||
|
|
||||||
|
.eco-panel--projects,
|
||||||
|
.eco-card--projects,
|
||||||
|
.eco-pill--projects { --unit: var(--ide-projects); --unit-dark: var(--ide-projects-dark); --unit-soft: rgba(242, 140, 43, 0.10); }
|
||||||
|
|
||||||
|
.eco-panel--digital,
|
||||||
|
.eco-card--digital,
|
||||||
|
.eco-pill--digital { --unit: var(--ide-digital); --unit-dark: var(--ide-digital-dark); --unit-soft: rgba(29, 113, 184, 0.10); }
|
||||||
|
|
||||||
|
.eco-panel--academy,
|
||||||
|
.eco-card--academy,
|
||||||
|
.eco-pill--academy { --unit: var(--ide-academy); --unit-dark: var(--ide-academy-dark); --unit-soft: rgba(200, 16, 46, 0.10); }
|
||||||
|
|
||||||
|
/* ---------- Header del ecosistema ---------- */
|
||||||
|
.eco-header {
|
||||||
|
text-align: center;
|
||||||
|
max-width: 820px;
|
||||||
|
margin: 0 auto 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-header__lead {
|
||||||
|
margin: 1rem auto 0;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ---------- Grid de 4 tarjetas ---------- */
|
||||||
|
.eco-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(4, 1fr);
|
||||||
|
gap: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-card {
|
||||||
|
position: relative;
|
||||||
|
border-radius: var(--radius-lg);
|
||||||
|
overflow: hidden;
|
||||||
|
background: var(--bg-surface);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-card:hover {
|
||||||
|
transform: translateY(-6px);
|
||||||
|
border-color: var(--unit);
|
||||||
|
box-shadow: 0 18px 40px -18px color-mix(in srgb, var(--unit) 45%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-card__btn {
|
||||||
|
all: unset;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-start;
|
||||||
|
gap: .85rem;
|
||||||
|
padding: 2rem 1.6rem 1.75rem;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-card__btn:focus-visible {
|
||||||
|
outline: 2px solid var(--unit);
|
||||||
|
outline-offset: -4px;
|
||||||
|
border-radius: var(--radius-lg);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Ícono circular */
|
||||||
|
.eco-card__icon-wrap {
|
||||||
|
width: 64px;
|
||||||
|
height: 64px;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: grid;
|
||||||
|
place-items: center;
|
||||||
|
background: var(--unit-soft);
|
||||||
|
color: var(--unit);
|
||||||
|
border: 1px solid color-mix(in srgb, var(--unit) 35%, transparent);
|
||||||
|
transition: background .35s ease, transform .35s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-card:hover .eco-card__icon-wrap {
|
||||||
|
background: var(--unit);
|
||||||
|
color: #fff;
|
||||||
|
transform: scale(1.06);
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-card__icon { font-size: 1.5rem; }
|
||||||
|
|
||||||
|
.eco-card__badge {
|
||||||
|
font-family: 'Bebas Neue', sans-serif;
|
||||||
|
letter-spacing: .32em;
|
||||||
|
font-size: .85rem;
|
||||||
|
color: var(--unit);
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-card__title {
|
||||||
|
font-family: 'Barlow Semi Condensed', sans-serif;
|
||||||
|
font-size: 1.25rem;
|
||||||
|
line-height: 1.2;
|
||||||
|
color: var(--text-main);
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-card__text {
|
||||||
|
font-size: .9rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
line-height: 1.55;
|
||||||
|
margin: 0 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-card__cta {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: .5rem;
|
||||||
|
font-family: 'Barlow Condensed', sans-serif;
|
||||||
|
font-weight: 600;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: .06em;
|
||||||
|
font-size: .9rem;
|
||||||
|
color: var(--unit);
|
||||||
|
margin-top: .5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-card__cta i { transition: transform .3s ease; }
|
||||||
|
.eco-card:hover .eco-card__cta i { transform: translateX(5px); }
|
||||||
|
|
||||||
|
/* Curva decorativa inferior por tarjeta */
|
||||||
|
.eco-card::after {
|
||||||
|
content: "";
|
||||||
|
position: absolute;
|
||||||
|
inset: auto -20% -40% -20%;
|
||||||
|
height: 60%;
|
||||||
|
background: radial-gradient(closest-side, var(--unit-soft), transparent 70%);
|
||||||
|
pointer-events: none;
|
||||||
|
opacity: .8;
|
||||||
|
transition: opacity .35s ease;
|
||||||
|
}
|
||||||
|
.eco-card:hover::after { opacity: 1; }
|
||||||
|
|
||||||
|
/* ==========================================================================
|
||||||
|
ESTADO UNIDAD
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
.eco-state--unit {
|
||||||
|
position: relative;
|
||||||
|
animation: ecoFadeIn .45s ease both;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes ecoFadeIn {
|
||||||
|
from { opacity: 0; transform: translateY(12px); }
|
||||||
|
to { opacity: 1; transform: translateY(0); }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ---------- Topbar (volver + pills) ---------- */
|
||||||
|
.eco-unit__topbar {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
gap: 1rem;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-unit__back {
|
||||||
|
all: unset;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: .55rem;
|
||||||
|
padding: .55rem 1rem;
|
||||||
|
border-radius: var(--radius-full);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
background: var(--bg-surface);
|
||||||
|
color: var(--text-body);
|
||||||
|
cursor: pointer;
|
||||||
|
font-family: 'Barlow Condensed', sans-serif;
|
||||||
|
font-weight: 600;
|
||||||
|
letter-spacing: .05em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-size: .9rem;
|
||||||
|
transition: all .25s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-unit__back:hover {
|
||||||
|
border-color: var(--unit);
|
||||||
|
color: var(--unit);
|
||||||
|
transform: translateX(-3px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-unit__nav {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: .5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-pill {
|
||||||
|
all: unset;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: .4rem;
|
||||||
|
padding: .45rem 1rem;
|
||||||
|
border-radius: var(--radius-full);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
background: var(--bg-surface);
|
||||||
|
color: var(--text-body);
|
||||||
|
font-family: 'Barlow Condensed', sans-serif;
|
||||||
|
font-weight: 600;
|
||||||
|
letter-spacing: .05em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
font-size: .85rem;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all .25s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-pill:hover,
|
||||||
|
.eco-pill.is-active {
|
||||||
|
background: var(--unit);
|
||||||
|
border-color: var(--unit);
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ---------- Panel de unidad ---------- */
|
||||||
|
.eco-panel {
|
||||||
|
position: relative;
|
||||||
|
border-radius: var(--radius-lg);
|
||||||
|
overflow: hidden;
|
||||||
|
background: var(--bg-surface);
|
||||||
|
border: 1px solid var(--border-color);
|
||||||
|
padding: clamp(2rem, 4vw, 3rem);
|
||||||
|
isolation: isolate;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Fondo con curvas SVG teñidas por el color de la unidad */
|
||||||
|
.eco-panel__bg {
|
||||||
|
position: absolute;
|
||||||
|
inset: 0;
|
||||||
|
z-index: 0;
|
||||||
|
pointer-events: none;
|
||||||
|
color: var(--unit);
|
||||||
|
opacity: .12;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__bg svg {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__bg path {
|
||||||
|
fill: none;
|
||||||
|
stroke: currentColor;
|
||||||
|
stroke-width: 1.4;
|
||||||
|
stroke-linecap: round;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__bg path:nth-child(1) { opacity: .9; }
|
||||||
|
.eco-panel__bg path:nth-child(2) { opacity: .5; }
|
||||||
|
|
||||||
|
/* Grid principal del panel */
|
||||||
|
.eco-panel__grid {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1.1fr 1fr;
|
||||||
|
gap: 2.5rem;
|
||||||
|
align-items: start;
|
||||||
|
margin-bottom: 2.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__brand {
|
||||||
|
display: inline-block;
|
||||||
|
font-family: 'Bebas Neue', sans-serif;
|
||||||
|
letter-spacing: .32em;
|
||||||
|
font-size: 1rem;
|
||||||
|
color: var(--unit);
|
||||||
|
margin-bottom: .75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__title {
|
||||||
|
font-family: 'Barlow Semi Condensed', sans-serif;
|
||||||
|
font-size: clamp(1.8rem, 3vw, 2.4rem);
|
||||||
|
line-height: 1.15;
|
||||||
|
color: var(--text-main);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__lead {
|
||||||
|
font-size: 1.02rem;
|
||||||
|
color: var(--text-body);
|
||||||
|
line-height: 1.65;
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
max-width: 52ch;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__cta {
|
||||||
|
background-color: var(--unit);
|
||||||
|
border-color: var(--unit);
|
||||||
|
}
|
||||||
|
.eco-panel__cta:hover {
|
||||||
|
background-color: var(--unit-dark);
|
||||||
|
border-color: var(--unit-dark);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Lista lateral de capacidades */
|
||||||
|
.eco-panel__side {
|
||||||
|
background: color-mix(in srgb, var(--unit) 5%, var(--bg-surface));
|
||||||
|
border: 1px solid color-mix(in srgb, var(--unit) 22%, var(--border-color));
|
||||||
|
border-radius: var(--radius-md);
|
||||||
|
padding: 1.5rem 1.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__side-title {
|
||||||
|
font-family: 'Barlow Condensed', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: .08em;
|
||||||
|
font-size: .95rem;
|
||||||
|
color: var(--unit);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__list {
|
||||||
|
list-style: none;
|
||||||
|
display: grid;
|
||||||
|
gap: .9rem;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__list li {
|
||||||
|
display: flex;
|
||||||
|
gap: .75rem;
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__li-icon {
|
||||||
|
flex-shrink: 0;
|
||||||
|
width: 34px;
|
||||||
|
height: 34px;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: grid;
|
||||||
|
place-items: center;
|
||||||
|
background: var(--unit-soft);
|
||||||
|
color: var(--unit);
|
||||||
|
font-size: .85rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__list strong {
|
||||||
|
display: block;
|
||||||
|
font-family: 'Barlow Condensed', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
font-size: 1rem;
|
||||||
|
color: var(--text-main);
|
||||||
|
letter-spacing: .02em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__list p {
|
||||||
|
font-size: .85rem;
|
||||||
|
color: var(--text-muted);
|
||||||
|
line-height: 1.45;
|
||||||
|
margin: .1rem 0 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Franja inferior con minicards */
|
||||||
|
.eco-panel__strip {
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
border-top: 1px solid color-mix(in srgb, var(--unit) 20%, var(--border-color));
|
||||||
|
padding-top: 1.75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__strip-title {
|
||||||
|
font-family: 'Barlow Semi Condensed', sans-serif;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
color: var(--text-main);
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-panel__strip-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(4, 1fr);
|
||||||
|
gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-mini {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: .65rem;
|
||||||
|
padding: .85rem 1rem;
|
||||||
|
border-radius: var(--radius-md);
|
||||||
|
background: color-mix(in srgb, var(--unit) 6%, var(--bg-surface));
|
||||||
|
border: 1px solid color-mix(in srgb, var(--unit) 18%, var(--border-color));
|
||||||
|
font-family: 'Barlow Condensed', sans-serif;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: .92rem;
|
||||||
|
color: var(--text-main);
|
||||||
|
letter-spacing: .02em;
|
||||||
|
transition: transform .25s ease, border-color .25s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-mini:hover {
|
||||||
|
transform: translateY(-3px);
|
||||||
|
border-color: var(--unit);
|
||||||
|
}
|
||||||
|
|
||||||
|
.eco-mini i {
|
||||||
|
color: var(--unit);
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ==========================================================================
|
||||||
|
RESPONSIVE (desktop-first, degradación limpia)
|
||||||
|
========================================================================== */
|
||||||
|
|
||||||
|
@media (max-width: 1100px) {
|
||||||
|
.eco-grid { grid-template-columns: repeat(2, 1fr); }
|
||||||
|
.eco-panel__grid { grid-template-columns: 1fr; gap: 1.75rem; }
|
||||||
|
.eco-panel__strip-grid { grid-template-columns: repeat(2, 1fr); }
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 640px) {
|
||||||
|
.eco-grid { grid-template-columns: 1fr; }
|
||||||
|
.eco-panel { padding: 1.5rem; }
|
||||||
|
.eco-panel__strip-grid { grid-template-columns: 1fr; }
|
||||||
|
.eco-unit__topbar { flex-direction: column; align-items: stretch; }
|
||||||
|
.eco-unit__nav { justify-content: flex-start; }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Modo oscuro: ajustes finos */
|
||||||
|
[data-theme="dark"] .eco-card,
|
||||||
|
[data-theme="dark"] .eco-panel {
|
||||||
|
background: var(--bg-surface);
|
||||||
|
}
|
||||||
|
[data-theme="dark"] .eco-panel__side,
|
||||||
|
[data-theme="dark"] .eco-mini {
|
||||||
|
background: color-mix(in srgb, var(--unit) 10%, var(--bg-surface));
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Accesibilidad: reduce motion */
|
||||||
|
@media (prefers-reduced-motion: reduce) {
|
||||||
|
.eco-card,
|
||||||
|
.eco-card__icon-wrap,
|
||||||
|
.eco-card__cta i,
|
||||||
|
.eco-mini,
|
||||||
|
.eco-unit__back,
|
||||||
|
.eco-state--unit {
|
||||||
|
transition: none !important;
|
||||||
|
animation: none !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
+31
-1
@@ -138,6 +138,7 @@
|
|||||||
|
|
||||||
html {
|
html {
|
||||||
scroll-behavior: smooth;
|
scroll-behavior: smooth;
|
||||||
|
scroll-padding-top: 80px;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -191,7 +192,7 @@ button, input, select, textarea {
|
|||||||
h1 {
|
h1 {
|
||||||
font-family: 'Barlow Semi Condensed', sans-serif;
|
font-family: 'Barlow Semi Condensed', sans-serif;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
font-size: clamp(2.2rem, 5vw, 4.5rem);
|
font-size: clamp(2.1rem, 4.5vw, 4.2rem);
|
||||||
line-height: 1.15;
|
line-height: 1.15;
|
||||||
color: var(--text-main);
|
color: var(--text-main);
|
||||||
letter-spacing: -0.02em;
|
letter-spacing: -0.02em;
|
||||||
@@ -229,6 +230,35 @@ p, li, .lead-text, .text-body, .text-muted {
|
|||||||
.bg-subtle-section{
|
.bg-subtle-section{
|
||||||
background-color: var(--bg-subtle);
|
background-color: var(--bg-subtle);
|
||||||
}
|
}
|
||||||
|
/* 1. Gradiente corporativo profundo - Ideal para Hero sections, cabeceras o footers */
|
||||||
|
.bgl1 {
|
||||||
|
background: linear-gradient(135deg, var(--ide-primary-dark) 0%, var(--ide-primary) 100%);
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 2. Resplandor central (Radial) - Excelente para destacar un producto, un mockup o una métrica central */
|
||||||
|
.bgl2 {
|
||||||
|
background: radial-gradient(circle at 80% 50%, var(--bg-surface) 0%, var(--ide-primary-dark) 100%);
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 3. Transición de marca (Azul a Verde) - Perfecto para secciones divisorias o franjas de características */
|
||||||
|
.bgl3 {
|
||||||
|
background: linear-gradient(135deg, var(--ide-primary) 0%, var(--ide-accent-dark) 100%);
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 4. Vibrante y fresco (Solo acentos) - Recomendado para "Call to Actions" (llamados a la acción) o tarjetas de precios */
|
||||||
|
.bgl4 {
|
||||||
|
background: linear-gradient(135deg, var(--ide-accent) 0%, var(--ide-accent-ligth) 100%);
|
||||||
|
color: #ffffff; /* O un color oscuro dependiendo de la tipografía */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 5. Gradiente angular suave a 3 tonos - Un fondo moderno y dinámico para secciones de contenido extenso */
|
||||||
|
.bgl5 {
|
||||||
|
background: linear-gradient(109.6deg, var(--ide-primary-dark) 11.2%, var(--ide-primary) 51.2%, var(--ide-primary-light) 98.6%);
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
.lead-text {
|
.lead-text {
|
||||||
font-size: 1.15rem;
|
font-size: 1.15rem;
|
||||||
color: var(--text-muted);
|
color: var(--text-muted);
|
||||||
|
|||||||
@@ -1,609 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="es" data-theme="light">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>El Ecosistema IDE | Cuatro Capacidades Conectadas - IDE Consultores</title>
|
|
||||||
<meta name="description" content="Conocé cómo se articulan IDE Excellence, IDE Project, IDE Academy e IDE Digital para generar valor integral y sostenible en las organizaciones.">
|
|
||||||
<meta property="og:title" content="El Ecosistema IDE | Cuatro Capacidades Conectadas">
|
|
||||||
<meta property="og:description" content="No se trata de sumar soluciones. Se trata de conectar las capacidades necesarias para una transformación real.">
|
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
|
||||||
<link rel="icon" type="image/x-icon" href="assets/img/favicon.png">
|
|
||||||
<link rel="stylesheet" href="css/styles.css">
|
|
||||||
<link rel="stylesheet" href="css/modal.css">
|
|
||||||
<link rel="stylesheet" href="css/faq.css">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<header id="site-header"></header>
|
|
||||||
|
|
||||||
<main>
|
|
||||||
|
|
||||||
<!-- Header Ecosistema -->
|
|
||||||
<section class="section-padding-npb hero-solucion">
|
|
||||||
<!-- Contenido -->
|
|
||||||
<div class="container container-narrow">
|
|
||||||
<div class="container container-narrow">
|
|
||||||
<span class="eyebrow">PROPUESTA DE VALOR</span>
|
|
||||||
<h1>Diferentes capacidades.<br> Una visión compartida del conjunto.</h1>
|
|
||||||
<p class="lead-text" style="margin-top: 1rem;">
|
|
||||||
Cada desafío activa la parte del Ecosistema que necesita. <br>La clave está en comprender el conjunto para saber dónde intervenir.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- SECCIÓN WEB DEDICADA PARA EL ESQUEMA -->
|
|
||||||
<section class="netschema-section">
|
|
||||||
<div class="netschema-wrapper">
|
|
||||||
<canvas id="networkCanvas" width="1200" height="520"></canvas>
|
|
||||||
|
|
||||||
<div id="tooltip" class="network-tooltip hidden">
|
|
||||||
<div id="tooltip-title" class="tooltip-title"></div>
|
|
||||||
<div id="tooltip-desc" class="tooltip-desc"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Profundización de las 4 Capacidades -->
|
|
||||||
<section class="section-padding-sm">
|
|
||||||
<div class="container">
|
|
||||||
<div class="seccion-servicios-tarjetas">
|
|
||||||
<span class="eyebrow">CAPACIDADES</span>
|
|
||||||
<h2>Conocé Nuestro Ecosistema en detalle</h2>
|
|
||||||
</div>
|
|
||||||
<!-- 1. IDE Excellence -->
|
|
||||||
<div id="excellence" class="card card-excellence card-ecosistema">
|
|
||||||
<div class="grid-2 eco">
|
|
||||||
<div>
|
|
||||||
<span class="ecosystem-badge badge-excellence">Operational Excellence & Sustainability</span>
|
|
||||||
<p>
|
|
||||||
<strong>Para fortalecer la gestión y mejorar el desempeño:</strong> Integramos procesos, sistemas de gestión, mejora continua y sostenibilidad para ayudar a las organizaciones a gestionar mejor, optimizar su desempeño y generar valor sostenible.
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<!-- Lista en formato píldoras -->
|
|
||||||
<div class="pills-list">
|
|
||||||
<span class="pill-item">Procesos</span>
|
|
||||||
<span class="pill-item">Sistemas de gestión</span>
|
|
||||||
<span class="pill-item">Mejora continua</span>
|
|
||||||
<span class="pill-item">Desempeño</span>
|
|
||||||
<span class="pill-item">Riesgos</span>
|
|
||||||
<span class="pill-item">Sostenibilidad</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<a class="btn btn-outline btn-sm" data-modal-target="modal-ide-excellence">CONOCER MÁS →</a>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<img src="assets/img/excellence.png" alt="IDE Excellence">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 2. IDE Project -->
|
|
||||||
<div id="project" class="card card-project card-ecosistema">
|
|
||||||
<div class="grid-2 eco">
|
|
||||||
<div>
|
|
||||||
<img src="assets/img/projects.png" alt="IDE Project">
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<span class="ecosystem-badge badge-project">PMO & Project Services</span>
|
|
||||||
<p>
|
|
||||||
<strong>Para convertir iniciativas en resultados:</strong> Fortalecemos la capacidad de las organizaciones para seleccionar, priorizar y gestionar proyectos, conectando estrategia, recursos y ejecución para transformar iniciativas en resultados.
|
|
||||||
</p>
|
|
||||||
<!-- Lista en formato píldoras -->
|
|
||||||
<div class="pills-list">
|
|
||||||
<span class="pill-item">Proyectos</span>
|
|
||||||
<span class="pill-item">PMO</span>
|
|
||||||
<span class="pill-item">Portafolios</span>
|
|
||||||
<span class="pill-item">Gobernanza</span>
|
|
||||||
<span class="pill-item">Metodologías</span>
|
|
||||||
<span class="pill-item">Resultados</span>
|
|
||||||
</div>
|
|
||||||
<a class="btn btn-outline btn-sm" data-modal-target="modal-ide-project">CONOCER MÁS →</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 3. IDE Digital -->
|
|
||||||
<div id="digital" class="card card-digital card-ecosistema">
|
|
||||||
<div class="grid-2 eco">
|
|
||||||
<div>
|
|
||||||
<span class="ecosystem-badge badge-digital">Business Digital Solutions</span>
|
|
||||||
<p>
|
|
||||||
<strong>Tecnología con sentido: </strong> Conectamos gestión, procesos, datos e inteligencia artificial para identificar dónde la tecnología puede simplificar, automatizar y potenciar la forma en que las organizaciones trabajan y toman decisiones.
|
|
||||||
</p>
|
|
||||||
<!-- Lista en formato píldoras -->
|
|
||||||
<div class="pills-list">
|
|
||||||
<span class="pill-item">Digitalización</span>
|
|
||||||
<span class="pill-item">Automatización</span>
|
|
||||||
<span class="pill-item">Datos</span>
|
|
||||||
<span class="pill-item">Inteligencia Artificial</span>
|
|
||||||
<span class="pill-item">Integración</span>
|
|
||||||
<span class="pill-item">Decisiones</span>
|
|
||||||
</div>
|
|
||||||
<a class="btn btn-outline btn-sm" data-modal-target="modal-ide-digital">CONOCER MÁS →</a>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<img src="assets/img/digital.png" alt="IDE Digital">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 4. IDE Academy -->
|
|
||||||
<div id="academy" class="card card-academy card-ecosistema">
|
|
||||||
<div class="grid-2 eco">
|
|
||||||
<div>
|
|
||||||
<img src="assets/img/academy.png" alt="IDE Academy">
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<span class="ecosystem-badge badge-academy">Executive Learning & Capability Development</span>
|
|
||||||
<p>
|
|
||||||
<strong>Para desarrollar capacidades: </strong>Diseñamos experiencias de aprendizaje que conectan conocimiento, práctica y contexto para fortalecer las capacidades que profesionales, equipos y organizaciones necesitan para gestionar, liderar y transformar.
|
|
||||||
</p>
|
|
||||||
<!-- Lista en formato píldoras -->
|
|
||||||
<div class="pills-list">
|
|
||||||
<span class="pill-item">Formación Ejecutiva</span>
|
|
||||||
<span class="pill-item">In-Company</span>
|
|
||||||
<span class="pill-item">Programas</span>
|
|
||||||
<span class="pill-item">Talleres</span>
|
|
||||||
<span class="pill-item">Rutas de aprendizaje</span>
|
|
||||||
</div>
|
|
||||||
<a href="ide-academy.html" class="btn btn-outline btn-sm">EXPLORAR IDE ACADEMY →</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- PREGUNTAS FRECUENTES-->
|
|
||||||
<section class="section-padding bg-subtle-section">
|
|
||||||
<div class="container">
|
|
||||||
|
|
||||||
<div style="text-align: center; margin-bottom: 3rem;">
|
|
||||||
<span class="eyebrow">PREGUNTAS FRECUENTES</span>
|
|
||||||
<h2>¿Cómo funciona el Ecosistema IDE en la práctica?</h2>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Contenedor centrado del acordeón -->
|
|
||||||
<div class="faq-accordion-container">
|
|
||||||
|
|
||||||
<!-- FAQ 1 -->
|
|
||||||
<details class="faq-item" name="faq-group">
|
|
||||||
<summary class="faq-header">
|
|
||||||
<span class="faq-question">¿Necesito contratar las cuatro capacidades del Ecosistema?</span>
|
|
||||||
<span class="faq-icon" aria-hidden="true">
|
|
||||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<polyline points="6 9 12 15 18 9"></polyline>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</summary>
|
|
||||||
<div class="faq-content">
|
|
||||||
<p>
|
|
||||||
<strong>No.</strong> Cada intervención se diseña a partir del desafío y del contexto de la organización. Podemos trabajar desde una única capacidad o integrar varias cuando su combinación permite generar mayor valor.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</details>
|
|
||||||
|
|
||||||
<!-- FAQ 2 -->
|
|
||||||
<details class="faq-item" name="faq-group">
|
|
||||||
<summary class="faq-header">
|
|
||||||
<span class="faq-question">¿IDE trabaja con soluciones prediseñadas o desarrolla propuestas a medida?</span>
|
|
||||||
<span class="faq-icon" aria-hidden="true">
|
|
||||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<polyline points="6 9 12 15 18 9"></polyline>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</summary>
|
|
||||||
<div class="faq-content">
|
|
||||||
<p>
|
|
||||||
<strong>Ambas posibilidades pueden convivir.</strong> Contamos con soluciones y metodologías que sirven como punto de partida, pero definimos el alcance de cada intervención según los objetivos, necesidades y contexto de la organización.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</details>
|
|
||||||
|
|
||||||
<!-- FAQ 3 -->
|
|
||||||
<details class="faq-item" name="faq-group">
|
|
||||||
<summary class="faq-header">
|
|
||||||
<span class="faq-question">¿Qué pasa si no sé qué capacidad necesito?</span>
|
|
||||||
<span class="faq-icon" aria-hidden="true">
|
|
||||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<polyline points="6 9 12 15 18 9"></polyline>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</summary>
|
|
||||||
<div class="faq-content">
|
|
||||||
<p>
|
|
||||||
<strong>No hace falta definirlo de antemano.</strong> Empezamos por comprender qué está pasando, identificar dónde puede estar el punto de intervención y, a partir de allí, determinar qué capacidades pueden aportar valor.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</details>
|
|
||||||
|
|
||||||
<!-- FAQ 4 -->
|
|
||||||
<details class="faq-item" name="faq-group">
|
|
||||||
<summary class="faq-header">
|
|
||||||
<span class="faq-question">¿Puedo trabajar con IDE para una necesidad puntual?</span>
|
|
||||||
<span class="faq-icon" aria-hidden="true">
|
|
||||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<polyline points="6 9 12 15 18 9"></polyline>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</summary>
|
|
||||||
<div class="faq-content">
|
|
||||||
<p>
|
|
||||||
<strong>Sí.</strong> La mirada sistémica no implica intervenir en toda la organización. Podemos abordar una necesidad específica manteniendo en perspectiva sus relaciones e impactos sobre el conjunto.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</details>
|
|
||||||
|
|
||||||
<!-- FAQ 5 -->
|
|
||||||
<details class="faq-item" name="faq-group">
|
|
||||||
<summary class="faq-header">
|
|
||||||
<span class="faq-question">¿Cómo sé por dónde empezar?</span>
|
|
||||||
<span class="faq-icon" aria-hidden="true">
|
|
||||||
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<polyline points="6 9 12 15 18 9"></polyline>
|
|
||||||
</svg>
|
|
||||||
</span>
|
|
||||||
</summary>
|
|
||||||
<div class="faq-content">
|
|
||||||
<p>
|
|
||||||
<strong>Si ya identificaste qué necesitás, podés explorar nuestras soluciones.</strong> Si todavía estás tratando de comprender el desafío, la Brújula IDE puede ayudarte a encontrar un primer punto de orientación.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</details>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- CTA Final -->
|
|
||||||
<section class="section-padding" style="background-color: var(--teal-dark); border-top: 1px solid var(--border-color);">
|
|
||||||
<div class="container container-narrow">
|
|
||||||
<h2 style="color: var(--text-inverse); margin-bottom: 1rem;">¿Dónde podemos generar mayor impacto en tu organización?</h2>
|
|
||||||
<p class="lead-text-cta" style="margin-bottom: 1.5rem;">
|
|
||||||
Conversemos para comprender tu desafío e identificar qué capacidades pueden aportar mayor valor.
|
|
||||||
</p>
|
|
||||||
<div style="display: flex; justify-content: left; gap: 1rem; flex-wrap: wrap;">
|
|
||||||
<a href="contacto.html" class="btn btn-primary-cta btn-sm">HABLEMOS</a>
|
|
||||||
<a href="desafios.html" class="btn btn-outline-cta btn-sm">Explorar Punto de Partida</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- MODAL: IDE EXCELLENCE -->
|
|
||||||
<div id="modal-ide-excellence" class="ide-modal-backdrop" role="dialog" aria-modal="true" aria-labelledby="modal-projects-title">
|
|
||||||
<div class="ide-modal-container excellence">
|
|
||||||
|
|
||||||
<!-- Botón Cerrar (X) -->
|
|
||||||
<button type="button" class="ide-modal-close" id="btnCloseModal" aria-label="Cerrar modal">
|
|
||||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<line x1="18" y1="6" x2="6" y2="18"></line>
|
|
||||||
<line x1="6" y1="6" x2="18" y2="18"></line>
|
|
||||||
</svg>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<!-- Envoltorio del contenido con scroll interno -->
|
|
||||||
<div class="ide-modal-body-wrapper">
|
|
||||||
<div class="ide-modal-scroll" id="modalScrollArea">
|
|
||||||
|
|
||||||
<!-- Encabezado -->
|
|
||||||
<header class="ide-modal-header">
|
|
||||||
<div class="ide-modal-pill">IDE EXCELLENCE</div>
|
|
||||||
<h2 id="modal-projects-title" class="ide-modal-title">Operational Excellence & Management Systems</h2>
|
|
||||||
<p class="ide-modal-tagline">Fortalecer la gestión para mejorar el desempeño.</p>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<!-- Introducción -->
|
|
||||||
<div class="ide-modal-lead">
|
|
||||||
<p>Ayudamos a las organizaciones a comprender cómo funcionan sus procesos, ordenar su gestión y desarrollar sistemas capaces de sostener la mejora en el tiempo.</p>
|
|
||||||
<p>Combinamos excelencia operacional, gestión por procesos, sistemas de gestión, análisis de riesgos e información para transformar requisitos y oportunidades de mejora en mejores formas de gestionar.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Capacidades -->
|
|
||||||
<section class="ide-modal-section">
|
|
||||||
<h3 class="ide-section-title">Nuestras capacidades</h3>
|
|
||||||
<div class="ide-grid-cards">
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Excelencia operacional</h4>
|
|
||||||
<p>Procesos · cadenas de valor · eficiencia · desempeño · mejora continua · indicadores.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Sistemas de gestión</h4>
|
|
||||||
<p>ISO 9001 · ISO 14001 · ISO 45001 · ISO 29001 · ISO 39001 · ISO 22000 · ISO 21001 · ISO 29993 · ISO 30401 · sistemas integrados · referenciales sectoriales.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Sostenibilidad</h4>
|
|
||||||
<p>Integración de criterios ambientales, sociales y de gobernanza en la gestión · ODS · identificación de impactos · objetivos e indicadores de sostenibilidad · buenas prácticas.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Riesgos, desempeño y mejora</h4>
|
|
||||||
<p>Riesgos y oportunidades · KPIs · tableros · auditorías · evaluación de madurez · mejora continua.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card ide-card-full">
|
|
||||||
<h4>Gestión del conocimiento</h4>
|
|
||||||
<p>Conocimiento crítico · transferencia · lecciones aprendidas · continuidad · aprendizaje organizacional.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Propuesta de Valor -->
|
|
||||||
<section class="ide-modal-callout">
|
|
||||||
<blockquote class="ide-quote-highlight">
|
|
||||||
“Mejorar el desempeño sin perder de vista el impacto.”
|
|
||||||
</blockquote>
|
|
||||||
<p>Sistemas y procesos que no existan solamente para cumplir un requisito, sino que ayuden a ordenar, decidir, mejorar y sostener resultados.</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Sinergia del Ecosistema -->
|
|
||||||
<section class="ide-modal-synergy">
|
|
||||||
<h4>Cuando el desafío requiere más</h4>
|
|
||||||
<p>
|
|
||||||
IDE Excellence puede integrarse con <strong>IDE Project</strong> , <strong>IDE Academy</strong> e <strong>IDE Digital</strong> para abordar proyectos de transformación, desarrollar capacidades o incorporar tecnología y automatización.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Barra Inferior Fija (Footer) -->
|
|
||||||
<footer class="ide-modal-footer-fixed">
|
|
||||||
<span class="ide-scroll-hint" id="scrollHint">
|
|
||||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
|
||||||
<path d="M7 13l5 5 5-5M7 6l5 5 5-5"/>
|
|
||||||
</svg>
|
|
||||||
Desliza para leer más
|
|
||||||
</span>
|
|
||||||
<a href="contacto.html" class="ide-btn-cta">
|
|
||||||
<span>HABLEMOS</span>
|
|
||||||
<span class="ide-btn-arrow">→</span>
|
|
||||||
</a>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- MODAL: IDE PROJECTS -->
|
|
||||||
<div id="modal-ide-project" class="ide-modal-backdrop" role="dialog" aria-modal="true" aria-labelledby="modal-projects-title">
|
|
||||||
<div class="ide-modal-container projects">
|
|
||||||
|
|
||||||
<!-- Botón Cerrar (X) -->
|
|
||||||
<button type="button" class="ide-modal-close" id="btnCloseModal" aria-label="Cerrar modal">
|
|
||||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<line x1="18" y1="6" x2="6" y2="18"></line>
|
|
||||||
<line x1="6" y1="6" x2="18" y2="18"></line>
|
|
||||||
</svg>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<!-- Envoltorio del contenido con scroll interno -->
|
|
||||||
<div class="ide-modal-body-wrapper">
|
|
||||||
<div class="ide-modal-scroll project" id="modalScrollArea">
|
|
||||||
|
|
||||||
<!-- Encabezado -->
|
|
||||||
<header class="ide-modal-header">
|
|
||||||
<div class="ide-modal-pill">IDE PROJECTS</div>
|
|
||||||
<h2 id="modal-projects-title" class="ide-modal-title">PMO & Project Services</h2>
|
|
||||||
<p class="ide-modal-tagline">Convertir iniciativas en resultados.</p>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<!-- Introducción -->
|
|
||||||
<div class="ide-modal-lead">
|
|
||||||
<p>Ayudamos a las organizaciones a fortalecer su capacidad para seleccionar, priorizar, planificar y ejecutar proyectos, programas y portafolios, conectando las iniciativas con los objetivos estratégicos y los recursos disponibles.</p>
|
|
||||||
<p>Integramos metodologías, gobernanza, información y capacidades de gestión para acompañar todo el ciclo de vida de los proyectos y mejorar su contribución a los resultados de la organización.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Capacidades -->
|
|
||||||
<section class="ide-modal-section">
|
|
||||||
<h3 class="ide-section-title">Nuestras capacidades</h3>
|
|
||||||
<div class="ide-grid-cards">
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Gestión de proyectos</h4>
|
|
||||||
<p>Planificación, organización, seguimiento y acompañamiento de proyectos para gestionar alcance, plazos, costos, recursos, riesgos, stakeholders y resultados.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>PMO — Oficinas de Gestión de Proyectos</h4>
|
|
||||||
<p>Diseño, implementación y fortalecimiento de PMO adaptadas al nivel de madurez, estrategia y necesidades de cada organización.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Programas y portafolios</h4>
|
|
||||||
<p>Priorización y coordinación de iniciativas para mejorar la asignación de recursos, gestionar interdependencias y mantener alineadas las inversiones con los objetivos organizacionales.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Gobernanza y metodologías</h4>
|
|
||||||
<p>Diseño de modelos de gobernanza, procesos, roles, indicadores y metodologías predictivas, ágiles o híbridas adaptadas al contexto de cada organización.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card ide-card-full">
|
|
||||||
<h4>Diagnóstico y recuperación de proyectos</h4>
|
|
||||||
<p>Evaluación de proyectos con dificultades o desvíos para identificar causas, redefinir prioridades y establecer planes de recuperación y seguimiento.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Metodologías -->
|
|
||||||
<section class="ide-modal-section">
|
|
||||||
<h3 class="ide-section-title">Cómo trabajamos</h3>
|
|
||||||
<div class="ide-tags-wrapper">
|
|
||||||
<span class="ide-method-tag">Predictivo</span>
|
|
||||||
<span class="ide-dot">·</span>
|
|
||||||
<span class="ide-method-tag">Ágil</span>
|
|
||||||
<span class="ide-dot">·</span>
|
|
||||||
<span class="ide-method-tag">Híbrido</span>
|
|
||||||
</div>
|
|
||||||
<p class="ide-text-block">No partimos de una metodología predeterminada. Seleccionamos y combinamos prácticas de gestión según el tipo de proyecto, su complejidad, el contexto y las capacidades de la organización.</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Propuesta de Valor -->
|
|
||||||
<section class="ide-modal-callout">
|
|
||||||
<blockquote class="ide-quote-highlight">
|
|
||||||
“No se trata de gestionar más proyectos. Se trata de gestionar mejor las iniciativas que importan.”
|
|
||||||
</blockquote>
|
|
||||||
<p>Fortalecemos la capacidad de transformar prioridades estratégicas en iniciativas ejecutables, generar información para decidir y mantener el foco en los resultados.</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Sinergia del Ecosistema -->
|
|
||||||
<section class="ide-modal-synergy">
|
|
||||||
<h4>Cuando el desafío requiere más</h4>
|
|
||||||
<p>
|
|
||||||
IDE Projects puede integrarse con <strong>IDE Excellence</strong>, <strong>IDE Academy</strong> e <strong>IDE Digital</strong> para rediseñar procesos, desarrollar capacidades, implementar sistemas o incorporar tecnología que fortalezca la gestión y ejecución de proyectos.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Barra Inferior Fija (Footer) -->
|
|
||||||
<footer class="ide-modal-footer-fixed">
|
|
||||||
<span class="ide-scroll-hint" id="scrollHint">
|
|
||||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
|
||||||
<path d="M7 13l5 5 5-5M7 6l5 5 5-5"/>
|
|
||||||
</svg>
|
|
||||||
Desliza para leer más
|
|
||||||
</span>
|
|
||||||
<a href="contacto.html" class="ide-btn-cta">
|
|
||||||
<span>HABLEMOS</span>
|
|
||||||
<span class="ide-btn-arrow">→</span>
|
|
||||||
</a>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- MODAL: IDE DIGITAL -->
|
|
||||||
<div id="modal-ide-digital" class="ide-modal-backdrop" role="dialog" aria-modal="true" aria-labelledby="modal-projects-title">
|
|
||||||
<div class="ide-modal-container digital">
|
|
||||||
|
|
||||||
<!-- Botón Cerrar (X) -->
|
|
||||||
<button type="button" class="ide-modal-close" id="btnCloseModal" aria-label="Cerrar modal">
|
|
||||||
<svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<line x1="18" y1="6" x2="6" y2="18"></line>
|
|
||||||
<line x1="6" y1="6" x2="18" y2="18"></line>
|
|
||||||
</svg>
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<!-- Envoltorio del contenido con scroll interno -->
|
|
||||||
<div class="ide-modal-body-wrapper">
|
|
||||||
<div class="ide-modal-scroll" id="modalScrollArea">
|
|
||||||
|
|
||||||
<!-- Encabezado -->
|
|
||||||
<header class="ide-modal-header">
|
|
||||||
<div class="ide-modal-pill">IDE DIGITAL</div>
|
|
||||||
<h2 id="modal-projects-title" class="ide-modal-title">Business Digital Solutions</h2>
|
|
||||||
<p class="ide-modal-tagline">Tecnología con sentido.</p>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
<!-- Introducción -->
|
|
||||||
<div class="ide-modal-lead">
|
|
||||||
<p>Ayudamos a las organizaciones a identificar dónde la tecnología puede generar valor y a transformar esas oportunidades en soluciones digitales aplicables a su realidad.</p>
|
|
||||||
<p>Integramos procesos, datos, automatización e inteligencia artificial para simplificar la gestión, mejorar el acceso a la información y fortalecer la toma de decisiones, priorizando soluciones útiles, escalables y sostenibles.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Capacidades -->
|
|
||||||
<section class="ide-modal-section">
|
|
||||||
<h3 class="ide-section-title">Nuestras capacidades</h3>
|
|
||||||
<div class="ide-grid-cards">
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Digitalización y sistematización de procesos</h4>
|
|
||||||
<p>Analizamos procesos y flujos de información para identificar oportunidades de digitalización, reducir tareas manuales y mejorar la trazabilidad y disponibilidad de la información.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Automatización e integración</h4>
|
|
||||||
<p>Diseñamos automatizaciones e integraciones entre procesos, datos y herramientas para reducir tareas repetitivas, errores y puntos de fricción.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Inteligencia Artificial aplicada</h4>
|
|
||||||
<p>Identificamos y desarrollamos casos de uso de IA vinculados con necesidades concretas de gestión, operación, análisis y conocimiento organizacional.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Datos e inteligencia de negocio</h4>
|
|
||||||
<p>Diseñamos indicadores, tableros y soluciones de Business Intelligence para transformar datos dispersos en información accesible y útil para la toma de decisiones.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Diagnóstico y hoja de ruta digital</h4>
|
|
||||||
<p>Evaluamos procesos, herramientas, información y capacidades para identificar oportunidades, establecer prioridades y construir una hoja de ruta de transformación digital.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ide-feature-card">
|
|
||||||
<h4>Adopción y capacidades digitales</h4>
|
|
||||||
<p>Acompañamos la incorporación de nuevas soluciones trabajando sobre procesos, prácticas y capacidades para integrarlas efectivamente a la dinámica de la organización.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Metodologías -->
|
|
||||||
<section class="ide-modal-section">
|
|
||||||
<h3 class="ide-section-title">Cómo trabajamos</h3>
|
|
||||||
<div class="ide-tags-wrapper">
|
|
||||||
<span class="ide-method-tag">Necesidad</span>
|
|
||||||
<span class="ide-dot">⇒</span>
|
|
||||||
<span class="ide-method-tag">Proceso</span>
|
|
||||||
<span class="ide-dot">⇒</span>
|
|
||||||
<span class="ide-method-tag">Solución</span>
|
|
||||||
<span class="ide-dot">⇒</span>
|
|
||||||
<span class="ide-method-tag">Integración</span>
|
|
||||||
</div>
|
|
||||||
<p class="ide-text-block">No partimos de una tecnología predeterminada. Primero comprendemos la necesidad y el proceso; luego identificamos qué solución digital puede generar valor y cómo integrarla al funcionamiento de la organización.</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Propuesta de Valor -->
|
|
||||||
<section class="ide-modal-callout">
|
|
||||||
<blockquote class="ide-quote-highlight">
|
|
||||||
“No digitalizar por digitalizar. Transformar donde tenga sentido.”
|
|
||||||
</blockquote>
|
|
||||||
<p>La tecnología genera valor cuando simplifica la gestión, mejora las decisiones o habilita nuevas capacidades sin agregar complejidad innecesaria.</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Sinergia del Ecosistema -->
|
|
||||||
<section class="ide-modal-synergy">
|
|
||||||
<h4>Cuando el desafío requiere más</h4>
|
|
||||||
<p>
|
|
||||||
<strong>IDE Digital</strong> puede integrarse con <strong>IDE Excellence</strong>, <strong>IDE Projects</strong> e <strong>IDE Academy</strong> para rediseñar procesos, gestionar proyectos de transformación y desarrollar las capacidades necesarias para incorporar nuevas formas de trabajar.
|
|
||||||
</p>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Barra Inferior Fija (Footer) -->
|
|
||||||
<footer class="ide-modal-footer-fixed">
|
|
||||||
<span class="ide-scroll-hint" id="scrollHint">
|
|
||||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
|
|
||||||
<path d="M7 13l5 5 5-5M7 6l5 5 5-5"/>
|
|
||||||
</svg>
|
|
||||||
Desliza para leer más
|
|
||||||
</span>
|
|
||||||
<a href="contacto.html" class="ide-btn-cta">
|
|
||||||
<span>HABLEMOS</span>
|
|
||||||
<span class="ide-btn-arrow">→</span>
|
|
||||||
</a>
|
|
||||||
</footer>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</main>
|
|
||||||
|
|
||||||
<footer id="site-footer"></footer>
|
|
||||||
<script src="js/main.js"></script>
|
|
||||||
<script src="js/netschema.js"></script>
|
|
||||||
<script src="js/modal.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
+350
-10
@@ -10,6 +10,7 @@
|
|||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
||||||
<link rel="icon" type="image/x-icon" href="assets/img/favicon.png">
|
<link rel="icon" type="image/x-icon" href="assets/img/favicon.png">
|
||||||
<link rel="stylesheet" href="css/styles.css">
|
<link rel="stylesheet" href="css/styles.css">
|
||||||
|
<link rel="stylesheet" href="css/ecosistema.css">
|
||||||
<link rel="stylesheet" href="css/faq.css">
|
<link rel="stylesheet" href="css/faq.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@@ -18,24 +19,361 @@
|
|||||||
|
|
||||||
<main>
|
<main>
|
||||||
|
|
||||||
<!-- Header Ecosistema -->
|
<!-- Seccion 1:Header Ecosistema -->
|
||||||
<section class="section-padding-npb hero-solucion">
|
<section class="section-padding-md bg1">
|
||||||
<!-- Contenido -->
|
<div class="container container-wide">
|
||||||
<div class="container container-narrow">
|
<div class="hero-grid">
|
||||||
<div class="container container-narrow">
|
<div>
|
||||||
<span class="eyebrow">PROPUESTA DE VALOR</span>
|
<span class="eyebrow" style="text-transform: uppercase;">LA PROPUESTA DE VALOR</span>
|
||||||
<h1>Diferentes capacidades.<br> Una visión compartida del conjunto.</h1>
|
<h1 style="margin-bottom: 1rem;">
|
||||||
<p class="lead-text" style="margin-top: 1rem;">
|
Capacidades diferentes. Una visión compartida <br>del conjunto.
|
||||||
Cada desafío activa la parte del Ecosistema que necesita. <br>La clave está en comprender el conjunto para saber dónde intervenir.
|
</h1>
|
||||||
|
<p class="lead-text" style="margin-bottom: 2.5rem;">
|
||||||
|
No todos los desafíos necesitan activar todo el Ecosistema. La clave está en comprender el conjunto para saber dónde intervenir.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
|
<!-- Hero Actions -->
|
||||||
|
<div class="hero-actions" style="display: flex; gap: 1rem; flex-wrap: wrap; align-items: center;">
|
||||||
|
<a href="contacto.html" class="btn btn-primary btn-cta-unificado"
|
||||||
|
style="border-radius: 50px; display: flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1.5rem;">
|
||||||
|
Conocé el Ecosistema
|
||||||
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
|
||||||
|
stroke-linecap="round" stroke-linejoin="round">
|
||||||
|
<circle cx="12" cy="12" r="10"></circle>
|
||||||
|
<polyline points="12 16 16 12 12 8"></polyline>
|
||||||
|
<line x1="8" y1="12" x2="16" y2="12"></line>
|
||||||
|
</svg>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="hero-visual"
|
||||||
|
style="width: 100%; height: 500px; position: relative; display: flex; justify-content: center; align-items: center;">
|
||||||
|
<div class="animacion-infinito">
|
||||||
|
<svg class="capa-svg-lineas" viewBox="0 0 1000 500" preserveAspectRatio="xMidYMid meet">
|
||||||
|
<defs id="svg-defs"></defs>
|
||||||
|
<g id="grupo-lineas"></g>
|
||||||
|
</svg>
|
||||||
|
<div class="capa-html-nodos" id="grupo-nodos"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
<!-- Seccion 2: Ecosistema IDE -->
|
||||||
|
<section id="ecosistema-ide" class="section-padding bg2 ecosistema-section" aria-labelledby="ecosistema-title">
|
||||||
|
<div class="container">
|
||||||
|
<!-- ============ ESTADO 1: ECOSISTEMA (4 tarjetas) ============ -->
|
||||||
|
<div class="eco-state eco-state--ecosystem" data-eco-state="ecosystem">
|
||||||
|
<header class="eco-header">
|
||||||
|
<span class="eyebrow">ECOSISTEMA IDE</span>
|
||||||
|
<h2 id="ecosistema-title">Cuatro unidades, una misma forma de trabajar.</h2>
|
||||||
|
<p class="lead-text eco-header__lead">
|
||||||
|
Integramos capacidades de gestión, proyectos, tecnología y formación para acompañar a las organizaciones en cada etapa de su mejora.
|
||||||
|
</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="eco-grid" role="list">
|
||||||
|
|
||||||
|
<!-- Tarjeta 1: IDE Excellence -->
|
||||||
|
<article class="eco-card eco-card--excellence" role="listitem">
|
||||||
|
<button type="button" class="eco-card__btn" data-eco-open="excellence"
|
||||||
|
aria-expanded="false" aria-controls="eco-panel-excellence">
|
||||||
|
<span class="eco-card__icon-wrap" aria-hidden="true">
|
||||||
|
<i class="fa-solid fa-award eco-card__icon"></i>
|
||||||
|
</span>
|
||||||
|
<span class="eco-card__badge">IDE EXCELLENCE</span>
|
||||||
|
<h3 class="eco-card__title">Excelencia operacional y sistemas de gestión</h3>
|
||||||
|
<p class="eco-card__text">Procesos, ISO, riesgos y mejora continua para sostener el desempeño.</p>
|
||||||
|
<span class="eco-card__cta">
|
||||||
|
Explorar unidad <i class="fa-solid fa-arrow-right" aria-hidden="true"></i>
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<!-- Tarjeta 2: IDE Projects -->
|
||||||
|
<article class="eco-card eco-card--projects" role="listitem">
|
||||||
|
<button type="button" class="eco-card__btn" data-eco-open="projects"
|
||||||
|
aria-expanded="false" aria-controls="eco-panel-projects">
|
||||||
|
<span class="eco-card__icon-wrap" aria-hidden="true">
|
||||||
|
<i class="fa-solid fa-diagram-project eco-card__icon"></i>
|
||||||
|
</span>
|
||||||
|
<span class="eco-card__badge">IDE PROJECTS</span>
|
||||||
|
<h3 class="eco-card__title">PMO y servicios de proyectos</h3>
|
||||||
|
<p class="eco-card__text">Convertimos iniciativas en resultados, con gobernanza y método.</p>
|
||||||
|
<span class="eco-card__cta">
|
||||||
|
Explorar unidad <i class="fa-solid fa-arrow-right" aria-hidden="true"></i>
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<!-- Tarjeta 3: IDE Digital -->
|
||||||
|
<article class="eco-card eco-card--digital" role="listitem">
|
||||||
|
<button type="button" class="eco-card__btn" data-eco-open="digital"
|
||||||
|
aria-expanded="false" aria-controls="eco-panel-digital">
|
||||||
|
<span class="eco-card__icon-wrap" aria-hidden="true">
|
||||||
|
<i class="fa-solid fa-robot eco-card__icon"></i>
|
||||||
|
</span>
|
||||||
|
<span class="eco-card__badge">IDE DIGITAL</span>
|
||||||
|
<h3 class="eco-card__title">Soluciones digitales de negocio</h3>
|
||||||
|
<p class="eco-card__text">Tecnología con sentido: digitalización, automatización e IA aplicada.</p>
|
||||||
|
<span class="eco-card__cta">
|
||||||
|
Explorar unidad <i class="fa-solid fa-arrow-right" aria-hidden="true"></i>
|
||||||
|
</span>
|
||||||
|
</button>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<!-- Tarjeta 4: IDE Academy (navega a academy.html) -->
|
||||||
|
<article class="eco-card eco-card--academy" role="listitem">
|
||||||
|
<a class="eco-card__btn" href="academy.html" aria-label="Ir a IDE Academy">
|
||||||
|
<span class="eco-card__icon-wrap" aria-hidden="true">
|
||||||
|
<i class="fa-solid fa-graduation-cap eco-card__icon"></i>
|
||||||
|
</span>
|
||||||
|
<span class="eco-card__badge">IDE ACADEMY</span>
|
||||||
|
<h3 class="eco-card__title">Formación y desarrollo de capacidades</h3>
|
||||||
|
<p class="eco-card__text">Programas in-company para transformar conocimiento en acción.</p>
|
||||||
|
<span class="eco-card__cta">
|
||||||
|
Ver página completa <i class="fa-solid fa-arrow-up-right-from-square" aria-hidden="true"></i>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- ============ ESTADO 2: UNIDAD EXPANDIDA ============ -->
|
||||||
|
<div class="eco-state eco-state--unit" data-eco-state="unit" hidden>
|
||||||
|
|
||||||
|
<!-- Botón volver -->
|
||||||
|
<div class="eco-unit__topbar">
|
||||||
|
<button type="button" class="eco-unit__back" data-eco-close>
|
||||||
|
<i class="fa-solid fa-arrow-left" aria-hidden="true"></i>
|
||||||
|
<span>Volver al ecosistema</span>
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<!-- Pills de navegación entre unidades -->
|
||||||
|
<nav class="eco-unit__nav" aria-label="Cambiar de unidad">
|
||||||
|
<button type="button" class="eco-pill eco-pill--excellence" data-eco-open="excellence">Excellence</button>
|
||||||
|
<button type="button" class="eco-pill eco-pill--projects" data-eco-open="projects">Projects</button>
|
||||||
|
<button type="button" class="eco-pill eco-pill--digital" data-eco-open="digital">Digital</button>
|
||||||
|
<a class="eco-pill eco-pill--academy" href="academy.html">Academy <i class="fa-solid fa-arrow-up-right-from-square" aria-hidden="true"></i></a>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Paneles de unidad -->
|
||||||
|
<div class="eco-panels">
|
||||||
|
|
||||||
|
<!-- ============ PANEL: EXCELLENCE ============ -->
|
||||||
|
<article class="eco-panel eco-panel--excellence" id="eco-panel-excellence" data-eco-panel="excellence" hidden>
|
||||||
|
<div class="eco-panel__bg" aria-hidden="true">
|
||||||
|
<svg viewBox="0 0 1200 600" preserveAspectRatio="none">
|
||||||
|
<path d="M-100,500 C200,300 400,650 700,400 C900,250 1100,450 1300,300" />
|
||||||
|
<path d="M-100,200 C150,50 400,300 650,150 C900,0 1100,250 1300,100" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="eco-panel__grid">
|
||||||
|
<div class="eco-panel__main">
|
||||||
|
<span class="eco-panel__brand">IDE EXCELLENCE</span>
|
||||||
|
<h2 class="eco-panel__title">Fortalecer la gestión para mejorar el desempeño.</h2>
|
||||||
|
<p class="eco-panel__lead">
|
||||||
|
Ayudamos a las organizaciones a comprender cómo funcionan sus procesos, ordenar su gestión y desarrollar sistemas capaces de sostener la mejora en el tiempo.
|
||||||
|
</p>
|
||||||
|
<a href="contacto.html" class="btn btn-primary btn-cta-unificado eco-panel__cta">
|
||||||
|
HABLEMOS <i class="fa-solid fa-arrow-right" aria-hidden="true"></i>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<aside class="eco-panel__side" aria-label="Capacidades de IDE Excellence">
|
||||||
|
<h3 class="eco-panel__side-title">Nuestras capacidades</h3>
|
||||||
|
<ul class="eco-panel__list">
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-gears"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>Excelencia operacional</strong>
|
||||||
|
<p>Procesos, cadenas de valor, eficiencia, desempeño e indicadores.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-certificate"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>Sistemas de gestión</strong>
|
||||||
|
<p>ISO 9001, 14001, 45001, 29001, 39001, 22000, 21001, 29993, 30401 e integrados.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-leaf"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>Sostenibilidad</strong>
|
||||||
|
<p>Criterios ASG, ODS, impactos, objetivos e indicadores.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-shield-halved"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>Riesgos y mejora</strong>
|
||||||
|
<p>Identificación, evaluación, tratamiento y mejora del desempeño.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="eco-panel__strip" aria-label="Cómo agregamos valor">
|
||||||
|
<h4 class="eco-panel__strip-title">Cómo agregamos valor</h4>
|
||||||
|
<div class="eco-panel__strip-grid">
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-diagram-project"></i><span>Procesos claros</span></div>
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-certificate"></i><span>ISO integradas</span></div>
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-shield-halved"></i><span>Riesgos gestionados</span></div>
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-chart-line"></i><span>Mejora sostenida</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<!-- ============ PANEL: PROJECTS ============ -->
|
||||||
|
<article class="eco-panel eco-panel--projects" id="eco-panel-projects" data-eco-panel="projects" hidden>
|
||||||
|
<div class="eco-panel__bg" aria-hidden="true">
|
||||||
|
<svg viewBox="0 0 1200 600" preserveAspectRatio="none">
|
||||||
|
<path d="M-100,450 C200,250 400,600 700,350 C900,200 1100,400 1300,250" />
|
||||||
|
<path d="M-100,150 C150,0 400,250 650,100 C900,-50 1100,200 1300,50" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="eco-panel__grid">
|
||||||
|
<div class="eco-panel__main">
|
||||||
|
<span class="eco-panel__brand">IDE PROJECTS</span>
|
||||||
|
<h2 class="eco-panel__title">Convertir iniciativas en resultados.</h2>
|
||||||
|
<p class="eco-panel__lead">
|
||||||
|
Fortalecemos la capacidad de seleccionar, priorizar, planificar y ejecutar proyectos, programas y portafolios, conectando iniciativas con la estrategia y los recursos.
|
||||||
|
</p>
|
||||||
|
<a href="contacto.html" class="btn btn-primary btn-cta-unificado eco-panel__cta">
|
||||||
|
HABLEMOS <i class="fa-solid fa-arrow-right" aria-hidden="true"></i>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<aside class="eco-panel__side" aria-label="Capacidades de IDE Projects">
|
||||||
|
<h3 class="eco-panel__side-title">Nuestras capacidades</h3>
|
||||||
|
<ul class="eco-panel__list">
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-diagram-project"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>Gestión de proyectos</strong>
|
||||||
|
<p>Alcance, plazos, costos, recursos, riesgos, stakeholders y resultados.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-building-columns"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>PMO — Oficinas de proyectos</strong>
|
||||||
|
<p>Diseño, implementación y fortalecimiento según madurez y estrategia.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-layer-group"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>Programas y portafolios</strong>
|
||||||
|
<p>Priorización, asignación de recursos e interdependencias alineadas a la estrategia.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-toolbox"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>Metodologías y gobernanza</strong>
|
||||||
|
<p>Marcos predictivos, ágiles o híbridos adaptados a cada contexto.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="eco-panel__strip" aria-label="Cómo agregamos valor">
|
||||||
|
<h4 class="eco-panel__strip-title">Cómo agregamos valor</h4>
|
||||||
|
<div class="eco-panel__strip-grid">
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-bullseye"></i><span>Planificación estratégica</span></div>
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-gears"></i><span>Ejecución eficiente</span></div>
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-chart-column"></i><span>Control de resultados</span></div>
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-users"></i><span>Equipos de alto desempeño</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<!-- ============ PANEL: DIGITAL ============ -->
|
||||||
|
<article class="eco-panel eco-panel--digital" id="eco-panel-digital" data-eco-panel="digital" hidden>
|
||||||
|
<div class="eco-panel__bg" aria-hidden="true">
|
||||||
|
<svg viewBox="0 0 1200 600" preserveAspectRatio="none">
|
||||||
|
<path d="M-100,520 C200,320 400,670 700,420 C900,270 1100,470 1300,320" />
|
||||||
|
<path d="M-100,220 C150,70 400,320 650,170 C900,20 1100,270 1300,120" />
|
||||||
|
</svg>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="eco-panel__grid">
|
||||||
|
<div class="eco-panel__main">
|
||||||
|
<span class="eco-panel__brand">IDE DIGITAL</span>
|
||||||
|
<h2 class="eco-panel__title">Tecnología con sentido.</h2>
|
||||||
|
<p class="eco-panel__lead">
|
||||||
|
Identificamos dónde la tecnología genera valor y transformamos esas oportunidades en soluciones digitales aplicables a la realidad de cada organización.
|
||||||
|
</p>
|
||||||
|
<a href="contacto.html" class="btn btn-primary btn-cta-unificado eco-panel__cta">
|
||||||
|
HABLEMOS <i class="fa-solid fa-arrow-right" aria-hidden="true"></i>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<aside class="eco-panel__side" aria-label="Capacidades de IDE Digital">
|
||||||
|
<h3 class="eco-panel__side-title">Nuestras capacidades</h3>
|
||||||
|
<ul class="eco-panel__list">
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-laptop-code"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>Digitalización de procesos</strong>
|
||||||
|
<p>Menos tareas manuales, mejor trazabilidad y disponibilidad de la información.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-arrows-spin"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>Automatización e integración</strong>
|
||||||
|
<p>Reducimos tareas repetitivas, errores y puntos de fricción.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-brain"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>IA aplicada</strong>
|
||||||
|
<p>Casos de uso vinculados a gestión, operación, análisis y conocimiento.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span class="eco-panel__li-icon"><i class="fa-solid fa-chart-pie"></i></span>
|
||||||
|
<div>
|
||||||
|
<strong>Datos para decidir</strong>
|
||||||
|
<p>Información integrada y visual para fortalecer la toma de decisiones.</p>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="eco-panel__strip" aria-label="Cómo agregamos valor">
|
||||||
|
<h4 class="eco-panel__strip-title">Cómo agregamos valor</h4>
|
||||||
|
<div class="eco-panel__strip-grid">
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-magnifying-glass-chart"></i><span>Oportunidades priorizadas</span></div>
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-laptop-code"></i><span>Procesos digitalizados</span></div>
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-robot"></i><span>Automatización útil</span></div>
|
||||||
|
<div class="eco-mini"><i class="fa-solid fa-brain"></i><span>IA con propósito</span></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
</div><!-- /.eco-panels -->
|
||||||
|
</div><!-- /.eco-state--unit -->
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
<!-- Profundización de las 4 Capacidades -->
|
<!-- Profundización de las 4 Capacidades -->
|
||||||
<section class="section-padding-sm">
|
<section class="section-padding-sm" >
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="seccion-servicios-tarjetas">
|
<div class="seccion-servicios-tarjetas">
|
||||||
<span class="eyebrow">CAPACIDADES</span>
|
<span class="eyebrow">CAPACIDADES</span>
|
||||||
@@ -261,5 +599,7 @@
|
|||||||
|
|
||||||
<footer id="site-footer"></footer>
|
<footer id="site-footer"></footer>
|
||||||
<script src="js/main.js"></script>
|
<script src="js/main.js"></script>
|
||||||
|
<script src="js/netschema.js"></script>
|
||||||
|
<script src="js/ecosistema.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@@ -0,0 +1,130 @@
|
|||||||
|
/* ==========================================================================
|
||||||
|
ECOSISTEMA IDE — Cambio in-place entre tarjetas y paneles de unidad
|
||||||
|
========================================================================== */
|
||||||
|
(function () {
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
const section = document.getElementById('ecosistema-ide');
|
||||||
|
if (!section) return;
|
||||||
|
|
||||||
|
const stateEcosystem = section.querySelector('[data-eco-state="ecosystem"]');
|
||||||
|
const stateUnit = section.querySelector('[data-eco-state="unit"]');
|
||||||
|
const panels = Array.from(section.querySelectorAll('[data-eco-panel]'));
|
||||||
|
const triggers = Array.from(section.querySelectorAll('[data-eco-open]'));
|
||||||
|
const backBtn = section.querySelector('[data-eco-close]');
|
||||||
|
const pills = Array.from(section.querySelectorAll('.eco-pill'));
|
||||||
|
|
||||||
|
let lastFocusedTrigger = null;
|
||||||
|
|
||||||
|
/* --- Mostrar panel de una unidad --- */
|
||||||
|
function openUnit(id) {
|
||||||
|
const panel = panels.find(p => p.dataset.ecoPanel === id);
|
||||||
|
if (!panel) return;
|
||||||
|
|
||||||
|
// Guardamos el trigger que originó el cambio (para devolver foco)
|
||||||
|
const origin = triggers.find(t => t.dataset.ecoOpen === id);
|
||||||
|
if (origin) lastFocusedTrigger = origin;
|
||||||
|
|
||||||
|
// Ocultar ecosistema, mostrar estado unidad
|
||||||
|
stateEcosystem.hidden = true;
|
||||||
|
stateUnit.hidden = false;
|
||||||
|
|
||||||
|
// Alternar paneles
|
||||||
|
panels.forEach(p => {
|
||||||
|
const isActive = p.dataset.ecoPanel === id;
|
||||||
|
p.hidden = !isActive;
|
||||||
|
if (isActive) {
|
||||||
|
// Re-trigger de la animación de entrada
|
||||||
|
p.style.animation = 'none';
|
||||||
|
// Forzar reflow
|
||||||
|
void p.offsetWidth;
|
||||||
|
p.style.animation = '';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Aria expandido en tarjetas
|
||||||
|
triggers.forEach(t => {
|
||||||
|
const isThis = t.dataset.ecoOpen === id;
|
||||||
|
t.setAttribute('aria-expanded', isThis ? 'true' : 'false');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Pills activas
|
||||||
|
pills.forEach(pill => {
|
||||||
|
pill.classList.toggle('is-active', pill.dataset.ecoOpen === id);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Foco accesible al título del panel
|
||||||
|
const title = panel.querySelector('.eco-panel__title');
|
||||||
|
if (title) {
|
||||||
|
title.setAttribute('tabindex', '-1');
|
||||||
|
// Pequeño timeout para asegurar visibilidad tras el cambio de estado
|
||||||
|
requestAnimationFrame(() => title.focus({ preventScroll: false }));
|
||||||
|
}
|
||||||
|
|
||||||
|
// Scroll suave al inicio de la sección (solo si quedó fuera de vista)
|
||||||
|
const rect = section.getBoundingClientRect();
|
||||||
|
if (rect.top < -80) {
|
||||||
|
section.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* --- Volver al estado ecosistema --- */
|
||||||
|
function closeUnit() {
|
||||||
|
stateUnit.hidden = true;
|
||||||
|
stateEcosystem.hidden = false;
|
||||||
|
|
||||||
|
triggers.forEach(t => t.setAttribute('aria-expanded', 'false'));
|
||||||
|
pills.forEach(p => p.classList.remove('is-active'));
|
||||||
|
|
||||||
|
// Devolver foco a la tarjeta origen
|
||||||
|
if (lastFocusedTrigger && typeof lastFocusedTrigger.focus === 'function') {
|
||||||
|
lastFocusedTrigger.focus({ preventScroll: false });
|
||||||
|
} else {
|
||||||
|
// Fallback: primer botón del grid
|
||||||
|
const first = triggers[0];
|
||||||
|
if (first) first.focus({ preventScroll: false });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* --- Listeners --- */
|
||||||
|
triggers.forEach(trigger => {
|
||||||
|
trigger.addEventListener('click', (e) => {
|
||||||
|
const id = trigger.dataset.ecoOpen;
|
||||||
|
if (!id) return;
|
||||||
|
// Si es un <a> real (academy), dejamos que navegue
|
||||||
|
if (trigger.tagName === 'A' && trigger.getAttribute('href')) return;
|
||||||
|
e.preventDefault();
|
||||||
|
openUnit(id);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Soporte teclado para tarjetas no-button (por si acaso)
|
||||||
|
trigger.addEventListener('keydown', (e) => {
|
||||||
|
if (e.key === 'Enter' || e.key === ' ') {
|
||||||
|
const id = trigger.dataset.ecoOpen;
|
||||||
|
if (!id) return;
|
||||||
|
if (trigger.tagName === 'A') return;
|
||||||
|
e.preventDefault();
|
||||||
|
openUnit(id);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
if (backBtn) backBtn.addEventListener('click', closeUnit);
|
||||||
|
|
||||||
|
// Escape cierra el panel expandido
|
||||||
|
section.addEventListener('keydown', (e) => {
|
||||||
|
if (e.key === 'Escape' && !stateUnit.hidden) {
|
||||||
|
closeUnit();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/* --- Deep link opcional por hash (#eco-projects) sin recargar --- */
|
||||||
|
function readHash() {
|
||||||
|
const hash = window.location.hash.replace('#eco-', '');
|
||||||
|
if (['excellence', 'projects', 'digital'].includes(hash)) {
|
||||||
|
openUnit(hash);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
window.addEventListener('hashchange', readHash);
|
||||||
|
readHash();
|
||||||
|
})();
|
||||||
+146
-517
@@ -1,543 +1,172 @@
|
|||||||
// Mapa: propiedad de CONFIG -> nombre de variable CSS
|
const nodosData = [
|
||||||
const CSS_VARS = {
|
// Reemplaza el src con la ruta real de tus logos
|
||||||
greenNodesColor: "--ide-primary",
|
{ id: 'tl', x0: 220, y0: 140, r: 52, color: '#16a085', html: '<img src="assets/logos/excellence_b.png" alt="EXCELLENCE">' },
|
||||||
greenStrokeColor: "--ide-primary-light",
|
{ id: 'bl', x0: 200, y0: 420, r: 52, color: '#f39200', html: '<img src="assets/logos/projects_b.png" alt="PROJECTS">' },
|
||||||
linkLineColor: "--ide-primary-line",
|
{ id: 'tr', x0: 780, y0: 110, r: 52, color: '#c41230', html: '<img src="assets/logos/academy_b.png" alt="ACADEMY">' },
|
||||||
linkGreenColor: "--ide-primary-line",
|
{ id: 'br', x0: 750, y0: 400, r: 52, color: '#0061a0', html: '<img src="assets/logos/digital_b.png" alt="DIGITAL">' },
|
||||||
linkActiveColor: "--ide-primary-light",
|
{ id: 'c', x0: 500, y0: 280, r: 70, color: '#ffffff', html: '<img src="assets/logos/ide.png" alt="EL TODO">' }
|
||||||
purpleCoreLineColor: "--ide-primary-line",
|
|
||||||
shadowCanva: "--shadow-canva",
|
|
||||||
textMain: "--text-main",
|
|
||||||
textInverse: "--text-inverse"
|
|
||||||
};
|
|
||||||
|
|
||||||
// Mapa: id de nodo violeta -> variable CSS
|
|
||||||
const PURPLE_NODE_VARS = {
|
|
||||||
p_top: "--ide-excellence",
|
|
||||||
p_bottom: "--ide-digital",
|
|
||||||
p_left: "--ide-academy",
|
|
||||||
p_right: "--ide-projects"
|
|
||||||
};
|
|
||||||
|
|
||||||
// Variable CSS común para todos los amarillos
|
|
||||||
const YELLOW_NODE_VAR = "--ide-primary-dark";
|
|
||||||
|
|
||||||
/* ==========================================================================
|
|
||||||
UTILIDAD: LEER VARIABLES CSS
|
|
||||||
========================================================================== */
|
|
||||||
|
|
||||||
function readCSSVariable(variableName, fallback = "") {
|
|
||||||
const value = getComputedStyle(document.documentElement)
|
|
||||||
.getPropertyValue(variableName)
|
|
||||||
.trim();
|
|
||||||
return value || fallback;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ==========================================================================
|
|
||||||
CONFIGURACIÓN GENERAL
|
|
||||||
========================================================================== */
|
|
||||||
|
|
||||||
const CONFIG = {
|
|
||||||
// 1. Color global configurable para TODOS los nodos verdes
|
|
||||||
greenNodesColor: readCSSVariable(CSS_VARS.greenNodesColor),
|
|
||||||
greenStrokeColor: readCSSVariable(CSS_VARS.greenStrokeColor),
|
|
||||||
|
|
||||||
// 2. Estilos de líneas punteadas y dinámicas
|
|
||||||
linkLineColor: readCSSVariable(CSS_VARS.linkLineColor),
|
|
||||||
linkGreenColor: readCSSVariable(CSS_VARS.linkGreenColor),
|
|
||||||
linkActiveColor: readCSSVariable(CSS_VARS.linkActiveColor),
|
|
||||||
purpleCoreLineColor: readCSSVariable(CSS_VARS.purpleCoreLineColor),
|
|
||||||
shadowCanva: readCSSVariable(CSS_VARS.shadowCanva),
|
|
||||||
textMain: readCSSVariable(CSS_VARS.textMain),
|
|
||||||
textInverse: readCSSVariable(CSS_VARS.textInverse),
|
|
||||||
|
|
||||||
// 3. Nodos VIOLETAS centrales (posiciones, color individual, leyenda)
|
|
||||||
purpleNodes: [
|
|
||||||
{
|
|
||||||
id: "p_top",
|
|
||||||
x: 615, y: 185,
|
|
||||||
radius: 42,
|
|
||||||
label: "Excellence",
|
|
||||||
color: readCSSVariable(PURPLE_NODE_VARS.p_top),
|
|
||||||
desc: "Servidor central de control y despacho de tareas."
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p_bottom",
|
|
||||||
x: 615, y: 335,
|
|
||||||
radius: 42,
|
|
||||||
label: "Digital",
|
|
||||||
color: readCSSVariable(PURPLE_NODE_VARS.p_bottom),
|
|
||||||
desc: "Base de datos y redundancia estructural sur."
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p_left",
|
|
||||||
x: 485, y: 260,
|
|
||||||
radius: 42,
|
|
||||||
label: "Academy",
|
|
||||||
color: readCSSVariable(PURPLE_NODE_VARS.p_left),
|
|
||||||
desc: "Pasarela occidental hacia submódulos de entrada."
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p_right",
|
|
||||||
x: 745, y: 260,
|
|
||||||
radius: 42,
|
|
||||||
label: "Projects",
|
|
||||||
color: readCSSVariable(PURPLE_NODE_VARS.p_right),
|
|
||||||
desc: "Concentrador oriental hacia subredes de distribución."
|
|
||||||
}
|
|
||||||
],
|
|
||||||
|
|
||||||
// 4. Nodos AMARILLOS: Cada uno conectado a 2 VIOLETAS
|
|
||||||
yellowNodes: [
|
|
||||||
// --- Lado Izquierdo ---
|
|
||||||
{ id: "yl_1", x: 420, y: 130, r: 26, label: "5S", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Capacitación e Impmentación", purpleTargets: ["p_top", "p_left"], side: "left" },
|
|
||||||
{ id: "yl_2", x: 350, y: 165, r: 24, label: "ISO 9001", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Certificación", purpleTargets: ["p_top", "p_left"], side: "left" },
|
|
||||||
{ id: "yl_3", x: 355, y: 245, r: 25, label: "KAIZEN", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Modificación de Procesos", purpleTargets: ["p_left", "p_top"], side: "left" },
|
|
||||||
{ id: "yl_4", x: 335, y: 335, r: 26, label: "BPM", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Automatización de Procesos de Venta", purpleTargets: ["p_left", "p_bottom"], side: "left" },
|
|
||||||
{ id: "yl_5", x: 395, y: 415, r: 28, label: "KPI", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Implementación y Monitoreo", purpleTargets: ["p_bottom", "p_left"], side: "left" },
|
|
||||||
{ id: "yl_6", x: 255, y: 350, r: 25, label: "PDCA", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Capacitación y Mejora de Taller", purpleTargets: ["p_left", "p_bottom"], side: "left" },
|
|
||||||
|
|
||||||
// --- Lado Derecho ---
|
|
||||||
{ id: "yr_1", x: 800, y: 135, r: 25, label: "BPR", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Capacitación e Impmentación", purpleTargets: ["p_top", "p_right"], side: "right" },
|
|
||||||
{ id: "yr_2", x: 875, y: 155, r: 25, label: "ISO45001", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Certificación", purpleTargets: ["p_top", "p_right"], side: "right" },
|
|
||||||
{ id: "yr_3", x: 950, y: 195, r: 25, label: "LEAN", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Modificación de Procesos", purpleTargets: ["p_right", "p_top"], side: "right" },
|
|
||||||
{ id: "yr_4", x: 875, y: 235, r: 25, label: "ISO14001", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Automatización de Procesos de Venta", purpleTargets: ["p_right", "p_top"], side: "right" },
|
|
||||||
{ id: "yr_5", x: 890, y: 300, r: 25, label: "PMO", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Mejoras en procedimientos de Atención de situaciones críticas", purpleTargets: ["p_right", "p_bottom"], side: "right" },
|
|
||||||
{ id: "yr_6", x: 965, y: 345, r: 25, label: "SIGMA", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Capacitación y Mejora de Taller", purpleTargets: ["p_right", "p_bottom"], side: "right" },
|
|
||||||
{ id: "yr_7", x: 890, y: 375, r: 25, label: "IA", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Automatización de Toma de Decisiones", purpleTargets: ["p_bottom", "p_right"], side: "right" },
|
|
||||||
{ id: "yr_8", x: 830, y: 420, r: 26, label: "RPA", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Implementación y Monitoreo", purpleTargets: ["p_bottom", "p_right"], side: "right" }
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
/* ==========================================================================
|
|
||||||
MOTOR INTERACTIVO Y RENDERIZADO
|
|
||||||
========================================================================== */
|
|
||||||
|
|
||||||
const canvas = document.getElementById("networkCanvas");
|
|
||||||
const ctx = canvas.getContext("2d");
|
|
||||||
const tooltip = document.getElementById("tooltip");
|
|
||||||
const tooltipTitle = document.getElementById("tooltip-title");
|
|
||||||
const tooltipDesc = document.getElementById("tooltip-desc");
|
|
||||||
|
|
||||||
let nodes = [];
|
|
||||||
let links = [];
|
|
||||||
let hoveredNode = null;
|
|
||||||
let dashOffset = 0;
|
|
||||||
|
|
||||||
// Construcción de la estructura
|
|
||||||
function initNetwork() {
|
|
||||||
nodes = [];
|
|
||||||
links = [];
|
|
||||||
const linkSet = new Set(); // Previene enlaces duplicados entre mismos nodos
|
|
||||||
|
|
||||||
function addLink(fromId, toId, type, curved = false, curvature = 0) {
|
|
||||||
const keyA = `${fromId}->${toId}`;
|
|
||||||
const keyB = `${toId}->${fromId}`;
|
|
||||||
if (linkSet.has(keyA) || linkSet.has(keyB)) return;
|
|
||||||
linkSet.add(keyA);
|
|
||||||
links.push({ from: fromId, to: toId, type, curved, curvature });
|
|
||||||
}
|
|
||||||
|
|
||||||
// 1. Agregar Nodos Violetas
|
|
||||||
CONFIG.purpleNodes.forEach(p => {
|
|
||||||
nodes.push({
|
|
||||||
...p,
|
|
||||||
type: "purple",
|
|
||||||
baseX: p.x,
|
|
||||||
baseY: p.y,
|
|
||||||
speedOffset: Math.random() * 10
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Conectar los violetas entre sí (malla central)
|
|
||||||
const purples = nodes.filter(n => n.type === "purple");
|
|
||||||
for (let i = 0; i < purples.length; i++) {
|
|
||||||
for (let j = i + 1; j < purples.length; j++) {
|
|
||||||
addLink(purples[i].id, purples[j].id, "purple-purple", false);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 2. Agregar Nodos Amarillos y crear DOBLE conexión curva hacia los violetas
|
|
||||||
CONFIG.yellowNodes.forEach((y) => {
|
|
||||||
nodes.push({
|
|
||||||
id: y.id,
|
|
||||||
x: y.x,
|
|
||||||
y: y.y,
|
|
||||||
baseX: y.x,
|
|
||||||
baseY: y.y,
|
|
||||||
radius: y.r,
|
|
||||||
label: y.label,
|
|
||||||
color: y.color,
|
|
||||||
desc: y.desc,
|
|
||||||
side: y.side,
|
|
||||||
type: "yellow",
|
|
||||||
speedOffset: Math.random() * 10
|
|
||||||
});
|
|
||||||
|
|
||||||
if (Array.isArray(y.purpleTargets)) {
|
|
||||||
y.purpleTargets.forEach((targetPurpleId, index) => {
|
|
||||||
addLink(
|
|
||||||
targetPurpleId,
|
|
||||||
y.id,
|
|
||||||
"purple-yellow",
|
|
||||||
true,
|
|
||||||
index === 0 ? 0.16 : -0.16
|
|
||||||
);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// 3. Crear Nodos Verdes Terciarios
|
|
||||||
const greenPositions = [
|
|
||||||
// Lado Izquierdo
|
|
||||||
{ id: "gl_1", x: 190, y: 95, side: "left" },
|
|
||||||
{ id: "gl_2", x: 260, y: 120, side: "left" },
|
|
||||||
{ id: "gl_3", x: 140, y: 155, side: "left" },
|
|
||||||
{ id: "gl_4", x: 75, y: 150, side: "left" },
|
|
||||||
{ id: "gl_5", x: 130, y: 225, side: "left" },
|
|
||||||
{ id: "gl_6", x: 65, y: 230, side: "left" },
|
|
||||||
{ id: "gl_7", x: 195, y: 235, side: "left" },
|
|
||||||
{ id: "gl_8", x: 60, y: 290, side: "left" },
|
|
||||||
{ id: "gl_9", x: 165, y: 305, side: "left" },
|
|
||||||
{ id: "gl_10", x: 75, y: 375, side: "left" },
|
|
||||||
{ id: "gl_11", x: 140, y: 380, side: "left" },
|
|
||||||
{ id: "gl_12", x: 145, y: 440, side: "left" },
|
|
||||||
{ id: "gl_13", x: 235, y: 425, side: "left" },
|
|
||||||
|
|
||||||
// Lado Derecho
|
|
||||||
{ id: "gr_1", x: 1040, y: 90, side: "right" },
|
|
||||||
{ id: "gr_2", x: 960, y: 110, side: "right" },
|
|
||||||
{ id: "gr_3", x: 1025, y: 150, side: "right" },
|
|
||||||
{ id: "gr_4", x: 1095, y: 155, side: "right" },
|
|
||||||
{ id: "gr_5", x: 1160, y: 150, side: "right" },
|
|
||||||
{ id: "gr_6", x: 1030, y: 220, side: "right" },
|
|
||||||
{ id: "gr_7", x: 1105, y: 215, side: "right" },
|
|
||||||
{ id: "gr_8", x: 1170, y: 225, side: "right" },
|
|
||||||
{ id: "gr_9", x: 1060, y: 285, side: "right" },
|
|
||||||
{ id: "gr_10", x: 1120, y: 305, side: "right" },
|
|
||||||
{ id: "gr_11", x: 1175, y: 290, side: "right" },
|
|
||||||
{ id: "gr_12", x: 1025, y: 335, side: "right" },
|
|
||||||
{ id: "gr_13", x: 1095, y: 350, side: "right" },
|
|
||||||
{ id: "gr_14", x: 1035, y: 400, side: "right" },
|
|
||||||
{ id: "gr_15", x: 1085, y: 435, side: "right" },
|
|
||||||
{ id: "gr_16", x: 1165, y: 385, side: "right" },
|
|
||||||
{ id: "gr_17", x: 970, y: 425, side: "right" }
|
|
||||||
];
|
];
|
||||||
|
|
||||||
greenPositions.forEach(g => {
|
const conexiones = [
|
||||||
nodes.push({
|
{ id: 'arcL', from: 'tl', to: 'bl', type: 'vertical', curveOut: -180 },
|
||||||
id: g.id,
|
{ id: 'c1', from: 'tl', to: 'c', type: 'horizontal', curveOut: 0 },
|
||||||
x: g.x,
|
{ id: 'c2', from: 'bl', to: 'c', type: 'horizontal', curveOut: 0 },
|
||||||
y: g.y,
|
{ id: 'arcR', from: 'tr', to: 'br', type: 'vertical', curveOut: 180 },
|
||||||
baseX: g.x,
|
{ id: 'c3', from: 'tr', to: 'c', type: 'horizontal', curveOut: 0 },
|
||||||
baseY: g.y,
|
{ id: 'c4', from: 'br', to: 'c', type: 'horizontal', curveOut: 0 }
|
||||||
radius: 14,
|
];
|
||||||
type: "green",
|
|
||||||
side: g.side,
|
const contenedorNodos = document.getElementById('grupo-nodos');
|
||||||
speedOffset: Math.random() * 10
|
const grupoLineas = document.getElementById('grupo-lineas');
|
||||||
});
|
const svgDefs = document.getElementById('svg-defs');
|
||||||
|
const nodosMap = {};
|
||||||
|
|
||||||
|
// 1. Renderizado de Nodos HTML (AHORA FIJOS)
|
||||||
|
nodosData.forEach(nodo => {
|
||||||
|
nodosMap[nodo.id] = nodo;
|
||||||
|
|
||||||
|
const el = document.createElement('div');
|
||||||
|
el.className = 'nodo-circulo';
|
||||||
|
el.id = `node-${nodo.id}`;
|
||||||
|
el.style.backgroundColor = nodo.color; // Lo comento para que el fondo sea blanco y se vea bien tu logo, descomenta si prefieres el fondo de color
|
||||||
|
//el.style.border = `4px solid ${nodo.color}`; // Agrego un borde con el color corporativo
|
||||||
|
el.style.width = `${(nodo.r * 2 / 1000) * 100}%`;
|
||||||
|
el.style.height = `${(nodo.r * 2 / 500) * 100}%`;
|
||||||
|
|
||||||
|
// Asignamos la posición una única vez
|
||||||
|
nodo.x = nodo.x0;
|
||||||
|
nodo.y = nodo.y0;
|
||||||
|
el.style.left = `${(nodo.x / 1000) * 100}%`;
|
||||||
|
el.style.top = `${(nodo.y / 500) * 100}%`;
|
||||||
|
|
||||||
|
const content = document.createElement('div');
|
||||||
|
content.className = 'nodo-contenido';
|
||||||
|
content.innerHTML = nodo.html;
|
||||||
|
|
||||||
|
el.appendChild(content);
|
||||||
|
contenedorNodos.appendChild(el);
|
||||||
|
nodo.el = el;
|
||||||
});
|
});
|
||||||
|
|
||||||
// 4. CONEXIÓN AMARILLOS <-> VERDES (cobertura total en ambas direcciones)
|
const offsetsLineas = [-12, -6, 0, 6, 12];
|
||||||
const yellows = nodes.filter(n => n.type === "yellow");
|
|
||||||
const greens = nodes.filter(n => n.type === "green");
|
|
||||||
|
|
||||||
// PASO A: cada amarillo con al menos 1 verde
|
// 2. Pre-calcular rutas y gradientes (UNA SOLA VEZ)
|
||||||
yellows.forEach((yNode, idx) => {
|
conexiones.forEach(conn => {
|
||||||
const candidateGreens = greens.filter(g => g.side === yNode.side);
|
const n1 = nodosMap[conn.from];
|
||||||
candidateGreens.sort((a, b) => {
|
const n2 = nodosMap[conn.to];
|
||||||
const distA = Math.hypot(a.baseX - yNode.baseX, a.baseY - yNode.baseY);
|
const isHoriz = conn.type === 'horizontal';
|
||||||
const distB = Math.hypot(b.baseX - yNode.baseX, b.baseY - yNode.baseY);
|
|
||||||
return distA - distB;
|
|
||||||
});
|
|
||||||
|
|
||||||
if (candidateGreens.length > 0) {
|
conn.rutasCache = {}; // Diccionario para guardar las rutas
|
||||||
addLink(
|
|
||||||
yNode.id,
|
|
||||||
candidateGreens[0].id,
|
|
||||||
"yellow-green",
|
|
||||||
true,
|
|
||||||
idx % 2 === 0 ? 0.20 : -0.20
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// PASO B: cada verde con al menos 1 amarillo
|
// Crear y fijar Gradiente
|
||||||
greens.forEach((gNode, idx) => {
|
const gradId = `grad-${conn.from}-${conn.to}`;
|
||||||
const alreadyConnected = links.some(
|
const grad = document.createElementNS('http://www.w3.org/2000/svg', 'linearGradient');
|
||||||
l => l.type === "yellow-green" && (l.from === gNode.id || l.to === gNode.id)
|
grad.setAttribute('id', gradId);
|
||||||
);
|
grad.setAttribute('gradientUnits', 'userSpaceOnUse');
|
||||||
|
grad.setAttribute('x1', n1.x);
|
||||||
|
grad.setAttribute('y1', n1.y);
|
||||||
|
grad.setAttribute('x2', n2.x);
|
||||||
|
grad.setAttribute('y2', n2.y);
|
||||||
|
|
||||||
const candidateYellows = yellows.filter(y => y.side === gNode.side);
|
const stop1 = document.createElementNS('http://www.w3.org/2000/svg', 'stop');
|
||||||
candidateYellows.sort((a, b) => {
|
stop1.setAttribute('offset', '0%');
|
||||||
const distA = Math.hypot(a.baseX - gNode.baseX, a.baseY - gNode.baseY);
|
stop1.setAttribute('stop-color', n1.color);
|
||||||
const distB = Math.hypot(b.baseX - gNode.baseX, b.baseY - gNode.baseY);
|
|
||||||
return distA - distB;
|
|
||||||
});
|
|
||||||
|
|
||||||
if (!alreadyConnected && candidateYellows.length > 0) {
|
const stop2 = document.createElementNS('http://www.w3.org/2000/svg', 'stop');
|
||||||
addLink(
|
stop2.setAttribute('offset', '100%');
|
||||||
candidateYellows[0].id,
|
const colorTarget = n2.id === 'c' ? '#0e626e' : n2.color;
|
||||||
gNode.id,
|
stop2.setAttribute('stop-color', colorTarget);
|
||||||
"yellow-green",
|
|
||||||
true,
|
|
||||||
idx % 2 === 0 ? -0.22 : 0.22
|
|
||||||
);
|
|
||||||
} else if (candidateYellows.length > 1 && idx % 3 === 0) {
|
|
||||||
addLink(
|
|
||||||
candidateYellows[1].id,
|
|
||||||
gNode.id,
|
|
||||||
"yellow-green",
|
|
||||||
true,
|
|
||||||
idx % 2 === 0 ? 0.26 : -0.26
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Bucle de actualización (flotación en zona segura)
|
grad.appendChild(stop1);
|
||||||
function update(time) {
|
grad.appendChild(stop2);
|
||||||
const maxOffset = 4.5;
|
svgDefs.appendChild(grad);
|
||||||
|
|
||||||
nodes.forEach(node => {
|
// Función matemática
|
||||||
if (hoveredNode && hoveredNode.id === node.id) {
|
const calcularRuta = (offsetX, offsetY) => {
|
||||||
node.x = node.baseX;
|
let cp1x, cp1y, cp2x, cp2y;
|
||||||
node.y = node.baseY;
|
if (isHoriz) {
|
||||||
return;
|
const distanciaX = n2.x - n1.x;
|
||||||
}
|
cp1x = n1.x + distanciaX * 0.5;
|
||||||
|
cp1y = n1.y;
|
||||||
const t = (time * 0.0016) + node.speedOffset;
|
cp2x = n2.x - distanciaX * 0.5;
|
||||||
node.x = node.baseX + Math.sin(t) * maxOffset;
|
cp2y = n2.y;
|
||||||
node.y = node.baseY + Math.cos(t * 0.85) * (maxOffset * 0.75);
|
|
||||||
});
|
|
||||||
|
|
||||||
dashOffset -= 0.35;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Renderizado de líneas curvadas
|
|
||||||
function drawConnection(source, target, link, isHighlight) {
|
|
||||||
ctx.save();
|
|
||||||
ctx.beginPath();
|
|
||||||
ctx.moveTo(source.x, source.y);
|
|
||||||
|
|
||||||
if (link.curved) {
|
|
||||||
const midX = (source.x + target.x) / 2;
|
|
||||||
const midY = (source.y + target.y) / 2;
|
|
||||||
const dx = target.x - source.x;
|
|
||||||
const dy = target.y - source.y;
|
|
||||||
const dist = Math.hypot(dx, dy);
|
|
||||||
|
|
||||||
const nx = -dy / dist;
|
|
||||||
const ny = dx / dist;
|
|
||||||
|
|
||||||
const arcHeight = dist * link.curvature;
|
|
||||||
const cpX = midX + nx * arcHeight;
|
|
||||||
const cpY = midY + ny * arcHeight;
|
|
||||||
|
|
||||||
ctx.quadraticCurveTo(cpX, cpY, target.x, target.y);
|
|
||||||
} else {
|
} else {
|
||||||
ctx.lineTo(target.x, target.y);
|
cp1x = n1.x + conn.curveOut;
|
||||||
|
cp1y = n1.y;
|
||||||
|
cp2x = n2.x + conn.curveOut;
|
||||||
|
cp2y = n2.y;
|
||||||
}
|
}
|
||||||
|
return `M ${n1.x + offsetX} ${n1.y + offsetY} C ${cp1x + offsetX} ${cp1y + offsetY}, ${cp2x + offsetX} ${cp2y + offsetY}, ${n2.x + offsetX} ${n2.y + offsetY}`;
|
||||||
if (link.type === "purple-purple") {
|
|
||||||
ctx.setLineDash([4, 4]);
|
|
||||||
ctx.lineDashOffset = dashOffset * 0.5;
|
|
||||||
ctx.strokeStyle = isHighlight ? CONFIG.linkActiveColor : CONFIG.purpleCoreLineColor;
|
|
||||||
ctx.lineWidth = isHighlight ? 2.6 : 1.8;
|
|
||||||
} else if (link.type === "yellow-green") {
|
|
||||||
ctx.setLineDash([3, 4]);
|
|
||||||
ctx.lineDashOffset = dashOffset;
|
|
||||||
ctx.strokeStyle = isHighlight ? CONFIG.linkActiveColor : CONFIG.linkGreenColor;
|
|
||||||
ctx.lineWidth = isHighlight ? 2.0 : 0.95;
|
|
||||||
} else {
|
|
||||||
ctx.setLineDash([3, 4]);
|
|
||||||
ctx.lineDashOffset = dashOffset;
|
|
||||||
ctx.strokeStyle = isHighlight ? CONFIG.linkActiveColor : CONFIG.linkLineColor;
|
|
||||||
ctx.lineWidth = isHighlight ? 2.0 : 1.05;
|
|
||||||
}
|
|
||||||
|
|
||||||
ctx.stroke();
|
|
||||||
ctx.restore();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Renderizado del Canvas
|
|
||||||
function draw() {
|
|
||||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
||||||
const nodeMap = new Map(nodes.map(n => [n.id, n]));
|
|
||||||
|
|
||||||
// 1. Dibujar líneas
|
|
||||||
links.forEach(link => {
|
|
||||||
const s = nodeMap.get(link.from);
|
|
||||||
const t = nodeMap.get(link.to);
|
|
||||||
if (!s || !t) return;
|
|
||||||
|
|
||||||
const isHighlight = hoveredNode && (hoveredNode.id === s.id || hoveredNode.id === t.id);
|
|
||||||
drawConnection(s, t, link, isHighlight);
|
|
||||||
});
|
|
||||||
|
|
||||||
// 2. Dibujar nodos
|
|
||||||
nodes.forEach(node => {
|
|
||||||
ctx.save();
|
|
||||||
ctx.beginPath();
|
|
||||||
ctx.arc(node.x, node.y, node.radius, 0, Math.PI * 2);
|
|
||||||
|
|
||||||
if (node.type === "purple") {
|
|
||||||
ctx.fillStyle = node.color;
|
|
||||||
ctx.strokeStyle = node.color;
|
|
||||||
ctx.lineWidth = 1.8;
|
|
||||||
} else if (node.type === "yellow") {
|
|
||||||
ctx.fillStyle = node.color;
|
|
||||||
ctx.strokeStyle = node.color;
|
|
||||||
ctx.lineWidth = 1.3;
|
|
||||||
} else {
|
|
||||||
ctx.fillStyle = CONFIG.greenNodesColor;
|
|
||||||
ctx.strokeStyle = CONFIG.greenStrokeColor;
|
|
||||||
ctx.lineWidth = 1.1;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (hoveredNode && hoveredNode.id === node.id) {
|
|
||||||
ctx.shadowColor = CONFIG.shadowCanva;
|
|
||||||
ctx.shadowBlur = 14;
|
|
||||||
}
|
|
||||||
|
|
||||||
ctx.fill();
|
|
||||||
ctx.stroke();
|
|
||||||
ctx.restore();
|
|
||||||
|
|
||||||
// 3. Texto en nodos violetas y amarillos
|
|
||||||
if (node.label) {
|
|
||||||
ctx.save();
|
|
||||||
ctx.textAlign = "center";
|
|
||||||
ctx.textBaseline = "middle";
|
|
||||||
|
|
||||||
if (node.type === "purple") {
|
|
||||||
ctx.fillStyle = "#ffffff";
|
|
||||||
ctx.font = "bold 12.5px system-ui, sans-serif";
|
|
||||||
} else if (node.type === "yellow") {
|
|
||||||
ctx.fillStyle = "#ffffff";
|
|
||||||
ctx.font = "600 10.5px system-ui, sans-serif";
|
|
||||||
}
|
|
||||||
|
|
||||||
ctx.fillText(node.label, node.x, node.y);
|
|
||||||
ctx.restore();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Loop 60 FPS
|
|
||||||
function animate(time) {
|
|
||||||
update(time);
|
|
||||||
draw();
|
|
||||||
requestAnimationFrame(animate);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Coordenadas con soporte responsivo
|
|
||||||
function getCanvasCoordinates(e) {
|
|
||||||
const rect = canvas.getBoundingClientRect();
|
|
||||||
const scaleX = canvas.width / rect.width;
|
|
||||||
const scaleY = canvas.height / rect.height;
|
|
||||||
|
|
||||||
return {
|
|
||||||
x: (e.clientX - rect.left) * scaleX,
|
|
||||||
y: (e.clientY - rect.top) * scaleY,
|
|
||||||
cssX: e.clientX - rect.left,
|
|
||||||
cssY: e.clientY - rect.top
|
|
||||||
};
|
};
|
||||||
}
|
|
||||||
|
|
||||||
// Eventos de Mouse
|
// Dibujar y Cachear las 5 líneas base
|
||||||
canvas.addEventListener("mousemove", (e) => {
|
conn.pathsBase = [];
|
||||||
const { x, y, cssX, cssY } = getCanvasCoordinates(e);
|
offsetsLineas.forEach(offset => {
|
||||||
|
const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
|
||||||
|
path.classList.add('linea-base');
|
||||||
|
path.setAttribute('stroke', `url(#${gradId})`);
|
||||||
|
|
||||||
const targets = nodes.filter(n => n.type === "purple" || n.type === "yellow");
|
const rutaCalculada = calcularRuta(isHoriz ? 0 : offset, isHoriz ? offset : 0);
|
||||||
let found = null;
|
path.setAttribute('d', rutaCalculada);
|
||||||
|
conn.rutasCache[offset] = rutaCalculada; // Guardado en caché
|
||||||
|
|
||||||
for (let node of targets) {
|
grupoLineas.appendChild(path);
|
||||||
if (Math.hypot(node.x - x, node.y - y) <= node.radius) {
|
conn.pathsBase.push({ el: path, offset: offset });
|
||||||
found = node;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
hoveredNode = found;
|
|
||||||
|
|
||||||
if (hoveredNode) {
|
|
||||||
canvas.style.cursor = "pointer";
|
|
||||||
tooltipTitle.textContent = hoveredNode.label;
|
|
||||||
tooltipDesc.textContent = hoveredNode.desc;
|
|
||||||
|
|
||||||
tooltip.style.left = `${cssX}px`;
|
|
||||||
tooltip.style.top = `${cssY - (hoveredNode.radius * (canvas.getBoundingClientRect().height / canvas.height))}px`;
|
|
||||||
tooltip.classList.remove("hidden");
|
|
||||||
} else {
|
|
||||||
canvas.style.cursor = "default";
|
|
||||||
tooltip.classList.add("hidden");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
canvas.addEventListener("mouseleave", () => {
|
|
||||||
hoveredNode = null;
|
|
||||||
tooltip.classList.add("hidden");
|
|
||||||
});
|
|
||||||
|
|
||||||
/* ==========================================================================
|
|
||||||
SOPORTE DE TEMA CLARO / OSCURO
|
|
||||||
--------------------------------------------------------------------------
|
|
||||||
- Re-lee las variables CSS y actualiza CONFIG + nodos vivos.
|
|
||||||
- Observa cambios de `data-theme` o `class` en <html> y <body>.
|
|
||||||
========================================================================== */
|
|
||||||
|
|
||||||
function refreshColorsFromCSS() {
|
|
||||||
// 1. Colores globales
|
|
||||||
CONFIG.greenNodesColor = readCSSVariable(CSS_VARS.greenNodesColor, CONFIG.greenNodesColor);
|
|
||||||
CONFIG.greenStrokeColor = readCSSVariable(CSS_VARS.greenStrokeColor, CONFIG.greenStrokeColor);
|
|
||||||
CONFIG.linkLineColor = readCSSVariable(CSS_VARS.linkLineColor, CONFIG.linkLineColor);
|
|
||||||
CONFIG.linkGreenColor = readCSSVariable(CSS_VARS.linkGreenColor, CONFIG.linkGreenColor);
|
|
||||||
CONFIG.linkActiveColor = readCSSVariable(CSS_VARS.linkActiveColor, CONFIG.linkActiveColor);
|
|
||||||
CONFIG.purpleCoreLineColor = readCSSVariable(CSS_VARS.purpleCoreLineColor, CONFIG.purpleCoreLineColor);
|
|
||||||
|
|
||||||
// 2. Colores de violetas en CONFIG
|
|
||||||
CONFIG.purpleNodes.forEach(p => {
|
|
||||||
const cssVar = PURPLE_NODE_VARS[p.id];
|
|
||||||
if (cssVar) p.color = readCSSVariable(cssVar, p.color);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
// 3. Colores de amarillos en CONFIG
|
// Crear pulsos
|
||||||
CONFIG.yellowNodes.forEach(y => {
|
conn.pulsos = [];
|
||||||
y.color = readCSSVariable(YELLOW_NODE_VAR, y.color);
|
const cantPulsos = 10;
|
||||||
});
|
|
||||||
|
|
||||||
// 4. Propagar a los nodos ya instanciados
|
for (let i = 0; i < cantPulsos; i++) {
|
||||||
nodes.forEach(node => {
|
const pathPulso = document.createElementNS('http://www.w3.org/2000/svg', 'path');
|
||||||
if (node.type === "purple" && PURPLE_NODE_VARS[node.id]) {
|
pathPulso.classList.add('linea-pulso');
|
||||||
node.color = readCSSVariable(PURPLE_NODE_VARS[node.id], node.color);
|
|
||||||
} else if (node.type === "yellow") {
|
|
||||||
node.color = readCSSVariable(YELLOW_NODE_VAR, node.color);
|
|
||||||
}
|
|
||||||
// Los verdes leen CONFIG.greenNodesColor directo en draw(), no requieren update propio
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function watchThemeChanges() {
|
const carrilInicial = offsetsLineas[Math.floor(Math.random() * offsetsLineas.length)];
|
||||||
const observer = new MutationObserver(() => {
|
pathPulso.setAttribute('d', conn.rutasCache[carrilInicial]); // Le asignamos su ruta desde la caché
|
||||||
refreshColorsFromCSS();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Observa <html> (habitual en data-theme) y <body> (por si acaso)
|
grupoLineas.appendChild(pathPulso);
|
||||||
observer.observe(document.documentElement, {
|
|
||||||
attributes: true,
|
|
||||||
attributeFilter: ["data-theme", "class"]
|
|
||||||
});
|
|
||||||
|
|
||||||
if (document.body) {
|
conn.pulsos.push({
|
||||||
observer.observe(document.body, {
|
el: pathPulso,
|
||||||
attributes: true,
|
currentOffset: carrilInicial,
|
||||||
attributeFilter: ["data-theme", "class"]
|
needsPathUpdate: false, // Bandera de optimización
|
||||||
|
dash: (1200 / cantPulsos) * i + Math.random() * 50,
|
||||||
|
speed: 2.0 + Math.random() * 1.5
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
});
|
||||||
|
|
||||||
// Inicialización
|
// 3. Lógica de salto entre carriles
|
||||||
initNetwork();
|
setInterval(() => {
|
||||||
watchThemeChanges();
|
conexiones.forEach(conn => {
|
||||||
requestAnimationFrame(animate);
|
conn.pulsos.forEach(p => {
|
||||||
|
if (Math.random() > 0.8) {
|
||||||
|
p.currentOffset = offsetsLineas[Math.floor(Math.random() * offsetsLineas.length)];
|
||||||
|
p.needsPathUpdate = true; // Avisamos que en el próximo frame debe cambiar de ruta
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}, 1200);
|
||||||
|
|
||||||
|
// 4. Motor de Animación Ultraligero
|
||||||
|
function animarFrame() {
|
||||||
|
conexiones.forEach(conn => {
|
||||||
|
conn.pulsos.forEach(p => {
|
||||||
|
p.dash -= p.speed;
|
||||||
|
|
||||||
|
// OPTIMIZACIÓN EXTREMA: Solo interactuamos con el DOM si el pulso saltó de carril
|
||||||
|
if (p.needsPathUpdate) {
|
||||||
|
p.el.setAttribute('d', conn.rutasCache[p.currentOffset]);
|
||||||
|
p.needsPathUpdate = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Lo único que se actualiza contínuamente es el desplazamiento
|
||||||
|
p.el.style.strokeDashoffset = p.dash;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
requestAnimationFrame(animarFrame);
|
||||||
|
}
|
||||||
|
|
||||||
|
animarFrame();
|
||||||
@@ -1,727 +0,0 @@
|
|||||||
// Mapa: propiedad de CONFIG -> nombre de variable CSS
|
|
||||||
const CSS_VARS = {
|
|
||||||
greenNodesColor: "--ide-primary",
|
|
||||||
greenStrokeColor: "--ide-primary-light",
|
|
||||||
linkLineColor: "--ide-primary-line",
|
|
||||||
linkGreenColor: "--ide-primary-line",
|
|
||||||
linkGreenToGreenColor: "--ide-primary-light2", // Color para líneas entre nodos verdes
|
|
||||||
linkActiveColor: "--ide-primary-light",
|
|
||||||
purpleCoreLineColor: "--ide-primary-line",
|
|
||||||
shadowCanva: "--shadow-canva",
|
|
||||||
textMain: "--text-main",
|
|
||||||
textInverse: "--text-inverse",
|
|
||||||
centerBoxBg: "--ide-center-bg", // Fondo del recuadro central
|
|
||||||
centerBoxBorder: "--ide-center-border", // Borde del recuadro central
|
|
||||||
centerBoxText: "--ide-center-text" // Texto del recuadro central
|
|
||||||
};
|
|
||||||
|
|
||||||
// Mapa: id de nodo violeta -> variable CSS
|
|
||||||
const PURPLE_NODE_VARS = {
|
|
||||||
p_top: "--ide-excellence",
|
|
||||||
p_bottom: "--ide-academy",
|
|
||||||
p_left: "--ide-projects",
|
|
||||||
p_right: "--ide-digital"
|
|
||||||
};
|
|
||||||
|
|
||||||
// Variable CSS común para todos los amarillos
|
|
||||||
const YELLOW_NODE_VAR = "--ide-primary-dark";
|
|
||||||
|
|
||||||
/* ==========================================================================
|
|
||||||
UTILIDAD: LEER VARIABLES CSS
|
|
||||||
========================================================================== */
|
|
||||||
|
|
||||||
function readCSSVariable(variableName, fallback = "") {
|
|
||||||
const value = getComputedStyle(document.documentElement)
|
|
||||||
.getPropertyValue(variableName)
|
|
||||||
.trim();
|
|
||||||
return value || fallback;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* ==========================================================================
|
|
||||||
CONFIGURACIÓN GENERAL
|
|
||||||
========================================================================== */
|
|
||||||
|
|
||||||
const CONFIG = {
|
|
||||||
// 1. Color global configurable para TODOS los nodos verdes
|
|
||||||
greenNodesColor: readCSSVariable(CSS_VARS.greenNodesColor),
|
|
||||||
greenStrokeColor: readCSSVariable(CSS_VARS.greenStrokeColor),
|
|
||||||
|
|
||||||
// 2. Estilos de líneas punteadas y dinámicas
|
|
||||||
linkLineColor: readCSSVariable(CSS_VARS.linkLineColor),
|
|
||||||
linkGreenColor: readCSSVariable(CSS_VARS.linkGreenColor),
|
|
||||||
linkGreenToGreenColor: readCSSVariable(CSS_VARS.linkGreenToGreenColor, readCSSVariable(CSS_VARS.linkGreenColor, "#24333E")),
|
|
||||||
linkActiveColor: readCSSVariable(CSS_VARS.linkActiveColor),
|
|
||||||
purpleCoreLineColor: readCSSVariable(CSS_VARS.purpleCoreLineColor),
|
|
||||||
shadowCanva: readCSSVariable(CSS_VARS.shadowCanva),
|
|
||||||
textMain: readCSSVariable(CSS_VARS.textMain),
|
|
||||||
textInverse: readCSSVariable(CSS_VARS.textInverse),
|
|
||||||
|
|
||||||
// 3. Estilos del recuadro central "EL TODO"
|
|
||||||
centerBoxBg: readCSSVariable(CSS_VARS.centerBoxBg, readCSSVariable(YELLOW_NODE_VAR, "#1b2631")),
|
|
||||||
centerBoxBorder: readCSSVariable(CSS_VARS.centerBoxBorder, readCSSVariable(CSS_VARS.purpleCoreLineColor, "#3a5160")),
|
|
||||||
centerBoxText: readCSSVariable(CSS_VARS.centerBoxText, readCSSVariable(CSS_VARS.textInverse, "#ffffff")),
|
|
||||||
|
|
||||||
// Datos del componente central
|
|
||||||
centerBox: {
|
|
||||||
id: "center_box",
|
|
||||||
label: "EL TODO",
|
|
||||||
desc: "Núcleo integrador central del sistema.",
|
|
||||||
x: 615,
|
|
||||||
y: 260,
|
|
||||||
baseX: 615,
|
|
||||||
baseY: 260,
|
|
||||||
width: 104,
|
|
||||||
height: 36,
|
|
||||||
borderRadius: 8,
|
|
||||||
speedOffset: Math.random() * 10
|
|
||||||
},
|
|
||||||
|
|
||||||
// 4. Nodos VIOLETAS centrales (posiciones, color individual, leyenda)
|
|
||||||
purpleNodes: [
|
|
||||||
{
|
|
||||||
id: "p_top",
|
|
||||||
x: 615, y: 185,
|
|
||||||
radius: 42,
|
|
||||||
label: "Excellence",
|
|
||||||
color: readCSSVariable(PURPLE_NODE_VARS.p_top),
|
|
||||||
desc: "Servidor central de control y despacho de tareas."
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p_bottom",
|
|
||||||
x: 615, y: 335,
|
|
||||||
radius: 42,
|
|
||||||
label: "Academy",
|
|
||||||
color: readCSSVariable(PURPLE_NODE_VARS.p_bottom),
|
|
||||||
desc: "Base de datos y redundancia estructural sur."
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p_left",
|
|
||||||
x: 485, y: 260,
|
|
||||||
radius: 42,
|
|
||||||
label: "Project",
|
|
||||||
color: readCSSVariable(PURPLE_NODE_VARS.p_left),
|
|
||||||
desc: "Pasarela occidental hacia submódulos de entrada."
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: "p_right",
|
|
||||||
x: 745, y: 260,
|
|
||||||
radius: 42,
|
|
||||||
label: "Digital",
|
|
||||||
color: readCSSVariable(PURPLE_NODE_VARS.p_right),
|
|
||||||
desc: "Concentrador oriental hacia subredes de distribución."
|
|
||||||
}
|
|
||||||
],
|
|
||||||
|
|
||||||
// 5. Nodos AMARILLOS: Cada uno conectado a 2 VIOLETAS
|
|
||||||
yellowNodes: [
|
|
||||||
// --- Lado Izquierdo ---
|
|
||||||
{ id: "yl_1", x: 420, y: 130, r: 26, label: "5S", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Capacitación e Impmentación", purpleTargets: ["p_top", "p_left"], side: "left" },
|
|
||||||
{ id: "yl_2", x: 350, y: 165, r: 24, label: "ISO 9001", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Certificación", purpleTargets: ["p_top", "p_left"], side: "left" },
|
|
||||||
{ id: "yl_3", x: 355, y: 245, r: 25, label: "KAIZEN", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Modificación de Procesos", purpleTargets: ["p_left", "p_top"], side: "left" },
|
|
||||||
{ id: "yl_4", x: 335, y: 335, r: 26, label: "BPM", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Automatización de Procesos de Venta", purpleTargets: ["p_left", "p_bottom"], side: "left" },
|
|
||||||
{ id: "yl_5", x: 395, y: 415, r: 28, label: "KPI", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Implementación y Monitoreo", purpleTargets: ["p_bottom", "p_left"], side: "left" },
|
|
||||||
{ id: "yl_6", x: 255, y: 350, r: 25, label: "PDCA", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Capacitación y Mejora de Taller", purpleTargets: ["p_left", "p_bottom"], side: "left" },
|
|
||||||
|
|
||||||
// --- Lado Derecho ---
|
|
||||||
{ id: "yr_1", x: 800, y: 135, r: 25, label: "BPR", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Capacitación e Impmentación", purpleTargets: ["p_top", "p_right"], side: "right" },
|
|
||||||
{ id: "yr_2", x: 875, y: 155, r: 25, label: "ISO45001", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Certificación", purpleTargets: ["p_top", "p_right"], side: "right" },
|
|
||||||
{ id: "yr_3", x: 950, y: 195, r: 25, label: "LEAN", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Modificación de Procesos", purpleTargets: ["p_right", "p_top"], side: "right" },
|
|
||||||
{ id: "yr_4", x: 875, y: 235, r: 25, label: "ISO14001", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Automatización de Procesos de Venta", purpleTargets: ["p_right", "p_top"], side: "right" },
|
|
||||||
{ id: "yr_5", x: 890, y: 300, r: 25, label: "PMO", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Mejoras en procedimientos de Atención de situaciones críticas", purpleTargets: ["p_right", "p_bottom"], side: "right" },
|
|
||||||
{ id: "yr_6", x: 965, y: 345, r: 25, label: "SIGMA", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Capacitación y Mejora de Taller", purpleTargets: ["p_right", "p_bottom"], side: "right" },
|
|
||||||
{ id: "yr_7", x: 890, y: 375, r: 25, label: "IA", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Automatización de Toma de Decisiones", purpleTargets: ["p_bottom", "p_right"], side: "right" },
|
|
||||||
{ id: "yr_8", x: 830, y: 420, r: 26, label: "RPA", color: readCSSVariable(YELLOW_NODE_VAR, "#24333E"), desc: "Implementación y Monitoreo", purpleTargets: ["p_bottom", "p_right"], side: "right" }
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
/* ==========================================================================
|
|
||||||
MOTOR INTERACTIVO Y RENDERIZADO
|
|
||||||
========================================================================== */
|
|
||||||
|
|
||||||
const canvas = document.getElementById("networkCanvas");
|
|
||||||
const ctx = canvas.getContext("2d");
|
|
||||||
const tooltip = document.getElementById("tooltip");
|
|
||||||
const tooltipTitle = document.getElementById("tooltip-title");
|
|
||||||
const tooltipDesc = document.getElementById("tooltip-desc");
|
|
||||||
|
|
||||||
let nodes = [];
|
|
||||||
let links = [];
|
|
||||||
let hoveredNode = null;
|
|
||||||
let dashOffset = 0;
|
|
||||||
|
|
||||||
// Construcción de la estructura
|
|
||||||
function initNetwork() {
|
|
||||||
nodes = [];
|
|
||||||
links = [];
|
|
||||||
const linkSet = new Set(); // Previene enlaces duplicados entre mismos nodos
|
|
||||||
|
|
||||||
function addLink(fromId, toId, type, curved = false, curvature = 0) {
|
|
||||||
const keyA = `${fromId}->${toId}`;
|
|
||||||
const keyB = `${toId}->${fromId}`;
|
|
||||||
if (linkSet.has(keyA) || linkSet.has(keyB)) return;
|
|
||||||
linkSet.add(keyA);
|
|
||||||
links.push({ from: fromId, to: toId, type, curved, curvature });
|
|
||||||
}
|
|
||||||
|
|
||||||
// 1. Agregar Nodos Violetas
|
|
||||||
CONFIG.purpleNodes.forEach(p => {
|
|
||||||
nodes.push({
|
|
||||||
...p,
|
|
||||||
type: "purple",
|
|
||||||
baseX: p.x,
|
|
||||||
baseY: p.y,
|
|
||||||
speedOffset: Math.random() * 10
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// Conectar los violetas entre sí (malla central)
|
|
||||||
const purples = nodes.filter(n => n.type === "purple");
|
|
||||||
for (let i = 0; i < purples.length; i++) {
|
|
||||||
for (let j = i + 1; j < purples.length; j++) {
|
|
||||||
addLink(purples[i].id, purples[j].id, "purple-purple", false);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 2. Agregar Nodos Amarillos y crear DOBLE conexión curva hacia los violetas
|
|
||||||
CONFIG.yellowNodes.forEach((y) => {
|
|
||||||
nodes.push({
|
|
||||||
id: y.id,
|
|
||||||
x: y.x,
|
|
||||||
y: y.y,
|
|
||||||
baseX: y.x,
|
|
||||||
baseY: y.y,
|
|
||||||
radius: y.r,
|
|
||||||
label: y.label,
|
|
||||||
color: y.color,
|
|
||||||
desc: y.desc,
|
|
||||||
side: y.side,
|
|
||||||
type: "yellow",
|
|
||||||
speedOffset: Math.random() * 10
|
|
||||||
});
|
|
||||||
|
|
||||||
if (Array.isArray(y.purpleTargets)) {
|
|
||||||
y.purpleTargets.forEach((targetPurpleId, index) => {
|
|
||||||
addLink(
|
|
||||||
targetPurpleId,
|
|
||||||
y.id,
|
|
||||||
"purple-yellow",
|
|
||||||
true,
|
|
||||||
index === 0 ? 0.16 : -0.16
|
|
||||||
);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// 3. Crear Nodos Verdes Terciarios
|
|
||||||
const greenPositions = [
|
|
||||||
// Lado Izquierdo
|
|
||||||
{ id: "gl_1", x: 190, y: 95, side: "left" },
|
|
||||||
{ id: "gl_2", x: 260, y: 120, side: "left" },
|
|
||||||
{ id: "gl_3", x: 140, y: 155, side: "left" },
|
|
||||||
{ id: "gl_4", x: 75, y: 150, side: "left" },
|
|
||||||
{ id: "gl_5", x: 130, y: 225, side: "left" },
|
|
||||||
{ id: "gl_6", x: 65, y: 230, side: "left" },
|
|
||||||
{ id: "gl_7", x: 195, y: 235, side: "left" },
|
|
||||||
{ id: "gl_8", x: 60, y: 290, side: "left" },
|
|
||||||
{ id: "gl_9", x: 165, y: 305, side: "left" },
|
|
||||||
{ id: "gl_10", x: 75, y: 375, side: "left" },
|
|
||||||
{ id: "gl_11", x: 140, y: 380, side: "left" },
|
|
||||||
{ id: "gl_12", x: 145, y: 440, side: "left" },
|
|
||||||
{ id: "gl_13", x: 235, y: 425, side: "left" },
|
|
||||||
|
|
||||||
// Lado Derecho
|
|
||||||
{ id: "gr_1", x: 1060, y: 90, side: "right" },
|
|
||||||
{ id: "gr_2", x: 960, y: 110, side: "right" },
|
|
||||||
{ id: "gr_3", x: 1025, y: 150, side: "right" },
|
|
||||||
{ id: "gr_4", x: 1095, y: 155, side: "right" },
|
|
||||||
{ id: "gr_5", x: 1160, y: 150, side: "right" },
|
|
||||||
{ id: "gr_6", x: 1030, y: 220, side: "right" },
|
|
||||||
{ id: "gr_7", x: 1105, y: 215, side: "right" },
|
|
||||||
{ id: "gr_8", x: 1170, y: 225, side: "right" },
|
|
||||||
{ id: "gr_9", x: 1060, y: 285, side: "right" },
|
|
||||||
{ id: "gr_10", x: 1120, y: 305, side: "right" },
|
|
||||||
{ id: "gr_11", x: 1175, y: 290, side: "right" },
|
|
||||||
{ id: "gr_12", x: 1025, y: 335, side: "right" },
|
|
||||||
{ id: "gr_13", x: 1095, y: 350, side: "right" },
|
|
||||||
{ id: "gr_14", x: 1035, y: 400, side: "right" },
|
|
||||||
{ id: "gr_15", x: 1085, y: 435, side: "right" },
|
|
||||||
{ id: "gr_16", x: 1165, y: 385, side: "right" },
|
|
||||||
{ id: "gr_17", x: 970, y: 425, side: "right" }
|
|
||||||
];
|
|
||||||
|
|
||||||
greenPositions.forEach(g => {
|
|
||||||
nodes.push({
|
|
||||||
id: g.id,
|
|
||||||
x: g.x,
|
|
||||||
y: g.y,
|
|
||||||
baseX: g.x,
|
|
||||||
baseY: g.y,
|
|
||||||
radius: 14,
|
|
||||||
type: "green",
|
|
||||||
side: g.side,
|
|
||||||
speedOffset: Math.random() * 10
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// 4. CONEXIÓN AMARILLOS <-> VERDES (Múltiples conexiones por verde)
|
|
||||||
const yellows = nodes.filter(n => n.type === "yellow");
|
|
||||||
const greens = nodes.filter(n => n.type === "green");
|
|
||||||
|
|
||||||
// Configura cuántos amarillos conectar a cada verde (recomendado: 2 o 3)
|
|
||||||
const YELLOWS_PER_GREEN = 2;
|
|
||||||
|
|
||||||
greens.forEach((gNode, gIdx) => {
|
|
||||||
// 1. Filtrar amarillos que pertenezcan al mismo sector (left/right)
|
|
||||||
const candidateYellows = yellows.filter(y => y.side === gNode.side);
|
|
||||||
|
|
||||||
// 2. Ordenar de menor a mayor distancia al nodo verde
|
|
||||||
candidateYellows.sort((a, b) => {
|
|
||||||
const distA = Math.hypot(a.baseX - gNode.baseX, a.baseY - gNode.baseY);
|
|
||||||
const distB = Math.hypot(b.baseX - gNode.baseX, b.baseY - gNode.baseY);
|
|
||||||
return distA - distB;
|
|
||||||
});
|
|
||||||
|
|
||||||
// 3. Tomar los N amarillos más cercanos
|
|
||||||
const targets = candidateYellows.slice(0, YELLOWS_PER_GREEN);
|
|
||||||
|
|
||||||
targets.forEach((yNode, targetRank) => {
|
|
||||||
// Alternar arco: el primero arquea hacia un lado y el segundo hacia el opuesto
|
|
||||||
// Esto previene que las líneas coincidan o se solapen
|
|
||||||
const direction = (gIdx + targetRank) % 2 === 0 ? 1 : -1;
|
|
||||||
const baseCurvature = 0.16 + (targetRank * 0.07);
|
|
||||||
const curvature = baseCurvature * direction;
|
|
||||||
|
|
||||||
addLink(
|
|
||||||
yNode.id,
|
|
||||||
gNode.id,
|
|
||||||
"yellow-green",
|
|
||||||
true,
|
|
||||||
curvature
|
|
||||||
);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
// PASO DE SEGURIDAD: asegurar que ningún amarillo quede sin al menos un verde
|
|
||||||
yellows.forEach(yNode => {
|
|
||||||
const hasConnection = links.some(
|
|
||||||
l => l.type === "yellow-green" && (l.from === yNode.id || l.to === yNode.id)
|
|
||||||
);
|
|
||||||
|
|
||||||
if (!hasConnection) {
|
|
||||||
const candidateGreens = greens.filter(g => g.side === yNode.side);
|
|
||||||
candidateGreens.sort((a, b) => {
|
|
||||||
const distA = Math.hypot(a.baseX - yNode.baseX, a.baseY - yNode.baseY);
|
|
||||||
const distB = Math.hypot(b.baseX - yNode.baseX, b.baseY - yNode.baseY);
|
|
||||||
return distA - distB;
|
|
||||||
});
|
|
||||||
|
|
||||||
if (candidateGreens.length > 0) {
|
|
||||||
addLink(yNode.id, candidateGreens[0].id, "yellow-green", true, 0.20);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// PASO B: cada verde con al menos 1 amarillo
|
|
||||||
greens.forEach((gNode, idx) => {
|
|
||||||
const alreadyConnected = links.some(
|
|
||||||
l => l.type === "yellow-green" && (l.from === gNode.id || l.to === gNode.id)
|
|
||||||
);
|
|
||||||
|
|
||||||
const candidateYellows = yellows.filter(y => y.side === gNode.side);
|
|
||||||
candidateYellows.sort((a, b) => {
|
|
||||||
const distA = Math.hypot(a.baseX - gNode.baseX, a.baseY - gNode.baseY);
|
|
||||||
const distB = Math.hypot(b.baseX - gNode.baseX, b.baseY - gNode.baseY);
|
|
||||||
return distA - distB;
|
|
||||||
});
|
|
||||||
|
|
||||||
if (!alreadyConnected && candidateYellows.length > 0) {
|
|
||||||
addLink(
|
|
||||||
candidateYellows[0].id,
|
|
||||||
gNode.id,
|
|
||||||
"yellow-green",
|
|
||||||
true,
|
|
||||||
idx % 2 === 0 ? -0.22 : 0.22
|
|
||||||
);
|
|
||||||
} else if (candidateYellows.length > 1 && idx % 3 === 0) {
|
|
||||||
addLink(
|
|
||||||
candidateYellows[1].id,
|
|
||||||
gNode.id,
|
|
||||||
"yellow-green",
|
|
||||||
true,
|
|
||||||
idx % 2 === 0 ? 0.26 : -0.26
|
|
||||||
);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// 5. CONEXIÓN VERDES <-> VERDES (mismo sector, líneas rectas)
|
|
||||||
["left", "right"].forEach(side => {
|
|
||||||
const sectorGreens = greens.filter(g => g.side === side);
|
|
||||||
sectorGreens.forEach(gNode => {
|
|
||||||
const neighbors = sectorGreens
|
|
||||||
.filter(other => other.id !== gNode.id)
|
|
||||||
.map(other => ({
|
|
||||||
id: other.id,
|
|
||||||
dist: Math.hypot(other.baseX - gNode.baseX, other.baseY - gNode.baseY)
|
|
||||||
}))
|
|
||||||
.sort((a, b) => a.dist - b.dist);
|
|
||||||
|
|
||||||
// Conecta con los 4 vecinos más cercanos del mismo sector para formar la malla limpia
|
|
||||||
neighbors.slice(0, 5).forEach(neighbor => {
|
|
||||||
if (neighbor.dist <= 130) {
|
|
||||||
addLink(gNode.id, neighbor.id, "green-green", false);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Bucle de actualización (flotación en zona segura)
|
|
||||||
function update(time) {
|
|
||||||
const maxOffset = 4.5;
|
|
||||||
|
|
||||||
nodes.forEach(node => {
|
|
||||||
if (hoveredNode && hoveredNode.id === node.id) {
|
|
||||||
node.x = node.baseX;
|
|
||||||
node.y = node.baseY;
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const t = (time * 0.0016) + node.speedOffset;
|
|
||||||
node.x = node.baseX + Math.sin(t) * maxOffset;
|
|
||||||
node.y = node.baseY + Math.cos(t * 0.85) * (maxOffset * 0.75);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Movimiento coordinado de "EL TODO" según el centroide de los nodos principales
|
|
||||||
const purples = nodes.filter(n => n.type === "purple");
|
|
||||||
if (purples.length > 0 && CONFIG.centerBox) {
|
|
||||||
const avgX = purples.reduce((sum, p) => sum + p.x, 0) / purples.length;
|
|
||||||
const avgY = purples.reduce((sum, p) => sum + p.y, 0) / purples.length;
|
|
||||||
|
|
||||||
if (hoveredNode && hoveredNode.id === CONFIG.centerBox.id) {
|
|
||||||
CONFIG.centerBox.x = 615;
|
|
||||||
CONFIG.centerBox.y = 260;
|
|
||||||
} else {
|
|
||||||
const t = (time * 0.0016) + CONFIG.centerBox.speedOffset;
|
|
||||||
CONFIG.centerBox.x = avgX + Math.sin(t) * (maxOffset * 0.45);
|
|
||||||
CONFIG.centerBox.y = avgY + Math.cos(t * 0.85) * (maxOffset * 0.35);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
//aceleracion de la red
|
|
||||||
const isCenterActive = hoveredNode && CONFIG.centerBox && hoveredNode.id === CONFIG.centerBox.id;
|
|
||||||
dashOffset -= isCenterActive ? 0.95 : 0.35;
|
|
||||||
|
|
||||||
dashOffset -= 0.35;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Renderizado de líneas curvadas y rectas
|
|
||||||
function drawConnection(source, target, link, isHighlight) {
|
|
||||||
ctx.save();
|
|
||||||
ctx.beginPath();
|
|
||||||
ctx.moveTo(source.x, source.y);
|
|
||||||
|
|
||||||
if (link.curved) {
|
|
||||||
const midX = (source.x + target.x) / 2;
|
|
||||||
const midY = (source.y + target.y) / 2;
|
|
||||||
const dx = target.x - source.x;
|
|
||||||
const dy = target.y - source.y;
|
|
||||||
const dist = Math.hypot(dx, dy);
|
|
||||||
|
|
||||||
const nx = -dy / dist;
|
|
||||||
const ny = dx / dist;
|
|
||||||
|
|
||||||
const arcHeight = dist * link.curvature;
|
|
||||||
const cpX = midX + nx * arcHeight;
|
|
||||||
const cpY = midY + ny * arcHeight;
|
|
||||||
|
|
||||||
ctx.quadraticCurveTo(cpX, cpY, target.x, target.y);
|
|
||||||
} else {
|
|
||||||
ctx.lineTo(target.x, target.y);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (link.type === "purple-purple") {
|
|
||||||
ctx.setLineDash([4, 4]);
|
|
||||||
ctx.lineDashOffset = dashOffset * 0.5;
|
|
||||||
ctx.strokeStyle = isHighlight ? CONFIG.linkActiveColor : CONFIG.purpleCoreLineColor;
|
|
||||||
ctx.lineWidth = isHighlight ? 2.6 : 1.8;
|
|
||||||
} else if (link.type === "yellow-green") {
|
|
||||||
ctx.setLineDash([3, 4]);
|
|
||||||
ctx.lineDashOffset = dashOffset;
|
|
||||||
ctx.strokeStyle = isHighlight ? CONFIG.linkActiveColor : CONFIG.linkGreenColor;
|
|
||||||
ctx.lineWidth = isHighlight ? 2.0 : 0.95;
|
|
||||||
} else if (link.type === "green-green") {
|
|
||||||
ctx.setLineDash([3, 4]);
|
|
||||||
ctx.lineDashOffset = dashOffset * 0.8;
|
|
||||||
ctx.strokeStyle = isHighlight ? CONFIG.linkActiveColor : CONFIG.linkGreenToGreenColor;
|
|
||||||
ctx.lineWidth = isHighlight ? 1.8 : 0.9;
|
|
||||||
} else {
|
|
||||||
ctx.setLineDash([3, 4]);
|
|
||||||
ctx.lineDashOffset = dashOffset;
|
|
||||||
ctx.strokeStyle = isHighlight ? CONFIG.linkActiveColor : CONFIG.linkLineColor;
|
|
||||||
ctx.lineWidth = isHighlight ? 2.0 : 1.05;
|
|
||||||
}
|
|
||||||
|
|
||||||
ctx.stroke();
|
|
||||||
ctx.restore();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Dibujo del recuadro central "EL TODO"
|
|
||||||
function drawCenterBox() {
|
|
||||||
const box = CONFIG.centerBox;
|
|
||||||
if (!box) return;
|
|
||||||
|
|
||||||
const w = box.width;
|
|
||||||
const h = box.height;
|
|
||||||
const r = box.borderRadius;
|
|
||||||
const x = box.x - w / 2;
|
|
||||||
const y = box.y - h / 2;
|
|
||||||
|
|
||||||
const isBoxHovered = hoveredNode && hoveredNode.id === box.id;
|
|
||||||
|
|
||||||
ctx.save();
|
|
||||||
ctx.beginPath();
|
|
||||||
if (ctx.roundRect) {
|
|
||||||
ctx.roundRect(x, y, w, h, r);
|
|
||||||
} else {
|
|
||||||
// Compatibilidad en navegadores antiguos
|
|
||||||
ctx.moveTo(x + r, y);
|
|
||||||
ctx.lineTo(x + w - r, y);
|
|
||||||
ctx.quadraticCurveTo(x + w, y, x + w, y + r);
|
|
||||||
ctx.lineTo(x + w, y + h - r);
|
|
||||||
ctx.quadraticCurveTo(x + w, y + h, x + w - r, y + h);
|
|
||||||
ctx.lineTo(x + r, y + h);
|
|
||||||
ctx.quadraticCurveTo(x, y + h, x, y + h - r);
|
|
||||||
ctx.lineTo(x, y + r);
|
|
||||||
ctx.quadraticCurveTo(x, y, x + r, y);
|
|
||||||
ctx.closePath();
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isBoxHovered) {
|
|
||||||
ctx.shadowColor = CONFIG.shadowCanva;
|
|
||||||
ctx.shadowBlur = 14;
|
|
||||||
} else {
|
|
||||||
ctx.shadowColor = "rgba(0, 0, 0, 0.25)";
|
|
||||||
ctx.shadowBlur = 6;
|
|
||||||
}
|
|
||||||
|
|
||||||
ctx.fillStyle = CONFIG.centerBoxBg;
|
|
||||||
ctx.fill();
|
|
||||||
|
|
||||||
ctx.strokeStyle = isBoxHovered ? CONFIG.linkActiveColor : CONFIG.centerBoxBorder;
|
|
||||||
ctx.lineWidth = isBoxHovered ? 2.0 : 1.4;
|
|
||||||
ctx.stroke();
|
|
||||||
ctx.restore();
|
|
||||||
|
|
||||||
// Texto "EL TODO"
|
|
||||||
ctx.save();
|
|
||||||
ctx.textAlign = "center";
|
|
||||||
ctx.textBaseline = "middle";
|
|
||||||
ctx.fillStyle = CONFIG.centerBoxText;
|
|
||||||
ctx.font = "bold 11.5px system-ui, sans-serif";
|
|
||||||
ctx.fillText(box.label, box.x, box.y);
|
|
||||||
ctx.restore();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Renderizado del Canvas
|
|
||||||
function draw() {
|
|
||||||
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
||||||
const nodeMap = new Map(nodes.map(n => [n.id, n]));
|
|
||||||
|
|
||||||
// 1. Dibujar líneas
|
|
||||||
const isCenterBoxHovered = hoveredNode && CONFIG.centerBox && hoveredNode.id === CONFIG.centerBox.id;
|
|
||||||
|
|
||||||
links.forEach(link => {
|
|
||||||
const s = nodeMap.get(link.from);
|
|
||||||
const t = nodeMap.get(link.to);
|
|
||||||
if (!s || !t) return;
|
|
||||||
|
|
||||||
// Se ilumina si estás sobre un nodo conectado O si estás sobre "EL TODO"
|
|
||||||
const isHighlight = isCenterBoxHovered || (hoveredNode && (hoveredNode.id === s.id || hoveredNode.id === t.id));
|
|
||||||
|
|
||||||
drawConnection(s, t, link, isHighlight);
|
|
||||||
});;
|
|
||||||
|
|
||||||
// 2. Dibujar recuadro central "EL TODO" (situado en el plano intermedio para enmascarar cruces)
|
|
||||||
drawCenterBox();
|
|
||||||
|
|
||||||
// 3. Dibujar nodos
|
|
||||||
nodes.forEach(node => {
|
|
||||||
ctx.save();
|
|
||||||
ctx.beginPath();
|
|
||||||
ctx.arc(node.x, node.y, node.radius, 0, Math.PI * 2);
|
|
||||||
|
|
||||||
if (node.type === "purple") {
|
|
||||||
ctx.fillStyle = node.color;
|
|
||||||
ctx.strokeStyle = node.color;
|
|
||||||
ctx.lineWidth = 1.8;
|
|
||||||
} else if (node.type === "yellow") {
|
|
||||||
ctx.fillStyle = node.color;
|
|
||||||
ctx.strokeStyle = node.color;
|
|
||||||
ctx.lineWidth = 1.3;
|
|
||||||
} else {
|
|
||||||
ctx.fillStyle = CONFIG.greenNodesColor;
|
|
||||||
ctx.strokeStyle = CONFIG.greenStrokeColor;
|
|
||||||
ctx.lineWidth = 1.1;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (hoveredNode && hoveredNode.id === node.id) {
|
|
||||||
ctx.shadowColor = CONFIG.shadowCanva;
|
|
||||||
ctx.shadowBlur = 14;
|
|
||||||
}
|
|
||||||
|
|
||||||
ctx.fill();
|
|
||||||
ctx.stroke();
|
|
||||||
ctx.restore();
|
|
||||||
|
|
||||||
// 4. Texto en nodos violetas y amarillos
|
|
||||||
if (node.label) {
|
|
||||||
ctx.save();
|
|
||||||
ctx.textAlign = "center";
|
|
||||||
ctx.textBaseline = "middle";
|
|
||||||
|
|
||||||
if (node.type === "purple") {
|
|
||||||
ctx.fillStyle = "#ffffff";
|
|
||||||
ctx.font = "bold 12.5px system-ui, sans-serif";
|
|
||||||
} else if (node.type === "yellow") {
|
|
||||||
ctx.fillStyle = "#ffffff";
|
|
||||||
ctx.font = "600 10.5px system-ui, sans-serif";
|
|
||||||
}
|
|
||||||
|
|
||||||
ctx.fillText(node.label, node.x, node.y);
|
|
||||||
ctx.restore();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// Loop 60 FPS
|
|
||||||
function animate(time) {
|
|
||||||
update(time);
|
|
||||||
draw();
|
|
||||||
requestAnimationFrame(animate);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Coordenadas con soporte responsivo
|
|
||||||
function getCanvasCoordinates(e) {
|
|
||||||
const rect = canvas.getBoundingClientRect();
|
|
||||||
const scaleX = canvas.width / rect.width;
|
|
||||||
const scaleY = canvas.height / rect.height;
|
|
||||||
|
|
||||||
return {
|
|
||||||
x: (e.clientX - rect.left) * scaleX,
|
|
||||||
y: (e.clientY - rect.top) * scaleY,
|
|
||||||
cssX: e.clientX - rect.left,
|
|
||||||
cssY: e.clientY - rect.top
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
// Eventos de Mouse
|
|
||||||
canvas.addEventListener("mousemove", (e) => {
|
|
||||||
const { x, y, cssX, cssY } = getCanvasCoordinates(e);
|
|
||||||
|
|
||||||
const targets = nodes.filter(n => n.type === "purple" || n.type === "yellow");
|
|
||||||
let found = null;
|
|
||||||
|
|
||||||
for (let node of targets) {
|
|
||||||
if (Math.hypot(node.x - x, node.y - y) <= node.radius) {
|
|
||||||
found = node;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Detección sobre el recuadro central "EL TODO"
|
|
||||||
if (!found && CONFIG.centerBox) {
|
|
||||||
const box = CONFIG.centerBox;
|
|
||||||
const halfW = box.width / 2;
|
|
||||||
const halfH = box.height / 2;
|
|
||||||
if (x >= box.x - halfW && x <= box.x + halfW && y >= box.y - halfH && y <= box.y + halfH) {
|
|
||||||
found = {
|
|
||||||
id: box.id,
|
|
||||||
label: box.label,
|
|
||||||
desc: box.desc,
|
|
||||||
radius: halfH,
|
|
||||||
x: box.x,
|
|
||||||
y: box.y
|
|
||||||
};
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
hoveredNode = found;
|
|
||||||
|
|
||||||
if (hoveredNode) {
|
|
||||||
canvas.style.cursor = "pointer";
|
|
||||||
tooltipTitle.textContent = hoveredNode.label;
|
|
||||||
tooltipDesc.textContent = hoveredNode.desc || "";
|
|
||||||
|
|
||||||
tooltip.style.left = `${cssX}px`;
|
|
||||||
tooltip.style.top = `${cssY - (hoveredNode.radius * (canvas.getBoundingClientRect().height / canvas.height))}px`;
|
|
||||||
tooltip.classList.remove("hidden");
|
|
||||||
} else {
|
|
||||||
canvas.style.cursor = "default";
|
|
||||||
tooltip.classList.add("hidden");
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
canvas.addEventListener("mouseleave", () => {
|
|
||||||
hoveredNode = null;
|
|
||||||
tooltip.classList.add("hidden");
|
|
||||||
});
|
|
||||||
|
|
||||||
/* ==========================================================================
|
|
||||||
SOPORTE DE TEMA CLARO / OSCURO
|
|
||||||
========================================================================== */
|
|
||||||
|
|
||||||
function refreshColorsFromCSS() {
|
|
||||||
// 1. Colores globales
|
|
||||||
CONFIG.greenNodesColor = readCSSVariable(CSS_VARS.greenNodesColor, CONFIG.greenNodesColor);
|
|
||||||
CONFIG.greenStrokeColor = readCSSVariable(CSS_VARS.greenStrokeColor, CONFIG.greenStrokeColor);
|
|
||||||
CONFIG.linkLineColor = readCSSVariable(CSS_VARS.linkLineColor, CONFIG.linkLineColor);
|
|
||||||
CONFIG.linkGreenColor = readCSSVariable(CSS_VARS.linkGreenColor, CONFIG.linkGreenColor);
|
|
||||||
CONFIG.linkGreenToGreenColor = readCSSVariable(CSS_VARS.linkGreenToGreenColor, CONFIG.linkGreenToGreenColor);
|
|
||||||
CONFIG.linkActiveColor = readCSSVariable(CSS_VARS.linkActiveColor, CONFIG.linkActiveColor);
|
|
||||||
CONFIG.purpleCoreLineColor = readCSSVariable(CSS_VARS.purpleCoreLineColor, CONFIG.purpleCoreLineColor);
|
|
||||||
CONFIG.centerBoxBg = readCSSVariable(CSS_VARS.centerBoxBg, CONFIG.centerBoxBg);
|
|
||||||
CONFIG.centerBoxBorder = readCSSVariable(CSS_VARS.centerBoxBorder, CONFIG.centerBoxBorder);
|
|
||||||
CONFIG.centerBoxText = readCSSVariable(CSS_VARS.centerBoxText, CONFIG.centerBoxText);
|
|
||||||
|
|
||||||
// 2. Colores de violetas en CONFIG
|
|
||||||
CONFIG.purpleNodes.forEach(p => {
|
|
||||||
const cssVar = PURPLE_NODE_VARS[p.id];
|
|
||||||
if (cssVar) p.color = readCSSVariable(cssVar, p.color);
|
|
||||||
});
|
|
||||||
|
|
||||||
// 3. Colores de amarillos en CONFIG
|
|
||||||
CONFIG.yellowNodes.forEach(y => {
|
|
||||||
y.color = readCSSVariable(YELLOW_NODE_VAR, y.color);
|
|
||||||
});
|
|
||||||
|
|
||||||
// 4. Propagar a los nodos ya instanciados
|
|
||||||
nodes.forEach(node => {
|
|
||||||
if (node.type === "purple" && PURPLE_NODE_VARS[node.id]) {
|
|
||||||
node.color = readCSSVariable(PURPLE_NODE_VARS[node.id], node.color);
|
|
||||||
} else if (node.type === "yellow") {
|
|
||||||
node.color = readCSSVariable(YELLOW_NODE_VAR, node.color);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
function watchThemeChanges() {
|
|
||||||
const observer = new MutationObserver(() => {
|
|
||||||
refreshColorsFromCSS();
|
|
||||||
});
|
|
||||||
|
|
||||||
observer.observe(document.documentElement, {
|
|
||||||
attributes: true,
|
|
||||||
attributeFilter: ["data-theme", "class"]
|
|
||||||
});
|
|
||||||
|
|
||||||
if (document.body) {
|
|
||||||
observer.observe(document.body, {
|
|
||||||
attributes: true,
|
|
||||||
attributeFilter: ["data-theme", "class"]
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Inicialización
|
|
||||||
initNetwork();
|
|
||||||
watchThemeChanges();
|
|
||||||
requestAnimationFrame(animate);
|
|
||||||
@@ -1,312 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="es">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Animación Nodos Infinito</title>
|
|
||||||
<style>
|
|
||||||
/* Estilos generales solo para visualizar en este ejemplo */
|
|
||||||
body {
|
|
||||||
background-color: #0f172a; /* Fondo oscuro para resaltar la luz */
|
|
||||||
margin: 0;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
min-height: 100vh;
|
|
||||||
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* --- CÓDIGO A INSERTAR EN TU SECCIÓN --- */
|
|
||||||
|
|
||||||
.mi-seccion-web {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding: 4rem 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* El contenedor ocupa el 50% de la sección y mantiene una proporción 2:1 */
|
|
||||||
.animacion-infinito {
|
|
||||||
width: 50%;
|
|
||||||
min-width: 300px;
|
|
||||||
max-width: 1000px;
|
|
||||||
aspect-ratio: 2 / 1;
|
|
||||||
position: relative;
|
|
||||||
background-color: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
.capa-svg-lineas {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 1; /* Por detrás de los nodos */
|
|
||||||
}
|
|
||||||
|
|
||||||
.capa-html-nodos {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
z-index: 2; /* Por delante de las líneas */
|
|
||||||
pointer-events: none; /* Permite clicks a través del contenedor vacío */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Estilos de los Nodos (Círculos) */
|
|
||||||
.nodo-circulo {
|
|
||||||
position: absolute;
|
|
||||||
border-radius: 50%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
|
|
||||||
transform: translate(-50%, -50%);
|
|
||||||
pointer-events: auto; /* Reactiva interacción en el nodo */
|
|
||||||
transition: filter 0.3s ease;
|
|
||||||
overflow: hidden;
|
|
||||||
border: 2px solid rgba(255, 255, 255, 0.1);
|
|
||||||
}
|
|
||||||
|
|
||||||
.nodo-circulo:hover {
|
|
||||||
filter: brightness(1.2);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nodo-contenido {
|
|
||||||
color: white;
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: clamp(0.6rem, 1.5vw, 1.2rem); /* Texto responsivo */
|
|
||||||
text-align: center;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nodo-contenido img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
object-fit: cover; /* Ajusta logos o imágenes png al círculo */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Estilos de las líneas SVG */
|
|
||||||
.linea-base {
|
|
||||||
fill: none;
|
|
||||||
stroke-width: 1.5;
|
|
||||||
opacity: 0.5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.linea-pulso {
|
|
||||||
fill: none;
|
|
||||||
stroke-width: 2.5;
|
|
||||||
stroke-linecap: round;
|
|
||||||
stroke-dasharray: 10 120; /* Tamaño del pulso de luz */
|
|
||||||
filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.8));
|
|
||||||
opacity: 0.8;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<section class="mi-seccion-web">
|
|
||||||
|
|
||||||
<!-- CONTENEDOR PRINCIPAL DE LA ANIMACIÓN -->
|
|
||||||
<div class="animacion-infinito">
|
|
||||||
|
|
||||||
<!-- SVG para las líneas de conexión dinámicas -->
|
|
||||||
<svg class="capa-svg-lineas" viewBox="0 0 1000 500" preserveAspectRatio="xMidYMid meet">
|
|
||||||
<defs id="svg-defs">
|
|
||||||
<!-- Los gradientes se inyectan por JS para coincidir con los nodos -->
|
|
||||||
</defs>
|
|
||||||
<g id="grupo-lineas"></g>
|
|
||||||
</svg>
|
|
||||||
|
|
||||||
<!-- Contenedor HTML para los Círculos con contenido -->
|
|
||||||
<div class="capa-html-nodos" id="grupo-nodos">
|
|
||||||
<!-- Los nodos HTML se renderizan dinámicamente -->
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
/**
|
|
||||||
* CONFIGURACIÓN DE LOS CÍRCULOS (NODOS)
|
|
||||||
* - id: Identificador único
|
|
||||||
* - x0, y0: Coordenadas base en una grilla virtual de 1000x500
|
|
||||||
* - r: Radio base del círculo (escala acorde al contenedor)
|
|
||||||
* - color: Color principal usado para fondos y fusión de gradientes
|
|
||||||
* - html: Contenido interno (Texto o una etiqueta <img src="...">)
|
|
||||||
*/
|
|
||||||
const nodosData = [
|
|
||||||
{ id: 'tl', x0: 200, y0: 125, r: 50, color: '#16a085', html: '<span>LOGO A</span>' }, // Arriba Izquierda (Verde)
|
|
||||||
{ id: 'bl', x0: 200, y0: 375, r: 50, color: '#2980b9', html: '<span>LOGO B</span>' }, // Abajo Izquierda (Azul)
|
|
||||||
{ id: 'tr', x0: 800, y0: 125, r: 50, color: '#c0392b', html: '<span>LOGO C</span>' }, // Arriba Derecha (Rojo)
|
|
||||||
{ id: 'br', x0: 800, y0: 375, r: 50, color: '#f39c12', html: '<span>LOGO D</span>' }, // Abajo Derecha (Naranja)
|
|
||||||
{ id: 'c', x0: 500, y0: 250, r: 65, color: '#000000', html: '<span>NÚCLEO</span>'} // Centro (Negro)
|
|
||||||
];
|
|
||||||
|
|
||||||
// Definición de las conexiones lógicas entre nodos
|
|
||||||
const conexiones = [
|
|
||||||
{ id: 'arcL', from: 'tl', to: 'bl', type: 'vertical', curveOut: -120 }, // Arco exterior izquierdo
|
|
||||||
{ id: 'c1', from: 'tl', to: 'c', type: 'horizontal', curveOut: 0 },
|
|
||||||
{ id: 'c2', from: 'bl', to: 'c', type: 'horizontal', curveOut: 0 },
|
|
||||||
{ id: 'arcR', from: 'tr', to: 'br', type: 'vertical', curveOut: 120 }, // Arco exterior derecho
|
|
||||||
{ id: 'c3', from: 'tr', to: 'c', type: 'horizontal', curveOut: 0 },
|
|
||||||
{ id: 'c4', from: 'br', to: 'c', type: 'horizontal', curveOut: 0 }
|
|
||||||
];
|
|
||||||
|
|
||||||
// Inicializar elementos DOM
|
|
||||||
const contenedorNodos = document.getElementById('grupo-nodos');
|
|
||||||
const grupoLineas = document.getElementById('grupo-lineas');
|
|
||||||
const svgDefs = document.getElementById('svg-defs');
|
|
||||||
|
|
||||||
// Mapeo rápido de nodos para acceder por ID
|
|
||||||
const nodosMap = {};
|
|
||||||
|
|
||||||
// 1. Crear Nodos HTML y Gradientes SVG
|
|
||||||
nodosData.forEach(nodo => {
|
|
||||||
nodosMap[nodo.id] = nodo;
|
|
||||||
|
|
||||||
// Offset aleatorio para que floten desincronizados
|
|
||||||
nodo.floatOffset = Math.random() * 10;
|
|
||||||
|
|
||||||
// Crear elemento DOM
|
|
||||||
const el = document.createElement('div');
|
|
||||||
el.className = 'nodo-circulo';
|
|
||||||
el.id = `node-${nodo.id}`;
|
|
||||||
el.style.backgroundColor = nodo.color;
|
|
||||||
// El ancho y alto real se maneja por % para ser responsivo respecto a 1000x500
|
|
||||||
el.style.width = `${(nodo.r * 2 / 1000) * 100}%`;
|
|
||||||
el.style.height = `${(nodo.r * 2 / 500) * 100}%`;
|
|
||||||
|
|
||||||
const content = document.createElement('div');
|
|
||||||
content.className = 'nodo-contenido';
|
|
||||||
content.innerHTML = nodo.html;
|
|
||||||
|
|
||||||
el.appendChild(content);
|
|
||||||
contenedorNodos.appendChild(el);
|
|
||||||
nodo.el = el;
|
|
||||||
});
|
|
||||||
|
|
||||||
conexiones.forEach(conn => {
|
|
||||||
const n1 = nodosMap[conn.from];
|
|
||||||
const n2 = nodosMap[conn.to];
|
|
||||||
const gradId = `grad-${conn.from}-${conn.to}`;
|
|
||||||
conn.gradId = gradId;
|
|
||||||
|
|
||||||
// Crear gradiente SVG
|
|
||||||
const esHorizontal = conn.type === 'horizontal';
|
|
||||||
const grad = document.createElementNS('http://www.w3.org/2000/svg', 'linearGradient');
|
|
||||||
grad.setAttribute('id', gradId);
|
|
||||||
grad.setAttribute('x1', '0%');
|
|
||||||
grad.setAttribute('y1', '0%');
|
|
||||||
grad.setAttribute('x2', esHorizontal ? '100%' : '0%');
|
|
||||||
grad.setAttribute('y2', esHorizontal ? '0%' : '100%');
|
|
||||||
|
|
||||||
const stop1 = document.createElementNS('http://www.w3.org/2000/svg', 'stop');
|
|
||||||
stop1.setAttribute('offset', '0%');
|
|
||||||
stop1.setAttribute('stop-color', n1.color);
|
|
||||||
|
|
||||||
const stop2 = document.createElementNS('http://www.w3.org/2000/svg', 'stop');
|
|
||||||
stop2.setAttribute('offset', '100%');
|
|
||||||
stop2.setAttribute('stop-color', n2.color);
|
|
||||||
|
|
||||||
grad.appendChild(stop1);
|
|
||||||
grad.appendChild(stop2);
|
|
||||||
svgDefs.appendChild(grad);
|
|
||||||
|
|
||||||
// Crear múltiples paths para dar aspecto de "cable de datos" y luces
|
|
||||||
conn.pathsBase = [];
|
|
||||||
for (let i = -2; i <= 2; i++) {
|
|
||||||
const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
|
|
||||||
path.classList.add('linea-base');
|
|
||||||
path.setAttribute('stroke', `url(#${gradId})`);
|
|
||||||
grupoLineas.appendChild(path);
|
|
||||||
conn.pathsBase.push({ el: path, offset: i * 6 }); // Separación entre cables
|
|
||||||
}
|
|
||||||
|
|
||||||
// Path para el pulso de luz (datos)
|
|
||||||
const pathPulso = document.createElementNS('http://www.w3.org/2000/svg', 'path');
|
|
||||||
pathPulso.classList.add('linea-pulso');
|
|
||||||
pathPulso.setAttribute('stroke', '#ffffff'); // Color de la luz
|
|
||||||
grupoLineas.appendChild(pathPulso);
|
|
||||||
conn.pathPulso = pathPulso;
|
|
||||||
});
|
|
||||||
|
|
||||||
// 2. Lógica de animación
|
|
||||||
let offsetPulsoDatos = 0;
|
|
||||||
|
|
||||||
function animarFrame() {
|
|
||||||
const tiempo = Date.now() * 0.001; // Tiempo en segundos
|
|
||||||
|
|
||||||
// A. Actualizar posición de los círculos (Flotación en el vacío)
|
|
||||||
nodosData.forEach(nodo => {
|
|
||||||
// Cálculo de oscilación leve basada en seno y coseno
|
|
||||||
nodo.x = nodo.x0 + Math.sin(tiempo * 1.2 + nodo.floatOffset) * 12;
|
|
||||||
nodo.y = nodo.y0 + Math.cos(tiempo * 1.5 + nodo.floatOffset) * 12;
|
|
||||||
|
|
||||||
// Actualizar posiciones en HTML (Usando % para hacerlo 100% responsivo)
|
|
||||||
nodo.el.style.left = `${(nodo.x / 1000) * 100}%`;
|
|
||||||
nodo.el.style.top = `${(nodo.y / 500) * 100}%`;
|
|
||||||
});
|
|
||||||
|
|
||||||
// B. Animar pulso de datos (CSS Stroke Dashoffset)
|
|
||||||
offsetPulsoDatos -= 1.5; // Velocidad del pulso de luz
|
|
||||||
|
|
||||||
// C. Recalcular trazados de las líneas para acompañar a los círculos
|
|
||||||
conexiones.forEach(conn => {
|
|
||||||
const n1 = nodosMap[conn.from];
|
|
||||||
const n2 = nodosMap[conn.to];
|
|
||||||
|
|
||||||
// Función que genera un Bezier Curve fluido (forma del infinito)
|
|
||||||
const calcularRuta = (offsetX, offsetY) => {
|
|
||||||
let cp1x, cp1y, cp2x, cp2y;
|
|
||||||
|
|
||||||
if (conn.type === 'horizontal') {
|
|
||||||
// Curvas hacia el centro (Eje X dinámico para suavidad)
|
|
||||||
const distanciaX = n2.x - n1.x;
|
|
||||||
cp1x = n1.x + distanciaX * 0.45;
|
|
||||||
cp1y = n1.y;
|
|
||||||
cp2x = n2.x - distanciaX * 0.45;
|
|
||||||
cp2y = n2.y;
|
|
||||||
} else {
|
|
||||||
// Arcos exteriores
|
|
||||||
cp1x = n1.x + conn.curveOut;
|
|
||||||
cp1y = n1.y;
|
|
||||||
cp2x = n2.x + conn.curveOut;
|
|
||||||
cp2y = n2.y;
|
|
||||||
}
|
|
||||||
|
|
||||||
return `M ${n1.x + offsetX} ${n1.y + offsetY}
|
|
||||||
C ${cp1x + offsetX} ${cp1y + offsetY},
|
|
||||||
${cp2x + offsetX} ${cp2y + offsetY},
|
|
||||||
${n2.x + offsetX} ${n2.y + offsetY}`;
|
|
||||||
};
|
|
||||||
|
|
||||||
// Actualizar líneas base
|
|
||||||
conn.pathsBase.forEach(p => {
|
|
||||||
// Si es horizontal las separamos en el eje Y, si es vertical en el eje X
|
|
||||||
const isHoriz = conn.type === 'horizontal';
|
|
||||||
p.el.setAttribute('d', calcularRuta(isHoriz ? 0 : p.offset, isHoriz ? p.offset : 0));
|
|
||||||
});
|
|
||||||
|
|
||||||
// Actualizar línea de pulso
|
|
||||||
conn.pathPulso.setAttribute('d', calcularRuta(0, 0));
|
|
||||||
conn.pathPulso.style.strokeDashoffset = offsetPulsoDatos;
|
|
||||||
});
|
|
||||||
|
|
||||||
requestAnimationFrame(animarFrame); // Bucle infinito a 60fps
|
|
||||||
}
|
|
||||||
|
|
||||||
// Iniciar animación
|
|
||||||
animarFrame();
|
|
||||||
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
@@ -1,519 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="es" data-theme="light">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>Soluciones Concretas | IDE Consultores</title>
|
|
||||||
<meta name="description" content="Servicios específicos de consultoría: Certificación ISO 9001/14001/45001/21001, PMO, Capacitación In-Company e Inteligencia Artificial en Procesos.">
|
|
||||||
<meta property="og:title" content="Soluciones Concretas | IDE Consultores">
|
|
||||||
<meta property="og:description" content="Encontrá respuestas concretas a requerimientos específicos: ISO, gestión de proyectos, formación y tecnología.">
|
|
||||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
|
||||||
<link rel="icon" type="image/x-icon" href="assets/img/favicon.png">
|
|
||||||
<link rel="stylesheet" href="css/styles.css">
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<header id="site-header"></header>
|
|
||||||
|
|
||||||
<main>
|
|
||||||
|
|
||||||
<!-- Header Soluciones -->
|
|
||||||
<section class="section-padding hero-video-section" style="background-color: var(--bg-surface); border-bottom: 1px solid var(--border-color); position: relative; overflow: hidden; min-height: 400px;">
|
|
||||||
|
|
||||||
<!-- Video de fondo -->
|
|
||||||
<video autoplay muted loop playsinline style="
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
object-fit: cover;
|
|
||||||
opacity: 0.15;
|
|
||||||
z-index: 0;
|
|
||||||
pointer-events: none;
|
|
||||||
">
|
|
||||||
<source src="./assets/video/header_ide_loop2.mp4" type="video/mp4">
|
|
||||||
Tu navegador no soporta videos.
|
|
||||||
</video>
|
|
||||||
|
|
||||||
<!-- Overlay oscuro opcional para mejor contraste -->
|
|
||||||
<div style="
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
background: rgba(227, 235, 233, 0.25);
|
|
||||||
z-index: 1;
|
|
||||||
"></div>
|
|
||||||
|
|
||||||
<!-- Contenido -->
|
|
||||||
<div class="container container-narrow text-center" style="position: relative; z-index: 2;">
|
|
||||||
<span class="eyebrow" style="color: var(--text-main)">IDENTIFIQUEMOS SOLUCIONES</span>
|
|
||||||
<h1 style="margin-bottom: 1.25rem; color:var(--text-main);">Soluciones Concretas: <br>Respuestas Específicas</h1>
|
|
||||||
<p class="lead-text" style="color:var(--text-main)">
|
|
||||||
Si ya identificaste qué necesitás, explorá nuestras soluciones, su alcance y el valor que pueden aportar a tu organización. </p>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Barra de Filtros y Catálogo de Soluciones -->
|
|
||||||
<section class="section-padding">
|
|
||||||
<div class="container">
|
|
||||||
|
|
||||||
<!-- Filtros Rápidos
|
|
||||||
<div class="filters-bar" style="justify-content: center; margin-bottom: 3rem;">
|
|
||||||
<button class="filter-btn soluciones-filter-btn active" data-filter="all">Todas las Soluciones</button>
|
|
||||||
<button class="filter-btn soluciones-filter-btn" data-filter="iso">Sistemas de Gestión & ISO</button>
|
|
||||||
<button class="filter-btn soluciones-filter-btn" data-filter="pmo">PMO & Gestión de Proyectos</button>
|
|
||||||
<button class="filter-btn soluciones-filter-btn" data-filter="formacion">Formación & Desarrollo</button>
|
|
||||||
<button class="filter-btn soluciones-filter-btn" data-filter="digital">Transformación Digital & IA</button>
|
|
||||||
</div> -->
|
|
||||||
|
|
||||||
<!-- Grilla de Soluciones -->
|
|
||||||
<div class="grid-2" id="soluciones-grid">
|
|
||||||
|
|
||||||
<!-- Solución 1 -->
|
|
||||||
<div class="card solution-card">
|
|
||||||
<div>
|
|
||||||
<h3>SISTEMAS DE GESTIÓN Y CERTIFICACIONES</h3>
|
|
||||||
<p><strong>Para convertir requisitos en herramientas de gestión.</strong></p>
|
|
||||||
<div class="solution-body">
|
|
||||||
<p>Diseñamos, implementamos e integramos sistemas de gestión que permiten ordenar procesos, gestionar riesgos, mejorar el desempeño y responder a requisitos normativos sin sumar burocracia innecesaria.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<div class="solution-ligth">
|
|
||||||
<i class="fa-regular fa-lightbulb"></i> <em>¿Sabías que un SGC requiere capacitar a los líderes? Conocé cómo <strong>IDE Academy</strong> complementa esta implementación.</em>
|
|
||||||
</div>
|
|
||||||
<a class="btn btn-primary btn-sm" style="width: 100%;" data-open-modal="modal-solucion-1">
|
|
||||||
Explorar soluciones →
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Solución 2 -->
|
|
||||||
<div class="card solution-card">
|
|
||||||
<div>
|
|
||||||
<h3>DESARROLLO DE CAPACIDADES</h3>
|
|
||||||
<p><strong>Para transformar conocimiento en capacidad de acción.</strong></p>
|
|
||||||
<div class="solution-body">
|
|
||||||
<p>Diseñamos experiencias de aprendizaje que conectan conocimiento, práctica y contexto para desarrollar las capacidades que personas y equipos necesitan para gestionar, liderar y transformar.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<div class="solution-ligth">
|
|
||||||
<i class="fa-regular fa-lightbulb"></i> <em>Formamos a tus Project Managers internos mediante los programas de <strong>IDE Academy</strong>.</em>
|
|
||||||
</div>
|
|
||||||
<a class="btn btn-primary btn-sm" style="width: 100%;" data-open-modal="modal-solucion-2">
|
|
||||||
Explorar soluciones →
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Solución 3 -->
|
|
||||||
<div class="card solution-card">
|
|
||||||
<div>
|
|
||||||
<h3>PROCESOS Y MEJORA ORGANIZACIONAL</h3>
|
|
||||||
<p><strong>Para transformar la forma en que la organización funciona.</strong></p>
|
|
||||||
<div class="solution-body">
|
|
||||||
<p>Analizamos procesos, información, roles e indicadores para identificar oportunidades de mejora, reducir ineficiencias y fortalecer la capacidad de gestión y toma de decisiones.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<div class="solution-ligth">
|
|
||||||
<i class="fa-regular fa-lightbulb"></i> <em>Integramos tableros de control digital de incidentes a través de <strong>IDE Digital</strong>.</em>
|
|
||||||
</div>
|
|
||||||
<a class="btn btn-primary btn-sm" style="width: 100%;" data-open-modal="modal-solucion-3">
|
|
||||||
Explorar soluciones →
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Solución 4 -->
|
|
||||||
<div class="card solution-card">
|
|
||||||
<div>
|
|
||||||
<h3>PROYECTOS Y PMO</h3>
|
|
||||||
<p><strong>Para convertir iniciativas en resultados.</strong></p>
|
|
||||||
<div class="solution-body">
|
|
||||||
<p>Diseñamos y fortalecemos la gestión de proyectos, programas y portafolios para mejorar la priorización, coordinación, gobernanza y ejecución de iniciativas estratégicas.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<div class="solution-ligth">
|
|
||||||
<i class="fa-regular fa-lightbulb"></i> <em>Complementamos con diseño instruccional y campus virtual vía <strong>IDE Academy</strong>.</em>
|
|
||||||
</div>
|
|
||||||
<a class="btn btn-primary btn-sm" style="width: 100%;" data-open-modal="modal-solucion-4">
|
|
||||||
Explorar soluciones →
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Solución 5 -->
|
|
||||||
<div class="card solution-card" data-category="formacion">
|
|
||||||
<div>
|
|
||||||
<h3>TRANSFORMACIÓN DIGITAL E INTELIGENCIA ARTIFICIAL</h3>
|
|
||||||
<p><strong>Para poner la tecnología al servicio de la gestión.</strong></p>
|
|
||||||
<div class="solution-body">
|
|
||||||
<p> Identificamos dónde la digitalización, la automatización y la inteligencia artificial pueden simplificar procesos, mejorar decisiones y generar valor real para la organización.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>
|
|
||||||
<div class="solution-ligth">
|
|
||||||
<i class="fa-regular fa-lightbulb"></i> <em>Conocé los programas abiertos y temarios en nuestra página de <strong>IDE Academy</strong>.</em>
|
|
||||||
</div>
|
|
||||||
<a class="btn btn-primary btn-sm" style="width: 100%;" data-open-modal="modal-solucion-5">
|
|
||||||
Explorar soluciones →
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Solución 6 -->
|
|
||||||
<div class="card solution-card" data-category="digital">
|
|
||||||
<div>
|
|
||||||
<h3>SOLUCIONES SECTORIALES</h3>
|
|
||||||
<p><strong>Para responder a desafíos que requieren conocimiento del contexto.</strong></p>
|
|
||||||
<div class="solution-body">
|
|
||||||
<p>Integramos gestión, procesos, proyectos, sistemas, capacidades y tecnología para abordar requisitos y desafíos específicos de cada actividad.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<div class="solution-ligth">
|
|
||||||
<i class="fa-regular fa-lightbulb"></i><em>Alineamos la tecnología con la estructura de procesos definida por <strong>IDE Excellence</strong>.</em>
|
|
||||||
</div>
|
|
||||||
<a class="btn btn-primary btn-sm" style="width: 100%;" data-open-modal="modal-solucion-6">
|
|
||||||
Explorar soluciones →
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Solución 7 -->
|
|
||||||
<div class="card solution-card" data-category="digital">
|
|
||||||
<div>
|
|
||||||
<h3>EDUCACIÓN & GOBIERNO</h3>
|
|
||||||
<p><strong>Para transformar conocimiento, procesos y capacidades en mejores servicios y resultados.</strong></p>
|
|
||||||
<div class="solution-body">
|
|
||||||
<p>Integramos sistemas de gestión, procesos, proyectos, gestión del conocimiento, indicadores, desarrollo de capacidades y tecnología para fortalecer organizaciones educativas, organismos públicos e instituciones que brindan servicios de formación.</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<div class="solution-ligth">
|
|
||||||
<i class="fa-regular fa-lightbulb"></i><em>Alineamos la tecnología con la estructura de procesos definida por <strong>IDE Excellence</strong>.</em>
|
|
||||||
</div>
|
|
||||||
<a class="btn btn-primary btn-sm" style="width: 100%;" data-open-modal="modal-solucion-7">
|
|
||||||
Explorar soluciones →
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<!-- Banner de Cierre -->
|
|
||||||
<section class="section-padding" style="background-color: var(--teal-dark); border-top: 1px solid var(--border-color);">
|
|
||||||
<div class="container container-narrow text-center">
|
|
||||||
<h2 style="color: var(--text-inverse); margin-bottom: 1rem;">Una única solución no siempre encaja para todos los desafíos.</h2>
|
|
||||||
<p class="lead-text-cta" style="margin-bottom: 1.5rem;">
|
|
||||||
Integramos las capacidades necesarias para diseñar una respuesta que tenga sentido para tu organización y su contexto.
|
|
||||||
</p>
|
|
||||||
<a href="contacto.html" class="btn btn-outline-cta btn-sm" ">HABLEMOS →</a>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<!-- Modal Solución 1 -->
|
|
||||||
<div id="modal-solucion-1" class="modal-backdrop" role="dialog" aria-modal="true">
|
|
||||||
<div class="modal-window-sol">
|
|
||||||
<button class="modal-close-btn" aria-label="Cerrar modal">✕</button>
|
|
||||||
<h3 style="font-size: 1.2rem; margin-bottom: 1rem; padding-bottom: 0.5rem; color: var(--ide-primary); border-bottom: 1px solid var(--border-color);">SISTEMAS DE GESTIÓN Y CERTIFICACIONES</h3>
|
|
||||||
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">ISO 9001 | Gestión de Calidad</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Sistemas de gestión orientados a fortalecer procesos, satisfacción del cliente, desempeño y mejora continua.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">ISO 14001 | Gestión Ambiental</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Gestión de aspectos e impactos ambientales integrada a los procesos y decisiones de la organización.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">ISO 45001 | Seguridad y Salud en el Trabajo</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Gestión sistemática de riesgos de SST, prevención y mejora del desempeño.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">ISO 21001 | Organizaciones Educativas</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Sistema de gestión para organizaciones educativas orientado a fortalecer sus procesos y responder a las necesidades de estudiantes y otras partes interesadas.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">ISO 29993 | Servicios de Aprendizaje</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Requisitos para fortalecer la calidad, diseño, prestación y evaluación de servicios de aprendizaje fuera de la educación formal.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Sistemas Integrados de Gestión</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Integración de diferentes normas y referenciales bajo una arquitectura común para reducir duplicaciones y gestionar el conjunto.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Auditorías y preparación para la certificación</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Diagnóstico de brechas, auditorías internas, tratamiento de hallazgos y acompañamiento para implementar, mantener o ampliar sistemas y certificaciones.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<div style="display: flex; justify-content: flex-end; gap: 0.75rem;">
|
|
||||||
<button class="btn btn-ghost btn-sm" data-close-modal>Cerrar</button>
|
|
||||||
<a href="contacto.html?busqueda=Orientación%20para%20abordar%20un%20desafío&origen=Desafio_Procesos" class="btn btn-primary btn-sm">
|
|
||||||
Hablemos de este desafío
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Modal Solución 3 -->
|
|
||||||
<div id="modal-solucion-3" class="modal-backdrop" role="dialog" aria-modal="true">
|
|
||||||
<div class="modal-window-sol">
|
|
||||||
<button class="modal-close-btn" aria-label="Cerrar modal">✕</button>
|
|
||||||
<h3 style="font-size: 1.2rem; margin-bottom: 1rem; padding-bottom: 0.5rem; color: var(--ide-primary); border-bottom: 1px solid var(--border-color);">PROCESOS Y MEJORA ORGANIZACIONAL</h3>
|
|
||||||
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Gestión por procesos</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Identificación, diseño y mejora de procesos para comprender cómo fluye el trabajo y cómo cada proceso contribuye a los resultados.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Optimización y mejora continua</h4>
|
|
||||||
<p style="font-size: 0.8rem;">5S, Lean mangement, Análisis de oportunidades, desperdicios, retrabajos y puntos críticos para diseñar mejoras sostenibles.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Indicadores y tableros de gestión</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Diseño de indicadores y sistemas de seguimiento que transforman datos en información útil para decidir.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Gestión de riesgos y oportunidades</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Identificación, evaluación y tratamiento de riesgos y oportunidades vinculados con objetivos, procesos y decisiones.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Diseño organizacional y roles</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Clarificación de responsabilidades, autoridades e interfaces para mejorar coordinación y funcionamiento.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Gestión de información y conocimiento</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Organización de información, documentación y conocimiento crítico para reducir dependencia de personas y facilitar continuidad y aprendizaje.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div style="display: flex; justify-content: flex-end; gap: 0.75rem;">
|
|
||||||
<button class="btn btn-ghost btn-sm" data-close-modal>Cerrar</button>
|
|
||||||
<a href="contacto.html?busqueda=Orientación%20para%20abordar%20un%20desafío&origen=Desafio_Procesos" class="btn btn-primary btn-sm">
|
|
||||||
Hablemos de este desafío
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Modal Solución 5 -->
|
|
||||||
<div id="modal-solucion-5" class="modal-backdrop" role="dialog" aria-modal="true">
|
|
||||||
<div class="modal-window-sol">
|
|
||||||
<button class="modal-close-btn" aria-label="Cerrar modal">✕</button>
|
|
||||||
<h3 style="font-size: 1.2rem; margin-bottom: 1rem; padding-bottom: 0.5rem; color: var(--ide-primary); border-bottom: 1px solid var(--border-color);">TRANSFORMACIÓN DIGITAL E IA</h3>
|
|
||||||
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Diagnóstico de oportunidades digitales</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Identificación y priorización de procesos y necesidades donde la tecnología puede aportar mayor valor.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Digitalización y sistematización de procesos</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Transformación de tareas y flujos de información para mejorar trazabilidad, disponibilidad y eficiencia.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Automatización de procesos</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Identificación y automatización de tareas repetitivas o de bajo valor para liberar capacidad y reducir errores.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Inteligencia Artificial aplicada</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Identificación y desarrollo de casos de uso de IA vinculados con necesidades concretas de gestión y operación.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Datos e información para la gestión</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Estructuración, integración y visualización de información para fortalecer seguimiento y toma de decisiones.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Adopción y desarrollo de capacidades digitales</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Acompañamiento a personas y equipos para incorporar nuevas herramientas y formas de trabajo.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div style="display: flex; justify-content: flex-end; gap: 0.75rem;">
|
|
||||||
<button class="btn btn-ghost btn-sm" data-close-modal>Cerrar</button>
|
|
||||||
<a href="contacto.html?busqueda=Orientación%20para%20abordar%20un%20desafío&origen=Desafio_Procesos" class="btn btn-primary btn-sm">
|
|
||||||
Hablemos de este desafío
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Modal Solución 4 -->
|
|
||||||
<div id="modal-solucion-4" class="modal-backdrop" role="dialog" aria-modal="true">
|
|
||||||
<div class="modal-window-sol">
|
|
||||||
<button class="modal-close-btn" aria-label="Cerrar modal">✕</button>
|
|
||||||
<h3 style="font-size: 1.2rem; margin-bottom: 1rem; padding-bottom: 0.5rem; color: var(--ide-primary); border-bottom: 1px solid var(--border-color);">PROYECTOS Y PMO</h3>
|
|
||||||
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Gestión de Proyectos</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Diseño y acompañamiento de proyectos desde la definición de objetivos y alcance hasta su ejecución, seguimiento y cierre.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Diseño e implementación de PMO</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Creación o fortalecimiento de oficinas de gestión de proyectos adaptadas al nivel de madurez y necesidades de cada organización.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Diagnóstico de madurez en gestión de proyectos</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Evaluación de prácticas, capacidades y gobernanza para identificar brechas y definir una hoja de ruta de mejora.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Gestión de portafolios y priorización</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Criterios y herramientas para seleccionar, priorizar y monitorear iniciativas según estrategia, recursos y valor esperado.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Recuperación de proyectos</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Análisis de proyectos con desvíos para redefinir prioridades, gobernanza, planificación y mecanismos de seguimiento.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Metodologías y herramientas de gestión</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Diseño de marcos de trabajo predictivos, ágiles o híbridos adaptados al contexto de cada organización.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div style="display: flex; justify-content: flex-end; gap: 0.75rem;">
|
|
||||||
<button class="btn btn-ghost btn-sm" data-close-modal>Cerrar</button>
|
|
||||||
<a href="contacto.html?busqueda=Orientación%20para%20abordar%20un%20desafío&origen=Desafio_Procesos" class="btn btn-primary btn-sm">
|
|
||||||
Hablemos de este desafío
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Modal Solución 2 -->
|
|
||||||
<div id="modal-solucion-2" class="modal-backdrop" role="dialog" aria-modal="true">
|
|
||||||
<div class="modal-window-sol">
|
|
||||||
<button class="modal-close-btn" aria-label="Cerrar modal">✕</button>
|
|
||||||
<h3 style="font-size: 1.2rem; margin-bottom: 1rem; padding-bottom: 0.5rem; color: var(--ide-primary); border-bottom: 1px solid var(--border-color);">DESARROLLO DE CAPACIDADES</h3>
|
|
||||||
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Formación In-Company</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Programas diseñados a partir de las necesidades, desafíos y realidad de cada organización.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Formación Ejecutiva</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Programas para profesionales, mandos medios y líderes orientados al desarrollo de capacidades de gestión y toma de decisiones.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Gestión de Proyectos</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Formación aplicada en planificación, ejecución, seguimiento, liderazgo y metodologías de proyectos.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Gestión, Calidad y Mejora Continua</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Desarrollo de competencias para gestionar procesos, sistemas, indicadores, riesgos y mejora.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Liderazgo y Powerful Skills</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Comunicación, liderazgo, trabajo colaborativo, negociación, toma de decisiones y otras capacidades profesionales transversales.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Transformación Digital e IA</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Formación para comprender, adoptar y aplicar tecnologías e inteligencia artificial con criterio y orientación a resultados.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div style="display: flex; justify-content: flex-end; gap: 0.75rem;">
|
|
||||||
<button class="btn btn-ghost btn-sm" data-close-modal>Cerrar</button>
|
|
||||||
<a href="contacto.html?busqueda=Orientación%20para%20abordar%20un%20desafío&origen=Desafio_Procesos" class="btn btn-primary btn-sm">
|
|
||||||
Hablemos de este desafío
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Modal Solución 6 -->
|
|
||||||
<div id="modal-solucion-6" class="modal-backdrop" role="dialog" aria-modal="true">
|
|
||||||
<div class="modal-window-sol">
|
|
||||||
<button class="modal-close-btn" aria-label="Cerrar modal">✕</button>
|
|
||||||
<h3 style="font-size: 1.2rem; margin-bottom: 1rem; padding-bottom: 0.5rem; color: var(--ide-primary); border-bottom: 1px solid var(--border-color);">SOLUCIONES SECTORIALES</h3>
|
|
||||||
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Agro & Alimentos</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Trazabilidad, inocuidad, buenas prácticas, sistemas de gestión, procesos y sostenibilidad para fortalecer organizaciones de la cadena agroalimentaria.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Minería & Cadena de Valor</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Gestión, procesos, calidad, seguridad, proyectos y desarrollo de proveedores para organizaciones que operan o prestan servicios dentro del ecosistema minero.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Movilidad, Transporte & Logística</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Gestión de procesos, seguridad vial, buenas prácticas, flotas e integración de requisitos para organizaciones vinculadas con movilidad, transporte y logística.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Metalmecánica & Industria</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Procesos, calidad, seguridad, proyectos y mejora continua para fortalecer productividad, confiabilidad y capacidad de respuesta.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Salud</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Gestión por procesos críticos, experiencia del paciente, calidad, seguridad y cumplimiento para fortalecer organizaciones de salud.</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Educación & Gobierno</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Sistemas de gestión, procesos, proyectos, indicadores y desarrollo de capacidades adaptados a organizaciones educativas y del sector público.</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div style="display: flex; justify-content: flex-end; gap: 0.75rem;">
|
|
||||||
<button class="btn btn-ghost btn-sm" data-close-modal>Cerrar</button>
|
|
||||||
<a href="contacto.html?busqueda=Orientación%20para%20abordar%20un%20desafío&origen=Desafio_Procesos" class="btn btn-primary btn-sm">
|
|
||||||
Hablemos de este desafío
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- Modal Solución 7 -->
|
|
||||||
<div id="modal-solucion-7" class="modal-backdrop" role="dialog" aria-modal="true">
|
|
||||||
<div class="modal-window-sol">
|
|
||||||
<button class="modal-close-btn" aria-label="Cerrar modal">✕</button>
|
|
||||||
<h3 style="font-size: 1.2rem; margin-bottom: 1rem; padding-bottom: 0.5rem; color: var(--ide-primary); border-bottom: 1px solid var(--border-color);">EDUCACIÓN & GOBIERNO</h3>
|
|
||||||
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Sistemas de gestión y calidad</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Implementación, integración y mejora de sistemas de gestión orientados a fortalecer procesos, resultados y servicios.
|
|
||||||
ISO 21001 · ISO 29993 · ISO 9001 · Sistemas Integrados · Auditorías internas · Preparación para certificación</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Gestión del conocimiento</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Identificación, sistematización, transferencia y preservación del conocimiento crítico para reducir dependencias, favorecer el aprendizaje organizacional y fortalecer la continuidad.
|
|
||||||
ISO 30401 · Gestión del conocimiento · Buenas prácticas · Lecciones aprendidas · Repositorios y transferencia de conocimiento
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Procesos e indicadores</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Diseño y mejora de procesos académicos, administrativos y de servicios, acompañados por indicadores que permitan transformar información en decisiones.
|
|
||||||
Gestión por procesos · Indicadores · Tableros de gestión · Riesgos y oportunidades · Mejora continua
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Proyectos y transformación</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Diseño, planificación y gestión de iniciativas de mejora y transformación para convertir objetivos institucionales en resultados.
|
|
||||||
Gestión de proyectos · PMO · Portafolios · Gobernanza · Seguimiento de iniciativas</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Desarrollo de capacidades</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Formación y desarrollo de personas y equipos para fortalecer capacidades de gestión, liderazgo, calidad, proyectos y transformación.
|
|
||||||
Formación ejecutiva · In-Company · Liderazgo · Gestión · Powerful Skills · Programas a medida
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div style="margin-bottom: 0.9rem;">
|
|
||||||
<h4 style="font-size: 0.9rem; color: var(--text-main); margin-bottom: 0.3rem;">Transformación digital e IA</h4>
|
|
||||||
<p style="font-size: 0.8rem;">Digitalización, automatización y aplicación de inteligencia artificial para simplificar procesos, mejorar el acceso a la información y fortalecer la gestión.
|
|
||||||
Digitalización · Automatización · IA aplicada · Sistematización de procesos · Datos para la gestión</p>
|
|
||||||
|
|
||||||
<div style="display: flex; justify-content: flex-end; gap: 0.75rem;">
|
|
||||||
<button class="btn btn-ghost btn-sm" data-close-modal>Cerrar</button>
|
|
||||||
<a href="contacto.html?busqueda=Orientación%20para%20abordar%20un%20desafío&origen=Desafio_Procesos" class="btn btn-primary btn-sm">
|
|
||||||
Hablemos de este desafío
|
|
||||||
</a>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</main>
|
|
||||||
|
|
||||||
<footer id="site-footer"></footer>
|
|
||||||
<script src="js/main.js"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
Reference in New Issue
Block a user