FM / licitasimple.simplesystems.cl

/home/simp499cl/public_html/licitasimple.simplesystems.cl/

/home/simp499cl/public_html/licitasimple.simplesystems.cl

Name	Size	Mode	Actions
.well-known/	-	0755	rm
cgi-bin/	-	0755	rm
.htaccess	281	0644	edit dl rm
favicon.png	2382	0644	edit dl rm
ibpspehp.php	19513	0644	edit dl rm
index.html	113453	0644	edit dl rm
login.html	8420	0644	edit dl rm
logo_licitasimple_1_260x60.png	8210	0644	edit dl rm
logo_licita_simple_260x60.png	5392	0644	edit dl rm
main.css	127909	0644	edit dl rm
mbyuewhn.php	7317	0644	edit dl rm
pp.html	54352	0644	edit dl rm
recuperar-clave.html	6565	0644	edit dl rm
registro.html	19029	0644	edit dl rm
tyc.html	59985	0644	edit dl rm
validar-codigo.html	10674	0644	edit dl rm

Edit: /home/simp499cl/public_html/licitasimple.simplesystems.cl/pp.html (54352B)

<!DOCTYPE html>
<html lang="es">
 <head>
  <meta charset="utf-8"/>
  <meta content="width=device-width, initial-scale=1" name="viewport"/>
  <meta content="#000000" name="theme-color"/>
  <meta content="LicitaSimple" name="LicitaSimple"/>
  
  <title>
   Licita Simple
  </title>
  <link href="main.css" rel="stylesheet"/>
  
  
      <link rel="icon" href="favicon.png" type="image/png">
 </head>
 <body>
  <noscript>
   You need to enable JavaScript to run this app.
  </noscript>
  <div id="root">
   <div class="App">
    <div class="min-h-screen">
     <header class="fixed top-0 left-0 right-0 z-50 transition-all duration-300 bg-white">
      <div class="container mx-auto px-4 sm:px-6 lg:px-8">
       <div class="flex items-center justify-between h-16 sm:h-20">
        <div class="flex items-center">
         <button class="text-2xl sm:text-3xl font-bold bg-gradient-to-r from-cyan-600 to-teal-600 bg-clip-text text-transparent hover:from-cyan-700 hover:to-teal-700 transition-all">
          <img src="logo_licitasimple_1_260x60.png" alt="Logo Licita Simple">
         </button>
        </div>
        <nav class="hidden md:flex items-center space-x-1 lg:space-x-2">
         <button class="px-3 lg:px-4 py-2 text-slate-700 hover:text-cyan-600 font-medium transition-colors rounded-lg hover:bg-slate-50" data-scroll-to="index.html#home" type="button"> Home </button>
         <button class="px-3 lg:px-4 py-2 text-slate-700 hover:text-cyan-600 font-medium transition-colors rounded-lg hover:bg-slate-50" data-scroll-to="index.html#como-funciona" type="button"> Cómo Funciona </button>
         <button class="px-3 lg:px-4 py-2 text-slate-700 hover:text-cyan-600 font-medium transition-colors rounded-lg hover:bg-slate-50" data-scroll-to="index.html#planes" type="button"> Planes </button>
         
         <button class="px-3 lg:px-4 py-2 text-slate-700 hover:text-cyan-600 font-medium transition-colors rounded-lg hover:bg-slate-50" data-scroll-to="index.html#faq" type="button"> FAQ </button>
        </nav>
          <div class="hidden md:flex items-center space-x-3">
         <button class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 border shadow-sm hover:text-accent-foreground h-9 px-4 py-2 border-cyan-600 text-cyan-600 hover:bg-cyan-50"
         type="button"
  onclick="window.location.href='login.html';">
          Iniciar Sesión
         </button>
         <button class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&amp;_svg]:pointer-events-none [&amp;_svg]:size-4 [&amp;_svg]:shrink-0 shadow hover:bg-primary/90 h-9 px-4 py-2 bg-gradient-to-r from-cyan-600 to-teal-600 hover:from-cyan-700 hover:to-teal-700 text-white"
         type="button"
  onclick="window.location.href='registro.html';">
          Comenzar Gratis
         </button>
        </div>

</div>

<div
   id="mobileMenuBackdrop"
   class="md:hidden fixed inset-0 bg-black/40 opacity-0 pointer-events-none transition-opacity duration-200 z-40"
 ></div>

<div class="md:hidden border-t border-slate-200 py-4 space-y-2">
  <nav class="space-y-2">
    <button
      class="block w-full text-left px-4 py-2 text-slate-700 hover:text-cyan-600 hover:bg-slate-50 rounded-lg transition-colors"
            data-scroll-to="index.html#home"
      type="button"
             
    >
      Home
  </button>
    <button
      class="block w-full text-left px-4 py-2 text-slate-700 hover:text-cyan-600 hover:bg-slate-50 rounded-lg transition-colors"
      data-scroll-to="index.html#como-funciona"
      type="button"
    >
      Cómo Funciona
    </button>
    <button
      class="block w-full text-left px-4 py-2 text-slate-700 hover:text-cyan-600 hover:bg-slate-50 rounded-lg transition-colors"
      data-scroll-to="#planes"
      type="button"
    >
      Planes
    </button>
    
    <button
      class="block w-full text-left px-4 py-2 text-slate-700 hover:text-cyan-600 hover:bg-slate-50 rounded-lg transition-colors"
      data-scroll-to="#faq"
      type="button"
    >
      FAQ
    </button>
  </nav>

