// Página Política de Privacidad

const PP_SECTIONS = [
  {
    id: 'responsable',
    num: '01',
    title: 'Responsable del tratamiento',
    content: () => (
      <>
        <p>El responsable del tratamiento de sus datos personales es <strong style={{color:'var(--fg)'}}>Agencia El Bocha</strong>, empresa de marketing y publicidad con domicilio en Av. París N41-164 e Isla Floreana, Quito, Ecuador.</p>
        <p>Para cualquier consulta relacionada con el tratamiento de sus datos puede contactar directamente con nuestro representante legal, Ing. Edison Ramírez, a través del correo electrónico: <a href="mailto:gerenciageneral@agenciaelbocha.com">gerenciageneral@agenciaelbocha.com</a>.</p>
      </>
    ),
  },
  {
    id: 'datos',
    num: '02',
    title: 'Datos que recopilamos',
    content: () => (
      <>
        <p>Recopilamos únicamente los datos necesarios para prestar nuestros servicios y mejorar la experiencia en nuestros canales digitales:</p>
        <ul>
          <li><strong style={{color:'var(--fg)'}}>Datos de contacto:</strong> nombre completo, número de teléfono o WhatsApp, correo electrónico y/o empresa, cuando el usuario los proporciona voluntariamente a través de formularios o mensajes directos.</li>
          <li><strong style={{color:'var(--fg)'}}>Datos de navegación:</strong> dirección IP, tipo de dispositivo, navegador, páginas visitadas, tiempo de sesión y fuente de tráfico, recopilados automáticamente mediante herramientas de analítica.</li>
          <li><strong style={{color:'var(--fg)'}}>Datos de interacción:</strong> clics en CTAs, formularios completados e interacciones con publicaciones en redes sociales vinculadas a nuestra agencia.</li>
          <li><strong style={{color:'var(--fg)'}}>Datos de comunicación:</strong> historial de mensajes enviados a través de WhatsApp Business cuando el usuario inicia voluntariamente una conversación con nosotros.</li>
        </ul>
        <p>No recopilamos datos sensibles como información bancaria, datos de salud ni documentos de identidad, salvo que sea estrictamente necesario para la prestación de un servicio específico y mediando consentimiento expreso.</p>
      </>
    ),
  },
  {
    id: 'finalidad',
    num: '03',
    title: 'Finalidad del tratamiento',
    content: () => (
      <>
        <p>Los datos personales recopilados son utilizados exclusivamente para las siguientes finalidades:</p>
        <ul>
          <li>Responder consultas, solicitudes de cotización y comunicaciones iniciadas por el usuario.</li>
          <li>Gestionar la relación comercial con clientes actuales y potenciales.</li>
          <li>Enviar información sobre servicios, promociones o contenidos de interés, únicamente con el consentimiento previo del usuario.</li>
          <li>Mejorar el rendimiento, diseño y contenido de nuestro sitio web mediante análisis estadístico del comportamiento de navegación.</li>
          <li>Cumplir con obligaciones legales y reglamentarias aplicables en Ecuador.</li>
          <li>Gestionar campañas publicitarias en plataformas digitales (Meta, Google, TikTok) cuando así se haya contratado como servicio.</li>
        </ul>
        <p>No vendemos, alquilamos ni cedemos sus datos personales a terceros con fines comerciales propios.</p>
      </>
    ),
  },
  {
    id: 'base-legal',
    num: '04',
    title: 'Base legal del tratamiento',
    content: () => (
      <>
        <p>El tratamiento de sus datos se fundamenta en las siguientes bases legales, conforme a la <strong style={{color:'var(--fg)'}}>Ley Orgánica de Protección de Datos Personales del Ecuador (LOPDP)</strong>:</p>
        <ul>
          <li><strong style={{color:'var(--fg)'}}>Consentimiento del titular:</strong> cuando el usuario completa un formulario, inicia un chat o acepta el uso de cookies no esenciales.</li>
          <li><strong style={{color:'var(--fg)'}}>Ejecución de un contrato:</strong> cuando el tratamiento es necesario para la prestación de servicios contratados.</li>
          <li><strong style={{color:'var(--fg)'}}>Interés legítimo:</strong> para la seguridad del sitio web, la prevención del fraude y la mejora continua de nuestros servicios.</li>
          <li><strong style={{color:'var(--fg)'}}>Cumplimiento de obligaciones legales:</strong> cuando la normativa ecuatoriana o internacional así lo exija.</li>
        </ul>
      </>
    ),
  },
  {
    id: 'conservacion',
    num: '05',
    title: 'Conservación de datos',
    content: () => (
      <>
        <p>Sus datos personales serán conservados durante el tiempo necesario para cumplir con la finalidad para la que fueron recopilados:</p>
        <ul>
          <li>Datos de contacto y comunicaciones comerciales: hasta 2 años desde el último contacto, salvo relación contractual activa.</li>
          <li>Datos contractuales: durante la vigencia del contrato y 5 años adicionales para cumplir obligaciones contables y fiscales.</li>
          <li>Datos de navegación y analítica: máximo 26 meses, según las políticas de las plataformas utilizadas.</li>
        </ul>
        <p>Transcurridos dichos plazos, los datos serán eliminados de forma segura o anonimizados.</p>
      </>
    ),
  },
  {
    id: 'derechos',
    num: '06',
    title: 'Tus derechos',
    content: () => (
      <>
        <p>De conformidad con la LOPDP, usted tiene los siguientes derechos sobre sus datos personales:</p>
        <ul>
          <li><strong style={{color:'var(--fg)'}}>Acceso:</strong> conocer qué datos personales suyos tratamos.</li>
          <li><strong style={{color:'var(--fg)'}}>Rectificación:</strong> solicitar la corrección de datos inexactos o incompletos.</li>
          <li><strong style={{color:'var(--fg)'}}>Supresión:</strong> solicitar la eliminación de sus datos cuando ya no sean necesarios.</li>
          <li><strong style={{color:'var(--fg)'}}>Oposición:</strong> oponerse al tratamiento de sus datos para determinadas finalidades.</li>
          <li><strong style={{color:'var(--fg)'}}>Portabilidad:</strong> recibir sus datos en un formato estructurado y legible por máquina.</li>
          <li><strong style={{color:'var(--fg)'}}>Revocación del consentimiento:</strong> retirar en cualquier momento el consentimiento otorgado, sin afectar la licitud del tratamiento previo.</li>
        </ul>
        <p>Para ejercer cualquiera de estos derechos, escríbenos a <a href="mailto:gerenciageneral@agenciaelbocha.com">gerenciageneral@agenciaelbocha.com</a> con el asunto "Ejercicio de derechos LOPDP". Responderemos en un plazo máximo de 15 días hábiles.</p>
      </>
    ),
  },
  {
    id: 'cookies',
    num: '07',
    title: 'Cookies y rastreo',
    content: () => (
      <>
        <p>Nuestro sitio web puede utilizar cookies y tecnologías similares para mejorar la experiencia de usuario, analizar el tráfico y medir la efectividad de nuestras campañas:</p>
        <ul>
          <li><strong style={{color:'var(--fg)'}}>Técnicas o estrictamente necesarias:</strong> imprescindibles para el funcionamiento básico del sitio. No requieren consentimiento.</li>
          <li><strong style={{color:'var(--fg)'}}>Analíticas:</strong> nos permiten conocer cómo los usuarios interactúan con el sitio (ej. Google Analytics). Se activan únicamente con su consentimiento.</li>
          <li><strong style={{color:'var(--fg)'}}>De marketing y remarketing:</strong> utilizadas por plataformas como Meta Pixel o Google Ads. Se activan únicamente con su consentimiento.</li>
        </ul>
        <p>Puede gestionar o rechazar las cookies no esenciales a través de la configuración de su navegador.</p>
      </>
    ),
  },
  {
    id: 'terceros',
    num: '08',
    title: 'Terceros y transferencias',
    content: () => (
      <>
        <p>Para la prestación de nuestros servicios, podemos compartir datos con proveedores de confianza que actúan como encargados del tratamiento, sujetos a acuerdos de confidencialidad:</p>
        <ul>
          <li>Plataformas publicitarias: Meta (Facebook/Instagram), Google Ads, TikTok Ads.</li>
          <li>Herramientas de analítica web: Google Analytics.</li>
          <li>Servicios de comunicación: WhatsApp Business API.</li>
          <li>Plataformas de email marketing, en caso de ser utilizadas para comunicaciones autorizadas.</li>
        </ul>
        <p>No realizamos transferencias internacionales de datos fuera del marco legal establecido por la LOPDP. Cuando los proveedores tienen su sede fuera de Ecuador, verificamos que cuenten con mecanismos de protección adecuados.</p>
      </>
    ),
  },
  {
    id: 'menores',
    num: '09',
    title: 'Menores de edad',
    content: () => (
      <>
        <p>Nuestros servicios están dirigidos exclusivamente a personas mayores de 18 años o empresas. No recopilamos intencionalmente datos de menores de edad. Si tomamos conocimiento de ello, procederemos a eliminar dichos datos de forma inmediata.</p>
        <p>Si usted es padre, madre o tutor y cree que su hijo nos ha proporcionado información personal, contáctenos en <a href="mailto:gerenciageneral@agenciaelbocha.com">gerenciageneral@agenciaelbocha.com</a>.</p>
      </>
    ),
  },
  {
    id: 'seguridad',
    num: '10',
    title: 'Seguridad',
    content: () => (
      <>
        <p>Implementamos medidas técnicas y organizativas para proteger sus datos personales contra el acceso no autorizado, la pérdida, alteración o divulgación:</p>
        <ul>
          <li>Transmisión de datos cifrada mediante protocolos HTTPS/TLS.</li>
          <li>Acceso restringido a datos personales únicamente al personal autorizado.</li>
          <li>Revisión periódica de prácticas de seguridad y proveedores.</li>
        </ul>
        <p>En caso de una brecha de seguridad que pueda afectar sus derechos, le notificaremos en los plazos y formas establecidos por la LOPDP.</p>
      </>
    ),
  },
  {
    id: 'cambios',
    num: '11',
    title: 'Cambios a esta política',
    content: () => (
      <>
        <p>Nos reservamos el derecho de actualizar esta Política de Privacidad en cualquier momento para reflejar cambios legales, operativos o en nuestras prácticas de datos. La versión vigente estará siempre disponible en esta página con la fecha de actualización indicada en el encabezado.</p>
        <p>Si los cambios son significativos, lo notificaremos a través de un aviso destacado en nuestro sitio web o mediante comunicación directa cuando contemos con su información de contacto.</p>
      </>
    ),
  },
  {
    id: 'contacto',
    num: '12',
    title: 'Contacto',
    content: () => (
      <>
        <p>Para cualquier consulta, solicitud o reclamación relacionada con esta Política de Privacidad o el tratamiento de sus datos personales:</p>
        <ul>
          <li><strong style={{color:'var(--fg)'}}>Correo electrónico:</strong> <a href="mailto:gerenciageneral@agenciaelbocha.com">gerenciageneral@agenciaelbocha.com</a></li>
          <li><strong style={{color:'var(--fg)'}}>Dirección:</strong> Av. París N41-164 e Isla Floreana, Quito, Ecuador</li>
          <li><strong style={{color:'var(--fg)'}}>WhatsApp:</strong> +593 99 181 0190</li>
        </ul>
        <p>También puede presentar una reclamación ante la <strong style={{color:'var(--fg)'}}>Superintendencia de Protección de Datos Personales (SPDP)</strong> de Ecuador.</p>
        <div className="pp-highlight">
          <p>Para consultas específicas sobre el tratamiento de datos en el marco de un proyecto o campaña, nuestro CEO <strong>Ing. Edison Ramírez</strong> está disponible directamente en <strong>gerenciageneral@agenciaelbocha.com</strong>.</p>
        </div>
      </>
    ),
  },
];

