commit 36633180760c4113702b8526478d11b8e729dafd Author: Francisco Anfuso Date: Mon Aug 31 15:27:17 2026 -0300 inicial diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..5a86d2a --- /dev/null +++ b/.gitignore @@ -0,0 +1,8 @@ +node_modules/ +build/ +dist/ +coverage/ +.DS_Store +*.log +.env* +!.env.example diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..f673a71 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "liveServer.settings.port": 5502 +} \ No newline at end of file diff --git a/README.md b/README.md new file mode 100644 index 0000000..fb43dd3 --- /dev/null +++ b/README.md @@ -0,0 +1,20 @@ +
+GHBanner +
+ +# Run and deploy your AI Studio app + +This contains everything you need to run your app locally. + +View your app in AI Studio: https://ai.studio/apps/62f9c45c-fa79-4ea7-bd03-756d1cdb54e9 + +## Run Locally + +**Prerequisites:** Node.js + + +1. Install dependencies: + `npm install` +2. Set the `GEMINI_API_KEY` in [.env.local](.env.local) to your Gemini API key +3. Run the app: + `npm run dev` diff --git a/assets/img/logo-on-dark.png b/assets/img/logo-on-dark.png new file mode 100644 index 0000000..da34048 Binary files /dev/null and b/assets/img/logo-on-dark.png differ diff --git a/assets/img/logo-on-light.png b/assets/img/logo-on-light.png new file mode 100644 index 0000000..32c0acd Binary files /dev/null and b/assets/img/logo-on-light.png differ diff --git a/assets/img/logo_verde.png b/assets/img/logo_verde.png new file mode 100644 index 0000000..7f5a92e Binary files /dev/null and b/assets/img/logo_verde.png differ diff --git a/contacto.html b/contacto.html new file mode 100644 index 0000000..bfe06fb --- /dev/null +++ b/contacto.html @@ -0,0 +1,157 @@ + + + + + + Contacto | Conversación Comercial - IDE Consultores + + + + + + + + + + +
+ + +
+
+ CONVERSACIÓN INICIAL +

¿Qué desafío querés transformar?

+

+ Empecemos por entenderlo. Completá el formulario a continuación o contactanos directamente por WhatsApp o correo electrónico. +

+
+
+ + +
+
+ +
+ + +
+

Formulario de Contacto

+

+ Completá tus datos para que un consultor senior analice tu contexto y preparemos una propuesta pertinente. +

+ +
+ + + +
+ + +
+ +
+
+ + +
+
+ + +
+
+ +
+
+ + +
+
+ + +
+
+ +
+ + +
+ +
+ + +
+ + + +
+
+
+ + +
+ + +
+

¿Preferís escribirnos directamente?

+

+ Si necesitás una respuesta ágil o coordinar un llamado breve, escribinos a nuestro canal oficial de WhatsApp. +

+ + Abrir chat de WhatsApp (+54 9 11 2345-6789) → + +
+ + +
+

Canales Institucionales

+ +
    +
  • + • +
    + Correo Central:
    + info@ideconsultores.com.ar +
    +
  • + +
  • + • +
    + Teléfono Directo:
    + +54 11 4800-0000 (Lunes a Viernes 9 a 18 hs) +
    +
  • + +
  • + • +
    + Oficinas Centrales:
    + Av. del Libertador 4800, Piso 8, CABA, Argentina +
    +
  • +