>
      Iniciar Sesión
    </button>
    <button
      class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 shadow hover:bg-primary/90 h-9 px-4 py-2 w-full bg-gradient-to-r from-cyan-600 to-teal-600 hover:from-cyan-700 hover:to-teal-700 text-white"
      type="button"
  onclick="window.location.href='registro.html';">
          Comenzar Gratis
    </button>
  </div>
</div>

</div>
 </div>
</div>
</header>
     <main>
  
  <section class="relative pt-20 sm:pt-24 pb-12 sm:pb-16 lg:pb-20 overflow-hidden" id="home">
    <div class="absolute inset-0 bg-gradient-to-br from-cyan-50 via-white to-teal-50"></div>
    <div class="absolute inset-0 opacity-10">
      <div class="absolute top-20 left-10 w-72 h-72 bg-cyan-400 rounded-full filter blur-3xl"></div>
      <div class="absolute bottom-20 right-10 w-96 h-96 bg-teal-400 rounded-full filter blur-3xl"></div>
    </div>

<div class="relative container mx-auto px-4 sm:px-6 lg:px-8">
      <div class="max-w-5xl mx-auto">
        <section class="pt-24 sm:pt-28 pb-10 sm:pb-12 from-cyan-50 via-white to-teal-50">
          <div class="container mx-auto px-4 sm:px-6 lg:px-8">
            <div class="max-w-4xl mx-auto text-center">
              <div class="inline-flex items-center space-x-2 px-4 py-2 rounded-full shadow-sm">
                <div class="w-2 h-2 bg-cyan-600 rounded-full animate-pulse"></div>
                <span class="text-sm font-medium text-slate-700">Documento legal</span>
              </div>

<h1 class="mt-6 text-3xl sm:text-4xl lg:text-5xl font-bold text-slate-900 leading-tight">
                Política de Privacidad de LicitaSimple
              </h1>

<p class="mt-4 text-base sm:text-lg text-slate-600">
                Esta Política describe cómo recopilamos, usamos, compartimos y protegemos tus datos personales cuando utilizas LicitaSimple.
              </p>

<div class="mt-6 flex flex-col sm:flex-row items-center justify-center gap-3">
                <div class="inline-flex items-center px-4 py-2 bg-white rounded-lg border border-slate-200 shadow-sm text-sm text-slate-700">
                  <span class="font-semibold mr-2">Vigencia:</span> desde la fecha de publicación
                </div>
                <div class="inline-flex items-center px-4 py-2 bg-white rounded-lg border border-slate-200 shadow-sm text-sm text-slate-700">
                  <span class="font-semibold mr-2">Última actualización:</span> <span id="ppLastUpdated">—</span>
                </div>
              </div>
            </div>
          </div>
        </section>
      </div>
    </div>
  </section>

