IDE-Demo-B/somos-ide.html

<!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>Somos IDE | Identidad, Propósito y Equipo - IDE Consultores</title>
  <meta name="description" content="Conocé el origen, propósito, equipo senior y metodología que sustentan el Ecosistema IDE Consultores.">
  <meta property="og:title" content="Somos IDE | Identidad, Propósito y Equipo">
  <meta property="og:description" content="Un equipo multidisciplinario con sólida trayectoria en gestión de calidad, 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>
    
    <!-- Hero / Origen y Propósito -->
    <section class="section-padding" style="background-color: var(--bg-surface); border-bottom: 1px solid var(--border-color);">
      <div class="container container-narrow text-center">
        <span class="eyebrow">PROPÓSITO & IDENTIDAD</span>
        <h1 style="margin-bottom: 1.5rem;">Vemos organizaciones. <br>Entendemos sistemas. <br>Conectamos el todo. </h1>
        <p class="lead-text" style="margin: 0 auto 2rem auto;">
          IDE nace de una forma compartida de entender la gestión: ninguna decisión ocurre de manera aislada.
        <br>Personas, procesos, proyectos, conocimiento y tecnología se conectan y se afectan mutuamente. Por eso, antes de proponer una solución buscamos comprender esas relaciones, identificar dónde podemos generar mayor impacto y conectar las capacidades necesarias para hacerlo posible.
        </p>
        <div class="card-somos">
        </div>
      </div>
    </section>

    <!-- Cómo Pensamos: La Mirada Sistémica -->
    <section class="section-padding">
      <div class="container">
        <div class="grid-2" style="align-items: center; gap: 3rem;">
          <div>
            <span class="eyebrow">FILOSOFÍA DE TRABAJO</span>
            <h2>No intervenimos en todo. Comprendemos el todo para saber dónde intervenir.</h2>
            <p style="font-size: 1.05rem; color: var(--text-body); margin-top: 1rem; line-height: 1.7;">
              Cada organización tiene su propia realidad. Por eso, antes de proponer una solución buscamos comprender su contexto, sus relaciones y aquello que está detrás de los desafíos visibles.
              <br>A partir de esa comprensión, focalizamos la intervención, conectamos las capacidades necesarias y trabajamos junto a las personas de la organización para generar mejoras que puedan sostenerse en el tiempo.
              </p>
            <p style="font-size: 1rem; color: var(--text-muted); margin-top: 1rem; line-height: 1.6;">
              
            </p>
          </div>
          <div>
            <div class="card" style="padding: 2.25rem;">
              <h3 style="font-size: 1.3rem; margin-bottom: 1rem; color: var(--ide-primary);">Nuestros Principios Guía</h3>
              <ul style="list-style: none; display: flex; flex-direction: column; gap: 1rem; font-size: 0.95rem;">
                <li style="display: flex; gap: 0.75rem;">
                  <span style="color: var(--ide-accent); font-weight: bold;">✓</span>
                  <span><strong>Mirada Sistémica: </strong> Cada intervención considera sus relaciones e impactos sobre el conjunto.</span>
                </li>
                <li style="display: flex; gap: 0.75rem;">
                  <span style="color: var(--ide-accent); font-weight: bold;">✓</span>
                  <span><strong>Rigor con sentido práctico: </strong> Integramos metodologías, normas y buenas prácticas adaptándolas al contexto y no al revés.</span>
                </li>
                <li style="display: flex; gap: 0.75rem;">
                  <span style="color: var(--ide-accent); font-weight: bold;">✓</span>
                  <span><strong>Personas como parte del Sistema: </strong> Las personas no son destinatarias pasivas del cambio: participan, aportan conocimiento y hacen posible su evolución.</span>
                </li>
                <li style="display: flex; gap: 0.75rem;">
                  <span style="color: var(--ide-accent); font-weight: bold;">✓</span>
                  <span><strong>Capacidades que permanecen: </strong> Buscamos que cada intervención deje conocimiento, herramientas y capacidades que la organización pueda seguir desarrollando.</span>
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
    </section>

    <!-- El Equipo y Perfiles -->
    <section class="section-padding bg-subtle-section">
      <div class="container">
        <div style="text-align: center; max-width: 700px; margin: 0 auto 3rem auto;">
          <span class="eyebrow">QUIÉNES HACEMOS IDE</span>
          <h2>Experiencias que se complementan</h2>
          <p class="lead-text" style="margin-top: 1rem;">
            IDE reúne profesionales con trayectorias en gestión, proyectos, mejora continua, sistemas de gestión, transformación digital, inteligencia artificial, docencia y desarrollo organizacional. <br>Cada uno aporta una especialidad. El mayor valor aparece cuando esas capacidades se conectan.
          </p>
        </div>

        <div class="grid-4">
          
          <!-- Miembro 1 -->
           <div class="card somos m1">
            <div class="card-portrait">
              <img src="../assets/img/CRA.png" alt="Retrato de Carlos Garcia" loading="lazy">
            </div>
            <h3>Claudia Raquel ANDRÉS</h3>
            <div class="somos-title">Directora General | Líder de IDE Projects</div>
            <p>Especialista en proyectos, optimización de procesos e implementación de sistemas de gestión, con más de 15 años de experiencia en consultoría, auditoría y docencia. Impulsa la mirada sistémica que le da indentidad a IDE.</p>
            <a href="#" class="btn btn-outline btn-sm"><i class="fa-brands fa-linkedin-in"></i>LinkedIn</a>
          </div>
          
          <!-- Miembro 2 -->
          <div class="card somos m2">
            <div class="card-portrait">
              <img src="../assets/img/JAP.png" alt="Retrato de Carlos Garcia" loading="lazy">
            </div>
            <h3>José PUGLIESE</h3>
            <div class="somos-title">Líder de IDE Digital</div>
            <p>
              Especialista en digitalización, Inteligencia Artificial y sistematización de procesos, con más de 10 años de experiencia en liderazgo de equipos e implementación de soluciones tecnológicas orientadas a optimizar la gestión.
            </p>
            <a href="#" class="btn btn-outline btn-sm"><i class="fa-brands fa-linkedin-in"></i>LinkedIn</a>
          </div>

          <!-- Miembro 3 -->
          <div class="card somos m3">
            <div class="card-portrait">
              <img src="../assets/img/MAR.png" alt="Retrato de Carlos Garcia" loading="lazy">
            </div>
            <h3>Miguel Ángel ROJAS</h3>
            <div class="somos-title">Líder de IDE Excellence</div>
            <p>
              Especialista en gestión y optimización de procesos fisicoquímicos, mejora continua y sistemas de calidad, con más de 15 años de experiencia impulsando la eficiencia operativa y el desempeño sostenible.
            </p>
            <a href="#" class="btn btn-outline btn-sm"><i class="fa-brands fa-linkedin-in"></i>LinkedIn</a>
          </div>

          <!-- Miembro 4 -->
          <div class="card somos m4">
            <div class="card-portrait">
              <img src="../assets/img/VUB.png" alt="Retrato de Carlos Garcia" loading="lazy">
            </div>
            <h3>Víctor Ulises BARRIONUEVO</h3>
            <div class="somos-title">Projects & Digital</div>
            <p>
             Especialista en gestión y ejecución de proyectos de infraestructura y telecomunicaciones, con amplia experiencia en planificación, operaciones y coordinación de equipos multidisciplinarios.
            </p>
            <a href="#" class="btn btn-outline btn-sm"><i class="fa-brands fa-linkedin-in"></i>LinkedIn</a>
          </div>

        </div>
      </div>
    </section>

    <!-- Marcos de Referencia y Metodologías -->
    <section class="section-padding">
      <div class="container">
        <div style="text-align: center; margin-bottom: 3rem;">
          <span class="eyebrow">ESTÁNDARES GLOBALES</span>
          <h2>Marcos y metodologías en los que nos basamos</h2>
        </div>

        <div class="grid-4" style="text-align: center;">
          <div class="card card-feature">
            <span class="card-icon" data-icon="iso" aria-hidden="true"></span>
            <h4 style="color: var(--ide-excellence); margin-bottom: 0.5rem;">Normas ISO</h4>
            <p style="font-size: 0.85rem; color: var(--text-muted);">ISO 9001, 14001, 45001, 21001, 27001 con enfoque de valor y gobernanza.</p>
          </div>

          <div class="card card-feature">
            <span class="card-icon" data-icon="pmi" aria-hidden="true"></span>
            <h4 style="color: var(--ide-projects); margin-bottom: 0.5rem;">PMI &amp; Agile</h4>
            <p style="font-size: 0.85rem; color: var(--text-muted);">PMBOK®, Scrum, Kanban y marcos híbridos adaptados a proyectos complejos.</p>
          </div>

          <div class="card card-feature">
            <span class="card-icon" data-icon="academy" aria-hidden="true"></span>
            <h4 style="color: var(--ide-academy); margin-bottom: 0.5rem;">Adult Learning</h4>
            <p style="font-size: 0.85rem; color: var(--text-muted);">Diseño instruccional para adultos, casos prácticos y aprendizaje experiencial.</p>
          </div>

          <div class="card card-feature">
            <span class="card-icon" data-icon="ia" aria-hidden="true"></span>
            <h4 style="color: var(--ide-digital); margin-bottom: 0.5rem;">IA &amp; Automatización</h4>
            <p style="font-size: 0.85rem; color: var(--text-muted);">Integración ética de IA, análisis de datos y reingeniería de flujos de trabajo.</p>
          </div>
        </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 text-center">
        <h2 style="color: var(--text-inverse); margin-bottom: 1rem;">Conversemos para comprender tu contexto,<br> identificar dónde intervenir y conectar las capacidades que puedan aportar mayor valor</h2>
        </p>
        <a href="contacto.html" class="btn btn-outline-cta btn-sm" ">Hablemos</a>
      </div>
    </section>

  </main>

  <footer id="site-footer"></footer>
  <script src="js/main.js"></script>
</body>
</html>