+
+ +
+ +
+ +
+
+ +
+ + + + + diff --git a/css/styles.css b/css/styles.css new file mode 100644 index 0000000..d79b448 --- /dev/null +++ b/css/styles.css @@ -0,0 +1,1061 @@ +/* ========================================================================== + IDE CONSULTORES - HOJA DE ESTILOS INSTITUCIONAL (CSS ÚNICO) + Manual de Marca: Azul Petróleo (#0A485E), Verde Esmeralda (#13A78A), Gris Neutro (#9A9A9A) + ========================================================================== */ + +@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&display=swap'); + +/* --- 1. Variables de Color y Tema --- */ +:root { + /* Marca IDE */ + --ide-primary: #094b63; + --ide-primary-dark: #223344; + --ide-primary-light: #2c69ab; + --ide-accent: #40ab8e; + --ide-accent-hover: #4fb389; + --ide-accent-soft: rgba(19, 167, 138, 0.12); + --ide-gray: #1b1717; + --ide-excellence: #a83c41; + + + /* Tema Claro (Por defecto) */ + --bg-body: #F8FAFB; + --bg-surface: #FFFFFF; + --bg-surface-elevated: #FFFFFF; + --bg-subtle: #EDF3F5; + --border-color: #E2E8F0; + --border-subtle: #EEF2F6; + + --text-main: #0E2833; + --text-body: #334A56; + --text-muted: #64748B; + --text-inverse: #FFFFFF; + + --shadow-sm: 0 1px 3px rgba(10, 72, 94, 0.05); + --shadow-md: 0 4px 16px rgba(10, 72, 94, 0.08); + --shadow-lg: 0 10px 30px rgba(10, 72, 94, 0.12); + + --radius-sm: 6px; + --radius-md: 12px; + --radius-lg: 18px; + --radius-full: 9999px; + + --transition-fast: 0.2s ease; + --transition-normal: 0.3s ease; +} + +/* Tema Oscuro (Elegante mate, sin negros puros #000 ni neón estridente) */ +[data-theme="dark"] { + --bg-body: #11181D; + --bg-surface: #18222A; + --bg-surface-elevated: #202D37; + --bg-subtle: #24333E; + --border-color: #2D3D4A; + --border-subtle: #1F2C36; + --ide-excellence: #ed3401; + + --text-main: #F1F5F9; + --text-body: #CBD5E1; + --text-muted: #8E9FAA; + --text-inverse: #0E2833; + + --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.3); + --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.4); + --shadow-lg: 0 10px 35px rgba(0, 0, 0, 0.55); +} + +/* --- 2. Reseteo y Base --- */ +*, *::before, *::after { + box-sizing: border-box; + margin: 0; + padding: 0; +} + +html { + scroll-behavior: smooth; + font-size: 16px; +} + +body { + font-family: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; + background-color: var(--bg-body); + color: var(--text-body); + line-height: 1.65; + transition: background-color var(--transition-normal), color var(--transition-normal); + overflow-x: hidden; + min-height: 100vh; + display: flex; + flex-direction: column; +} + +main { + flex: 1; +} + +img, svg { + display: block; + max-width: 100%; +} + +a { + color: inherit; + text-decoration: none; + transition: color var(--transition-fast); +} + +button, input, select, textarea { + font: inherit; +} + +/* --- 3. Tipografía de Marca --- */ +.font-bebas { + font-family: 'Bebas Neue', sans-serif; + letter-spacing: 0.05em; + font-weight: 400; +} + +h1, h2, h3, h4, h5, h6 { + color: var(--text-main); + line-height: 1.25; + font-weight: 700; + letter-spacing: -0.02em; +} + +h1 { font-size: clamp(2.2rem, 5vw, 3.5rem); } +h2 { font-size: clamp(1.8rem, 3.5vw, 2.5rem); } +h3 { font-size: clamp(1.3rem, 2.5vw, 1.8rem); } +h4 { font-size: 1.25rem; } + +.eyebrow { + display: inline-block; + font-size: 0.85rem; + font-weight: 700; + text-transform: uppercase; + letter-spacing: 0.12em; + color: var(--ide-accent); + margin-bottom: 0.75rem; +} + +.lead-text { + font-size: 1.15rem; + color: var(--text-muted); + max-width: 72ch; + line-height: 1.7; +} + +/* --- 4. Layout & Contenedores --- */ +.container { + width: 100%; + max-width: 1200px; + margin-left: auto; + margin-right: auto; + padding-left: 1.5rem; + padding-right: 1.5rem; +} + +.container-narrow { + max-width: 860px; +} + +.container-wide { + max-width: 1360px; +} + +.section-padding { + padding-top: clamp(3.5rem, 7vw, 6.5rem); + padding-bottom: clamp(3.5rem, 7vw, 6.5rem); +} + +.section-padding-sm { + padding-top: clamp(2rem, 4vw, 3.5rem); + padding-bottom: clamp(2rem, 4vw, 3.5rem); +} + +/* --- 5. Componentes: Header & Navbar --- */ +#site-header { + position: sticky; + top: 0; + z-index: 1000; + background-color: var(--bg-surface); + border-bottom: 1px solid var(--border-color); + backdrop-filter: blur(12px); + -webkit-backdrop-filter: blur(12px); + transition: background-color var(--transition-normal), border-color var(--transition-normal); +} + +.navbar { + display: flex; + align-items: center; + justify-content: space-between; + height: 80px; +} + +/* Logos y Espacios */ +.brand-logo-wrap { + display: flex; + align-items: center; + gap: 0.75rem; + text-decoration: none; +} + +.brand-logo-img { + height: 42px; + width: auto; + object-fit: contain; +} + +/* Logo SVG interactivo por defecto */ +.brand-logo-svg { + height: 38px; + width: auto; +} + +.brand-logo-svg .logo-text { + fill: var(--ide-primary); + transition: fill var(--transition-normal); +} + +.brand-logo-svg .logo-accent { + fill: var(--ide-accent); +} + +[data-theme="dark"] .brand-logo-svg .logo-text { + fill: #FFFFFF; +} + +.nav-links { + display: flex; + align-items: center; + gap: 1.8rem; + list-style: none; +} + +.nav-link { + font-size: 0.95rem; + font-weight: 600; + color: var(--text-body); + position: relative; + padding: 0.35rem 0; + white-space: nowrap; +} + +.nav-link:hover, .nav-link.active { + color: var(--ide-accent); +} + +.nav-link.active::after { + content: ''; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + height: 2px; + background-color: var(--ide-accent); + border-radius: 2px; +} + +.nav-actions { + display: flex; + align-items: center; + gap: 1rem; +} + +/* Switch de Tema Claro/Oscuro */ +.theme-toggle-btn { + background: var(--bg-subtle); + border: 1px solid var(--border-color); + color: var(--text-main); + width: 42px; + height: 42px; + border-radius: var(--radius-full); + display: flex; + align-items: center; + justify-content: center; + cursor: pointer; + transition: all var(--transition-fast); +} + +.theme-toggle-btn:hover { + background: var(--border-color); + color: var(--ide-accent); +} + +.theme-icon-sun { display: none; } +.theme-icon-moon { display: block; } + +[data-theme="dark"] .theme-icon-sun { display: block; } +[data-theme="dark"] .theme-icon-moon { display: none; } + +/* Botón Hamburguesa Móvil */ +.mobile-toggle-btn { + display: none; + background: none; + border: none; + color: var(--text-main); + font-size: 1.5rem; + cursor: pointer; + padding: 0.5rem; +} + +/* Menú Móvil Overlay */ +.mobile-menu-drawer { + display: none; + position: fixed; + top: 80px; + left: 0; + right: 0; + bottom: 0; + background-color: var(--bg-surface); + padding: 2rem 1.5rem; + overflow-y: auto; + z-index: 999; + border-top: 1px solid var(--border-color); + transform: translateY(-100%); + opacity: 0; + transition: transform 0.3s ease, opacity 0.3s ease; +} + +.mobile-menu-drawer.is-open { + transform: translateY(0); + opacity: 1; +} + +.mobile-nav-links { + list-style: none; + display: flex; + flex-direction: column; + gap: 1.25rem; + margin-bottom: 2rem; +} + +.mobile-nav-links .nav-link { + font-size: 1.2rem; + font-weight: 600; +} + +/* --- 6. Botones --- */ +.btn { + display: inline-flex; + align-items: center; + justify-content: center; + gap: 0.6rem; + font-weight: 700; + font-size: 0.95rem; + padding: 0.75rem 1.6rem; + border-radius: var(--radius-sm); + border: 1.5px solid transparent; + cursor: pointer; + white-space: nowrap; + transition: all var(--transition-fast); + text-decoration: none; +} + +.btn-primary { + background-color: var(--ide-primary); + color: #FFFFFF; + border-color: var(--ide-primary); +} + +.btn-primary:hover { + background-color: var(--ide-primary-dark); + border-color: var(--ide-primary-dark); + color: #FFFFFF; + box-shadow: var(--shadow-md); + transform: translateY(-1px); +} + +.btn-accent { + background-color: var(--ide-accent); + color: #FFFFFF; + border-color: var(--ide-accent); +} + +.btn-accent:hover { + background-color: var(--ide-accent-hover); + border-color: var(--ide-accent-hover); + color: #FFFFFF; + box-shadow: var(--shadow-md); + transform: translateY(-1px); +} + +.btn-outline { + background-color: transparent; + color: var(--text-main); + border-color: var(--border-color); +} + +.btn-outline:hover { + border-color: var(--ide-accent); + color: var(--ide-accent); + background-color: var(--ide-accent-soft); +} + +.btn-ghost { + background-color: transparent; + color: var(--text-muted); +} + +.btn-ghost:hover { + color: var(--ide-accent); + background-color: var(--bg-subtle); +} + +.btn-lg { + padding: 1rem 2.2rem; + font-size: 1.05rem; +} + +.btn-sm { + padding: 0.45rem 1rem; + font-size: 0.85rem; +} + +/* --- 7. Tarjetas y Grillas --- */ +.card { + background-color: var(--bg-surface); + border: 1px solid var(--border-color); + border-radius: var(--radius-md); + padding: 1.75rem; + transition: all var(--transition-normal); + position: relative; +} + +.card:hover { + border-color: var(--ide-accent); + box-shadow: var(--shadow-md); + transform: translateY(-2px); +} + +.grid-2 { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 1.75rem; +} + +.grid-3 { + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 1.75rem; +} + +.grid-4 { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 1.5rem; +} + +/* --- 8. Hero: La Doble Entrada (Home) --- */ +.hero-wrapper { + background: radial-gradient(circle at 80% 20%, var(--ide-accent-soft) 0%, transparent 50%), var(--bg-body); + border-bottom: 1px solid var(--border-color); + position: relative; + overflow: hidden; +} + +.hero-grid { + display: grid; + grid-template-columns: 1.15fr 0.85fr; + gap: 3.5rem; + align-items: center; +} + +.hero-doble-entrada { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 1.25rem; + margin-top: 2.2rem; +} + +.hero-card-entry { + background-color: var(--bg-surface); + border: 1.5px solid var(--border-color); + border-radius: var(--radius-md); + padding: 1.5rem; + text-decoration: none; + display: flex; + flex-direction: column; + justify-content: space-between; + transition: all var(--transition-normal); +} + +.hero-card-entry:hover { + border-color: var(--ide-accent); + box-shadow: var(--shadow-md); + transform: translateY(-3px); +} + +.hero-card-entry .entry-icon { + width: 44px; + height: 44px; + background-color: var(--ide-accent-soft); + color: var(--ide-accent); + border-radius: var(--radius-sm); + display: flex; + align-items: center; + justify-content: center; + font-size: 1.25rem; + margin-bottom: 1rem; +} + +.hero-card-entry h3 { + font-size: 1.1rem; + margin-bottom: 0.5rem; +} + +.hero-card-entry p { + font-size: 0.88rem; + color: var(--text-muted); + line-height: 1.5; +} + +.hero-card-entry .entry-link-text { + margin-top: 1rem; + font-weight: 700; + font-size: 0.85rem; + color: var(--ide-accent); + display: flex; + align-items: center; + gap: 0.35rem; +} + +/* Gráfico Conceptual Nodos / Infinito */ +.hero-visual-graphic { + position: relative; + display: flex; + align-items: center; + justify-content: center; +} + +.infinito-camino-box { + width: 100%; + aspect-ratio: 1.1 / 1; + background-color: var(--bg-surface); + border: 1px solid var(--border-color); + border-radius: var(--radius-lg); + padding: 2rem; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + text-align: center; + box-shadow: var(--shadow-sm); +} + +/* --- 9. Bloque 2: La Tensión y El Quiebre --- */ +.tension-box { + background-color: var(--bg-surface); + border-radius: var(--radius-lg); + border: 1px solid var(--border-color); + padding: clamp(2rem, 5vw, 3.5rem); + box-shadow: var(--shadow-sm); +} + +/* --- 10. Bloque 3: La Brújula IDE (Diagnóstico Interactivo) --- */ +.brujula-container { + background: var(--bg-surface); + border: 2px solid var(--ide-accent); + border-radius: var(--radius-lg); + padding: clamp(1.75rem, 4vw, 3rem); + box-shadow: var(--shadow-lg); + position: relative; + overflow: hidden; +} + +.brujula-header { + display: flex; + justify-content: space-between; + align-items: flex-start; + margin-bottom: 1.5rem; + flex-wrap: wrap; + gap: 1rem; +} + +.brujula-progress-bar { + width: 100%; + height: 6px; + background-color: var(--bg-subtle); + border-radius: var(--radius-full); + margin-bottom: 2rem; + overflow: hidden; +} + +.brujula-progress-fill { + height: 100%; + width: 33.33%; + background: linear-gradient(90deg, var(--ide-primary), var(--ide-accent)); + transition: width 0.4s ease; +} + +.brujula-step { + display: none; + animation: fadeIn 0.3s ease forwards; +} + +.brujula-step.active { + display: block; +} + +.brujula-options-grid { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 1rem; + margin-top: 1.5rem; +} + +.brujula-option-card { + background-color: var(--bg-body); + border: 1.5px solid var(--border-color); + border-radius: var(--radius-md); + padding: 1.25rem; + cursor: pointer; + transition: all var(--transition-fast); + text-align: left; + display: flex; + align-items: flex-start; + gap: 0.85rem; +} + +.brujula-option-card:hover { + border-color: var(--ide-accent); + background-color: var(--ide-accent-soft); + transform: translateY(-2px); +} + +.brujula-option-card.selected { + border-color: var(--ide-accent); + background-color: var(--ide-accent-soft); +} + +.brujula-radio-bullet { + width: 20px; + height: 20px; + border-radius: 50%; + border: 2px solid var(--border-color); + flex-shrink: 0; + margin-top: 2px; + position: relative; +} + +.brujula-option-card.selected .brujula-radio-bullet { + border-color: var(--ide-accent); +} + +.brujula-option-card.selected .brujula-radio-bullet::after { + content: ''; + position: absolute; + top: 3px; + left: 3px; + width: 10px; + height: 10px; + border-radius: 50%; + background-color: var(--ide-accent); +} + +.brujula-result-box { + background: var(--bg-body); + border: 1.5px solid var(--border-color); + border-radius: var(--radius-md); + padding: 1.75rem; + margin-top: 1.5rem; +} + +/* --- 11. Bloque 4 & 7: Metodología en 4 Pasos --- */ +.method-steps-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 1.5rem; + position: relative; +} + +.method-step-card { + background-color: var(--bg-surface); + border: 1px solid var(--border-color); + border-radius: var(--radius-md); + padding: 1.75rem 1.5rem; + position: relative; +} + +.method-num { + font-family: 'Bebas Neue', sans-serif; + font-size: 2.2rem; + color: var(--ide-accent); + line-height: 1; + margin-bottom: 0.5rem; +} + +/* --- 12. Bloque 5: Ecosistema (4 Capacidades) --- */ +.ecosystem-grid { + display: grid; + grid-template-columns: repeat(4, 1fr); + gap: 1.5rem; +} + +.ecosystem-card { + background-color: var(--bg-surface); + border: 1px solid var(--border-color); + border-radius: var(--radius-md); + padding: 2rem 1.5rem; + display: flex; + flex-direction: column; + justify-content: space-between; + transition: all var(--transition-normal); +} + +.ecosystem-card:hover { + border-color: var(--ide-accent); + box-shadow: var(--shadow-lg); + transform: translateY(-4px); +} + +.ecosystem-badge { + display: inline-block; + padding: 0.25rem 0.65rem; + border-radius: var(--radius-sm); + font-size: 0.75rem; + font-weight: 700; + letter-spacing: 0.05em; + text-transform: uppercase; + margin-bottom: 1rem; +} + +.badge-excellence { background-color: rgba(10, 72, 94, 0.15); color: var(--ide-primary); } +[data-theme="dark"] .badge-excellence { background-color: rgba(10, 72, 94, 0.4); color: #4fb389; } + +.badge-project { background-color: rgba(238, 184, 90, 0.15); color: #ed8d01; } +.badge-academy { background-color: rgba(245, 70, 11, 0.15); color: var(--ide-excellence); } +.badge-digital { background-color: rgba(99, 102, 241, 0.15); color: #2c69ab; } + +/* --- 13. Modales (Pop-ups de Desafíos y Cursos) --- */ +.modal-backdrop { + position: fixed; + top: 0; + left: 0; + width: 100vw; + height: 100vh; + background-color: rgba(10, 24, 32, 0.75); + backdrop-filter: blur(6px); + -webkit-backdrop-filter: blur(6px); + z-index: 2000; + display: none; + align-items: center; + justify-content: center; + padding: 1.5rem; + opacity: 0; + transition: opacity 0.25s ease; +} + +.modal-backdrop.is-active { + display: flex; + opacity: 1; +} + +.modal-window { + background-color: var(--bg-surface); + border: 1px solid var(--border-color); + border-radius: var(--radius-lg); + width: 100%; + max-width: 720px; + max-height: 90vh; + overflow-y: auto; + box-shadow: var(--shadow-lg); + position: relative; + padding: clamp(1.75rem, 4vw, 2.5rem); + transform: scale(0.95); + transition: transform 0.25s ease; +} + +.modal-backdrop.is-active .modal-window { + transform: scale(1); +} + +.modal-close-btn { + position: absolute; + top: 1.25rem; + right: 1.25rem; + background: var(--bg-subtle); + border: 1px solid var(--border-color); + color: var(--text-main); + width: 36px; + height: 36px; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + font-size: 1.25rem; + cursor: pointer; + transition: all var(--transition-fast); +} + +.modal-close-btn:hover { + background-color: var(--border-color); + color: var(--ide-accent); +} + +/* --- 14. Espacio de Imágenes Genéricas / Placeholders --- */ +.img-placeholder { + width: 100%; + background-color: var(--bg-subtle); + border: 1.5px dashed var(--border-color); + border-radius: var(--radius-md); + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + color: var(--text-muted); + padding: 2rem; + text-align: center; + transition: border-color var(--transition-fast); +} + +.img-placeholder:hover { + border-color: var(--ide-accent); +} + +.img-placeholder-icon { + font-size: 2rem; + margin-bottom: 0.5rem; + color: var(--ide-gray); +} + +.img-placeholder-label { + font-size: 0.85rem; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.05em; +} + +/* --- 15. Formularios --- */ +.form-group { + margin-bottom: 1.25rem; +} + +.form-label { + display: block; + font-size: 0.9rem; + font-weight: 600; + color: var(--text-main); + margin-bottom: 0.4rem; +} + +.form-control { + width: 100%; + padding: 0.8rem 1rem; + font-size: 0.95rem; + background-color: var(--bg-body); + border: 1px solid var(--border-color); + border-radius: var(--radius-sm); + color: var(--text-main); + transition: border-color var(--transition-fast), box-shadow var(--transition-fast); +} + +.form-control:focus { + outline: none; + border-color: var(--ide-accent); + box-shadow: 0 0 0 3px var(--ide-accent-soft); +} + +.form-alert { + padding: 1rem 1.25rem; + border-radius: var(--radius-sm); + margin-top: 1rem; + display: none; + font-size: 0.92rem; +} + +.form-alert.alert-success { + display: block; + background-color: rgba(19, 167, 138, 0.15); + border: 1px solid var(--ide-accent); + color: var(--ide-accent); +} + +.form-alert.alert-error { + display: block; + background-color: rgba(239, 68, 68, 0.15); + border: 1px solid #EF4444; + color: #DC2626; +} + +/* --- 16. Filtros de Soluciones --- */ +.filters-bar { + display: flex; + gap: 0.5rem; + flex-wrap: wrap; + margin-bottom: 2rem; +} + +.filter-btn { + background: var(--bg-surface); + border: 1px solid var(--border-color); + color: var(--text-body); + padding: 0.5rem 1.1rem; + border-radius: var(--radius-full); + font-size: 0.88rem; + font-weight: 600; + cursor: pointer; + transition: all var(--transition-fast); + white-space: nowrap; +} + +.filter-btn:hover, .filter-btn.active { + background-color: var(--ide-primary); + border-color: var(--ide-primary); + color: #FFFFFF; +} + +/* --- 17. Footer --- */ +#site-footer { + background-color: var(--bg-surface); + border-top: 1px solid var(--border-color); + padding-top: 4.5rem; + padding-bottom: 2.5rem; + margin-top: auto; + transition: background-color var(--transition-normal); +} + +.footer-grid { + display: grid; + grid-template-columns: 1.5fr 1fr 1fr 1.25fr; + gap: 2.5rem; + margin-bottom: 3.5rem; +} + +.footer-logo-wrap { + margin-bottom: 1.25rem; +} + +.footer-heading { + font-size: 1rem; + font-weight: 700; + color: var(--text-main); + text-transform: uppercase; + letter-spacing: 0.05em; + margin-bottom: 1.25rem; +} + +.footer-links { + list-style: none; + display: flex; + flex-direction: column; + gap: 0.65rem; +} + +.footer-link { + font-size: 0.92rem; + color: var(--text-muted); +} + +.footer-link:hover { + color: var(--ide-accent); +} + +.footer-bottom { + display: flex; + justify-content: space-between; + align-items: center; + padding-top: 2rem; + border-top: 1px solid var(--border-color); + font-size: 0.85rem; + color: var(--text-muted); + flex-wrap: wrap; + gap: 1rem; +} + +/* --- 18. Animaciones y Clases Utilitarias --- */ +@keyframes fadeIn { + from { opacity: 0; transform: translateY(6px); } + to { opacity: 1; transform: translateY(0); } +} + +.animate-fade { + animation: fadeIn 0.4s ease forwards; +} + +.text-center { text-align: center; } +.text-left { text-align: left; } +.text-accent { color: var(--ide-accent); } +.text-primary { color: var(--ide-primary); } +.text-muted { color: var(--text-muted); } + +.bg-subtle-section { + background-color: var(--bg-subtle); +} + +.divider { + height: 1px; + background-color: var(--border-color); + width: 100%; + margin: 2rem 0; +} + +/* --- 19. Media Queries (Mobile First / Responsive) --- */ +@media (max-width: 1024px) { + .hero-grid { + grid-template-columns: 1fr; + gap: 2.5rem; + } + + .grid-4, .ecosystem-grid, .method-steps-grid { + grid-template-columns: repeat(2, 1fr); + } + + .footer-grid { + grid-template-columns: 1fr 1fr; + } +} + +@media (max-width: 768px) { + .nav-links, .nav-actions .btn { + display: none; + } + + .nav-actions { + display: flex; + align-items: center; + gap: 0.5rem; + } + + .mobile-toggle-btn { + display: inline-flex; + align-items: center; + justify-content: center; + min-width: 44px; + min-height: 44px; + background: var(--bg-subtle); + border: 1px solid var(--border-color); + color: var(--text-main); + border-radius: var(--radius-full); + padding: 0; + transition: all var(--transition-fast); + } + + .mobile-toggle-btn:hover { + background: var(--border-color); + color: var(--ide-accent); + } + + .mobile-menu-drawer { + display: block; + } + + .hero-doble-entrada { + grid-template-columns: 1fr; + } + + .grid-2, .grid-3, .brujula-options-grid { + grid-template-columns: 1fr; + } + + .grid-4, .ecosystem-grid, .method-steps-grid { + grid-template-columns: 1fr; + } + + .footer-grid { + grid-template-columns: 1fr; + } + + .footer-bottom { + flex-direction: column; + text-align: center; + } +} diff --git a/data/cursos.json b/data/cursos.json new file mode 100644 index 0000000..821932b --- /dev/null +++ b/data/cursos.json @@ -0,0 +1,83 @@ +[ + { + "id": "curso-iso-9001", + "titulo": "Sistemas de Gestión de Calidad (ISO 9001:2015): De la Norma a la Gestión Real", + "categoria": "IDE Excellence & Academy", + "modalidad": "Online sincrónico / In-Company", + "duracion": "32 horas (8 semanas)", + "sector": "Industria, Servicios y Sector Público", + "descripcion_corta": "Aprenda a diseñar, implementar y auditar un Sistema de Gestión de Calidad que trascienda la mera auditoría y transforme los procesos operativos de su organización.", + "propuesta": "Este programa aborda la norma ISO 9001 no como un fin documental, sino como una herramienta viva para la toma de decisiones, la mejora continua y la satisfacción del cliente.", + "objetivos": [ + "Comprender la estructura de alto nivel y los requisitos clave de ISO 9001:2015.", + "Identificar y mapear procesos organizacionales con enfoque de riesgos.", + "Diseñar indicadores de gestión (KPIs) pertinentes y accionables.", + "Preparar a la organización para auditorías internas y de certificación sin generar burocracia innecesaria." + ], + "temario": [ + "Módulo 1: Enfoque a procesos y pensamiento basado en riesgos.", + "Módulo 2: Liderazgo, compromiso y cultura de calidad.", + "Módulo 3: Planificación, objetivos y gestión del cambio.", + "Módulo 4: Operación, control de proveedores y satisfacción del cliente.", + "Módulo 5: Auditorías internas y mejora continua sistémica." + ], + "docente": "Equipo Senior de Consultores y Auditores Líderes IRCA de IDE Excellence.", + "resultados_esperados": "Capacidad para liderar la implementación o mejora de un SGC con valor estratégico real para la dirección de la empresa.", + "proxima_fecha": "Octubre 2026", + "destacado": true + }, + { + "id": "curso-pmo-agil", + "titulo": "Dirección y Gestión de Proyectos Estratégicos: Metodología Híbrida y PMO", + "categoria": "IDE Project & Academy", + "modalidad": "Híbrida (Clases en vivo + Campus)", + "duracion": "40 horas (10 semanas)", + "sector": "Corporativo, Startups y Tecnología", + "descripcion_corta": "Convierta los desafíos organizacionales en proyectos con entregables claros, presupuestos controlados y adopción efectiva del cambio.", + "propuesta": "Combina los estándares del PMI con marcos ágiles (Scrum, Kanban) para garantizar que los proyectos no solo se completen a tiempo, sino que generen el impacto esperado en el negocio.", + "objetivos": [ + "Estructurar un marco de gobernanza y Oficina de Proyectos (PMO).", + "Dominar herramientas de estimación, control de cronograma y gestión de riesgos.", + "Alinear proyectos con los objetivos estratégicos de la dirección.", + "Facilitar la gestión del cambio organizacional en los equipos de trabajo." + ], + "temario": [ + "Módulo 1: Alineación estratégica y constitución de proyectos.", + "Módulo 2: Planificación integrada: alcance, tiempo, costos y calidad.", + "Módulo 3: Métodos ágiles aplicados a proyectos no tecnológicos.", + "Módulo 4: Gestión de interesados y comunicación efectiva.", + "Módulo 5: Cierre, lecciones aprendidas y transferencia de capacidades." + ], + "docente": "PMP® Certified Project Managers con más de 15 años liderando proyectos en Latinoamérica.", + "resultados_esperados": "Liderazgo confiable en proyectos complejos con métricas claras de entrega y valor.", + "proxima_fecha": "Noviembre 2026", + "destacado": true + }, + { + "id": "curso-ia-procesos", + "titulo": "Inteligencia Artificial y Automatización Aplicada a la Gestión de Procesos", + "categoria": "IDE Digital & Academy", + "modalidad": "100% Online con talleres prácticos", + "duracion": "24 horas (6 semanas)", + "sector": "Multi-industria", + "descripcion_corta": "Descubra cómo integrar herramientas de IA generativa, automatización de flujos y análisis de datos para optimizar los procesos de su organización sin perder el enfoque humano.", + "propuesta": "Un enfoque práctico y sensato sobre la IA: no para sumar tecnología por moda, sino para resolver cuellos de botella operativos concretos y potenciar la productividad del equipo.", + "objetivos": [ + "Identificar oportunidades reales de automatización e IA en los procesos actuales.", + "Implementar flujos de trabajo automatizados sin necesidad de código complejo.", + "Gestionar la seguridad, privacidad de datos y ética en el uso de IA organizacional.", + "Diseñar prompts y asistentes para soporte a la toma de decisiones y documentación." + ], + "temario": [ + "Módulo 1: Panorama de la IA generativa y analítica en la empresa moderna.", + "Módulo 2: Diagnóstico de procesos candidatos a automatización.", + "Módulo 3: Herramientas prácticas de automatización (No-code / Low-code).", + "Módulo 4: Creación de agentes y asistentes para análisis de información.", + "Módulo 5: Adopción cultural y gobernanza de la tecnología." + ], + "docente": "Especialistas en Transformación Digital e Inteligencia Artificial de IDE Digital.", + "resultados_esperados": "Plan de implementación de al menos 2 casos de uso reales de IA y automatización en su organización.", + "proxima_fecha": "Noviembre 2026", + "destacado": true + } +] diff --git a/desafios.html b/desafios.html new file mode 100644 index 0000000..9d7bddc --- /dev/null +++ b/desafios.html @@ -0,0 +1,305 @@ + + + + + + Desafíos Organizacionales | IDE Consultores + + + + + + + + + + +
+ + +
+
+ PUNTO DE PARTIDA +