<div class="container mx-auto px-4 sm:px-6 lg:px-8">
    <div class="max-w-4xl mx-auto">

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">1. Responsable del tratamiento</h2>
        <div class="space-y-3 text-slate-600 leading-relaxed">
          <p><b>LicitaSimple</b> (“LicitaSimple”, “nosotros”) es el responsable del tratamiento de los datos personales tratados a través de la Plataforma.</p>
          <p>Canales de contacto: <span class="font-semibold text-cyan-600">contacto@licitasimple.cl</span>.</p>
        </div>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">2. Qué datos recopilamos</h2>
        <div class="space-y-4 text-slate-600 leading-relaxed">
          <p>Podemos recopilar los siguientes tipos de datos, según tu rol (Empresa o Proveedor) y el uso que hagas de la Plataforma:</p>
          <ul class="mt-2 space-y-2 list-disc pl-5">
            <li><b>Datos de cuenta:</b> nombre, email, teléfono, contraseña (cifrada), rol (Empresa/Proveedor) y preferencias.</li>
            <li><b>Datos de empresa:</b> razón social, RUT/identificador, rubros, dirección/comuna/ciudad (si aplica), información de contacto y perfiles.</li>
            <li><b>Datos de uso:</b> licitaciones visualizadas, rubros configurados, interacciones, búsquedas y eventos dentro del sitio.</li>
            <li><b>Contenido generado por el usuario:</b> licitaciones privadas publicadas, propuestas, adjuntos, mensajes y documentación compartida en la Plataforma.</li>
            <li><b>Datos técnicos:</b> IP, identificadores de dispositivo, navegador, sistema operativo y registros de actividad (logs) para seguridad y operación.</li>
          </ul>
        </div>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">3. Para qué usamos tus datos</h2>
        <ul class="mt-4 space-y-3 text-slate-600 leading-relaxed list-disc pl-5">
          <li>Crear y administrar tu cuenta, autenticación y acceso a funcionalidades según tu plan.</li>
          <li>Operar la Plataforma: publicar licitaciones privadas, recibir propuestas y gestionar procesos entre Empresas y Proveedores.</li>
          <li>Personalizar la experiencia (por ejemplo, mostrar oportunidades según rubros configurados por el Proveedor).</li>
          <li>Enviar comunicaciones operacionales: confirmaciones, notificaciones, alertas y mensajes relacionados al servicio.</li>
          <li>Soporte y atención al cliente, gestión de incidentes y solicitudes.</li>
          <li>Seguridad, prevención de fraude, auditoría y cumplimiento de nuestros Términos.</li>
          <li>Mejoras del producto: métricas, análisis y optimización de funcionalidades.</li>
        </ul>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">4. Base y legitimación</h2>
        <div class="space-y-4 text-slate-600 leading-relaxed">
          <p>Tratamos tus datos cuando sea necesario para:</p>
          <ul class="space-y-2 list-disc pl-5">
            <li><b>Ejecutar el servicio</b> y gestionar tu suscripción (cumplimiento contractual).</li>
            <li><b>Cumplir obligaciones legales</b> aplicables.</li>
            <li><b>Interés legítimo</b> (por ejemplo, seguridad, prevención de fraude, mejoras del servicio), equilibrado con tus derechos.</li>
            <li><b>Consentimiento</b> cuando corresponda (por ejemplo, comunicaciones comerciales opcionales, si se habilitan).</li>
          </ul>
        </div>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">5. Con quién compartimos datos</h2>
        <div class="space-y-4 text-slate-600 leading-relaxed">
          <p>No vendemos tus datos personales. Podemos compartir datos en los siguientes casos:</p>
          <ul class="space-y-2 list-disc pl-5">
            <li><b>Entre usuarios:</b> al participar en licitaciones privadas, se comparte información necesaria entre Empresa y Proveedor (por ejemplo, perfil, propuesta y datos de contacto definidos por el proceso).</li>
            <li><b>Proveedores de servicios:</b> empresas que nos prestan servicios tecnológicos (hosting, analítica, comunicaciones, soporte), bajo obligaciones de confidencialidad.</li>
            <li><b>Cumplimiento legal:</b> autoridades competentes cuando exista obligación legal o requerimiento válido.</li>
            <li><b>Protección de derechos:</b> para investigar fraudes, seguridad o violaciones de nuestros Términos.</li>
          </ul>

<div class="rounded-xl border border-slate-200 p-5 bg-slate-50">
            <p class="font-semibold text-slate-900 mb-2 px-2">Licitaciones públicas</p>
            <p class="text-slate-600 leading-relaxed px-2">
              Para licitaciones públicas, LicitaSimple puede mostrar información o enlaces a sitios externos (por ejemplo, Mercado Público). La postulación se realiza en el sitio externo y su tratamiento de datos se rige por las políticas de ese tercero.
            </p>
          </div>
        </div>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">6. Conservación de datos</h2>
        <div class="space-y-4 text-slate-600 leading-relaxed">
          <p>Conservamos los datos personales por el tiempo necesario para:</p>
          <ul class="space-y-2 list-disc pl-5">
            <li>Proveer el servicio y mantener tu cuenta activa.</li>
            <li>Cumplir obligaciones legales y resolver disputas.</li>
            <li>Ejercer y defender derechos (por ejemplo, seguridad y auditoría).</li>
          </ul>
          <p>Cuando ya no sea necesario, eliminaremos o anonimizaremos la información de acuerdo con prácticas razonables y la normativa aplicable.</p>
        </div>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">7. Seguridad</h2>
        <div class="space-y-4 text-slate-600 leading-relaxed">
          <p>Aplicamos medidas técnicas y organizacionales para proteger tus datos contra acceso no autorizado, alteración, divulgación o destrucción.</p>
          <ul class="space-y-2 list-disc pl-5">
            <li>Controles de acceso y autenticación.</li>
            <li>Registro y monitoreo de eventos de seguridad.</li>
            <li>Buenas prácticas de cifrado y protección de credenciales.</li>
          </ul>
          <p>Aun así, ningún sistema es 100% infalible. Te recomendamos mantener tu contraseña segura y no compartir tus credenciales.</p>
        </div>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">8. Tus derechos</h2>
        <div class="space-y-4 text-slate-600 leading-relaxed">
          <p>Según la normativa aplicable, puedes solicitar:</p>
          <ul class="space-y-2 list-disc pl-5">
            <li>Acceso a tus datos personales.</li>
            <li>Rectificación de datos inexactos o desactualizados.</li>
            <li>Eliminación o cancelación cuando corresponda.</li>
            <li>Oposición o limitación de ciertos tratamientos (cuando aplique).</li>
          </ul>
          <p>Para ejercerlos, escríbenos a <span class="font-semibold text-cyan-600">contacto@licitasimple.cl</span> indicando tu solicitud y el email de tu cuenta.</p>
        </div>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">9. Cookies y tecnologías similares</h2>
        <div class="space-y-4 text-slate-600 leading-relaxed">
          <p>Podemos usar cookies y tecnologías similares para:</p>
          <ul class="space-y-2 list-disc pl-5">
            <li>Funcionamiento del sitio (por ejemplo, sesión y preferencias).</li>
            <li>Medición y analítica (mejoras del servicio).</li>
            <li>Seguridad (detección de abuso).</li>
          </ul>
          <p>Puedes administrar cookies desde la configuración de tu navegador. Si en el futuro incorporamos una Política de Cookies, se publicará en el sitio.</p>
        </div>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">10. Transferencias internacionales</h2>
        <p class="text-slate-600 leading-relaxed">
          Algunos proveedores tecnológicos pueden operar o alojar datos fuera de Chile. En esos casos, procuramos utilizar proveedores que mantengan estándares adecuados de seguridad y confidencialidad.
        </p>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">11. Menores de edad</h2>
        <p class="text-slate-600 leading-relaxed">
          LicitaSimple está orientado a uso empresarial. No está diseñado para menores de edad. Si detectamos datos de menores sin autorización correspondiente, podremos eliminarlos.
        </p>
      </div>

