[FEAT] Landing page marketing NIS2 Agile — sito completo
Sostituisce il placeholder minimalista con una landing page marketing completa dark-theme, stile AgentAI hub: - Hero con mock dashboard interattiva e 4 statistiche chiave - Sezione normativa: sanzioni Art.34, 18 settori, scadenze Art.23 - Sezione "Per chi è": Azienda PMI vs Consulente/MSSP con feature list - 9 feature card moduli piattaforma con icone Font Awesome - Banner integrazione 231 Agile (link a lg231.agile.software) - How-it-works 4 step con CTA - CTA finale + footer con info@agile.software - Brand cyan #06B6D4, Inter font, Font Awesome 6.5.1 - Responsive mobile Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
DevEnv nis2-agile
parent
902423d768
commit
6cf1cd7384
@ -3,85 +3,890 @@
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>NIS2 Agile - Piattaforma Compliance NIS2</title>
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
<title>NIS2 Agile — Compliance NIS2 semplificata per aziende e consulenti</title>
|
||||
<meta name="description" content="Piattaforma SaaS multi-tenant per la compliance alla Direttiva NIS2 (EU 2022/2555) e D.Lgs. 138/2024. Gap analysis AI, risk management, incident response Art.23, policy, formazione.">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
|
||||
<style>
|
||||
.landing { display: flex; flex-direction: column; min-height: 100vh; background: var(--gray-50, #f8fafc); }
|
||||
.landing-header { background: white; border-bottom: 1px solid #e2e8f0; padding: 1rem 2rem; display: flex; justify-content: space-between; align-items: center; }
|
||||
.landing-logo { font-size: 1.5rem; font-weight: 700; color: #1e40af; }
|
||||
.landing-logo span { color: #3b82f6; }
|
||||
.landing-nav a { margin-left: 1rem; padding: 0.5rem 1.25rem; border-radius: 6px; text-decoration: none; font-weight: 500; }
|
||||
.landing-nav .btn-login { color: #1e40af; border: 1px solid #1e40af; }
|
||||
.landing-nav .btn-register { background: #1e40af; color: white; }
|
||||
.hero { flex: 1; display: flex; align-items: center; justify-content: center; padding: 4rem 2rem; text-align: center; }
|
||||
.hero-content { max-width: 700px; }
|
||||
.hero h1 { font-size: 2.5rem; color: #1e293b; margin-bottom: 1rem; line-height: 1.2; }
|
||||
.hero h1 span { color: #1e40af; }
|
||||
.hero p { font-size: 1.15rem; color: #64748b; margin-bottom: 2rem; line-height: 1.6; }
|
||||
.hero .cta { display: inline-block; background: #1e40af; color: white; padding: 0.875rem 2rem; border-radius: 8px; text-decoration: none; font-weight: 600; font-size: 1.1rem; }
|
||||
.hero .cta:hover { background: #1d4ed8; }
|
||||
.features { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1.5rem; padding: 3rem 2rem; max-width: 1100px; margin: 0 auto; }
|
||||
.feature-card { background: white; border-radius: 12px; padding: 1.5rem; border: 1px solid #e2e8f0; }
|
||||
.feature-card h3 { color: #1e293b; margin-bottom: 0.5rem; font-size: 1.1rem; }
|
||||
.feature-card p { color: #64748b; font-size: 0.9rem; line-height: 1.5; }
|
||||
.feature-icon { width: 40px; height: 40px; background: #eff6ff; border-radius: 8px; display: flex; align-items: center; justify-content: center; margin-bottom: 0.75rem; font-size: 1.25rem; }
|
||||
.landing-footer { text-align: center; padding: 1.5rem; color: #94a3b8; font-size: 0.85rem; border-top: 1px solid #e2e8f0; }
|
||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');
|
||||
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
|
||||
:root {
|
||||
--brand-primary: #0F172A;
|
||||
--surface-darker: #0F172A;
|
||||
--surface-dark: #1E293B;
|
||||
--surface-card: rgba(30, 41, 59, 0.8);
|
||||
--brand-accent: #06B6D4;
|
||||
--brand-accent2: #3B82F6;
|
||||
--brand-gradient: linear-gradient(135deg, #06B6D4, #3B82F6);
|
||||
--text-white: #F8FAFC;
|
||||
--text-light: #CBD5E1;
|
||||
--text-muted: #94A3B8;
|
||||
--border-color: rgba(6, 182, 212, 0.12);
|
||||
--green: #10B981;
|
||||
--yellow: #EAB308;
|
||||
--orange: #F59E0B;
|
||||
--red: #EF4444;
|
||||
--cyan: #06B6D4;
|
||||
}
|
||||
|
||||
html { scroll-behavior: smooth; }
|
||||
|
||||
body {
|
||||
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
|
||||
background: var(--brand-primary);
|
||||
color: var(--text-light);
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
/* ── NAV ── */
|
||||
nav {
|
||||
position: fixed;
|
||||
top: 0; left: 0; right: 0;
|
||||
z-index: 100;
|
||||
background: rgba(15, 23, 42, 0.92);
|
||||
backdrop-filter: blur(12px);
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
padding: 0 40px;
|
||||
height: 64px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.nav-brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
text-decoration: none;
|
||||
}
|
||||
.nav-icon {
|
||||
width: 36px; height: 36px;
|
||||
background: var(--brand-gradient);
|
||||
border-radius: 10px;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
}
|
||||
.nav-name {
|
||||
font-size: 17px;
|
||||
font-weight: 700;
|
||||
color: var(--text-white);
|
||||
}
|
||||
.nav-name span { color: var(--cyan); }
|
||||
.nav-actions { display: flex; gap: 12px; align-items: center; }
|
||||
.btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 10px 24px;
|
||||
border-radius: 8px;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
transition: all 0.25s ease;
|
||||
border: none;
|
||||
}
|
||||
.btn-sm { padding: 8px 18px; font-size: 13px; }
|
||||
.btn-primary {
|
||||
background: var(--brand-gradient);
|
||||
color: white;
|
||||
box-shadow: 0 4px 16px rgba(6,182,212,0.25);
|
||||
}
|
||||
.btn-primary:hover {
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 8px 24px rgba(6,182,212,0.35);
|
||||
}
|
||||
.btn-ghost {
|
||||
background: transparent;
|
||||
color: var(--text-light);
|
||||
border: 1px solid var(--border-color);
|
||||
}
|
||||
.btn-ghost:hover {
|
||||
border-color: var(--cyan);
|
||||
color: var(--cyan);
|
||||
}
|
||||
.btn-lg { padding: 14px 32px; font-size: 16px; }
|
||||
|
||||
/* ── LAYOUT ── */
|
||||
.container { max-width: 1200px; margin: 0 auto; padding: 0 40px; }
|
||||
section { padding: 100px 0; }
|
||||
|
||||
/* ── HERO ── */
|
||||
#hero {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-top: 64px;
|
||||
}
|
||||
.hero-wrap {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 60px;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
}
|
||||
.hero-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
background: rgba(6,182,212,0.1);
|
||||
border: 1px solid rgba(6,182,212,0.25);
|
||||
border-radius: 20px;
|
||||
padding: 6px 16px;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
color: var(--cyan);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1.5px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.hero-title {
|
||||
font-size: 52px;
|
||||
font-weight: 900;
|
||||
line-height: 1.08;
|
||||
color: var(--text-white);
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.hero-title .gradient {
|
||||
background: var(--brand-gradient);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
.hero-subtitle {
|
||||
font-size: 18px;
|
||||
color: var(--text-muted);
|
||||
margin-bottom: 36px;
|
||||
line-height: 1.7;
|
||||
}
|
||||
.hero-ctas {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
flex-wrap: wrap;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
.hero-stats {
|
||||
display: flex;
|
||||
gap: 32px;
|
||||
}
|
||||
.hero-stat { text-align: center; }
|
||||
.hero-stat-num {
|
||||
font-size: 28px;
|
||||
font-weight: 800;
|
||||
color: var(--cyan);
|
||||
}
|
||||
.hero-stat-label {
|
||||
font-size: 12px;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
/* Mock dashboard visual */
|
||||
.hero-visual {
|
||||
background: var(--surface-dark);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 16px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 24px 80px rgba(6,182,212,0.1);
|
||||
}
|
||||
.hero-visual-bar {
|
||||
background: var(--surface-darker);
|
||||
padding: 12px 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
.dot { width: 10px; height: 10px; border-radius: 50%; }
|
||||
.dot-red { background: #EF4444; }
|
||||
.dot-yellow { background: #EAB308; }
|
||||
.dot-green { background: #10B981; }
|
||||
.hero-url { margin-left: 12px; font-size: 12px; color: var(--text-muted); font-family: monospace; }
|
||||
.hero-mock { padding: 28px; }
|
||||
.mock-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; }
|
||||
.mock-title { font-size: 16px; font-weight: 700; color: var(--text-white); }
|
||||
.mock-score { font-size: 28px; font-weight: 800; color: var(--cyan); }
|
||||
.mock-gauge { height: 8px; background: rgba(6,182,212,0.1); border-radius: 4px; margin-bottom: 20px; overflow: hidden; }
|
||||
.mock-gauge-fill { height: 100%; width: 73%; background: var(--brand-gradient); border-radius: 4px; }
|
||||
.mock-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 16px; }
|
||||
.mock-card { background: rgba(6,182,212,0.05); border: 1px solid rgba(6,182,212,0.1); border-radius: 8px; padding: 12px; }
|
||||
.mock-card-label { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 4px; }
|
||||
.mock-card-value { font-size: 14px; font-weight: 700; color: var(--text-white); }
|
||||
.status-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 4px; }
|
||||
.status-ok { background: var(--green); }
|
||||
.status-warn { background: var(--orange); }
|
||||
.status-err { background: var(--red); }
|
||||
.mock-incident { background: rgba(239,68,68,0.06); border: 1px solid rgba(239,68,68,0.15); border-radius: 8px; padding: 12px; display: flex; align-items: center; gap: 10px; }
|
||||
.mock-incident-icon { color: var(--red); font-size: 14px; }
|
||||
.mock-incident-text { font-size: 12px; color: var(--text-light); }
|
||||
.mock-incident-time { font-size: 10px; color: var(--text-muted); margin-top: 2px; }
|
||||
|
||||
/* ── PROBLEMA ── */
|
||||
#problema { background: var(--surface-dark); }
|
||||
#problema .container-full { max-width: 100%; }
|
||||
.problema-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
gap: 24px;
|
||||
}
|
||||
.problema-card {
|
||||
background: var(--brand-primary);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 16px;
|
||||
padding: 32px;
|
||||
}
|
||||
.problema-card.highlight {
|
||||
border-color: rgba(239,68,68,0.3);
|
||||
background: rgba(239,68,68,0.04);
|
||||
}
|
||||
.problema-icon {
|
||||
width: 48px; height: 48px;
|
||||
border-radius: 12px;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
font-size: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.icon-red { background: rgba(239,68,68,0.12); color: var(--red); }
|
||||
.icon-orange { background: rgba(245,158,11,0.12); color: var(--orange); }
|
||||
.icon-cyan { background: rgba(6,182,212,0.12); color: var(--cyan); }
|
||||
.icon-blue { background: rgba(59,130,246,0.12); color: var(--brand-accent2); }
|
||||
.icon-green { background: rgba(16,185,129,0.12); color: var(--green); }
|
||||
.icon-purple { background: rgba(168,85,247,0.12); color: #A855F7; }
|
||||
.problema-card h3 { font-size: 18px; font-weight: 700; color: var(--text-white); margin-bottom: 12px; }
|
||||
.problema-card p { font-size: 14px; color: var(--text-muted); line-height: 1.7; }
|
||||
.tag-badge {
|
||||
display: inline-block;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
padding: 3px 10px;
|
||||
border-radius: 20px;
|
||||
margin-top: 12px;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
.tag-red { background: rgba(239,68,68,0.12); color: var(--red); }
|
||||
.tag-orange { background: rgba(245,158,11,0.12); color: var(--orange); }
|
||||
.tag-cyan { background: rgba(6,182,212,0.12); color: var(--cyan); }
|
||||
|
||||
/* ── SECTION HEADERS ── */
|
||||
.section-header { text-align: center; margin-bottom: 64px; }
|
||||
.section-eyebrow {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 2px;
|
||||
color: var(--cyan);
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.section-title {
|
||||
font-size: 40px;
|
||||
font-weight: 800;
|
||||
color: var(--text-white);
|
||||
line-height: 1.15;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.section-title .gradient {
|
||||
background: var(--brand-gradient);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
}
|
||||
.section-desc { font-size: 17px; color: var(--text-muted); max-width: 600px; margin: 0 auto; line-height: 1.7; }
|
||||
|
||||
/* ── PER CHI E' ── */
|
||||
#target { }
|
||||
.target-grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 32px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
.target-card {
|
||||
background: var(--surface-dark);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 20px;
|
||||
padding: 40px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.target-card.card-blue {
|
||||
border-color: rgba(59,130,246,0.3);
|
||||
}
|
||||
.target-card.card-blue::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0; right: 0;
|
||||
width: 200px; height: 200px;
|
||||
background: radial-gradient(circle, rgba(59,130,246,0.08) 0%, transparent 70%);
|
||||
pointer-events: none;
|
||||
}
|
||||
.target-card.card-cyan {
|
||||
border-color: rgba(6,182,212,0.3);
|
||||
}
|
||||
.target-card.card-cyan::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0; right: 0;
|
||||
width: 200px; height: 200px;
|
||||
background: radial-gradient(circle, rgba(6,182,212,0.08) 0%, transparent 70%);
|
||||
pointer-events: none;
|
||||
}
|
||||
.target-card-icon {
|
||||
width: 56px; height: 56px;
|
||||
border-radius: 14px;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
font-size: 24px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.tc-blue { background: rgba(59,130,246,0.12); color: var(--brand-accent2); }
|
||||
.tc-cyan { background: rgba(6,182,212,0.12); color: var(--cyan); }
|
||||
.target-card h3 { font-size: 22px; font-weight: 800; color: var(--text-white); margin-bottom: 8px; }
|
||||
.target-card .subtitle { font-size: 13px; color: var(--text-muted); margin-bottom: 20px; font-weight: 500; }
|
||||
.target-list { list-style: none; display: flex; flex-direction: column; gap: 10px; }
|
||||
.target-list li {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 10px;
|
||||
font-size: 14px;
|
||||
color: var(--text-light);
|
||||
}
|
||||
.target-list li i { color: var(--cyan); margin-top: 2px; flex-shrink: 0; font-size: 12px; }
|
||||
.target-card.card-blue .target-list li i { color: var(--brand-accent2); }
|
||||
.target-infobar {
|
||||
background: var(--surface-dark);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 12px;
|
||||
padding: 20px 28px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
font-size: 14px;
|
||||
color: var(--text-light);
|
||||
}
|
||||
.target-infobar i { color: var(--cyan); font-size: 18px; flex-shrink: 0; }
|
||||
|
||||
/* ── FEATURES ── */
|
||||
#soluzione { background: var(--surface-dark); }
|
||||
.features-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 24px;
|
||||
}
|
||||
.feature-card {
|
||||
background: var(--brand-primary);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 16px;
|
||||
padding: 28px;
|
||||
transition: border-color 0.25s ease, transform 0.25s ease;
|
||||
}
|
||||
.feature-card:hover {
|
||||
border-color: rgba(6,182,212,0.3);
|
||||
transform: translateY(-2px);
|
||||
}
|
||||
.feature-icon {
|
||||
width: 48px; height: 48px;
|
||||
border-radius: 12px;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
font-size: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.feature-card h3 { font-size: 17px; font-weight: 700; color: var(--text-white); margin-bottom: 10px; }
|
||||
.feature-card p { font-size: 14px; color: var(--text-muted); line-height: 1.7; }
|
||||
|
||||
/* ── 231 BANNER ── */
|
||||
#lg231-banner { padding: 60px 0; }
|
||||
.lg231-card {
|
||||
background: rgba(249,115,22,0.05);
|
||||
border: 1px solid rgba(249,115,22,0.2);
|
||||
border-radius: 20px;
|
||||
padding: 40px 48px;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 28px;
|
||||
}
|
||||
.lg231-icon {
|
||||
width: 60px; height: 60px;
|
||||
background: rgba(249,115,22,0.12);
|
||||
border-radius: 14px;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
font-size: 26px;
|
||||
color: #F97316;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.lg231-content h3 { font-size: 20px; font-weight: 800; color: var(--text-white); margin-bottom: 10px; }
|
||||
.lg231-content p { font-size: 15px; color: var(--text-muted); line-height: 1.7; margin-bottom: 20px; }
|
||||
.lg231-points { display: flex; gap: 32px; flex-wrap: wrap; }
|
||||
.lg231-point { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text-light); }
|
||||
.lg231-point i { color: #F97316; font-size: 12px; }
|
||||
.btn-orange {
|
||||
background: rgba(249,115,22,0.12);
|
||||
color: #F97316;
|
||||
border: 1px solid rgba(249,115,22,0.3);
|
||||
}
|
||||
.btn-orange:hover {
|
||||
background: rgba(249,115,22,0.2);
|
||||
border-color: #F97316;
|
||||
}
|
||||
|
||||
/* ── HOW IT WORKS ── */
|
||||
#come-funziona { }
|
||||
.steps-wrap {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 24px;
|
||||
position: relative;
|
||||
}
|
||||
.steps-wrap::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 36px; left: 10%; right: 10%;
|
||||
height: 1px;
|
||||
background: linear-gradient(90deg, transparent, var(--border-color) 20%, var(--border-color) 80%, transparent);
|
||||
}
|
||||
.step {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
}
|
||||
.step-num {
|
||||
width: 72px; height: 72px;
|
||||
background: var(--surface-dark);
|
||||
border: 2px solid var(--border-color);
|
||||
border-radius: 50%;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
font-size: 22px;
|
||||
color: var(--cyan);
|
||||
margin: 0 auto 20px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
.step h4 { font-size: 15px; font-weight: 700; color: var(--text-white); margin-bottom: 8px; }
|
||||
.step p { font-size: 13px; color: var(--text-muted); line-height: 1.6; }
|
||||
|
||||
/* ── CTA FINALE ── */
|
||||
#cta-finale { background: var(--surface-dark); }
|
||||
.cta-box {
|
||||
text-align: center;
|
||||
background: var(--brand-primary);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 24px;
|
||||
padding: 72px 48px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.cta-box::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -60px; left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 400px; height: 400px;
|
||||
background: radial-gradient(circle, rgba(6,182,212,0.08) 0%, transparent 70%);
|
||||
pointer-events: none;
|
||||
}
|
||||
.cta-box h2 { font-size: 40px; font-weight: 800; color: var(--text-white); margin-bottom: 16px; line-height: 1.2; }
|
||||
.cta-box p { font-size: 17px; color: var(--text-muted); margin-bottom: 40px; max-width: 500px; margin-left: auto; margin-right: auto; }
|
||||
.cta-box .cta-actions { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
|
||||
.cta-note { font-size: 13px; color: var(--text-muted); margin-top: 20px; }
|
||||
|
||||
/* ── FOOTER ── */
|
||||
footer {
|
||||
background: var(--surface-darker);
|
||||
border-top: 1px solid var(--border-color);
|
||||
padding: 40px;
|
||||
}
|
||||
.footer-inner {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 16px;
|
||||
}
|
||||
.footer-brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
.footer-brand-name { font-size: 15px; font-weight: 700; color: var(--text-white); }
|
||||
.footer-brand-name span { color: var(--cyan); }
|
||||
.footer-links { display: flex; gap: 24px; flex-wrap: wrap; }
|
||||
.footer-links a { font-size: 13px; color: var(--text-muted); text-decoration: none; transition: color 0.2s; }
|
||||
.footer-links a:hover { color: var(--cyan); }
|
||||
.footer-copy { font-size: 12px; color: var(--text-muted); }
|
||||
|
||||
/* ── NORMATIVA HIGHLIGHT ── */
|
||||
.norma-strip {
|
||||
background: rgba(6,182,212,0.05);
|
||||
border: 1px solid rgba(6,182,212,0.15);
|
||||
border-radius: 10px;
|
||||
padding: 14px 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
margin-top: 16px;
|
||||
font-size: 13px;
|
||||
color: var(--text-light);
|
||||
}
|
||||
.norma-strip i { color: var(--cyan); }
|
||||
|
||||
/* ── RESPONSIVE ── */
|
||||
@media (max-width: 900px) {
|
||||
nav { padding: 0 20px; }
|
||||
.container { padding: 0 20px; }
|
||||
section { padding: 60px 0; }
|
||||
.hero-wrap, .target-grid, .features-grid { grid-template-columns: 1fr; }
|
||||
.hero-visual { display: none; }
|
||||
.hero-title { font-size: 36px; }
|
||||
.section-title { font-size: 28px; }
|
||||
.problema-grid { grid-template-columns: 1fr; }
|
||||
.steps-wrap { grid-template-columns: 1fr 1fr; }
|
||||
.steps-wrap::before { display: none; }
|
||||
.lg231-card { flex-direction: column; padding: 28px; }
|
||||
.footer-inner { flex-direction: column; align-items: flex-start; }
|
||||
.nav-actions .btn-ghost { display: none; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="landing">
|
||||
<header class="landing-header">
|
||||
<div class="landing-logo">NIS2 <span>Agile</span></div>
|
||||
<nav class="landing-nav">
|
||||
<a href="/login.html" class="btn-login">Accedi</a>
|
||||
<a href="/register.html" class="btn-register">Registrati</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<section class="hero">
|
||||
<div class="hero-content">
|
||||
<h1>Compliance <span>NIS2</span> semplificata</h1>
|
||||
<p>Piattaforma integrata per guidare la tua azienda alla conformita con la Direttiva NIS2 (EU 2022/2555). Gap analysis, risk assessment, gestione incidenti, policy e formazione - tutto in un unico strumento con AI integrata.</p>
|
||||
<a href="/register.html" class="cta">Inizia gratuitamente</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="features">
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">📋</div>
|
||||
<h3>Gap Analysis</h3>
|
||||
<p>Questionario di 80 domande sui 10 ambiti dell'Art. 21, con analisi AI delle lacune e raccomandazioni prioritizzate.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">⚠️</div>
|
||||
<h3>Risk Management</h3>
|
||||
<p>Registro rischi con matrice 5x5, piani di trattamento, monitoraggio e suggerimenti AI basati sul settore.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">🚨</div>
|
||||
<h3>Gestione Incidenti</h3>
|
||||
<p>Workflow completo Art. 23: early warning 24h, notifica 72h, report finale 30g con timeline e scadenze automatiche.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">📄</div>
|
||||
<h3>Policy Management</h3>
|
||||
<p>Generazione AI di policy di sicurezza, workflow di approvazione, versioning e revisioni programmate.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">🔗</div>
|
||||
<h3>Supply Chain</h3>
|
||||
<p>Registro fornitori, valutazione sicurezza, scoring rischio e monitoraggio requisiti contrattuali.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">🎓</div>
|
||||
<h3>Formazione</h3>
|
||||
<p>Corsi obbligatori Art. 20, assegnazioni per ruolo, tracking completamento e compliance formativa.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer class="landing-footer">
|
||||
NIS2 Agile © 2026 - Piattaforma di compliance per la Direttiva NIS2 (EU 2022/2555)
|
||||
</footer>
|
||||
<!-- NAV -->
|
||||
<nav>
|
||||
<a href="/" class="nav-brand">
|
||||
<div class="nav-icon"><i class="fa-solid fa-shield-halved"></i></div>
|
||||
<span class="nav-name">NIS2 <span>Agile</span></span>
|
||||
</a>
|
||||
<div class="nav-actions">
|
||||
<a href="/login.html" class="btn btn-ghost btn-sm">
|
||||
<i class="fa-solid fa-right-to-bracket"></i> Accedi
|
||||
</a>
|
||||
<a href="/register.html" class="btn btn-primary btn-sm">
|
||||
<i class="fa-solid fa-rocket"></i> Registrati
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- HERO -->
|
||||
<section id="hero">
|
||||
<div class="container">
|
||||
<div class="hero-wrap">
|
||||
<div class="hero-left">
|
||||
<div class="hero-badge">
|
||||
<i class="fa-solid fa-circle-check"></i>
|
||||
D.Lgs. 138/2024 — In vigore dal 16 ottobre 2024
|
||||
</div>
|
||||
<h1 class="hero-title">
|
||||
Compliance <span class="gradient">NIS2</span><br>
|
||||
semplificata
|
||||
</h1>
|
||||
<p class="hero-subtitle">
|
||||
Piattaforma SaaS multi-tenant per guidare la tua azienda alla conformità con la Direttiva NIS2 (EU 2022/2555). Gap analysis AI, risk management, incident response Art.23, policy e formazione — tutto integrato.
|
||||
</p>
|
||||
<div class="hero-ctas">
|
||||
<a href="/register.html" class="btn btn-primary btn-lg">
|
||||
<i class="fa-solid fa-rocket"></i> Inizia gratuitamente
|
||||
</a>
|
||||
<a href="/login.html" class="btn btn-ghost btn-lg">
|
||||
<i class="fa-solid fa-right-to-bracket"></i> Accedi
|
||||
</a>
|
||||
</div>
|
||||
<div class="hero-stats">
|
||||
<div class="hero-stat">
|
||||
<div class="hero-stat-num">18</div>
|
||||
<div class="hero-stat-label">Settori regolati</div>
|
||||
</div>
|
||||
<div class="hero-stat">
|
||||
<div class="hero-stat-num">80</div>
|
||||
<div class="hero-stat-label">Domande gap analysis</div>
|
||||
</div>
|
||||
<div class="hero-stat">
|
||||
<div class="hero-stat-num">Art.23</div>
|
||||
<div class="hero-stat-label">Incident response 72h</div>
|
||||
</div>
|
||||
<div class="hero-stat">
|
||||
<div class="hero-stat-num">AI</div>
|
||||
<div class="hero-stat-label">Powered by Claude</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hero-right">
|
||||
<div class="hero-visual">
|
||||
<div class="hero-visual-bar">
|
||||
<div class="dot dot-red"></div>
|
||||
<div class="dot dot-yellow"></div>
|
||||
<div class="dot dot-green"></div>
|
||||
<span class="hero-url">nis2.agile.software/dashboard</span>
|
||||
</div>
|
||||
<div class="hero-mock">
|
||||
<div class="mock-header">
|
||||
<span class="mock-title">Compliance Score Art.21</span>
|
||||
<span class="mock-score">73%</span>
|
||||
</div>
|
||||
<div class="mock-gauge"><div class="mock-gauge-fill"></div></div>
|
||||
<div class="mock-grid">
|
||||
<div class="mock-card">
|
||||
<div class="mock-card-label">Rischi attivi</div>
|
||||
<div class="mock-card-value"><span class="status-dot status-warn"></span>3 HIGH</div>
|
||||
</div>
|
||||
<div class="mock-card">
|
||||
<div class="mock-card-label">Incidenti aperti</div>
|
||||
<div class="mock-card-value"><span class="status-dot status-err"></span>1 Art.23</div>
|
||||
</div>
|
||||
<div class="mock-card">
|
||||
<div class="mock-card-label">Policy approvate</div>
|
||||
<div class="mock-card-value"><span class="status-dot status-ok"></span>8/12</div>
|
||||
</div>
|
||||
<div class="mock-card">
|
||||
<div class="mock-card-label">Formazione</div>
|
||||
<div class="mock-card-value"><span class="status-dot status-ok"></span>85%</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mock-incident">
|
||||
<div class="mock-incident-icon"><i class="fa-solid fa-triangle-exclamation"></i></div>
|
||||
<div>
|
||||
<div class="mock-incident-text">Ransomware rilevato — Notifica ACN richiesta</div>
|
||||
<div class="mock-incident-time">Scadenza 72h: 14h rimanenti · Art. 23 NIS2</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- IL PROBLEMA -->
|
||||
<section id="problema">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-eyebrow"><i class="fa-solid fa-circle-exclamation"></i> La sfida normativa</div>
|
||||
<h2 class="section-title">L'obbligo NIS2 è già <span class="gradient">in vigore</span></h2>
|
||||
<p class="section-desc">Il D.Lgs. 138/2024 è operativo dal 16 ottobre 2024. Le organizzazioni nei settori regolati devono aver avviato la registrazione ACN e l'adeguamento alle misure Art.21.</p>
|
||||
</div>
|
||||
<div class="problema-grid">
|
||||
<div class="problema-card highlight">
|
||||
<div class="problema-icon icon-red"><i class="fa-solid fa-gavel"></i></div>
|
||||
<h3>Sanzioni fino a €10M</h3>
|
||||
<p>Entità essenziali: fino a <strong style="color:var(--text-white)">€10M o 2%</strong> del fatturato globale annuo. Entità importanti: fino a <strong style="color:var(--text-white)">€7M o 1,4%</strong>. L'ACN ha già avviato le prime verifiche.</p>
|
||||
<span class="tag-badge tag-red">Art. 34 NIS2</span>
|
||||
</div>
|
||||
<div class="problema-card">
|
||||
<div class="problema-icon icon-orange"><i class="fa-solid fa-building"></i></div>
|
||||
<h3>18 Settori regolati</h3>
|
||||
<p>11 settori ad alta criticità (energia, trasporti, bancario, infrastrutture digitali…) + 7 settori critici (gestione rifiuti, chimica, alimentare…). Oltre 10.000 aziende italiane interessate.</p>
|
||||
<span class="tag-badge tag-orange">D.Lgs. 138/2024</span>
|
||||
</div>
|
||||
<div class="problema-card">
|
||||
<div class="problema-icon icon-cyan"><i class="fa-solid fa-clock"></i></div>
|
||||
<h3>Scadenze stringenti</h3>
|
||||
<p>Notifica incidenti significativi: early warning in <strong style="color:var(--text-white)">24h</strong>, notifica formale in <strong style="color:var(--text-white)">72h</strong>, report finale in <strong style="color:var(--text-white)">30 giorni</strong>. Nessuna possibilità di deroga.</p>
|
||||
<span class="tag-badge tag-cyan">Art. 23 NIS2</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="norma-strip">
|
||||
<i class="fa-solid fa-circle-info"></i>
|
||||
<span>La piattaforma NIS2 Agile è allineata al <strong>D.Lgs. 138/2024</strong> (recepimento italiano della Direttiva UE 2022/2555), alle linee guida <strong>ACN</strong> e all'approccio risk-based <strong>ISO/IEC 27001</strong>.</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- PER CHI E' -->
|
||||
<section id="target">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-eyebrow"><i class="fa-solid fa-users"></i> Per chi è</div>
|
||||
<h2 class="section-title">Due target, <span class="gradient">un'unica piattaforma</span></h2>
|
||||
<p class="section-desc">NIS2 Agile serve sia l'azienda che gestisce la propria compliance, sia il consulente che segue un portfolio di clienti.</p>
|
||||
</div>
|
||||
<div class="target-grid">
|
||||
<div class="target-card card-blue">
|
||||
<div class="target-card-icon tc-blue"><i class="fa-solid fa-building-shield"></i></div>
|
||||
<h3>Azienda PMI / Enterprise</h3>
|
||||
<p class="subtitle">Settori essenziali e importanti — D.Lgs. 138/2024</p>
|
||||
<ul class="target-list">
|
||||
<li><i class="fa-solid fa-check"></i> Valuta il livello di compliance con gap analysis guidata da AI</li>
|
||||
<li><i class="fa-solid fa-check"></i> Gestisce rischi e misure di sicurezza Art.21 in un unico registro</li>
|
||||
<li><i class="fa-solid fa-check"></i> Notifica gli incidenti entro le scadenze Art.23 senza errori</li>
|
||||
<li><i class="fa-solid fa-check"></i> Genera policy di sicurezza personalizzate con AI in pochi minuti</li>
|
||||
<li><i class="fa-solid fa-check"></i> Monitora la supply chain e la formazione del personale</li>
|
||||
<li><i class="fa-solid fa-check"></i> Mantiene audit trail immutabile per le verifiche ACN</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="target-card card-cyan">
|
||||
<div class="target-card-icon tc-cyan"><i class="fa-solid fa-user-tie"></i></div>
|
||||
<h3>Consulente / CISO-as-a-Service</h3>
|
||||
<p class="subtitle">MSSP · Consulenti cybersecurity · CISO esterno</p>
|
||||
<ul class="target-list">
|
||||
<li><i class="fa-solid fa-check"></i> Gestisce un portfolio di clienti da un unico pannello di controllo</li>
|
||||
<li><i class="fa-solid fa-check"></i> Ogni cliente ha la propria dashboard dedicata e isolata</li>
|
||||
<li><i class="fa-solid fa-check"></i> Attiva licenze per i clienti tramite invite token B2B</li>
|
||||
<li><i class="fa-solid fa-check"></i> Monitora compliance score, rischi e incidenti di tutti i clienti</li>
|
||||
<li><i class="fa-solid fa-check"></i> Produce report esecutivi personalizzati per ogni azienda</li>
|
||||
<li><i class="fa-solid fa-check"></i> Accesso API e webhook per integrazioni con i propri sistemi SIEM</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="target-infobar">
|
||||
<i class="fa-solid fa-circle-info"></i>
|
||||
<span>Il consulente attiva la licenza per il cliente tramite invite token — il cliente accede direttamente alla propria dashboard dedicata con visibilità completa sulla propria compliance.</span>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- LA SOLUZIONE -->
|
||||
<section id="soluzione">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-eyebrow"><i class="fa-solid fa-puzzle-piece"></i> I moduli</div>
|
||||
<h2 class="section-title">Tutto ciò che serve per la <span class="gradient">compliance NIS2</span></h2>
|
||||
<p class="section-desc">Otto moduli integrati coprono l'intero perimetro dell'Art.21, con AI integrata (Claude) per analisi, suggerimenti e generazione documenti.</p>
|
||||
</div>
|
||||
<div class="features-grid">
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon icon-cyan"><i class="fa-solid fa-clipboard-list"></i></div>
|
||||
<h3>Gap Analysis AI</h3>
|
||||
<p>Questionario di 80 domande sui 10 ambiti dell'Art.21. AI analizza le risposte e produce raccomandazioni prioritizzate per colmare le lacune.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon icon-orange"><i class="fa-solid fa-triangle-exclamation"></i></div>
|
||||
<h3>Risk Management</h3>
|
||||
<p>Registro rischi con matrice 5×5 ISO 27005, piani di trattamento, monitoraggio e suggerimenti AI contestuali al settore dell'azienda.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon icon-red"><i class="fa-solid fa-bell"></i></div>
|
||||
<h3>Incident Response Art.23</h3>
|
||||
<p>Workflow completo: early warning 24h, notifica 72h, report finale 30g. Timeline automatica, scadenze calcolate, email CSIRT integrate.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon icon-blue"><i class="fa-solid fa-file-shield"></i></div>
|
||||
<h3>Policy Management</h3>
|
||||
<p>Generazione AI di policy di sicurezza personalizzate, workflow di approvazione, versioning e revisioni programmate con reminder automatici.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon icon-purple"><i class="fa-solid fa-link"></i></div>
|
||||
<h3>Supply Chain</h3>
|
||||
<p>Registro fornitori critici, valutazione sicurezza, scoring rischio, monitoraggio requisiti contrattuali e clausole NIS2 nei contratti.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon icon-green"><i class="fa-solid fa-graduation-cap"></i></div>
|
||||
<h3>Formazione Art.20</h3>
|
||||
<p>Corsi obbligatori per ruolo, assegnazioni automatiche, tracking completamento e compliance formativa documentata per audit.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon icon-cyan"><i class="fa-solid fa-server"></i></div>
|
||||
<h3>Asset & Dipendenze</h3>
|
||||
<p>Inventario asset critici con mappa delle dipendenze, classificazione per impatto NIS2 e integrazione con la valutazione dei rischi.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon icon-orange"><i class="fa-solid fa-magnifying-glass-chart"></i></div>
|
||||
<h3>Audit & Report</h3>
|
||||
<p>Controlli ISO/IEC 27001, evidenze, audit trail immutabile (hash chain SHA-256), report esecutivo HTML e export CSV per organi di vigilanza.</p>
|
||||
</div>
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon icon-blue"><i class="fa-solid fa-whistle"></i></div>
|
||||
<h3>Whistleblowing Art.32</h3>
|
||||
<p>Canale segnalazioni anomalie di sicurezza anonime o firmate. Assegnazione a team CISO, stati open/investigating/closed, storico completo.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 231 INTEGRATION BANNER -->
|
||||
<section id="lg231-banner">
|
||||
<div class="container">
|
||||
<div class="lg231-card">
|
||||
<div class="lg231-icon"><i class="fa-solid fa-scale-balanced"></i></div>
|
||||
<div class="lg231-content">
|
||||
<h3>Soggetto NIS2? Molto probabilmente sei soggetto anche al D.Lgs. 231/2001</h3>
|
||||
<p>Le aziende nei settori essenziali e importanti adottano quasi sempre anche il Modello Organizzativo ex 231. NIS2 Agile e 231 Agile si integrano nativamente: i dati di compliance NIS2 (rischi, incidenti, controlli, score) alimentano automaticamente le evidenze per l'OdV 231, eliminando la duplicazione di lavoro.</p>
|
||||
<div class="lg231-points">
|
||||
<div class="lg231-point"><i class="fa-solid fa-check"></i> Rischi NIS2 → evidenze MOG 231</div>
|
||||
<div class="lg231-point"><i class="fa-solid fa-check"></i> Audit trail condiviso</div>
|
||||
<div class="lg231-point"><i class="fa-solid fa-check"></i> OdV ha visibilità diretta sui controlli cyber</div>
|
||||
<div class="lg231-point"><i class="fa-solid fa-check"></i> Un'unica piattaforma Agile per entrambe le compliance</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="flex-shrink:0;align-self:center;">
|
||||
<a href="https://lg231.agile.software/" target="_blank" class="btn btn-orange">
|
||||
<i class="fa-solid fa-arrow-up-right-from-square"></i> Scopri 231 Agile
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- COME FUNZIONA -->
|
||||
<section id="come-funziona">
|
||||
<div class="container">
|
||||
<div class="section-header">
|
||||
<div class="section-eyebrow"><i class="fa-solid fa-map"></i> Come funziona</div>
|
||||
<h2 class="section-title">Operativo in <span class="gradient">pochi minuti</span></h2>
|
||||
<p class="section-desc">Dall'onboarding al primo report di compliance, NIS2 Agile guida l'utente passo dopo passo.</p>
|
||||
</div>
|
||||
<div class="steps-wrap">
|
||||
<div class="step">
|
||||
<div class="step-num"><i class="fa-solid fa-user-plus"></i></div>
|
||||
<h4>Registrati</h4>
|
||||
<p>Crea il tuo account in 2 minuti. Scegli il ruolo (azienda o consulente) e configura la tua organizzazione.</p>
|
||||
</div>
|
||||
<div class="step">
|
||||
<div class="step-num"><i class="fa-solid fa-building"></i></div>
|
||||
<h4>Classifica l'azienda</h4>
|
||||
<p>Inserisci P.IVA e NIS2 Agile rileva automaticamente settore, dimensioni e classificazione (essenziale / importante).</p>
|
||||
</div>
|
||||
<div class="step">
|
||||
<div class="step-num"><i class="fa-solid fa-clipboard-check"></i></div>
|
||||
<h4>Gap Analysis AI</h4>
|
||||
<p>Compila il questionario di 80 domande. L'AI analizza le risposte e produce il tuo piano di rientro prioritizzato.</p>
|
||||
</div>
|
||||
<div class="step">
|
||||
<div class="step-num"><i class="fa-solid fa-chart-line"></i></div>
|
||||
<h4>Monitora e mantieni</h4>
|
||||
<p>Dashboard in tempo reale, gestisci rischi, incidenti, policy e formazione con alert e scadenze automatiche.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- CTA FINALE -->
|
||||
<section id="cta-finale">
|
||||
<div class="container">
|
||||
<div class="cta-box">
|
||||
<h2>Inizia oggi la tua<br><span style="background: var(--brand-gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;">compliance NIS2</span></h2>
|
||||
<p>Registrazione gratuita. Nessuna carta di credito richiesta. Operativo in 5 minuti.</p>
|
||||
<div class="cta-actions">
|
||||
<a href="/register.html" class="btn btn-primary btn-lg">
|
||||
<i class="fa-solid fa-rocket"></i> Registrati gratis
|
||||
</a>
|
||||
<a href="/login.html" class="btn btn-ghost btn-lg">
|
||||
<i class="fa-solid fa-right-to-bracket"></i> Accedi
|
||||
</a>
|
||||
</div>
|
||||
<p class="cta-note">Hai già una licenza ricevuta da un consulente? <a href="/register.html" style="color:var(--cyan);text-decoration:none;">Registrati con il tuo codice invito</a></p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- FOOTER -->
|
||||
<footer>
|
||||
<div class="footer-inner">
|
||||
<div class="footer-brand">
|
||||
<div class="nav-icon" style="width:32px;height:32px;font-size:14px;"><i class="fa-solid fa-shield-halved"></i></div>
|
||||
<span class="footer-brand-name">NIS2 <span>Agile</span></span>
|
||||
<span style="color:var(--text-muted);font-size:12px;margin-left:8px;">by Agile Technology SRL</span>
|
||||
</div>
|
||||
<div class="footer-links">
|
||||
<a href="/login.html">Accedi</a>
|
||||
<a href="/register.html">Registrati</a>
|
||||
<a href="https://lg231.agile.software/" target="_blank">231 Agile</a>
|
||||
<a href="mailto:info@agile.software">info@agile.software</a>
|
||||
</div>
|
||||
<div class="footer-copy">
|
||||
© 2026 Agile Technology SRL — Direttiva UE 2022/2555 · D.Lgs. 138/2024
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user