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

const getBolsaBenefits = () => [
  {
    title: 'Red Inmobiliaria CloserBroker',
    desc: 'Accede al inventario de otras agencias en LATAM y multiplica tu oferta sin necesidad de captar más propiedades. Vista lista, mapa o split, con filtros por ciudad, zona, precio y comisión.',
  },
  {
    title: 'Buscador inteligente para tus clientes',
    desc: 'Selecciona uno de tus prospectos y la Bolsa filtra automáticamente las propiedades que coinciden con sus criterios. Encuentra la propiedad ideal en segundos.',
  },
  {
    title: 'Gestiona colaboraciones de principio a fin',
    desc: 'Mensajes, invitaciones recibidas, solicitudes enviadas y colaboraciones activas — todo centralizado. Visualiza por separado las colaboraciones sobre tus propias propiedades y las que iniciaste sobre listings de otras agencias.',
  },
  {
    title: 'Construye tu red de aliados de confianza',
    desc: 'Guarda las agencias con las que ya colaboraste o con las que trabajas frecuentemente. Más colaboraciones, menos fricción, más cierres.',
  },
  {
    title: 'Datos de mercado integrados',
    desc: 'Accede a información en tiempo real sobre precios, demanda y tendencias del mercado inmobiliario en cada zona. Asesora a tus clientes con datos, no con suposiciones.',
  },
];

const BolsaPage = () => {
  const ctx = (typeof useCountry === 'function') ? useCountry() : null;
  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="Bolsa Inmobiliaria"
          title="Tu red,"
          titleAccent="multiplicada."
          subtitle="Accede al inventario compartido de las agencias CloserBroker en LATAM, busca propiedades para tus clientes y gestiona colaboraciones de principio a fin — todo desde un mismo lugar."
        />
        <VideoDemo
          videoSrc="https://video.closerbroker.com/bolsa.mp4"
          posterSrc="https://video.closerbroker.com/bolsa.jpg"
        />
        <FuncionalidadBenefits
          eyebrow="Lo que incluye"
          title={<><span className="serif" style={{ fontStyle: 'italic' }}>Todo lo que necesitas</span> para colaborar y cerrar más.</>}
          subtitle="Una red de agencias, un buscador inteligente y herramientas para gestionar cada colaboración."
          items={getBolsaBenefits()}
        />
        <FuncionalidadCTA
          eyebrow="¿Listo para empezar?"
          title="Multiplica tus ventas"
          titleAccent="con una red de agencias colaborando."
          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.BolsaPage = BolsaPage;