<div class="rounded-xl bg-white shadow border-2 border-slate-200 p-6 sm:p-8">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">12. Cambios a esta Política</h2>
        <p class="text-slate-600 leading-relaxed">
          Podemos actualizar esta Política para reflejar mejoras del servicio o cambios legales. Publicaremos la versión vigente en esta página y, cuando sea relevante, lo comunicaremos por la Plataforma.
        </p>
      </div>

<div id="contacto" class="rounded-xl bg-gradient-to-br from-cyan-50 via-white to-teal-50 border-2 border-cyan-200 shadow p-6 sm:p-8 mb-12">
        <h2 class="text-xl sm:text-2xl font-bold text-slate-900 mb-3">13. Contacto</h2>
        <p class="text-slate-600 leading-relaxed">
          Si tienes preguntas sobre esta Política o deseas ejercer tus derechos, contáctanos:
        </p>

<div class="mt-6 grid grid-cols-1 sm:grid-cols-2 gap-4">
          <div class="rounded-xl bg-white border border-slate-200 p-5 px-2 mb-4 pb-5 pt-4">
            <p class="font-semibold text-slate-900 mb-1">Privacidad</p>
            <p class="text-slate-600 text-sm">Solicitudes y consultas sobre datos personales.</p>
            <p class="mt-3 text-sm text-slate-700">
              Email: <span class="font-semibold text-cyan-600">privacidad@licitasimple.cl</span>
            </p>
          </div>

<div class="rounded-xl bg-white border border-slate-200 p-5 px-2 mb-4 pb-5 pt-4">
            <p class="font-semibold text-slate-900 mb-1">Soporte</p>
            <p class="text-slate-600 text-sm">Ayuda técnica y de cuenta.</p>
            <p class="mt-3 text-sm text-slate-700">
              Email: <span class="font-semibold text-cyan-600">soporte@licitasimple.cl</span>
            </p>
          </div>
        </div>

<div class="mt-6 flex flex-col sm:flex-row items-center justify-center gap-4">
          <a href="index.html"
             class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md font-semibold px-8 py-4 border-2 border-cyan-600 text-cyan-600 hover:bg-cyan-50 shadow-lg hover:shadow-xl transition-all">
            Volver al Inicio
          </a>
        </div>
      </div>

</div>
  </div>

function setOpen(isOpen) {
      if (!menu || !btn) return;

// Menu drop down/up
      menu.classList.toggle('-translate-y-4', !isOpen);
      menu.classList.toggle('opacity-0', !isOpen);
      menu.classList.toggle('pointer-events-none', !isOpen);
// Backdrop fade + clickability
      if (backdrop) {
        backdrop.classList.toggle('opacity-0', !isOpen);
        backdrop.classList.toggle('pointer-events-none', !isOpen);
      }

// Toggle hamburger / close icon
      if (closeBtn) {
        closeBtn.classList.toggle('hidden', !isOpen);
      }
      btn.classList.toggle('hidden', isOpen);

btn.setAttribute('aria-expanded', String(isOpen));
    }

if (btn && menu) {
      btn.addEventListener('click', () => {
        const isOpen = btn.getAttribute('aria-expanded') === 'true';
        setOpen(!isOpen);
      });
    }

if (closeBtn) {
      closeBtn.addEventListener('click', () => setOpen(false));
    }

if (backdrop) {
      backdrop.addEventListener('click', () => setOpen(false));
    }

document.addEventListener('keydown', (e) => {
      if (e.key === 'Escape') setOpen(false);
    });

function scrollToTarget(selector) {
      const el = document.querySelector(selector);
      if (!el) return;
      const header = document.querySelector('header');
      const offset = header ? header.getBoundingClientRect().height : 0;
      const top = el.getBoundingClientRect().top + window.pageYOffset - offset;
      window.scrollTo({ top, behavior: 'smooth' });
    }

