// Página /funcionalidades/productividad — datos específicos + ensamblaje
// Reutiliza Nav, Footer, WhatsAppButton et les composants de page-funcionalidad-template.jsx

const getProductividadBenefits = (vocab) => [
  {
    title: 'Dashboard con analytics integrados',
    desc: 'Visualiza el tráfico de tu sitio web, fuentes de leads, pipeline y métricas de propiedades en una sola pantalla. Decisiones basadas en datos reales, no en suposiciones.',
  },
  {
    title: 'Calendario sincronizable con Google y Outlook',
    desc: 'Programa visitas, llamadas, tareas y eventos del equipo en un solo calendario, sincronizado con Google Calendar y Outlook. Vista semanal o mensual, vinculado directamente a tus prospectos y propiedades.',
  },
  {
    title: 'Gestión de tareas tipo Kanban',
    desc: 'Organiza tus tareas en pendientes, en progreso y terminadas. Define urgencia (alta, media, baja), vincula tareas a prospectos y nada se queda atrás.',
  },
  {
    title: 'Registro de actividades cerradas',
    desc: `Registra cada venta o ${vocab.rent} cerrada con su comisión. Visualiza tu desempeño semanal, mensual o anual con métricas claras: total vendido, comisiones, promedios.`,
  },
  {
    title: 'Notificaciones y recordatorios automáticos',
    desc: 'Recibe alertas cuando una tarea vence, un prospecto lleva días sin contacto o se acerca una visita programada. Nada se te olvida, nada se queda atrás.',
  },
];

const ProductividadPage = () => {
  const ctx = (typeof useCountry === 'function') ? useCountry() : null;
  const vocab = (ctx && ctx.vocab) || (window.CO_LOCALE && window.CO_LOCALE.vocab) || { rent: 'arriendo' };
  const country = (ctx && ctx.country) || 'co';
  const preciosHref = `/${country}/precios/`;
  React.useEffect(() => {
    const obs = new IntersectionObserver((entries) => {
      entries.forEach(e => { if (e.isIntersecting) e.target.classList.add('in'); });
    }, { threshold: 0.1, rootMargin: '0px 0px -10% 0px' });
    document.querySelectorAll('.reveal').forEach(el => obs.observe(el));
    return () => obs.disconnect();
  }, []);

  return (
    <>
      <Nav />
      <main>
        <FuncionalidadHero
          eyebrow="Funcionalidad"
          title="Productividad"
          titleAccent="y organización"
          subtitle="Dashboard, calendario, tareas y métricas — todo lo que tu equipo necesita para mantenerse organizado y enfocado en cerrar."
        />
        <VideoDemo
          videoSrc="https://video.closerbroker.com/productividad.mp4"
          posterSrc="https://video.closerbroker.com/productividad.jpg"
        />
        <FuncionalidadBenefits
          eyebrow="Lo que incluye"
          title="Todo lo que necesitas para"
          titleAccent="mantener el ritmo."
          subtitle="Desde el seguimiento de tu agenda hasta el registro de cada venta cerrada, cada función está pensada para que nada se pierda y todo avance."
          items={getProductividadBenefits(vocab)}
        />
        <FuncionalidadCTA
          eyebrow="¿Listo para empezar?"
          title="Organiza tu día sin esfuerzo"
          titleAccent="y dedica más tiempo a vender."
          subtitle="Un solo precio, todo incluido. Sin sorpresas en la factura."
          cta={{ label: 'Empezar mis 21 días gratis', href: preciosHref }}
        />
      </main>
      <Footer />
      <WhatsAppButton />
    </>
  );
};

window.ProductividadPage = ProductividadPage;