const PPHero = () => (
  <section className="pp-hero container">
    <span className="pp-label reveal" data-delay="0">Legal · Privacidad</span>
    <h1 className="reveal" data-delay="0.05">
      Política de <em>Privacidad</em>
    </h1>
    <div className="pp-meta reveal" data-delay="0.15">
      <span>Agencia El Bocha</span>
      <span className="sep"/>
      <span>Versión 1.0</span>
      <span className="sep"/>
      <span>Vigente desde Mayo 2026</span>
      <span className="sep"/>
      <span>Quito, Ecuador</span>
    </div>
  </section>
);

const PPContent = () => (
  <div className="pp-body container">
    <aside className="pp-toc reveal" data-delay="0.1">
      <div className="pp-toc-title">Contenido</div>
      {PP_SECTIONS.map(s => (
        <a key={s.id} href={`#${s.id}`}>{s.num} — {s.title}</a>
      ))}
    </aside>

    <article className="pp-article">
      <div className="pp-notice reveal" data-delay="0.2">
        <p>Al navegar por <strong>agenciaelbocha.com</strong> o contactarnos a través de cualquier canal digital, aceptas los términos descritos en esta política. Si tienes preguntas, escríbenos a <strong>gerenciageneral@agenciaelbocha.com</strong>.</p>
      </div>

      {PP_SECTIONS.map((s, i) => (
        <div key={s.id} id={s.id} className="pp-section reveal" data-delay={0.25 + i * 0.05}>
          <span className="pp-section-num">{s.num}</span>
          <h2>{s.title}</h2>
          {s.content()}
        </div>
      ))}
    </article>
  </div>
);

const AppPP = () => {
  useReveal();
  return (
    <div className="wrap">
      <Navbar activePage="" />
      <PPHero/>
      <PPContent/>
      <Footer />
      <WaFloat/>
    </div>
  );
};

ReactDOM.createRoot(document.getElementById('root')).render(<AppPP/>);