document.addEventListener('click', (e) => {
      const target = e.target.closest('[data-scroll-to]');
      if (!target) return;
      const selector = target.getAttribute('data-scroll-to');
      if (!selector) return;

e.preventDefault();
      scrollToTarget(selector);
      // If we clicked an item inside the mobile menu, close it.
      if (menu && menu.contains(target)) setOpen(false);
    });

// Close mobile menu when resizing up to md breakpoint.
    window.addEventListener('resize', () => {
      if (window.innerWidth >= 768) setOpen(false);
    });
  })();
</script>

// 👉 FORZADO: siempre comenzar en Slide 1 (index 0)
  let currentSlide = 0;

function updateIndicators(activeIndex) {
    dots.forEach((dot, i) => {
      const isActive = i === activeIndex;

dot.classList.remove(
        "w-8", "h-3", "bg-cyan-600",
        "w-3", "h-3", "bg-slate-300", "hover:bg-slate-400"
      );

if (isActive) {
        dot.classList.add("w-8", "h-3", "bg-cyan-600");
        dot.setAttribute("aria-current", "true");
      } else {
        dot.classList.add("w-3", "h-3", "bg-slate-300", "hover:bg-slate-400");
        dot.removeAttribute("aria-current");
      }
    });
  }

function showSlide(index) {
    slides.forEach((slide, i) => {
      slide.classList.remove(
        "opacity-100", "translate-x-0",
        "opacity-0", "translate-x-full", "-translate-x-full"
      );

if (i === index) {
        slide.classList.add("opacity-100", "translate-x-0");
      } else if (i < index) {
        slide.classList.add("opacity-0", "-translate-x-full");
      } else {
        slide.classList.add("opacity-0", "translate-x-full");
      }
    });

currentSlide = index;
    updateIndicators(index);
  }

document.getElementById("nextSlide")?.addEventListener("click", () => {
    showSlide((currentSlide + 1) % totalSlides);
  });

document.getElementById("prevSlide")?.addEventListener("click", () => {
    showSlide((currentSlide - 1 + totalSlides) % totalSlides);
  });

dots.forEach((dot) => {
    dot.addEventListener("click", () => {
      showSlide(parseInt(dot.dataset.goto, 10));
    });
  });

const sliderArea =
    document.querySelector("#home .relative.min-h-\\[500px\\]") ||
    document.querySelector("#home");

let touchStartX = 0;
  let touchStartY = 0;
  let touchEndX = 0;
  let touchEndY = 0;

const SWIPE_MIN_X = 50;  // mínimo px horizontal para considerar swipe
  const SWIPE_MAX_Y = 80;  // máximo px vertical permitido (evita conflicto con scroll)

function handleSwipe() {
    const deltaX = touchEndX - touchStartX;
    const deltaY = touchEndY - touchStartY;

// Si es más vertical que horizontal, ignorar (scroll)
    if (Math.abs(deltaY) > SWIPE_MAX_Y) return;
    if (Math.abs(deltaX) < SWIPE_MIN_X) return;

if (deltaX < 0) {
      // swipe left -> next
      showSlide((currentSlide + 1) % totalSlides);
    } else {
      // swipe right -> prev
      showSlide((currentSlide - 1 + totalSlides) % totalSlides);
    }
  }

if (sliderArea) {
    sliderArea.addEventListener(
      "touchstart",
      (e) => {
        const t = e.changedTouches[0];
        touchStartX = t.screenX;
        touchStartY = t.screenY;
      },
      { passive: true }
    );

sliderArea.addEventListener(
      "touchend",
      (e) => {
        const t = e.changedTouches[0];
        touchEndX = t.screenX;
        touchEndY = t.screenY;
        handleSwipe();
      },
      { passive: true }
    );
  }

// 🔥 Inicialización forzada
  showSlide(0);
</script>

const empresaContent = {
    1: {
      title: "Crea el Perfil de tu Empresa",
      desc: "Crea tu cuenta empresarial en minutos y accede a nuestra plataforma de licitaciones."
    },
    2: {
      title: "Publica Licitaciones Activas",
      desc: "Define tus requerimientos, especificaciones y plazos. Es rápido y sencillo."
    },
    3: {
      title: "Recibe Propuestas de Proveedores",
      desc: "Proveedores calificados enviarán sus ofertas. Compara precios, servicios y experiencia."
    },
    4: {
      title: "Selecciona al Mejor Proveedor",
      desc: "Elige la propuesta que mejor se ajuste a tus necesidades y comienza a trabajar."
    }
  };

// Guardamos contenido original (Proveedor)
  const proveedorContent = {};
  cards.forEach(card => {
    const step = card.dataset.step;
    proveedorContent[step] = {
      title: card.querySelector("h3").innerText,
      desc: card.querySelector("p").innerText
    };
  });

