/* Products section — 3 product cards (Report / Consult / Flow) */

function ProductCard({ variant, name, tagline, badge, desc, img, bullets }) {
  return (
    <article className={`product-3 ${variant}`}>
      <header className="ph">
        <div>
          <div className="ph-name">Delt<span className="name-ai">Ai</span> {name}</div>
          <div className="tag">{tagline}</div>
        </div>
        {badge && <span className="beta">{badge}</span>}
      </header>
      <div className="imgwrap">
        <img src={img} alt={`DeltAi ${name}`} />
      </div>
      <div style={{display:"grid", gap: 14}}>
        <p className="pdesc">{desc}</p>
        <ul className="bullets">
          {bullets.map(b => <li key={b}><I.Check/>{b}</li>)}
        </ul>
      </div>
    </article>
  );
}

function Products() {
  return (
    <section className="container section" id="producto">
      <div className="section-head">
        <span className="eyebrow">— Ecosistema de producto</span>
        <h2>Un ecosistema integral de <span className="grad">inteligencia clínica</span>.</h2>
        <p>
          Tres herramientas que se integran a cualquier plataforma RIS/PACS y potencian
          cada etapa del proceso radiológico.
        </p>
      </div>
      <div className="products-3">
        <ProductCard
          variant="report"
          name="Report"
          tagline="Más informe, menos dictado."
          desc="Convierte hallazgos clave en informes completos, ordenados y con tono académico profesional."
          img={(window.__resources && window.__resources.productReport) || "assets/report-knee-laptop.png"}
          bullets={[
            "Estructura técnica · hallazgos · conclusión",
            "Tono unificado y consistente",
            "Edición y validación en un click",
          ]}
        />
        <ProductCard
          variant="consult"
          name="Consult"
          tagline="Tu colega para casos complejos."
          desc="Analiza imágenes, semiología radiológica y datos clínicos proponiendo diagnósticos diferenciales con fundamento científico."
          img={(window.__resources && window.__resources.productConsult) || "assets/consult-chest-laptop.png"}
          bullets={[
            "Análisis multimodal (imagen + texto)",
            "Diagnósticos diferenciales razonados",
            "Justificación basada en evidencia",
          ]}
        />
        <ProductCard
          variant="flow"
          name="Flow"
          tagline="Flujo de trabajo inteligente."
          badge="Beta"
          desc="Optimiza tiempos y reduce fricción operativa en entornos de alto volumen integrándose con cualquier RIS/PACS."
          img={(window.__resources && window.__resources.productFlow) || "assets/product-flow-tablet.png"}
          bullets={[
            "Intervención invisible, trabaja en segundo plano",
            "Elimina fricción de copiar y pegar",
            "Automatización de contexto",
          ]}
        />
      </div>
    </section>
  );
}

window.Products = Products;