// FINAL VARIANT — Dynamic Grid body + Minimal-style hero & lettering const { useState: useStateF, useMemo: useMemoF, useRef: useRefF } = React; function GlyphF({ category, size = 56 }) { if (category === "sicurezza") { return ( ); } if (category === "compliance") { return ( ); } if (category === "lom") { return ( ); } return ( ); } function CardF({ course, isOpen, onToggle }) { const cat = window.CATEGORY_META[course.category]; const ref = useRefF(null); const onMove = (e) => { if (isOpen || !ref.current) return; const r = ref.current.getBoundingClientRect(); ref.current.style.setProperty("--gx", `${e.clientX - r.left}px`); ref.current.style.setProperty("--gy", `${e.clientY - r.top}px`); }; return (
{course.num}
{cat.label}

{course.title}

{course.duration} {course.category === "lom" ? "Microlearning" : "E-learning"}

{course.desc}

Destinatari

{course.audience}

Riferimenti

{course.norm}

Attestazione

{course.cert}

Indice dei contenuti ({course.topics.length})
    {course.topics.map((t, i) => (
  • {String(i + 1).padStart(2, "0")} {t}
    • ))}
); } function FinalVariant() { const [filter, setFilter] = useStateF("all"); const [openId, setOpenId] = useStateF(null); const [search, setSearch] = useStateF(""); const filtered = useMemoF(() => { return window.COURSES.filter((c) => { if (filter !== "all" && c.category !== filter) return false; if (search && !(c.title + " " + c.desc + " " + c.topics.join(" ")) .toLowerCase().includes(search.toLowerCase())) return false; return true; }); }, [filter, search]); const totalHours = window.COURSES.reduce((s, c) => s + c.hours, 0); return (
Top Spin Consulting
Prenota demo →
{/* HERO — stile Minimal Index, due colonne, headline gigante */}
— Catalogo formativo aziendale

Formazione,
sicurezza
e cultura
organizzativa.

Indice ragionato dei {window.COURSES.length} percorsi e-learning in autoapprendimento per aziende e organizzazioni — sicurezza sul lavoro, compliance normativa, ESG e cultura.

Vai all'indice ↓ Prenota demo →
{/* FASCIA DI TRANSIZIONE — categorie tematiche + LOM trasversale */}
{window.CATEGORIES.filter((c) => c.id !== "lom").map((c) => { const count = c.id === "all" ? window.COURSES.length : window.COURSES.filter((x) => x.category === c.id).length; const color = window.CATEGORY_META[c.id].color; return ( ); })}
{/* RIGA TRASVERSALE — Learn One Minute attraversa tutte le aree */}
{/* CATALOGO */} {/* ON-DEMAND — Progettazione e produzione su misura */}
On-demand

Progettazione
e produzione
su misura.

Oltre al catalogo, progettiamo e produciamo qualsiasi percorso formativo a partire dai fabbisogni della tua organizzazione — dalla fase di analisi al rilascio degli attestati, con contenuti dedicati, brandizzati e tracciabili.

Richiedi un preventivo →
{/* CTA / CONTATTI */}
Prenota demo

Vediamo insieme
come strutturare
il tuo piano formativo.

Demo gratuita della piattaforma, tour del catalogo e analisi dei fabbisogni formativi della tua organizzazione.

Email

info@topspinconsulting.it

Sede

Via Nomentana 251
00161 Roma

{ e.preventDefault(); const fd = new FormData(e.currentTarget); const nome = (fd.get("nome") || "").toString().trim(); const azienda = (fd.get("azienda") || "").toString().trim(); const email = (fd.get("email") || "").toString().trim(); const note = (fd.get("note") || "").toString().trim(); const subject = `Richiesta demo — ${azienda || nome || "nuovo contatto"}`; const body = `Buongiorno,\n\nvorrei prenotare una demo della piattaforma e-learning Top Spin Consulting.\n\n` + `— Nome: ${nome || "\u2014"}\n` + `— Azienda: ${azienda || "\u2014"}\n` + `— Email: ${email || "\u2014"}\n\n` + `Note:\n${note || "\u2014"}\n\n` + `—\nInviato dal sito catalogo Top Spin Consulting`; const href = "mailto:info@topspinconsulting.it" + "?subject=" + encodeURIComponent(subject) + "&body=" + encodeURIComponent(body); window.location.href = href; }}>

Cliccando su "Prenota demo" si aprirà il tuo client di posta con un'email già compilata e pronta da inviare a info@topspinconsulting.it.

); } window.FinalVariant = FinalVariant;