/* Products — "Nosso Ecossistema" — 4 product cards */
const LAB_PRODUCTS = [
  { name: "DentalFlow", icon: "tooth", desc: "Gestão inteligente para clínicas odontológicas." },
  { name: "Lumière", icon: "sparkles", desc: "Software premium para clínicas de estética." },
  { name: "FrioGest", icon: "snowflake", desc: "Gestão completa para empresas de refrigeração." },
  { name: "LAB AI", icon: "brain-circuit", desc: "Agentes de IA e automações empresariais." },
];

function Products() {
  return (
    <section className="lab-section" id="produtos">
      <div className="lab-container">
        <div className="lab-section-head">
          <Reveal><Eyebrow>Produtos</Eyebrow></Reveal>
          <Reveal delay={60} as="h2">Nosso Ecossistema</Reveal>
          <Reveal delay={120}><p>SaaS especializados para diferentes segmentos — construídos para escalar com a sua operação.</p></Reveal>
        </div>
        <div className="lab-products">
          {LAB_PRODUCTS.map((p, i) => (
            <Reveal key={p.name} delay={i * 80}>
              <div className="lab-pcard">
                <div className="tile"><Icon name={p.icon} size={26} color="#fff" /></div>
                <h3>{p.name}</h3>
                <p>{p.desc}</p>
                <a className="more" href="#produtos">Saiba Mais <Icon name="arrow-right" size={15} /></a>
              </div>
            </Reveal>
          ))}
        </div>
      </div>
    </section>
  );
}
window.Products = Products;