inou/portal/templates/landing_it.tmpl

122 lines
10 KiB
Cheetah

{{define "landing_it"}}
<style>
.landing-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 48px; width: 100%; margin-left: auto; margin-right: auto; margin-bottom: 24px; }
.hero-answer { text-align: center; font-size: 1.25rem; font-weight: 400; color: var(--text); line-height: 1.8; margin-top: 16px; margin-bottom: 32px; }
.hero-answer .inou { font-weight: 700; color: var(--accent); }
.hero-tagline { text-align: center; font-size: 1.3rem; font-weight: 600; color: var(--text); margin-bottom: 32px; }
.hero-cta { margin-bottom: 0; text-align: center; }
.hero-cta .btn { padding: 18px 56px; font-size: 0.9rem; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; border-radius: 4px; }
.story-prose.warm { font-size: 1.1rem; line-height: 1.8; color: var(--text); }
.story-prose.warm p { margin-bottom: 20px; }
.story-prose.warm .emphasis { font-weight: 600; font-size: 1.15rem; }
.story-title { font-size: 1.25rem; font-weight: 600; color: var(--text); margin-bottom: 32px; }
.story-pair { margin-bottom: 32px; }
.story-pair .data { font-size: 1.1rem; font-weight: 400; color: var(--text); margin-bottom: 4px; }
.story-pair .reality { font-size: 1rem; font-weight: 300; font-style: italic; color: var(--text-muted); }
.story-transition { font-size: 1.25rem; font-weight: 400; color: var(--text); line-height: 1.8; margin: 32px 0; padding: 24px 0; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.story-gaps { font-size: 1rem; font-weight: 300; color: var(--text-muted); line-height: 1.8; margin-bottom: 32px; }
.story-gaps span { display: block; }
.story-gaps .indent { font-style: italic; }
.story-connections { font-size: 1rem; font-weight: 300; color: var(--text-muted); line-height: 1.8; margin-bottom: 32px; }
.story-connections span { display: block; }
.story-ai { font-size: 1.25rem; font-weight: 400; color: var(--text); line-height: 1.8; margin-bottom: 32px; }
.story-ai span { display: block; }
.story-ai .last { font-style: italic; }
.story-prose { font-size: 1rem; font-weight: 300; color: var(--text-muted); line-height: 1.8; margin-bottom: 20px; }
.story-prose:last-of-type { margin-bottom: 32px; }
.story-prose strong { font-weight: 600; color: var(--text); }
.story-prose .inou { font-weight: 700; color: var(--accent); }
.story-closing { font-size: 1.25rem; font-weight: 400; color: var(--text); padding-top: 24px; border-top: 1px solid var(--border); }
.story-closing .inou { font-weight: 700; color: var(--accent); }
.trust-card { width: 100%; margin-left: auto; margin-right: auto; background: var(--bg-card); border: 1px solid var(--border); border-radius: 8px; padding: 32px 48px; margin-bottom: 24px; }
.trust-card .section-label { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 24px; }
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; }
.trust-item { font-size: 0.9rem; font-weight: 300; color: var(--text-muted); line-height: 1.6; }
.trust-item strong { display: block; font-weight: 600; color: var(--text); margin-bottom: 4px; }
.landing-footer { padding: 16px 0; border-top: 1px solid var(--border); display: flex; justify-content: space-between; align-items: center; }
.landing-footer-left { font-size: 0.9rem; color: var(--text-muted); display: flex; gap: 16px; align-items: center; }
.landing-footer-left a { color: var(--text-muted); text-decoration: none; }
.landing-footer-left a:hover { color: var(--accent); }
.landing-footer-right { font-size: 1rem; }
.landing-footer-right .inou { font-weight: 700; color: var(--accent); }
.landing-footer-right .health { font-weight: 400; color: var(--text-muted); }
@media (max-width: 768px) { .trust-card { padding: 24px; } .trust-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; } }
@media (max-width: 480px) { .trust-card { padding: 20px 16px; } .trust-grid { grid-template-columns: 1fr; gap: 20px; } .landing-footer { flex-direction: column; gap: 12px; text-align: center; } .landing-footer-left { flex-direction: column; gap: 8px; } }
</style>
<div class="sg-container">
<div class="landing-card">
<div class="hero">
<div class="hero-answer"><span class="inou">inou</span> organizza e condivide il tuo dossier sanitario con la tua IA — in modo sicuro e privato.</div>
<div class="hero-tagline">La tua salute, compresa.</div>
<div class="hero-cta">{{if .Dossier}}<a href="/invite" class="btn btn-primary">Invita un amico</a>{{else}}<a href="/start" class="btn btn-primary">Accedi</a>{{end}}{{if .Error}}<div class="error" style="margin-top: 24px;">{{.Error}}</div>{{end}}</div>
</div>
</div>
<div class="landing-card">
<div class="story">
<h2 class="story-title">Hai bisogno dell'IA per la tua salute</h2>
<div class="story-prose warm">
<p>I tuoi dati sanitari sono sparsi in decine di posti — dal cardiologo, dal neurologo, nel laboratorio, nel tuo smartwatch, nelle tue app, nel tuo 23andMe. E solo tu conosci il resto: cosa mangi, cosa bevi, quali integratori prendi. La tua routine di allenamento. I tuoi sintomi. I tuoi obiettivi — che tu stia cercando di rimanere incinta, allenarti per una maratona, o semplicemente sentirti meno stanco.</p>
<p>Che tu sia in salute e voglia restarlo, stia affrontando una diagnosi difficile, o ti stia prendendo cura di un familiare che non può difendersi da solo — nessun medico vede il quadro completo. Nessun sistema connette tutto.</p>
<p>Ma tu hai accesso a tutto. Ti manca solo l'esperienza per capire tutto.</p>
<p class="emphasis">La tua IA ce l'ha. inou le dà il quadro completo.</p>
</div>
</div>
</div>
<div class="landing-card">
<div class="story">
<h2 class="story-title">La sfida</h2>
<div class="story-pair"><div class="data">La tua risonanza ha 4.000 sezioni.</div><div class="reality">È stata letta in 10 minuti.</div></div>
<div class="story-pair"><div class="data">Il tuo genoma ha milioni di varianti.</div><div class="reality">Hai scoperto solo il colore dei tuoi occhi e da dove vengono i tuoi antenati.</div></div>
<div class="story-pair"><div class="data">Le tue analisi del sangue hanno decine di marcatori.</div><div class="reality">Il tuo medico ha detto "tutto bene."</div></div>
<div class="story-pair"><div class="data">Il tuo orologio ha registrato 10.000 ore di sonno.</div><div class="reality">Il tuo trainer non sa che esiste.</div></div>
<div class="story-pair"><div class="data">Hai provato cento integratori diversi.</div><div class="reality">Nessuno ha chiesto quali.</div></div>
<div class="story-transition">Le connessioni ci sono.<br>Sono troppo complesse per una sola persona.</div>
<div class="story-gaps">
<span>Nessuno sa come il tuo corpo metabolizza il Warfarin — nemmeno tu.</span>
<span class="indent">Ma la risposta potrebbe essere nascosta nel tuo 23andMe.</span>
<span>Quel "nella norma" nella tua risonanza — qualcuno ha davvero guardato tutte le 4.000 sezioni con attenzione?</span>
<span>La tua tiroide è "nei range" — ma nessuno l'ha collegata alla tua stanchezza, al tuo peso, al fatto che hai sempre freddo.</span>
</div>
<div class="story-connections">
<span>Nessuno collega il tuo caffè pomeridiano alla qualità del tuo sonno.</span>
<span>I tuoi livelli di ferro alla tua stanchezza in allenamento.</span>
<span>La tua genetica alla tua nebbia mentale.</span>
</div>
<div class="story-ai">
<span>La tua IA non dimentica.</span>
<span>Non ha fretta.</span>
<span>Trova quello che è stato trascurato.</span>
<span class="last">Non si specializza — ti vede nella tua interezza.</span>
</div>
<div class="story-closing"><span class="inou">inou</span> permette alla tua IA di considerare tutto — ogni sezione, ogni marcatore, ogni variante — connette tutto e finalmente ti dà risposte che nessun altro poteva dare.</div>
</div>
</div>
<div class="landing-card">
<div class="story">
<h2 class="story-title">Perché abbiamo costruito questo</h2>
<p class="story-prose">Hai raccolto anni di dati sanitari. Esami dall'ospedale. Analisi dal laboratorio. Risultati dal portale del medico. Dati dal tuo orologio. Forse anche il tuo DNA.</p>
<p class="story-prose">E poi c'è tutto quello che solo tu sai — il tuo peso, la tua pressione, la tua routine di allenamento, gli integratori che prendi, i sintomi che dimentichi sempre di menzionare.</p>
<p class="story-prose">È tutto lì — ma sparso in sistemi che non comunicano, con specialisti che vedono solo la loro parte, o chiuso nella tua testa.</p>
<p class="story-prose">Il tuo cardiologo non sa cosa ha trovato il tuo neurologo. Il tuo trainer non ha visto le tue analisi del sangue. Il tuo medico non ha idea di quali integratori prendi. E nessuno di loro ha tempo di sedersi con te e collegare i punti.</p>
<p class="story-prose"><strong>L'IA finalmente può.</strong> Può unire quello che nessun esperto da solo vede — e spiegartelo anche.</p>
<p class="story-prose">Ma questi dati non entrano in una finestra di chat. E l'ultima cosa che vuoi è la tua storia clinica sui server di qualcun altro, ad addestrare i loro modelli.</p>
<p class="story-prose"><span class="inou">inou</span> unisce tutto — laboratorio, imaging, genetica, parametri vitali, farmaci, integratori — crittografato, privato, e non condiviso con assolutamente nessuno. La tua IA si connette in sicurezza. I tuoi dati restano tuoi.</p>
<div class="story-closing">La tua salute, compresa.</div>
</div>
</div>
<div class="trust-card">
<div class="section-label">{{.T.data_yours}}</div>
<div class="trust-grid">
<div class="trust-item"><strong>{{.T.never_training}}</strong>{{.T.never_training_desc}}</div>
<div class="trust-item"><strong>{{.T.never_shared}}</strong>{{.T.never_shared_desc}}</div>
<div class="trust-item"><strong>{{.T.encrypted}}</strong>{{.T.encrypted_desc}}</div>
<div class="trust-item"><strong>{{.T.delete}}</strong>{{.T.delete_desc}}</div>
</div>
</div>
<footer class="landing-footer">
<div class="landing-footer-left"><span>© 2025</span><a href="/privacy-policy">Privacy</a></div>
<span class="landing-footer-right"><span class="inou">inou</span> <span class="health">health</span></span>
</footer>
</div>
{{end}}