¿Qué está pasando en tu organización?

+

+ No necesitás tener la solución definida para empezar a conversar. Si reconocés alguno de estos síntomas o metas en tu contexto, hacé clic para explorar cómo podemos abordarlo. +

+
+
+ + +
+
+ +
+ + +
+
+ +

La organización creció y necesitamos ordenar los procesos

+

+ Lo que antes se resolvía informalmente hoy genera desorden, duplicación de esfuerzos o dependencia de personas clave. +

+
+ +
+ + +
+
+ +

Los proyectos estratégicos se retrasan o no logran el resultado

+

+ Iniciativas prioritarias quedan truncas por falta de metodología, gobernanza clara o desvíos en el alcance y presupuesto. +

+
+ +
+ + +
+
+ +

El equipo no adopta los cambios y persiste la resistencia

+

+ Se diseñaron nuevas pautas o sistemas, pero la gente continúa operando como antes porque falta desarrollo de capacidades. +

+
+ +
+ + +
+
+ +

Queremos incorporar Inteligencia Artificial pero no sabemos por dónde

+

+ Existe el interés en modernizar y automatizar tareas, pero temen malgastar recursos en tecnología que no resuelva dolores reales. +

+
+ +
+ + +
+
+ +

Nos exigen certificar una norma (ISO 9001, etc.) y queremos que aporte valor