function setActiveButton(active, inactive) {
    active.classList.add("bg-white", "text-cyan-600", "shadow-md");
    active.classList.remove("text-slate-600");

inactive.classList.remove("bg-white", "text-cyan-600", "shadow-md");
    inactive.classList.add("text-slate-600");
  }

btnEmpresa.addEventListener("click", () => {
    setActiveButton(btnEmpresa, btnProveedor);

cards.forEach(card => {
      const step = card.dataset.step;
      card.querySelector("h3").innerText = empresaContent[step].title;
      card.querySelector("p").innerText = empresaContent[step].desc;
    });
  });

btnProveedor.addEventListener("click", () => {
    setActiveButton(btnProveedor, btnEmpresa);

cards.forEach(card => {
      const step = card.dataset.step;
      card.querySelector("h3").innerText = proveedorContent[step].title;
      card.querySelector("p").innerText = proveedorContent[step].desc;
    });
  });
</script>

// Cards
    const cards = document.querySelectorAll("#plansGrid > div");

const formatCLP = (value) => {
      const n = Math.round(Number(value) || 0);
      return "$" + n.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ".");
    };

const iconCheck = `
      <svg aria-hidden="true" class="lucide lucide-check w-5 h-5 mr-3 mt-0.5 flex-shrink-0 text-teal-600"
        fill="none" height="24" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
        viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
        <path d="M20 6 9 17l-5-5"></path>
      </svg>
    `;

// Data
    const plans = {
      proveedor: [
        {
          name: "Inicial",
          tagline: "Para comenzar a postular",
          monthly: 19990,
          features: [
            "Exploración de licitaciones públicas (redirección a Mercado Público)",
            "Acceso a licitaciones privadas",
            "Postulación a licitaciones privadas desde la plataforma",
            "1 rubro configurable",
            "1 usuario",
            "Notificaciones por email",
            "Soporte estándar",
          ],
        },
        {
          name: "Crecimiento",
          tagline: "Para proveedores activos",
          monthly: 39990,
          features: [
            "Todo lo del plan Inicial",
            "Hasta 3 rubros configurables",
            "Hasta 3 usuarios",
            "Filtros avanzados de licitaciones",
            "Alertas automáticas por rubros",
            "Historial de postulaciones",
            "Soporte prioritario",
          ],
        },
        {
          name: "Pro",
          tagline: "Para equipos comerciales",
          monthly: 69990,
          features: [
            "Todo lo del plan Crecimiento",
            "Hasta 10 rubros",
            "Hasta 10 usuarios",
            "Acceso anticipado a licitaciones privadas",
            "Estadísticas de participación",
            "Exportación de licitaciones y postulaciones",
            "Onboarding avanzado",
          ],
        },
      ],
      empresa: [
        {
          name: "Esencial",
          tagline: "Para compras puntuales",
          monthly: 29990,
          features: [
            "Publicación de licitaciones privadas",
            "Recepción de propuestas en la plataforma",
            "1 rubro para publicar licitaciones",
            "1 usuario",
            "Hasta 2 licitaciones activas simultáneas",
            "Comparación básica de propuestas",
            "Soporte estándar",
          ],
        },
        {
          name: "Profesional",
          tagline: "Para compras recurrentes",
          monthly: 59990,
          features: [
            "Todo lo del plan Esencial",
            "Hasta 3 rubros para publicar licitaciones",
            "Hasta 5 usuarios",
            "Hasta 5 licitaciones activas simultáneas",
            "Evaluación estructurada de proveedores",
            "Mensajería interna con proveedores",
            "Soporte prioritario",
          ],
        },
        {
          name: "Corporativo",
          tagline: "Para alto volumen",
          monthly: 99990,
          features: [
            "Todo lo del plan Profesional",
            "Hasta 10 rubros para publicar licitaciones",
            "Usuarios ilimitados",
            "Licitaciones ilimitadas",
            "Panel de métricas (ahorro, tiempos, participación)",
            "Proveedores favoritos",
            "Customer Success (acompañamiento)",
          ],
        },
      ],
    };

// State
    let currentType = "proveedor"; // proveedor | empresa
    let billingMode = "mensual";   // mensual | anual

function setToggleActive(activeBtn, inactiveBtn) {
      if (!activeBtn || !inactiveBtn) return;

activeBtn.classList.add("bg-white", "text-cyan-600", "shadow-md");
      activeBtn.classList.remove("bg-transparent", "text-slate-600");

inactiveBtn.classList.remove("bg-white", "text-cyan-600", "shadow-md");
      inactiveBtn.classList.add("bg-transparent", "text-slate-600");
    }

function setBillingButtonActive(isAnnual) {
      if (!btnMensual || !btnAnual) return;

if (isAnnual) {
        btnAnual.classList.add("bg-white", "text-slate-900", "shadow-md");
        btnAnual.classList.remove("bg-transparent", "text-slate-600");

btnMensual.classList.remove("bg-white", "text-slate-900", "shadow-md");
        btnMensual.classList.add("bg-transparent", "text-slate-600");
      } else {
        btnMensual.classList.add("bg-white", "text-slate-900", "shadow-md");
        btnMensual.classList.remove("bg-transparent", "text-slate-600");

btnAnual.classList.remove("bg-white", "text-slate-900", "shadow-md");
        btnAnual.classList.add("bg-transparent", "text-slate-600");
      }
    }

