/* Trust + Final CTA + Footer sections, plus the FlowSection wrapper. */

function FlowSection({ speed }) {
  return (
    <section className="container section" id="flujo">
      <div className="section-head">
        <span className="eyebrow">— Cómo funciona</span>
        <h2>DeltAi Report automatiza el informe<br/>en <span className="grad">3 pasos simples</span>.</h2>
        <p>
          Las tareas administrativas sobrecargan el día del radiólogo.
          Con DeltAi Report, reducí el tiempo del informe y mejorá su calidad sin cambiar tu flujo.
        </p>
      </div>
      <FlowAnimation speed={speed} />
    </section>
  );
}

function Trust() {
  const cards = [
    { halo: "ico-cyan",   icon: <I.Shield/>,    title: "Marco legal",            desc: "Cumplimiento normativo y trazabilidad completa para cada informe firmado." },
    { halo: "ico-magenta",icon: <I.Award/>,     title: "Validación profesional", desc: "Diseñado, validado y probado por radiólogos en práctica clínica activa." },
    { halo: "ico-rosa",   icon: <I.Lightbulb/>, title: "Soporte clínico",       desc: "Asistencia para la decisión, nunca reemplazo. Vos firmás, vos decidís." },
    { halo: "ico-mint",   icon: <I.Lock/>,      title: "HIPAA-aligned",          desc: "Datos cifrados extremo a extremo. Tus pacientes nunca salen de tu control." },
  ];
  return (
    <section className="container section-tight">
      <div className="section-head center">
        <span className="eyebrow">— Confianza y respaldo</span>
      </div>
      <div className="trust-grid">
        {cards.map(c => (
          <div className="trust-card" key={c.title}>
            <span className={`ico-halo ${c.halo}`}>{c.icon}</span>
            <div className="t-title">{c.title}</div>
            <div className="t-desc">{c.desc}</div>
          </div>
        ))}
      </div>
    </section>
  );
}

function FinalCTA({ onTrial, onDemo }) {
  return (
    <section className="container section">
      <div className="final-cta">
        <div>
          <span className="eyebrow">— Empezá hoy</span>
          <h2 style={{marginTop: 14}}>
            Probá DeltAi con <span className="cta-hl">15 informes gratis</span>.<br/>
            Sin tarjeta, sin compromiso.
          </h2>
          <p>
            Diseñado por radiólogos, para radiólogos. Empezá a recuperar tiempo desde el primer
            informe — y descubrí por qué tus colegas no quieren volver a trabajar sin DeltAi.
          </p>
          <div className="actions">
            <button className="btn btn-primary btn-pill btn-lg" onClick={onTrial}>
              Empezá tus 15 informes gratis <I.Arrow style={{width:16, height:16}}/>
            </button>
            <button className="btn btn-ghost btn-lg" onClick={onDemo}>
              <I.Play style={{width:14, height:14, color:"var(--brand-cian-clinico)"}}/> Ver demo
            </button>
          </div>
        </div>
        <div className="stat-grid">
          <div className="stat-row">
            <span className="v">+2 hs</span>
            <span className="l">recuperadas por día</span>
          </div>
          <div className="stat-row">
            <span className="v">50%</span>
            <span className="l">menos tiempo de informe</span>
          </div>
          <div className="stat-row">
            <span className="v">95%</span>
            <span className="l">confianza promedio de la IA</span>
          </div>
        </div>
      </div>
    </section>
  );
}

function Footer() {
  return (
    <section className="container">
      <footer className="footer">
        <div>
          <a className="brand" href="#top" style={{display:"inline-flex", alignItems:"center", gap:12}}>
            <img src={(window.__resources && window.__resources.logoMark) || "assets/logo-mark-color.png"} alt="DeltAi" />
            <span className="word" style={{fontFamily:"var(--font-display)", fontWeight:700, fontSize:22, letterSpacing:"-0.02em"}}>
              Delt<span style={{color:"var(--brand-cian-clinico)"}}>Ai</span> Suite
            </span>
          </a>
          <p className="blurb">
            HealthTech argentina (Buenos Aires). AI-Driven Radiology diseñada por radiólogos,
            para radiólogos. Premium · Inteligente · Humano.
          </p>
          <div className="accent-rule" />
        </div>
        <div>
          <h5>Producto</h5>
          <ul>
            <li><a href="#producto">DeltAi Report</a></li>
            <li><a href="#producto">DeltAi Consult</a></li>
            <li><a href="#producto">DeltAi Flow <span className="chip chip-magenta" style={{marginLeft:6}}>Beta</span></a></li>
            <li><a href="#planes">Planes</a></li>
          </ul>
        </div>
        <div>
          <h5>Recursos</h5>
          <ul>
            <li><a href="#flujo">Cómo funciona</a></li>
            <li><a href="#beneficios">Beneficios</a></li>
            <li><a href="#testimonios">Testimonios</a></li>
            <li><a href="terminos.html">Términos y condiciones</a></li>
            <li><a href="privacidad.html">Política de privacidad</a></li>
          </ul>
        </div>
      </footer>
      <div className="foot-bottom">
        <span>© 2026 DeltAi Suite S.R.L. · Buenos Aires, Argentina</span>
        <span style={{display:"inline-flex", alignItems:"center", gap:8}}>
          <span className="chip chip-success" style={{padding:"2px 8px"}}>
            <I.Shield style={{width:11, height:11}}/> HIPAA-aligned
          </span>
          <span>deltaisuite.com</span>
        </span>
      </div>
    </section>
  );
}

window.FlowSection = FlowSection;
window.Trust = Trust;
window.FinalCTA = FinalCTA;
window.LandingFooter = Footer;