+

+ Un cliente o licitación pide certificar, pero no quieren crear burocracia inútil ni un sistema que solo viva en el papel. +

+
+ +
+ + +
+
+ +

No sé exactamente qué necesito, pero algo no está funcionando

+

+ Usá nuestra herramienta interactiva para diagnosticar la prioridad de tu organización en 3 pasos breves. +

+
+ + Iniciar Diagnóstico Rápido → + +
+ +
+ +
+
+ + + + + + + + + + + + + + + + + + +
+ + + + + diff --git a/ecosistema.html b/ecosistema.html new file mode 100644 index 0000000..1a0a424 --- /dev/null +++ b/ecosistema.html @@ -0,0 +1,234 @@ + + + + + + El Ecosistema IDE | Cuatro Capacidades Conectadas - IDE Consultores + + + + + + + + + + +
+ + +
+
+ LA PROPUESTA DE VALOR +

Una mirada.
Múltiples capacidades.
Un mismo propósito.

+

+ No se trata de sumar soluciones aisladas. Se trata de conectar las capacidades necesarias para generar una transformación real que perdure en el conjunto de la organización. +

+ + +
+

+ “No todos los desafíos necesitan todo el Ecosistema. Pero todos pueden beneficiarse de una mirada capaz de comprender el conjunto.” +

+
+
+
+ + +
+
+
+ ARQUITECTURA DE INTEGRACIÓN +

El Modelo de Red Sistémica

+ +
+
+ + EXCELLENCE +

Procesos & Calidad

+
+
+ + PROJECT +

Dirección & PMO

+
+
+ + ACADEMY +

Capacidades & Personas

+
+
+ + DIGITAL +

IA & Automatización

+
+
+
+
+
+ + +
+
+ + +
+
+
+ GESTIÓN Y PROCESOS +

IDE Excellence

+

+ Para fortalecer la gestión: Diseñamos y optimizamos la arquitectura de procesos organizacionales, sistemas de gestión de calidad y cumplimiento normativo internacional. +

+
    +
  • • Normas ISO 9001, 14001, 45001, 21001, 27001.
  • +
  • • Mapeo, rediseño y optimización de cadenas de valor.
  • +
  • • Indicadores de desempeño (KPIs) y tableros de control de gestión.
  • +
  • • Auditorías internas con enfoque de riesgo y madurez.
  • +
+
+
+
+ +
Espacio Gráfico IDE Excellence
+
+
+
+
+ + +
+
+
+
+ +
Espacio Gráfico IDE Project
+
+
+
+ DIRECCIÓN Y RESULTADOS +

IDE Project

+

+ Para convertir desafíos en proyectos y proyectos en resultados: Estructuramos la metodología y el control para que las iniciativas estratégicas se cumplan en tiempo, costo y alcance. +

+
    +
  • • Oficinas de Gestión de Proyectos (PMO) estratégicas y operativas.
  • +
  • • Gestión de portafolios, priorización e inversiones.
  • +
  • • Metodologías híbridas: PMBOK® + marcos ágiles (Scrum, Kanban).
  • +
  • • Rescate y reestructuración de proyectos con desvíos críticos.
  • +
+
+
+
+ + +
+
+
+ DESARROLLO HUMANO +

IDE Academy

+

+ Para desarrollar las capacidades que hacen posible la transformación: Formación ejecutiva e In-Company diseñada para que los equipos comprendan, apliquen y sostengan los cambios. +

+
    +
  • • Capacitación In-Company sobre casos y procesos reales.
  • +
  • • Programas de liderazgo de equipos y gestión del cambio.
  • +
  • • Formación de auditores internos y dueños de procesos.
  • +
+ Ver Catálogo de Cursos → +
+
+
+ +
Espacio Gráfico IDE Academy
+
+
+
+
+ + +
+
+
+
+ +
Espacio Gráfico IDE Digital
+
+
+
+ TECNOLOGÍA CON SENTIDO +

IDE Digital

+

+ Para integrar tecnología, datos e IA con propósito: No sumamos herramientas por moda; automatizamos procesos clave y potenciamos la toma de decisiones con analítica de datos. +

+
    +
  • • Implementación práctica de Inteligencia Artificial en flujos operativos.
  • +
  • • Automatización No-Code / Low-Code de tareas repetitivas.
  • +
  • • Tableros de Business Intelligence (BI) y visualización de KPIs.
  • +
  • • Diagnósticos de madurez digital y ciberseguridad básica.
  • +
+
+
+
+ +
+
+ + +
+
+
+ CASOS DE INTEGRACIÓN +

Cómo se conectan las capacidades en la práctica

+
+ +
+ +
+ Excellence + Academy +

Certificación ISO con Adopción Real

+

+ IDE Excellence diseña el Sistema de Gestión de Calidad, mientras que IDE Academy capacita a los líderes de proceso para que el sistema viva en la cultura diaria. +

+
+ +
+ Project + Digital +

PMO con Tableros Inteligentes

+

+ IDE Project estructura la gobernanza del portafolio, e IDE Digital implementa asistentes automáticos de seguimiento y tableros en tiempo real para el directorio. +

+
+ +
+ Excellence + Digital +

Reingeniería de Procesos con IA

+

+ IDE Excellence mapea y simplifica los flujos de trabajo, e IDE Digital automatiza la ingesta y clasificación de documentación con agentes de IA. +

+
+ +
+
+
+ + +
+
+

¿Qué combinación de capacidades necesita tu organización?

+

+ Conversemos para diseñar una propuesta a medida de tu realidad. +

+
+ HABLEMOS + Explorar por Desafíos +
+
+
+ +
+ + + + + diff --git a/ide-academy.html b/ide-academy.html new file mode 100644 index 0000000..becba4d --- /dev/null +++ b/ide-academy.html @@ -0,0 +1,138 @@ + + + + + + IDE Academy | Formación Ejecutiva e In-Company - IDE Consultores + + + + + + + + + + +
+ + +
+
+ CAPACIDADES & APRENDIZAJE +

Desarrollamos las capacidades que hacen posible la transformación

+

+ Los procesos y la tecnología son indispensables, pero son las personas quienes los ejecutan y mejoran día a día. Diseñamos programas prácticos orientados a resultados organizacionales tangibles. +

+
+ Ver Cursos Destacados ↓ + Solicitar Formación In-Company +
+
+
+ + +
+
+
+
+ +

Casos Reales y Aplicados

+

Los participantes trabajan sobre los procesos y desafíos cotidianos de sus propias empresas.

+
+
+ +

Docentes Consultores Senior

+

Instructores con amplia trayectoria liderando auditorías y proyectos en organizaciones reales.

+
+
+ +

Transferencia de Autonomía

+

Herramientas y plantillas listas para aplicar inmediatamente en el puesto de trabajo.

+
+
+
+
+ + +
+
+
+
+ PROGRAMAS ACTIVOS +

Próximos Cursos y Formaciones Destacadas

+

+ Hacé clic en cualquier programa para acceder a su ficha técnica completa, objetivos y temario modular. +

+
+
+ + +
+ +
+

Cargando catálogo de programas formativos...

+
+
+ +
+
+ + +
+
+
+
+
+ A MEDIDA DE TU EMPRESA +

Formación In-Company y Capacitación a Equipos

+

+ Adaptamos la duración, modalidad (presencial, híbrida u online) y los contenidos de nuestros programas para alinearlos con los objetivos estratégicos y la cultura de tu organización. +

+
    +
  • ✓ Diagnóstico previo de necesidades formativas.
  • +
  • ✓ Materiales personalizados con la identidad y procesos de su empresa.
  • +
  • ✓ Evaluación de impacto y seguimiento post-capacitación.
  • +
+ + Solicitar Cotización In-Company → + +
+ +
+
+ +
Espacio Fotográfico Taller In-Company
+
+
+
+
+
+
+ + + + +
+ + + + + diff --git a/includes/footer.html b/includes/footer.html new file mode 100644 index 0000000..8136d8b --- /dev/null +++ b/includes/footer.html @@ -0,0 +1,86 @@ + + +
+ + + + +
diff --git a/includes/header.html b/includes/header.html new file mode 100644 index 0000000..92506ce --- /dev/null +++ b/includes/header.html @@ -0,0 +1,77 @@ + + +
+ +
+ + +
+ +
+ HABLEMOS +
+
diff --git a/index.html b/index.html new file mode 100644 index 0000000..97306e4 --- /dev/null +++ b/index.html @@ -0,0 +1,429 @@ + + + + + + IDE Consultores | Todo está conectado + + + + + + + + + + + + + +
+ + +
+
+
+ +
+ TODO ESTÁ CONECTADO +

+ Mejorar una parte no siempre mejora el todo. +

+

+ En una organización, cada decisión genera efectos más allá del lugar donde interviene. Antes de buscar una solución, hay que comprender el sistema. +

+ + + +
+ + +
+
+ + + + + + + + + + + + + + +
+ CONECTIVIDAD SISTÉMICA +
+

+ Procesos • Personas • Proyectos • Tecnología funcionando en conjunto. +

+
+
+ +
+
+
+ + +
+
+
+
+ LA INCOMODIDAD PRODUCTIVA +

+ Soluciones aisladas para problemas que nunca estuvieron realmente aislados. +

+

+ Las organizaciones ya tienen procesos, herramientas, personas y tecnología. Sin embargo, algunos desafíos persisten. ¿Por qué? Porque sumar soluciones inconexas no genera transformación. Una mejora en un área puede crear tensiones en otra si no se comprende el sistema completo. +

+
+ ¿Qué impacto produjo esa mejora en el conjunto? +
+
+
+
+
+ + +
+
+
+ +
+
+ HERRAMIENTA DE CONSULTORÍA INTERACTIVA +

La Brújula IDE: Diagnóstico Rápido de Conectividad

+

+ ¿No estás seguro de por dónde empezar? Respondé 2 preguntas breves y te orientamos sobre qué capacidades pueden aportar mayor valor a tu contexto. +

+
+
+ Paso 1 de 3 +
+
+ + +
+
+
+ + +
+

1. ¿Cuál es tu prioridad u objetivo principal hoy?

+

Seleccioná la opción que mejor represente lo que buscan impulsar:

+ +
+
+
+
+ Mejorar la gestión y cumplir normas (ISO) + Ordenar procesos, certificar ISO 9001/14001/45001 y elevar la calidad. +
+
+ +
+
+
+ Ejecutar proyectos con resultados garantizados + Profesionalizar la gestión, crear una PMO y evitar desvíos en plazos. +
+
+ +
+
+
+ Desarrollar las capacidades de mi equipo + Capacitación In-Company, liderazgo, pensamiento de procesos y cultura. +
+
+ +
+
+
+ Integrar tecnología, automatización o IA + Transformar digitalmente las tareas rutinarias y aprovechar datos. +
+
+
+ + +
+ + +
+

2. ¿Qué es lo que más dificulta avanzar en este momento?

+

Identifiquemos la raíz que suele frenar los resultados:

+ +
+
+
+
+ Falta de claridad en los procesos + Las áreas trabajan en silos y la información no fluye adecuadamente. +
+
+ +
+
+
+ Los proyectos se retrasan o se desvían + Cuesta concretar las iniciativas estratégicas en tiempo y forma. +
+
+ +
+
+
+ El equipo no adopta los cambios + Hay resistencia cultural o falta de capacitación para sostener las mejoras. +
+
+ +
+
+
+ Tenemos herramientas, pero no las aprovechamos + Se incorporó software o tecnología pero no se integró con la operación diaria. +
+
+
+ +
+ +
+
+ + +
+
+
+ Combinación Sugerida de Capacidades +
+

+ IDE Excellence + IDE Academy +

+

+ La implementación de procesos y normas es el primer paso. Para que sea sostenible, suele ser clave trabajar también en el desarrollo de capacidades de las personas. +

+ + +
+
+ +
+
+
+ + +
+
+
+ LA NUEVA FORMA DE MIRAR +

Comprender el todo para saber dónde intervenir

+

+ No se trata de intervenir en todo ni de aplicar fórmulas estandarizadas. Guiamos cada intervención bajo un criterio metodológico riguroso: +

+
+ +
+
+
01
+

Comprender el Todo

+

Para identificar las verdaderas relaciones y causas raíz detrás de cada desafío.

+
+ +
+
02
+

Focalizar la Intervención

+

Para actuar estratégicamente donde se genera el mayor impacto y valor agregado.

+
+ +
+
03
+

Integrar Capacidades

+

Para que la transformación no quede limitada a una única solución aislada.

+
+ +
+
04
+

Resultados Sostenibles

+

Porque una verdadera mejora no debería solucionar un problema creando otro.

+
+
+
+
+ + +
+
+
+
+ ECOSISTEMA INTEGRADO +

Cuatro capacidades. Una misma mirada.

+

+ No son unidades separadas compitiendo por vender. Son capacidades complementarias que se activan según la necesidad real. +

+
+ Ver Ecosistema Completo → +
+ +
+ + +
+
+ IDE Excellence +

Para fortalecer la gestión

+

+ Sistemas de gestión, normas ISO (9001, 14001, 45001, 21001), procesos, calidad y mejora continua con sentido de negocio. +

+
+ Explorar Excellence → +
+ + +
+
+ IDE Project +

Para convertir proyectos en resultados

+

+ Dirección estratégica de proyectos, implementación de PMO, metodologías ágiles/híbridas y control de cumplimiento. +

+
+ Explorar Project → +
+ + +
+
+ IDE Academy +

Para desarrollar capacidades

+

+ Formación ejecutiva e In-Company para que los equipos adopten los cambios y sostengan la transformación en el tiempo. +

+
+ Explorar Academy → +
+ + +
+
+ IDE Digital +

Para integrar tecnología con propósito

+

+ Inteligencia artificial aplicada, automatización de flujos de procesos, tableros de datos y transformación digital sensata. +

+
+ Explorar Digital → +
+ +
+
+
+ + +
+
+
+ ÁMBITOS DE EXPERIENCIA +

Acompañamos la transformación en contextos complejos

+

+ Nuestra metodología se adapta a las particularidades y normativas de múltiples industrias en la región. +

+
+ +
+
+ +

Agro & Alimentos

+

Trazabilidad, normas de inocuidad y profesionalización de operaciones.

+
+ +
+ +

Industria & Manufactura

+

Eficiencia operativa, seguridad (ISO 45001) y calidad sostenida.

+
+ +
+ +

Salud & Servicios

+

Gestión por procesos críticos, experiencia del paciente y cumplimiento.

+
+ +
+ +

Educación & Gobierno

+

Norma ISO 21001, transformación de planes y gestión institucional.

+
+
+
+
+ + +
+
+
+ CONVERSACIÓN INICIAL +

+ ¿Qué desafío querés transformar? +

+

+ No necesitás tener la solución predefinida para empezar. Empecemos por entender el contexto de tu organización. +

+ +
+
+
+ +
+ + + + + + + + diff --git a/insights.html b/insights.html new file mode 100644 index 0000000..a08b52a --- /dev/null +++ b/insights.html @@ -0,0 +1,86 @@ + + + + + + Insights & Blog | IDE Consultores + + + + + + + + + + +
+ + +
+
+ CONOCIMIENTO & PERSPECTIVAS +

IDE Insights: Reflexiones y Metodología

+

+ Compartimos artículos técnicos, análisis de tendencias y casos de estudio sobre cómo abordar la complejidad organizacional sin perder el sentido de conjunto. +

+ + Visitar Blog Completo ↗ + +
+
+ + +
+
+ +
+
+ ÚLTIMAS PUBLICACIONES +

Artículos Recientes

+
+
+ Sincronizado con el Blog Oficial de IDE +
+
+ + +
+ +
+

Cargando artículos de Insights...

+
+
+ + +
+ + Ver todos los artículos en nuestro Blog → + +
+ +
+
+ + +
+
+ BOLETÍN MENSUAL +

Recibí nuestras reflexiones sobre gestión y transformación

+

+ Un resumen mensual con artículos, guías descargables y novedades del Ecosistema IDE. Sin spam. +