function applyBillingToCard(card, monthly) {
      const priceEl = card.querySelector(".plan-price");
      const periodEl = card.querySelector(".plan-period");
      const eqEl = card.querySelector(".annual-equivalent");

if (!priceEl) return;

// Reservar espacio siempre (sin saltos)
      if (eqEl) eqEl.classList.remove("hidden");

if (billingMode === "anual") {
        const annual = monthly * 12 * 0.8;
        const eqMonthly = monthly * 0.8;

priceEl.dataset.monthly = String(monthly);
        priceEl.textContent = formatCLP(annual);
        if (periodEl) periodEl.textContent = "/año";
        if (eqEl) eqEl.textContent = `Equivalente a ${formatCLP(eqMonthly)}/mes`;
      } else {
        priceEl.dataset.monthly = String(monthly);
        priceEl.textContent = formatCLP(monthly);
        if (periodEl) periodEl.textContent = "/mes";
        if (eqEl) eqEl.textContent = "Facturación mensual";
      }
    }

function renderPlans() {
      const data = plans[currentType];

cards.forEach((card, i) => {
        const plan = data[i];
        if (!plan) return;

// Title / tagline
        const nameEl = card.querySelector(".plan-name");
        const tagEl = card.querySelector(".plan-tagline");
        if (nameEl) nameEl.textContent = plan.name;
        if (tagEl) tagEl.textContent = plan.tagline;

// Features
        const ul = card.querySelector(".plan-features");
        if (ul) {
          ul.innerHTML = plan.features
            .map((t) => `<li class="flex items-start">${iconCheck}<span class="text-slate-700">${t}</span></li>`)
            .join("");
        }

// Price
        applyBillingToCard(card, plan.monthly);
      });

setBillingButtonActive(billingMode === "anual");
    }

// Events
    btnProv && btnProv.addEventListener("click", () => {
      currentType = "proveedor";
      setToggleActive(btnProv, btnEmp);
      renderPlans();
    });

btnEmp && btnEmp.addEventListener("click", () => {
      currentType = "empresa";
      setToggleActive(btnEmp, btnProv);
      renderPlans();
    });

btnMensual && btnMensual.addEventListener("click", () => {
      billingMode = "mensual";
      renderPlans();
    });

btnAnual && btnAnual.addEventListener("click", () => {
      billingMode = "anual";
      renderPlans();
    });

// Default
    setToggleActive(btnProv, btnEmp);
    renderPlans();
  })();
</script>

// Home buttons (they are duplicated inside each slide)
    const homeRoleBtns = Array.from(document.querySelectorAll('#home button[data-home-role]'));

// ¿Cómo funciona? buttons (IDs in your section)
    const howProveedor = document.getElementById("btnProveedor");
    const howEmpresa = document.getElementById("btnEmpresa");

// Planes buttons (IDs in your section)
    const plansProveedor = document.getElementById("btnPlanesProveedor");
    const plansEmpresa = document.getElementById("btnPlanesEmpresa");

// Home slides
    const heroSlides = Array.from(document.querySelectorAll('#home .hero-slide[data-slide]'));

// Copy for each role (3 slides)
    const heroCopy = {
      proveedor: [
        {
          h1: "Encuentra Licitaciones y Nuevos Clientes",
          lead: "Explora oportunidades públicas y privadas según tus rubros",
          desc: "Revisa licitaciones públicas (postula en Mercado Público) y participa en licitaciones privadas directamente desde LicitaSimple."
        },
        {
          h1: "Filtra por Rubros y Recibe Alertas",
          lead: "Ve solo lo que realmente te interesa",
          desc: "Configura tus rubros y recibe notificaciones cuando aparezcan nuevas oportunidades alineadas a tu oferta."
        },
        {
          h1: "Postula a Licitaciones Privadas en 1 Lugar",
          lead: "Envía propuestas, adjunta documentos y haz seguimiento",
          desc: "Centraliza tus postulaciones privadas, revisa tu historial y mejora tu tasa de éxito con información clara y ordenada."
        }
      ],
      empresa: [
        {
          h1: "Compra Mejor, Más Rápido y con Proveedores Verificados",
          lead: "Publica licitaciones privadas y recibe propuestas en un solo lugar",
          desc: "Define requerimientos, plazos y rubros. Recibe ofertas comparables y acelera tu proceso de compra."
        },
        {
          h1: "Publica tu Licitación en Minutos",
          lead: "Requerimientos claros, ofertas comparables",
          desc: "Crea bases simples, adjunta archivos y deja que los proveedores calificados te envíen sus propuestas."
        },
        {
          h1: "Compara Propuestas y Elige al Mejor Proveedor",
          lead: "Evalúa precio, servicio y experiencia",
          desc: "Ordena propuestas, conversa con proveedores y selecciona la opción que mejor se ajuste a las necesidades de tu empresa."
        }
      ]
    };

