function Tessa() {
  return (
    <section className="tessa-section" id="tessa">
      <div className="shell">
        <SectionLabel num="09 / Núcleo" label="Conoce a Tessa" right="IA propietaria" />

        <div className="tessa-grid">
          <div className="tessa-video">
            <video autoPlay muted loop playsInline>
              <source src="https://hebbkx1anhila5yf.public.blob.vercel-storage.com/03a6e552-385e-499d-8879-aeaad6379193-4ANjKkN7wRTt29OfD1HJSLWE3v2Iwr.mp4" type="video/mp4" />
            </video>
            <div className="frame-tag">TESSA · CORE</div>
          </div>
          <div>
            <p className="tessa-pull">
              Tessa es la IA propietaria que <span className="em">opera detrás</span> de cada uno
              de nuestros módulos.
            </p>
            <p className="lede" style={{ marginBottom: 32 }}>
              Mientras otras agencias usan herramientas separadas y te cobran por
              horas humanas, Tessa hace en minutos lo que un equipo entrega en
              semanas: análisis de mercado, generación de creativos, optimización
              de pauta, calificación de leads.
            </p>

            <div className="tessa-stats-grid">
              {[
                { k: "ContenIA", v: "Guiones basados en tendencias reales" },
                { k: "PerformanceIA", v: "Optimización en tiempo real con alertas" },
                { k: "Plan 90/180d", v: "Account Manager con plan semanal" },
                { k: "Buyer Personas", v: "3 perfiles con datos reales" },
              ].map((c) => (
                <div key={c.k} style={{ borderTop: "1px solid var(--line)", paddingTop: 16 }}>
                  <div style={{ fontFamily: "var(--mono)", fontSize: 11, letterSpacing: "0.1em", color: "var(--accent)", textTransform: "uppercase", marginBottom: 8 }}>
                    {c.k}
                  </div>
                  <div style={{ fontFamily: "var(--display)", fontSize: 18, lineHeight: 1.2, color: "var(--ink-dim)", fontStyle: "italic" }}>
                    {c.v}
                  </div>
                </div>
              ))}
            </div>
          </div>
        </div>
      </div>
    </section>
  );
}

window.Tessa = Tessa;