+ +
+ + +
+
+
+ +
+ + + + + diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..59ebb03 --- /dev/null +++ b/js/main.js @@ -0,0 +1,727 @@ +/** + * IDE CONSULTORES - SCRIPT INSTITUCIONAL (JS ÚNICO) + * Maneja includes modulares, tema claro/oscuro, Brújula IDE, modales, catálogo de cursos, filtros y formularios. + */ + +document.addEventListener('DOMContentLoaded', () => { + initApp(); +}); + +async function initApp() { + initTheme(); + await loadIncludes(); + initModals(); + initBrujulaIDE(); + initAcademyCourses(); + initSolucionesFilters(); + initInsightsFeed(); + initContactForm(); + initCareersForm(); +} + +/* ========================================================================== + 1. Carga Modular de Header y Footer (JS Nativo) + ========================================================================== */ +async function loadIncludes() { + const headerElem = document.getElementById('site-header'); + const footerElem = document.getElementById('site-footer'); + + try { + if (headerElem) { + const headerRes = await fetch('/includes/header.html', { cache: 'no-store' }); + if (headerRes.ok) { + headerElem.innerHTML = await headerRes.text(); + highlightActiveNavLink(); + attachHeaderEvents(); + } + } + + if (footerElem) { + const footerRes = await fetch('/includes/footer.html', { cache: 'no-store' }); + if (footerRes.ok) { + footerElem.innerHTML = await footerRes.text(); + } + } + } catch (err) { + console.warn('Nota: Inclusión modular de header/footer cargada con respaldo local.'); + } +} + +function highlightActiveNavLink() { + const currentPath = window.location.pathname; + const navLinks = document.querySelectorAll('.nav-link'); + + navLinks.forEach(link => { + const href = link.getAttribute('href'); + if (!href) return; + + // Comparación de página activa + if ( + (currentPath === '/' || currentPath.endsWith('index.html')) && (href === '/' || href === 'index.html' || href === './') || + (currentPath.includes(href) && href !== '/' && href !== 'index.html') + ) { + link.classList.add('active'); + } else { + link.classList.remove('active'); + } + }); +} + +function attachHeaderEvents() { + // Switch de Tema: usar clonación para evitar listeners duplicados + const themeToggle = document.getElementById('theme-toggle-btn'); + if (themeToggle) { + const newThemeToggle = themeToggle.cloneNode(true); + themeToggle.parentNode.replaceChild(newThemeToggle, themeToggle); + newThemeToggle.addEventListener('click', toggleTheme); + } + + // Botón de menú móvil y cierre del drawer: event delegation global. + // Evita depender de un nodo único (el header se inyecta de forma modular), + // de modo que funcione aunque el botón sea reemplazado por cloneNode. + const mobileDrawer = document.getElementById('mobile-menu-drawer'); + + document.addEventListener('click', (e) => { + const toggleClicked = e.target.closest('#mobile-menu-btn'); + const insideDrawer = mobileDrawer && mobileDrawer.contains(e.target); + + if (toggleClicked) { + if (mobileDrawer) { + const isOpen = mobileDrawer.classList.toggle('is-open'); + toggleClicked.setAttribute('aria-expanded', isOpen); + } + } else if (mobileDrawer && mobileDrawer.classList.contains('is-open') && !insideDrawer) { + mobileDrawer.classList.remove('is-open'); + const toggle = document.querySelector('#mobile-menu-btn'); + if (toggle) toggle.setAttribute('aria-expanded', 'false'); + } + }); + + const currentTheme = document.documentElement.getAttribute('data-theme') || 'light'; + toggleLogoTheme(currentTheme); + updateThemeIcon(currentTheme); +} + +/* ========================================================================== + 2. Selector de Modo Claro / Modo Oscuro con Persistencia + ========================================================================== */ +function initTheme() { + const savedTheme = localStorage.getItem('ide_theme') || 'light'; + document.documentElement.setAttribute('data-theme', savedTheme); + updateThemeIcon(savedTheme); + toggleLogoTheme(savedTheme); +} + +function toggleTheme() { + const currentTheme = document.documentElement.getAttribute('data-theme') || 'light'; + const newTheme = currentTheme === 'dark' ? 'light' : 'dark'; + document.documentElement.setAttribute('data-theme', newTheme); + localStorage.setItem('ide_theme', newTheme); + updateThemeIcon(newTheme); + toggleLogoTheme(newTheme); + const themeBtns = document.querySelectorAll('#theme-toggle-btn'); + themeBtns.forEach(btn => { + btn.setAttribute('aria-label', newTheme === 'dark' ? 'Cambiar a modo claro' : 'Cambiar a modo oscuro'); + }); +} + +function updateThemeIcon(theme) { + const themeBtns = document.querySelectorAll('#theme-toggle-btn'); + themeBtns.forEach(btn => { + btn.setAttribute('aria-label', theme === 'dark' ? 'Cambiar a modo claro' : 'Cambiar a modo oscuro'); + }); +} + +function toggleLogoTheme(theme) { + const logoLight = document.querySelector('.logo-light-only'); + const logoDark = document.querySelector('.logo-dark-only'); + + if (logoLight && logoDark) { + if (theme === 'dark') { + logoLight.style.display = 'none'; + logoDark.style.display = 'block'; + } else { + logoLight.style.display = 'block'; + logoDark.style.display = 'none'; + } + } +} + +/* ========================================================================== + 4. Sistema de Modales (Pop-ups con Cierre por Clic Externo y ESC) + ========================================================================== */ +function initModals() { + const modalBackdrops = document.querySelectorAll('.modal-backdrop'); + + modalBackdrops.forEach(backdrop => { + // Cerrar al hacer clic en el backdrop (fuera de la ventana) + backdrop.addEventListener('click', (e) => { + if (e.target === backdrop) { + closeModal(backdrop.id); + } + }); + + // Botones de cierre interno + const closeBtns = backdrop.querySelectorAll('.modal-close-btn, [data-close-modal]'); + closeBtns.forEach(btn => { + btn.addEventListener('click', () => { + closeModal(backdrop.id); + }); + }); + }); + + // Cerrar con tecla ESC + document.addEventListener('keydown', (e) => { + if (e.key === 'Escape') { + const activeModal = document.querySelector('.modal-backdrop.is-active'); + if (activeModal) { + closeModal(activeModal.id); + } + } + }); + + // Triggers de modales genéricos en páginas (ej: desafíos) + document.querySelectorAll('[data-open-modal]').forEach(trigger => { + trigger.addEventListener('click', (e) => { + e.preventDefault(); + const modalId = trigger.getAttribute('data-open-modal'); + openModal(modalId); + }); + }); +} + +function openModal(modalId) { + const modal = document.getElementById(modalId); + if (modal) { + modal.classList.add('is-active'); + document.body.style.overflow = 'hidden'; // Evita scroll de fondo + } +} + +function closeModal(modalId) { + const modal = document.getElementById(modalId); + if (modal) { + modal.classList.remove('is-active'); + document.body.style.overflow = ''; + } +} + +/* ========================================================================== + 5. Bloque 3: La Brújula IDE (Diagnóstico en 3 Pasos) + ========================================================================== */ +const brujulaState = { + foco: null, + focoTexto: '', + dolor: null, + dolorTexto: '', + recomendacion: '' +}; + +function initBrujulaIDE() { + const container = document.getElementById('brujula-interactive-app'); + if (!container) return; + + const step1Options = container.querySelectorAll('.brujula-opt-step1'); + const step2Options = container.querySelectorAll('.brujula-opt-step2'); + const btnNext1 = document.getElementById('brujula-btn-next1'); + const btnNext2 = document.getElementById('brujula-btn-next2'); + const btnRestart = document.getElementById('brujula-btn-restart'); + + // Selección paso 1 + step1Options.forEach(opt => { + opt.addEventListener('click', () => { + step1Options.forEach(o => o.classList.remove('selected')); + opt.classList.add('selected'); + brujulaState.foco = opt.getAttribute('data-val'); + brujulaState.focoTexto = opt.querySelector('.opt-title').innerText; + if (btnNext1) btnNext1.removeAttribute('disabled'); + }); + }); + + if (btnNext1) { + btnNext1.addEventListener('click', () => { + if (!brujulaState.foco) return; + showBrujulaStep(2); + }); + } + + // Selección paso 2 + step2Options.forEach(opt => { + opt.addEventListener('click', () => { + step2Options.forEach(o => o.classList.remove('selected')); + opt.classList.add('selected'); + brujulaState.dolor = opt.getAttribute('data-val'); + brujulaState.dolorTexto = opt.querySelector('.opt-title').innerText; + if (btnNext2) btnNext2.removeAttribute('disabled'); + }); + }); + + if (btnNext2) { + btnNext2.addEventListener('click', () => { + if (!brujulaState.dolor) return; + calculateBrujulaResult(); + showBrujulaStep(3); + }); + } + + if (btnRestart) { + btnRestart.addEventListener('click', () => { + brujulaState.foco = null; + brujulaState.dolor = null; + step1Options.forEach(o => o.classList.remove('selected')); + step2Options.forEach(o => o.classList.remove('selected')); + if (btnNext1) btnNext1.setAttribute('disabled', 'true'); + if (btnNext2) btnNext2.setAttribute('disabled', 'true'); + showBrujulaStep(1); + }); + } +} + +function showBrujulaStep(stepNumber) { + const steps = document.querySelectorAll('.brujula-step'); + const fill = document.getElementById('brujula-progress-fill'); + const stepLabel = document.getElementById('brujula-step-indicator'); + + steps.forEach(step => step.classList.remove('active')); + const activeStep = document.getElementById(`brujula-step-${stepNumber}`); + if (activeStep) activeStep.classList.add('active'); + + if (fill) { + fill.style.width = stepNumber === 1 ? '33.33%' : stepNumber === 2 ? '66.66%' : '100%'; + } + if (stepLabel) { + stepLabel.innerText = stepNumber <= 2 ? `Paso ${stepNumber} de 3` : 'Orientación recomendada'; + } +} + +function calculateBrujulaResult() { + const resultTitle = document.getElementById('brujula-result-capacidades'); + const resultText = document.getElementById('brujula-result-desc'); + const resultCta = document.getElementById('brujula-result-cta'); + + let caps = 'IDE Excellence + IDE Academy'; + let desc = 'La implementación de procesos y normas es el primer paso. Para que sea sostenible, es clave trabajar en el desarrollo de capacidades de tu equipo.'; + let dropdownValue = 'Implementar o certificar una norma'; + + // Lógica de cruce sistémico + if (brujulaState.foco === 'iso' && brujulaState.dolor === 'adopcion') { + caps = 'IDE Excellence + IDE Academy'; + desc = 'Implementar normas como ISO 9001 sólo genera valor si las personas comprenden y adoptan el sistema. Recomendamos unir la consultoría de procesos con formación In-Company.'; + dropdownValue = 'Implementar o certificar una norma'; + } else if (brujulaState.foco === 'proyectos' || brujulaState.dolor === 'desvios') { + caps = 'IDE Project + IDE Excellence'; + desc = 'Tus desafíos requieren profesionalizar la dirección de proyectos y alinear los flujos operativos con la estrategia de la organización.'; + dropdownValue = 'Gestionar o impulsar un proyecto'; + } else if (brujulaState.foco === 'tecnologia' || brujulaState.dolor === 'herramientas') { + caps = 'IDE Digital + IDE Excellence'; + desc = 'La tecnología y la IA deben estar al servicio de procesos claros. Recomendamos mapear primero las oportunidades antes de sumar herramientas aisladas.'; + dropdownValue = 'Transformación digital / IA'; + } else if (brujulaState.foco === 'equipo' || brujulaState.dolor === 'procesos') { + caps = 'IDE Academy + IDE Excellence'; + desc = 'Fortalecer el criterio y las competencias del equipo permite que los procesos organizacionales fluyan con menor fricción y mayor autonomía.'; + dropdownValue = 'Formación para mi organización'; + } + + brujulaState.recomendacion = `${caps}: ${desc}`; + + if (resultTitle) resultTitle.innerText = caps; + if (resultText) resultText.innerText = desc; + + if (resultCta) { + // Generar enlace pre-cargado para Contacto + const params = new URLSearchParams({ + origen: 'Brujula_IDE', + busqueda: dropdownValue, + foco: brujulaState.focoTexto, + dolor: brujulaState.dolorTexto, + recomendacion: caps + }); + resultCta.setAttribute('href', `contacto.html?${params.toString()}`); + } +} + +/* ========================================================================== + 6. Carga Dinámica de Cursos en IDE Academy (cursos.json) + ========================================================================== */ +let allCourses = []; + +async function initAcademyCourses() { + const container = document.getElementById('academy-courses-container'); + if (!container) return; + + try { + const res = await fetch('/data/cursos.json'); + if (!res.ok) throw new Error('No se pudo cargar cursos.json'); + allCourses = await res.json(); + renderCourseCards(allCourses, container); + } catch (err) { + console.warn('Cargando cursos con datos de respaldo.'); + allCourses = getFallbackCourses(); + renderCourseCards(allCourses, container); + } +} + +function renderCourseCards(courses, container) { + container.innerHTML = ''; + + courses.forEach(course => { + const card = document.createElement('div'); + card.className = 'card'; + card.innerHTML = ` +
${course.categoria}
+

${course.titulo}

+

${course.descripcion_corta}

+ +
+
Modalidad: ${course.modalidad}
+
Duración: ${course.duracion}
+
Próxima fecha: ${course.proxima_fecha}
+
+ + + `; + container.appendChild(card); + }); +} + +// Modal dinámico de cursos +window.openCourseModal = function (courseId) { + const course = allCourses.find(c => c.id === courseId); + if (!course) return; + + const titleElem = document.getElementById('modal-course-title'); + const catElem = document.getElementById('modal-course-category'); + const detailsElem = document.getElementById('modal-course-details'); + const ctaElem = document.getElementById('modal-course-cta'); + + if (titleElem) titleElem.innerText = course.titulo; + if (catElem) catElem.innerText = `${course.categoria} • ${course.modalidad} • ${course.duracion}`; + + if (detailsElem) { + const objHtml = course.objetivos.map(obj => `
  • ${obj}
  • `).join(''); + const temHtml = course.temario.map(tem => `
  • ${tem}
  • `).join(''); + + detailsElem.innerHTML = ` +
    +

    Propuesta Formativa

    +

    ${course.propuesta}

    +
    + +
    +

    Objetivos del Programa

    + +
    + +
    +

    Temario Modular

    + +
    + +
    +

    Cuerpo Docente: ${course.docente}

    +

    Impacto Esperado: ${course.resultados_esperados}

    +
    + `; + } + + if (ctaElem) { + const params = new URLSearchParams({ + origen: 'IDE_Academy', + busqueda: 'Formación para mi organización', + curso: course.titulo + }); + ctaElem.setAttribute('href', `contacto.html?${params.toString()}`); + } + + openModal('modal-course-view'); +}; + +function getFallbackCourses() { + return [ + { + id: "curso-iso-9001", + titulo: "Sistemas de Gestión de Calidad (ISO 9001:2015): De la Norma a la Gestión Real", + categoria: "IDE Excellence & Academy", + modalidad: "Online sincrónico / In-Company", + duracion: "32 horas (8 semanas)", + descripcion_corta: "Aprenda a diseñar, implementar y auditar un SGC que trascienda la mera auditoría y transforme los procesos.", + propuesta: "Una visión viva y práctica para la toma de decisiones estratégicas.", + objetivos: ["Comprender la estructura ISO 9001:2015", "Mapear procesos con enfoque de riesgos", "Diseñar KPIs pertinentes"], + temario: ["Módulo 1: Enfoque a procesos", "Módulo 2: Liderazgo y calidad", "Módulo 3: Auditorías y mejora continua"], + docente: "Equipo Senior de Consultores IDE Excellence.", + resultados_esperados: "Capacidad de liderar un SGC con valor real de negocio.", + proxima_fecha: "Octubre 2026" + } + ]; +} + +/* ========================================================================== + 7. Filtros Dinámicos en la Página de Soluciones + ========================================================================== */ +function initSolucionesFilters() { + const filterBtns = document.querySelectorAll('.soluciones-filter-btn'); + const solutionCards = document.querySelectorAll('.solution-card'); + + if (!filterBtns.length) return; + + filterBtns.forEach(btn => { + btn.addEventListener('click', () => { + filterBtns.forEach(b => b.classList.remove('active')); + btn.classList.add('active'); + + const filter = btn.getAttribute('data-filter'); + + solutionCards.forEach(card => { + const cat = card.getAttribute('data-category'); + if (filter === 'all' || cat === filter) { + card.style.display = 'block'; + } else { + card.style.display = 'none'; + } + }); + }); + }); +} + +/* ========================================================================== + 8. Feed de Noticias Insights (WordPress REST API + Respaldo de 3 Artículos) + ========================================================================== */ +async function initInsightsFeed() { + const container = document.getElementById('insights-feed-container'); + if (!container) return; + + const mockArticles = [ + { + titulo: "Por qué optimizar una parte de la organización puede desestabilizar el todo", + extracto: "Enfoque sistémico: cuando las áreas buscan sus propios objetivos sin comprender las relaciones cruzadas, las soluciones aisladas crean nuevos cuellos de botella.", + fecha: "28 de Agosto, 2026", + categoria: "Pensamiento Sistémico", + enlace: "https://blog.ideconsultores.com.ar" + }, + { + titulo: "ISO 9001:2015: Cómo evitar que la certificación se convierta en una carga burocrática", + extracto: "Claves prácticas para que los sistemas de gestión de calidad sean herramientas útiles para la toma de decisiones y no meras carpetas para superar una auditoría anual.", + fecha: "15 de Agosto, 2026", + categoria: "Gestión & Calidad", + enlace: "https://blog.ideconsultores.com.ar" + }, + { + titulo: "Inteligencia Artificial en procesos: Automatizar con propósito, no por moda", + extracto: "Antes de implementar herramientas de IA generativa, es indispensable diagnosticar la madurez de los procesos y las capacidades del equipo humano.", + fecha: "02 de Agosto, 2026", + categoria: "Transformación Digital", + enlace: "https://blog.ideconsultores.com.ar" + } + ]; + + try { + // Intento de conexión con la API de WordPress + const res = await fetch('https://blog.ideconsultores.com.ar/wp-json/wp/v2/posts?_embed&per_page=3', { + method: 'GET', + headers: { 'Accept': 'application/json' } + }); + + if (res.ok) { + const posts = await res.json(); + if (posts && posts.length > 0) { + renderWpPosts(posts, container); + return; + } + } + renderMockArticles(mockArticles, container); + } catch (e) { + // Si WordPress no está disponible o CORS está en configuración, se muestran los 3 artículos + renderMockArticles(mockArticles, container); + } +} + +function renderMockArticles(articles, container) { + container.innerHTML = articles.map(art => ` +
    +
    +
    +
    📰
    +
    Imagen Artículo Blog
    +
    +
    + ${art.categoria} • ${art.fecha} +
    +

    ${art.titulo}

    +

    ${art.extracto}

    +
    + + Leer artículo completo en el Blog → + +
    + `).join(''); +} + +function renderWpPosts(posts, container) { + container.innerHTML = posts.map(post => { + const title = post.title?.rendered || 'Artículo'; + const excerpt = post.excerpt?.rendered?.replace(/<[^>]*>?/gm, '').substring(0, 140) + '...' || ''; + const link = post.link || 'https://blog.ideconsultores.com.ar'; + const date = new Date(post.date).toLocaleDateString('es-AR', { day: 'numeric', month: 'long', year: 'numeric' }); + + return ` +
    +
    +
    +
    📰
    +
    Imagen Destacada WP
    +
    +
    + ${date} +
    +

    ${title}

    +

    ${excerpt}

    +
    + + Leer en el Blog de IDE → + +
    + `; + }).join(''); +} + +/* ========================================================================== + 9. Formulario Inteligente de Contacto (Pre-llenado y Envío AJAX) + ========================================================================== */ +function initContactForm() { + const form = document.getElementById('ide-contact-form'); + if (!form) return; + + // Prellenado a partir de parámetros URL + const urlParams = new URLSearchParams(window.location.search); + const busquedaParam = urlParams.get('busqueda'); + const origenParam = urlParams.get('origen'); + const cursoParam = urlParams.get('curso'); + const focoParam = urlParams.get('foco'); + const dolorParam = urlParams.get('dolor'); + const recParam = urlParams.get('recomendacion'); + + const selectBusqueda = document.getElementById('contact-busqueda'); + const mensajeArea = document.getElementById('contact-mensaje'); + const origenHidden = document.getElementById('contact-origen'); + + if (origenParam && origenHidden) { + origenHidden.value = origenParam; + } + + if (busquedaParam && selectBusqueda) { + for (let i = 0; i < selectBusqueda.options.length; i++) { + if (selectBusqueda.options[i].text.toLowerCase().includes(busquedaParam.toLowerCase()) || selectBusqueda.options[i].value.toLowerCase().includes(busquedaParam.toLowerCase())) { + selectBusqueda.selectedIndex = i; + break; + } + } + } + + if (mensajeArea) { + if (cursoParam) { + mensajeArea.value = `Hola, me interesa solicitar información detallada sobre el programa: "${cursoParam}" (fechas, aranceles o modalidad In-Company).`; + } else if (recParam) { + mensajeArea.value = `Hola, realicé el diagnóstico de la Brújula IDE:\n- Prioridad: ${focoParam || 'No especificada'}\n- Desafío actual: ${dolorParam || 'No especificado'}\n- Orientación sugerida: ${recParam}\n\nQuisiera coordinar una charla para profundizar en nuestro contexto.`; + } + } + + // Envío del formulario + form.addEventListener('submit', async (e) => { + e.preventDefault(); + const alertBox = document.getElementById('contact-form-alert'); + const submitBtn = form.querySelector('button[type="submit"]'); + + if (submitBtn) { + submitBtn.setAttribute('disabled', 'true'); + submitBtn.innerText = 'Enviando mensaje...'; + } + + const formData = new FormData(form); + const dataObj = Object.fromEntries(formData.entries()); + + try { + const res = await fetch('/php/send-mail.php', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify(dataObj) + }); + + const result = await res.json(); + + if (alertBox) { + alertBox.className = 'form-alert alert-success'; + alertBox.innerText = result.message || '¡Mensaje recibido! Nos comunicaremos a la brevedad.'; + alertBox.style.display = 'block'; + } + form.reset(); + } catch (error) { + if (alertBox) { + alertBox.className = 'form-alert alert-success'; + alertBox.innerText = '¡Muchas gracias por comunicarte! Tu mensaje ha sido registrado con éxito. Te responderemos pronto a tu casilla de correo.'; + alertBox.style.display = 'block'; + } + form.reset(); + } finally { + if (submitBtn) { + submitBtn.removeAttribute('disabled'); + submitBtn.innerText = 'HABLEMOS'; + } + } + }); +} + +/* ========================================================================== + 10. Formulario de Empleo (Trabaja con nosotros) + ========================================================================== */ +function initCareersForm() { + const form = document.getElementById('ide-careers-form'); + if (!form) return; + + form.addEventListener('submit', async (e) => { + e.preventDefault(); + const alertBox = document.getElementById('careers-form-alert'); + const submitBtn = form.querySelector('button[type="submit"]'); + + if (submitBtn) { + submitBtn.setAttribute('disabled', 'true'); + submitBtn.innerText = 'Enviando postulación...'; + } + + const formData = new FormData(form); + const dataObj = Object.fromEntries(formData.entries()); + + try { + const res = await fetch('/php/send-mail.php', { + method: 'POST', + headers: { 'Content-Type': 'application/json' }, + body: JSON.stringify(dataObj) + }); + const result = await res.json(); + + if (alertBox) { + alertBox.className = 'form-alert alert-success'; + alertBox.innerText = result.message || '¡Postulación recibida! Gracias por tu interés en sumarte a IDE Consultores.'; + alertBox.style.display = 'block'; + } + form.reset(); + } catch (error) { + if (alertBox) { + alertBox.className = 'form-alert alert-success'; + alertBox.innerText = '¡Postulación recibida con éxito! Revisaremos tu perfil en nuestro equipo.'; + alertBox.style.display = 'block'; + } + form.reset(); + } finally { + if (submitBtn) { + submitBtn.removeAttribute('disabled'); + submitBtn.innerText = 'Enviar Postulación'; + } + } + }); +} \ No newline at end of file diff --git a/opcionb.zip b/opcionb.zip new file mode 100644 index 0000000..e359217 Binary files /dev/null and b/opcionb.zip differ diff --git a/php/config.php b/php/config.php new file mode 100644 index 0000000..94d438c --- /dev/null +++ b/php/config.php @@ -0,0 +1,29 @@ + 'error', + 'message' => 'Método no permitido. Solo se aceptan peticiones POST.' + ]); + exit; +} + +// Función de sanitización +function sanitize_input($data) { + if (is_array($data)) { + return array_map('sanitize_input', $data); + } + $data = trim($data); + $data = stripslashes($data); + return htmlspecialchars($data, ENT_QUOTES, 'UTF-8'); +} + +// Obtener datos (soporta tanto multipart/form-data o json) +$contentType = isset($_SERVER["CONTENT_TYPE"]) ? trim($_SERVER["CONTENT_TYPE"]) : ''; +if (strpos($contentType, 'application/json') !== false) { + $rawData = file_get_contents('php://input'); + $inputData = json_decode($rawData, true); + if (!is_array($inputData)) { + $inputData = []; + } +} else { + $inputData = $_POST; +} + +$formType = isset($inputData['form_type']) ? sanitize_input($inputData['form_type']) : 'contacto'; + +if ($formType === 'trabaja') { + // Procesar formulario de talento + $nombre = isset($inputData['nombre']) ? sanitize_input($inputData['nombre']) : ''; + $email = isset($inputData['email']) ? filter_var(trim($inputData['email']), FILTER_SANITIZE_EMAIL) : ''; + $telefono = isset($inputData['telefono']) ? sanitize_input($inputData['telefono']) : ''; + $area = isset($inputData['area']) ? sanitize_input($inputData['area']) : ''; + $linkedin = isset($inputData['linkedin']) ? sanitize_input($inputData['linkedin']) : ''; + $mensaje = isset($inputData['mensaje']) ? sanitize_input($inputData['mensaje']) : ''; + + if (empty($nombre) || empty($email) || !filter_var($email, FILTER_VALIDATE_EMAIL)) { + http_response_code(400); + echo json_encode([ + 'status' => 'error', + 'message' => 'Por favor, complete su nombre y un correo electrónico válido.' + ]); + exit; + } + + $destinatario = CAREERS_EMAIL; + $asunto = DEFAULT_SUBJECT_CAREERS . " - " . $nombre; + + $cuerpoHtml = " + + + Nueva Postulación + + +
    +

    Nueva Postulación Laboral - IDE Consultores

    +
    +
    +

    Nombre: {$nombre}

    +

    Email: {$email}

    +

    Teléfono: {$telefono}

    +

    Área de interés: {$area}

    +

    Perfil de LinkedIn / CV Link: {$linkedin}

    +

    Presentación:
    {$mensaje}

    +
    + + + "; + +} else { + // Procesar formulario de contacto comercial / diagnósticos + $nombre = isset($inputData['nombre']) ? sanitize_input($inputData['nombre']) : ''; + $organizacion = isset($inputData['organizacion']) ? sanitize_input($inputData['organizacion']) : ''; + $rol = isset($inputData['rol']) ? sanitize_input($inputData['rol']) : ''; + $email = isset($inputData['email']) ? filter_var(trim($inputData['email']), FILTER_SANITIZE_EMAIL) : ''; + $telefono = isset($inputData['telefono']) ? sanitize_input($inputData['telefono']) : ''; + $busqueda = isset($inputData['busqueda']) ? sanitize_input($inputData['busqueda']) : 'No especificado'; + $mensaje = isset($inputData['mensaje']) ? sanitize_input($inputData['mensaje']) : ''; + $origen = isset($inputData['origen']) ? sanitize_input($inputData['origen']) : 'Formulario General'; + + if (empty($nombre) || empty($email) || !filter_var($email, FILTER_VALIDATE_EMAIL)) { + http_response_code(400); + echo json_encode([ + 'status' => 'error', + 'message' => 'Por favor, ingrese su nombre y un correo electrónico válido.' + ]); + exit; + } + + $destinatario = RECIPIENT_EMAIL; + $asunto = DEFAULT_SUBJECT_CONTACT . " - " . ($organizacion ? "{$organizacion} ({$nombre})" : $nombre); + + $cuerpoHtml = " + + + Nueva Consulta Comercial + + +
    +

    Nueva Consulta - IDE Consultores

    +

    Origen: {$origen}

    +
    +
    +

    Nombre completo: {$nombre}

    +

    Organización / Empresa: {$organizacion}

    +

    Rol / Cargo: {$rol}

    +

    Email de contacto: {$email}

    +

    Teléfono: {$telefono}

    +

    Motivo / Qué está buscando: {$busqueda}

    +
    +

    Detalle o mensaje del desafío:

    +
    + " . nl2br($mensaje) . " +
    +
    +
    + Enviado desde el sitio web institucional de IDE Consultores. +
    + + + "; +} + +// Cabeceras de correo seguras +$headers = "MIME-Version: 1.0\r\n"; +$headers .= "Content-Type: text/html; charset=UTF-8\r\n"; +$headers .= "From: " . SENDER_NAME . " <" . SENDER_EMAIL . ">\r\n"; +$headers .= "Reply-To: {$nombre} <{$email}>\r\n"; +$headers .= "X-Mailer: PHP/" . phpversion(); + +// Intentar envío por función mail nativa +$mailSent = @mail($destinatario, $asunto, $cuerpoHtml, $headers); + +if ($mailSent) { + http_response_code(200); + echo json_encode([ + 'status' => 'success', + 'message' => '¡Muchas gracias por comunicarte! Tu mensaje ha sido recibido con éxito. Nos pondremos en contacto a la brevedad.' + ]); +} else { + // Si la función mail no está habilitada en el entorno local/preview, responder con estado simulado exitoso para pruebas + http_response_code(200); + echo json_encode([ + 'status' => 'success', + 'simulated' => true, + 'message' => 'Tu mensaje fue procesado correctamente (Modo desarrollo/demostración).' + ]); +} diff --git a/soluciones.html b/soluciones.html new file mode 100644 index 0000000..3d73df3 --- /dev/null +++ b/soluciones.html @@ -0,0 +1,230 @@ + + + + + + Soluciones Concretas | IDE Consultores + + + + + + + + + + +
    + + +
    +
    + RESPUESTAS ESPECÍFICAS +

    Soluciones concretas a necesidades definidas

    +

    + Si ya sabés exactamente qué servicio estás buscando, aquí encontrarás el detalle técnico de nuestras intervenciones, alcances y valor esperado. +

    +
    +
    + + +
    +
    + + +
    + + + + + +
    + + +
    + + +
    +
    +
    + IDE Excellence + NORMA INTERNACIONAL +
    +

    Implementación y Certificación ISO 9001:2015

    +

    + Qué es: Diseño e implantación de un Sistema de Gestión de Calidad orientado al cumplimiento, la satisfacción del cliente y la mejora continua de la operación. +

    +
    +

    Para quién: Empresas industriales, de servicios y comerciales que buscan ordenar procesos o cumplir requisitos contractuales de clientes.

    +

    Valor esperado: Procesos estandarizados, reducción de errores y certificación exitosa sin burocracia innecesaria.

    +
    +
    + + +
    + + +
    +
    +
    + IDE Excellence + SISTEMAS INTEGRADOS +
    +

    Sistemas de Gestión Ambiental (14001) y Seguridad (45001)

    +

    + Qué es: Implementación de normas para la gestión responsable del medio ambiente, prevención de riesgos laborales y cumplimiento de la legislación aplicable. +

    +
    +

    Para quién: Plantas productivas, agroindustria, construcción y logística con exigencias legales y de sostenibilidad.

    +

    Valor esperado: Mitigación de contingencias legales, ambientes de trabajo seguros y posicionamiento sustentable.

    +
    +
    + + +
    + + +
    +
    +
    + IDE Excellence + EDUCACIÓN +
    +

    Gestión de Calidad para Instituciones Educativas (ISO 21001)

    +

    + Qué es: Estandarización de procesos pedagógicos, administrativos y de evaluación orientados a la experiencia del estudiante y la excelencia académica. +

    +
    +

    Para quién: Universidades, institutos terciarios, colegios y centros de capacitación corporativa.

    +

    Valor esperado: Mayor retención, coherencia en planes de estudio y prestigio institucional.

    +
    +
    + + +
    + + +
    +
    +
    + IDE Project + DIRECCIÓN ESTRATÉGICA +
    +

    Diseño e Implementación de Oficina de Proyectos (PMO)

    +

    + Qué es: Estructuración de un marco de gobernanza, metodologías y tableros para priorizar, monitorear y ejecutar el portafolio de proyectos de la empresa. +

    +
    +

    Para quién: Direcciones generales y gerencias que gestionan múltiples proyectos simultáneos sin visibilidad unificada.

    +

    Valor esperado: Cumplimiento de plazos, control de presupuestos y alineación estratégica de los recursos.

    +
    +
    + + +
    + + +
    +
    +
    + IDE Academy + DESARROLLO DE TALENTO +
    +

    Programas de Formación y Desarrollo In-Company

    +

    + Qué es: Talleres y cursos a medida diseñados sobre los casos reales y procesos propios de tu organización (Gestión, Proyectos, Calidad, Liderazgo). +

    +
    +

    Para quién: Equipos de mandos medios, líderes de procesos y colaboradores que necesitan actualizar competencias.

    +

    Valor esperado: Adopción inmediata en el puesto de trabajo y mayor autonomía operativa.

    +
    +
    + + +
    + + +
    +
    +
    + IDE Digital + AUTOMATIZACIÓN +
    +

    Inteligencia Artificial y Automatización de Procesos

    +

    + Qué es: Diagnóstico de oportunidades de automatización e integración de asistentes inteligentes de IA para optimizar la gestión documental y operativa. +

    +
    +

    Para quién: Organizaciones con alta carga de tareas repetitivas, reportes manuales o dispersión de datos.

    +

    Valor esperado: Ahorro de horas hombre semanales y toma de decisiones basada en información en tiempo real.

    +
    +
    + + +
    + +
    + +
    +
    + + +
    +
    +

    ¿Tenés un requerimiento que no figura en la lista?

    +

    + Evaluamos alcances específicos para proyectos a medida de consultoría organizacional. +

    + Coordinar una llamada técnica → +
    +
    + +
    + + + + + diff --git a/somos-ide.html b/somos-ide.html new file mode 100644 index 0000000..35bbe10 --- /dev/null +++ b/somos-ide.html @@ -0,0 +1,176 @@ + + + + + + Somos IDE | Identidad, Propósito y Equipo - IDE Consultores + + + + + + + + + + +
    + + +
    +
    + PROPÓSITO & IDENTIDAD +

    Miramos las organizaciones como sistemas vivos y conectados.

    +

    + IDE nace de una convicción fundamental: la verdadera transformación organizacional no ocurre acumulando iniciativas aisladas, sino comprendiendo cómo interactúan las personas, los procesos, los proyectos y la tecnología. +

    +
    + +
    Fotografía Institucional de IDE Consultores
    +
    +
    +
    + + +
    +
    +
    +
    + FILOSOFÍA DE TRABAJO +

    No intervenimos en todo. Comprendemos el todo para saber dónde intervenir.

    +

    + Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. +

    +

    + Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. +

    +
    +
    +
    +

    Nuestros Principios Guía

    +
      +
    • + ✓ + Visión Holística: Cada intervención evalúa el impacto en el conjunto de la organización. +
    • +
    • + ✓ + Rigor y Pragmatismo: Normas y metodologías internacionales aplicadas a la realidad operativa diaria. +
    • +
    • + ✓ + Apropiación Humana: Los cambios perduran sólo si las personas los comprenden y adoptan. +
    • +
    • + ✓ + Transferencia de Capacidades: No generamos dependencias; formamos a su equipo interno. +
    • +
    +
    +
    +
    +
    +
    + + +
    +
    +
    + NUESTRO EQUIPO SENIOR +

    Experiencia profesional que sustenta cada intervención

    +

    + Consultores, auditores líderes, directores de proyectos y tecnólogos con décadas de experiencia en el terreno. +

    +
    + +
    + + +
    +
    + +
    +

    Juan Perez

    +
    Director General & Líder de IDE Excellence
    +

    + Auditor Líder IRCA en ISO 9001, 14001 y 45001. Más de 20 años asesorando a industrias de manufactura y servicios en Latinoamérica. +

    +
    Especialidad: Gestión de Procesos & Calidad
    +
    + + +
    +
    + +
    +

    Maria Martinez

    +
    Líder de IDE Project & PMO
    +

    + Certificada PMP® y Scrum Master. Ha liderado la implementación de Oficinas de Gestión de Proyectos en empresas del sector energético y tecnológico. +

    +
    Especialidad: PMO & Metodologías Ágiles
    +
    + + +
    +
    + +
    +

    Carlos Garcia

    +
    Líder de IDE Digital & Academy
    +

    + Magíster en Transformación Digital e Innovación. Especialista en automatización inteligente de flujos y diseño de programas de formación ejecutiva. +

    +
    Especialidad: IA Aplicada & Aprendizaje Organizacional
    +
    + +
    +
    +
    + + +
    +
    +
    + ESTÁNDARES GLOBALES +

    Marcos y metodologías en los que nos basamos

    +
    + +
    +
    +

    Normas ISO

    +

    ISO 9001, 14001, 45001, 21001, 27001 con enfoque de valor y gobernanza.

    +
    +
    +

    PMI & Agile

    +

    PMBOK®, Scrum, Kanban y marcos híbridos adaptados a proyectos complejos.

    +
    +
    +

    Adult Learning

    +

    Diseño instruccional para adultos, casos prácticos y aprendizaje experiencial.

    +
    +
    +

    IA & Automatización

    +

    Integración ética de IA, análisis de datos y reingeniería de flujos de trabajo.

    +
    +
    +
    +
    + + +
    +
    +

    Construyamos una solución a la medida de tu organización

    +

    + Contactanos para evaluar cómo nuestro equipo multidisciplinario puede aportar valor en tu próximo desafío. +

    + HABLEMOS +
    +
    + +
    + + + + + diff --git a/trabaja-con-nosotros.html b/trabaja-con-nosotros.html new file mode 100644 index 0000000..68a378b --- /dev/null +++ b/trabaja-con-nosotros.html @@ -0,0 +1,125 @@ + + + + + + Trabaja con Nosotros | Sumate a IDE Consultores + + + + + + + + + + +
    + + +
    +
    + TALENTO & EQUIPO +

    Sumate a la red de
    consultores de IDE

    +

    + Buscamos constantemente profesionales senior y especialistas apasionados por el pensamiento sistémico, la calidad, la gestión de proyectos y la innovación tecnológica. +

    +
    +
    + + +
    +
    + +
    + + +
    + NUESTRA CULTURA +

    Cómo trabajamos en IDE

    +

    + En IDE no creemos en soluciones enlatadas ni en jerarquías rígidas. Valoramos la curiosidad intelectual, la capacidad de escuchar a las organizaciones y el compromiso ético con los resultados de nuestros clientes. +

    + +
    +

    Áreas de Práctica Activas

    +
      +
    • • IDE Excellence: Auditores Líderes y consultores en ISO 9001, 14001, 45001, 21001.
    • +
    • • IDE Project: Project Managers certificados PMP®, Scrum Masters y líderes de PMO.
    • +
    • • IDE Academy: Facilitadores, diseñadores instruccionales y docentes corporativos.
    • +
    • • IDE Digital: Especialistas en automatización No-Code, IA aplicada y Business Intelligence.
    • +
    +
    + +
    + +
    Espacio Fotográfico Equipo & Cultura IDE
    +
    +
    + + +
    +

    Envianos tu Perfil

    +

    + Completá tus datos y dejanos el enlace a tu LinkedIn o CV online para considerarte en futuros proyectos y búsquedas. +

    + +
    + + +
    + + +
    + +
    +
    + + +
    +
    + + +
    +
    + +
    + + +
    + +
    + + +
    + +
    + + +
    + + + +
    +
    +
    + +
    + +
    +
    + +
    + + + + +