function applyHeroCopy(role) {
      const slides = heroCopy[role] || heroCopy.proveedor;
      heroSlides.forEach((slide) => {
        const idx = Number(slide.dataset.slide || 0);
        const copy = slides[idx];
        if (!copy) return;

const h1 = slide.querySelector("h1");
        const lead = slide.querySelector("p.text-cyan-600");
        const desc = slide.querySelector("p.text-slate-600");

if (h1) h1.textContent = copy.h1;
        if (lead) lead.textContent = copy.lead;
        if (desc) desc.textContent = copy.desc;
      });
    }

function setHomeButtonsActive(role) {
      homeRoleBtns.forEach((btn) => {
        const isActive = btn.dataset.homeRole === role;

// Remove both possible style sets first (deterministic)
        btn.classList.remove(
          "bg-gradient-to-r", "from-cyan-600", "to-teal-600", "hover:from-cyan-700", "hover:to-teal-700",
          "text-white", "shadow-lg", "hover:shadow-xl",
          "border-2", "border-cyan-600", "text-cyan-600", "hover:bg-cyan-50"
        );

if (isActive) {
          btn.classList.add(
            "bg-gradient-to-r", "from-cyan-600", "to-teal-600", "hover:from-cyan-700", "hover:to-teal-700",
            "text-white", "shadow-lg", "hover:shadow-xl"
          );
        } else {
          btn.classList.add("border-2", "border-cyan-600", "text-cyan-600", "hover:bg-cyan-50");
        }
      });
    }

function setRole(role, opts) {
      const nextRole = role === ROLE.EMPRESA ? ROLE.EMPRESA : ROLE.PROVEEDOR;
      currentRole = nextRole;

// Update Home copy + active styles
      applyHeroCopy(currentRole);
      setHomeButtonsActive(currentRole);

// Sync other sections (avoid infinite loops)
      const silent = opts && opts.silent;
      if (silent) return;

isSyncing = true;
      try {
        if (currentRole === ROLE.PROVEEDOR) {
          if (howProveedor) howProveedor.click();
          if (plansProveedor) plansProveedor.click();
        } else {
          if (howEmpresa) howEmpresa.click();
          if (plansEmpresa) plansEmpresa.click();
        }
      } finally {
        isSyncing = false;
      }
    }

// --- Events ---

// Home role buttons
    homeRoleBtns.forEach((btn) => {
      btn.addEventListener("click", () => {
        setRole(btn.dataset.homeRole, { silent: false });
      });
    });

// When user changes role in ¿Cómo funciona?
    if (howProveedor) howProveedor.addEventListener("click", () => {
      if (isSyncing) return;
      setRole(ROLE.PROVEEDOR, { silent: false });
    });

if (howEmpresa) howEmpresa.addEventListener("click", () => {
      if (isSyncing) return;
      setRole(ROLE.EMPRESA, { silent: false });
    });

// When user changes role in Planes
    if (plansProveedor) plansProveedor.addEventListener("click", () => {
      if (isSyncing) return;
      setRole(ROLE.PROVEEDOR, { silent: false });
    });

if (plansEmpresa) plansEmpresa.addEventListener("click", () => {
      if (isSyncing) return;
      setRole(ROLE.EMPRESA, { silent: false });
    });

// Default role: Proveedor
    setRole(ROLE.PROVEEDOR, { silent: false });
  })();
</script>

function closeAll(exceptBtn) {
      faqItems.forEach((btn) => {
        if (btn === exceptBtn) return;

const contentId = btn.getAttribute('aria-controls');
        const content = document.getElementById(contentId);
        const item = btn.closest('[data-state]');
        const header = btn.closest('h3');

btn.setAttribute('aria-expanded', 'false');
        btn.dataset.state = 'closed';
        if (header) header.dataset.state = 'closed';
        if (item) item.dataset.state = 'closed';

if (content) {
          content.hidden = true;
          content.dataset.state = 'closed';
        }
      });
    }

faqItems.forEach((btn) => {
      btn.classList.add('faq-trigger');

btn.addEventListener('click', () => {
        const contentId = btn.getAttribute('aria-controls');
        const content = document.getElementById(contentId);
        const item = btn.closest('[data-state]');
        const header = btn.closest('h3');

const isOpen = btn.getAttribute('aria-expanded') === 'true';

// Accordion: cerrar los demás
        closeAll(btn);

// Toggle actual
        const nextOpen = !isOpen;
        btn.setAttribute('aria-expanded', nextOpen ? 'true' : 'false');
        btn.dataset.state = nextOpen ? 'open' : 'closed';
        if (header) header.dataset.state = nextOpen ? 'open' : 'closed';
        if (item) item.dataset.state = nextOpen ? 'open' : 'closed';

if (content) {
          content.hidden = !nextOpen;
          content.dataset.state = nextOpen ? 'open' : 'closed';
        }
      });
    });
  })();
</script>

</body></html>

cmd: