batida/batida-landing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: remove misleading claims, broken links and translate to PT-BR
All checks were successful
Deploy / Build & Push (Prod) (push) Successful in 8s
Details
Deploy / Deploy Staging (push) Successful in 4s
Details
Deploy / Deploy Prod (push) Successful in 4s
Details

Browse Source 
- Remove "Open Source Core" claims (no public repo exists)
- Replace Unsplash stock image with CSS mockup dashboard
- Fix CTA buttons to link to signup ({{APP_URL}}/signup)
- Remove dead links: demo buttons, footer sections (Resources, Company, Legal), social links without URLs, newsletter form, docs link
- Translate all English terms to PT-BR (~40+ translations)
- Fix Portuguese accentuation (Começar, incluído, usuário, etc.)
This commit is contained in:
Mário Idival
2026-04-17 15:48:02 -03:00
parent eb44d1c1ef
commit 361a6721c0
1 changed files with 130 additions and 170 deletions
Download Patch File Download Diff File Expand all files Collapse all files

300
index.html
View File

@@ -549,9 +549,9 @@
<a href="{{APP_URL}}/login" class="hidden sm:inline-flex text-sm hover:text-white transition-colors" style="color: var(--text-secondary);">Login</a>
<button class="hidden sm:inline-flex px-4 py-2 rounded-lg text-sm font-semibold text-white btn-ember">
<a href="{{APP_URL}}/signup" class="hidden sm:inline-flex px-4 py-2 rounded-lg text-sm font-semibold text-white btn-ember">
Começar Grátis
</button>
</a>
<!-- Mobile Hamburger -->
<button class="hamburger md:hidden" onclick="toggleMobileMenu()" aria-label="Menu">
@@ -590,7 +590,7 @@
<div class="mt-8 pt-8 border-t space-y-3" style="border-color: var(--border-color);">
<a href="{{APP_URL}}/login" class="block w-full px-4 py-3 text-center rounded-lg font-medium btn-ghost" style="color: var(--text-primary);">Login</a>
<button class="w-full px-4 py-3 rounded-lg font-semibold text-white btn-ember">Começar Grátis</button>
<a href="{{APP_URL}}/signup" class="w-full px-4 py-3 rounded-lg font-semibold text-white btn-ember block text-center">Começar Grátis</a>
</div>
<div class="swipe-hint mt-6 justify-center">
@@ -639,36 +639,29 @@
<!-- CTAs -->
<div class="flex flex-col sm:flex-row gap-4 mb-10">
<button class="btn-ember px-8 py-4 rounded-xl text-base font-bold text-white inline-flex items-center justify-center gap-2 group">
<a href="{{APP_URL}}/signup" class="btn-ember px-8 py-4 rounded-xl text-base font-bold text-white inline-flex items-center justify-center gap-2 group">
<span>Começar Grátis</span>
<svg class="w-5 h-5 group-hover:translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7l5 5m0 0l-5 5m5-5H6"/>
</svg>
</button>
<button class="btn-ghost px-8 py-4 rounded-xl text-base font-semibold inline-flex items-center justify-center gap-2">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"/>
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
</svg>
<span>Ver Demo (2min)</span>
</button>
</a>
</div>
<!-- Social Proof Mini -->
<div class="space-y-3">
<p class="text-xs uppercase tracking-wider font-semibold" style="color: var(--text-muted);">Built by SREs, for SREs</p>
<p class="text-xs uppercase tracking-wider font-semibold" style="color: var(--text-muted);">Construído por SREs, para SREs</p>
<div class="flex flex-wrap items-center gap-4">
<span class="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full card-surface text-xs font-medium" style="color: var(--text-secondary);">
<svg class="w-3.5 h-3.5 text-ember-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
Open Source Core
Feito no Brasil
</span>
<span class="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full card-surface text-xs font-medium" style="color: var(--text-secondary);">
<svg class="w-3.5 h-3.5 text-frost-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
Early Access
Acesso Antecipado
</span>
<span class="inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full card-surface text-xs font-medium" style="color: var(--text-secondary);">
<svg class="w-3.5 h-3.5 text-ember-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
Free to Start
Grátis para Começar
</span>
</div>
</div>
@@ -815,7 +808,7 @@
Sua equipe recebe centenas de alertas por dia. <strong style="color: var(--text-primary);">Noise demais, signal de menos.</strong> Ninguém sabe o que é crítico até ser tarde demais.
</p>
<div class="pt-4 border-t text-xs font-mono uppercase tracking-wider" style="border-color: var(--border-color); color: var(--text-muted);">
Result: Alert Fatigue → Missed Incidents
Resultado: Fadiga de alertas → Incidentes perdidos
</div>
</div>
@@ -827,7 +820,7 @@
Quando um incidente acontece, vira bagunça geral. <strong style="color: var(--text-primary);">Quem está on-call? Quem já foi escalonado?</strong> Informações perdidas em threads infinitas.
</p>
<div class="pt-4 border-t text-xs font-mono uppercase tracking-wider" style="border-color: var(--border-color); color: var(--text-muted);">
Result: Slow Response → Longer Outages
Resultado: Resposta lenta → Interrupções mais longas
</div>
</div>
@@ -839,7 +832,7 @@
Depois do incêndio apagado, ninguém tem tempo para documentar. <strong style="color: var(--text-primary);">Mesmos erros acontecem de novo.</strong> Zero aprendizado estruturado.
</p>
<div class="pt-4 border-t text-xs font-mono uppercase tracking-wider" style="border-color: var(--border-color); color: var(--text-muted);">
Result: Repeated Failures → No Improvement
Resultado: Falhas repetidas → Sem melhoria
</div>
</div>
</div>
@@ -866,7 +859,7 @@
<div>
<div class="inline-flex items-center gap-2 px-3 py-1.5 rounded-full bg-frost-500/10 border border-frost-500/20 mb-6">
<span class="w-1.5 h-1.5 rounded-full bg-frost-400"></span>
<span class="text-xs font-semibold text-frost-400 uppercase tracking-wider">All-in-One Platform</span>
<span class="text-xs font-semibold text-frost-400 uppercase tracking-wider">Plataforma Tudo-em-Um</span>
</div>
<h2 class="responsive-subheading text-display mb-6 leading-tight">
@@ -876,7 +869,7 @@
<p class="text-lg mb-8 leading-relaxed" style="color: var(--text-secondary);">
Uma plataforma completa para detectar, responder, coordenar e aprender com incidentes.
<strong style="color: var(--text-primary);">Sem complexidade. Sem preço de enterprise.</strong>
<strong style="color: var(--text-primary);">Sem complexidade. Sem preço de grande corporação.</strong>
</p>
<div class="space-y-4">
@@ -927,10 +920,49 @@
</div>
</div>
<!-- Right: Image -->
<!-- Right: Dashboard Mockup -->
<div class="relative order-first lg:order-last">
<div class="absolute inset-0 bg-gradient-to-br from-ember-500/20 via-transparent to-frost-500/20 rounded-3xl blur-3xl opacity-40"></div>
<img src="https://images.unsplash.com/photo-1551288049-bebda4e38f71?w=800&auto=format&fit=crop&q=80" alt="Analytics Dashboard" class="relative rounded-2xl border shadow-2xl w-full object-cover aspect-[4/3]" style="border-color: var(--border-color);">
<div class="relative card-surface rounded-2xl overflow-hidden shadow-2xl" style="border-color: var(--border-color);">
<div class="px-4 py-3 flex items-center gap-3 border-b" style="background: var(--bg-raised); border-color: var(--border-color);">
<div class="flex gap-2">
<div class="w-3 h-3 rounded-full bg-red-500/80"></div>
<div class="w-3 h-3 rounded-full bg-yellow-500/80"></div>
<div class="w-3 h-3 rounded-full bg-green-500/80"></div>
</div>
<div class="flex-1 flex justify-center">
<div class="px-4 py-1 rounded-md text-xs font-mono" style="background: var(--bg-primary); color: var(--text-muted);">
app.batida.io/analytics
</div>
</div>
</div>
<div class="p-4 sm:p-6 space-y-4">
<div class="grid grid-cols-2 gap-3">
<div class="card-surface rounded-lg p-3">
<div class="text-xs uppercase tracking-wider font-semibold mb-1" style="color: var(--text-muted);">MTTA</div>
<div class="text-2xl font-bold text-frost-400">2<span class="text-base">min</span></div>
<div class="text-xs text-emerald-400">↓ 60%</div>
</div>
<div class="card-surface rounded-lg p-3">
<div class="text-xs uppercase tracking-wider font-semibold mb-1" style="color: var(--text-muted);">MTTR</div>
<div class="text-2xl font-bold text-ember-400">23<span class="text-base">min</span></div>
<div class="text-xs text-emerald-400">↓ 40%</div>
</div>
</div>
<div class="card-surface rounded-lg p-3">
<div class="text-xs uppercase tracking-wider font-semibold mb-2" style="color: var(--text-muted);">Incidentes esta semana</div>
<div class="flex gap-1 items-end h-12">
<div class="flex-1 bg-ember-500/60 rounded-sm" style="height: 40%;"></div>
<div class="flex-1 bg-ember-500/60 rounded-sm" style="height: 70%;"></div>
<div class="flex-1 bg-ember-500/60 rounded-sm" style="height: 30%;"></div>
<div class="flex-1 bg-ember-500/60 rounded-sm" style="height: 55%;"></div>
<div class="flex-1 bg-ember-500/60 rounded-sm" style="height: 90%;"></div>
<div class="flex-1 bg-frost-500/60 rounded-sm" style="height: 45%;"></div>
<div class="flex-1 bg-frost-500/60 rounded-sm" style="height: 25%;"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@@ -978,7 +1010,7 @@
<ul class="space-y-2.5 text-sm" style="color: var(--text-secondary);">
<li class="flex items-start gap-2"><span class="text-frost-400 mt-1">→</span> +200 fontes conectáveis</li>
<li class="flex items-start gap-2"><span class="text-frost-400 mt-1">→</span> Redução automática de noise via ML</li>
<li class="flex items-start gap-2"><span class="text-frost-400 mt-1">→</span> Deduplication & suppression</li>
<li class="flex items-start gap-2"><span class="text-frost-400 mt-1">→</span> Deduplicação e supressão</li>
<li class="flex items-start gap-2"><span class="text-frost-400 mt-1">→</span> Políticas customizáveis</li>
</ul>
</div>
@@ -992,7 +1024,7 @@
<h3 class="text-xl font-bold mb-4" style="color: var(--text-primary);">Resposta Orquestrada</h3>
<ul class="space-y-2.5 text-sm" style="color: var(--text-secondary);">
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> Canais automáticos Slack/Teams</li>
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> War rooms virtuais colaborativos</li>
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> Salas de crise virtuais colaborativas</li>
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> Runbooks & checklists</li>
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> Status pages públicas/privadas</li>
</ul>
@@ -1006,7 +1038,7 @@
</div>
<h3 class="text-xl font-bold mb-4" style="color: var(--text-primary);">Pós-Incidente & Aprendizado</h3>
<ul class="space-y-2.5 text-sm" style="color: var(--text-secondary);">
<li class="flex items-start gap-2"><span class="text-frost-400 mt-1">→</span> Templates blameless postmortems</li>
<li class="flex items-start gap-2"><span class="text-frost-400 mt-1">→</span> Templates de postmortems sem culpados</li>
<li class="flex items-start gap-2"><span class="text-frost-400 mt-1">→</span> Análise automática MTTA/MTTR</li>
<li class="flex items-start gap-2"><span class="text-frost-400 mt-1">→</span> Action items rastreáveis</li>
<li class="flex items-start gap-2"><span class="text-frost-400 mt-1">→</span> Base de conhecimento evolutiva</li>
@@ -1023,22 +1055,11 @@
<ul class="space-y-2.5 text-sm" style="color: var(--text-secondary);">
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> Dashboards tempo real</li>
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> Relatórios customizáveis</li>
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> Trend analysis & predição</li>
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> Exportação para BI tools</li>
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> Análise de tendências e predição</li>
<li class="flex items-start gap-2"><span class="text-ember-400 mt-1">→</span> Exportação para ferramentas de BI</li>
</ul>
</div>
<!-- CTA Card -->
<div class="card-surface rounded-2xl p-6 sm:p-8 bg-gradient-to-br from-ember-500/5 to-transparent border-ember-500/20 flex flex-col justify-center">
<div class="text-4xl mb-4">🎯</div>
<h3 class="text-xl font-bold mb-3 text-ember-400">Quer ver tudo em ação?</h3>
<p class="text-sm mb-6" style="color: var(--text-secondary);">
Agende uma demo personalizada de 15 minutos.
</p>
<button class="btn-ember px-6 py-3 rounded-xl text-sm font-bold text-white w-fit">
Agendar Demo →
</button>
</div>
</div>
</div>
</section>
@@ -1074,7 +1095,7 @@
<p class="leading-relaxed mb-4" style="color: var(--text-secondary);">
Integre Datadog, Prometheus, CloudWatch, ou qualquer ferramenta via webhook/API.
</p>
<div class="inline-block px-3 py-1 rounded-full card-surface text-xs font-mono" style="color: var(--text-muted);">~5 min setup</div>
<div class="inline-block px-3 py-1 rounded-full card-surface text-xs font-mono" style="color: var(--text-muted);">~5 min de setup</div>
</div>
<div class="text-center relative">
@@ -1100,19 +1121,19 @@
<p class="leading-relaxed mb-4" style="color: var(--text-secondary);">
Receba alerts inteligentes, coordene equipe, resolva mais rápido, construa knowledge base.
</p>
<div class="inline-block px-3 py-1 rounded-full card-surface text-xs font-mono" style="color: var(--text-muted);">Contínuo improvement</div>
<div class="inline-block px-3 py-1 rounded-full card-surface text-xs font-mono" style="color: var(--text-muted);">Melhoria contínua</div>
</div>
</div>
<!-- CTA -->
<div class="text-center mt-12 lg:mt-16">
<button class="btn-ember px-10 py-4 rounded-xl text-lg font-bold text-white inline-flex items-center gap-2 group">
<a href="{{APP_URL}}/signup" class="btn-ember px-10 py-4 rounded-xl text-lg font-bold text-white inline-flex items-center gap-2 group">
<span>Começar Gratuitamente</span>
<svg class="w-5 h-5 group-hover:translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7l5 5m0 0l-5 5m5-5H6"/>
</svg>
</button>
<p class="text-sm mt-4" style="color: var(--text-muted);">Setup &lt; 15 min • Sem cartão • Suporte PT-BR</p>
</a>
<p class="text-sm mt-4" style="color: var(--text-muted);">Setup em &lt; 15 min • Sem cartão • Suporte PT-BR</p>
</div>
</div>
</section>
@@ -1170,15 +1191,7 @@
<span class="text-sm font-bold text-ember-400">+190 mais</span>
</div>
</div>
<div class="text-center">
<a href="#" class="inline-flex items-center gap-2 text-ember-500 font-semibold hover:text-ember-400 transition-colors group">
Ver documentação de integrações
<svg class="w-4 h-4 group-hover:translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
</svg>
</a>
</div>
</div>
</section>
@@ -1194,14 +1207,14 @@
<span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-ember-400 opacity-75"></span>
<span class="relative inline-flex rounded-full h-2 w-2 bg-ember-500"></span>
</span>
<span class="text-sm font-medium" style="color: var(--text-secondary);">Early Access Aberto</span>
<span class="text-sm font-medium" style="color: var(--text-secondary);">Acesso Antecipado Aberto</span>
</div>
<h2 class="responsive-subheading text-display mb-4">
Construido por SREs,<br>
<span class="gradient-text-ember">para SREs</span>
</h2>
<p class="text-lg max-w-2xl mx-auto" style="color: var(--text-secondary);">
Nascemos da frustracao real com ferramentas caras e complexas. O Batida e open source no core, com recursos enterprise sem preco de enterprise.
Nascemos da frustração real com ferramentas caras e complexas. O Batida oferece recursos avançados sem preço de grande corporação.
</p>
</div>
@@ -1209,27 +1222,27 @@
<div class="grid grid-cols-2 md:grid-cols-4 gap-4 lg:gap-6 mb-12">
<div class="text-center card-surface rounded-2xl p-6">
<div class="text-3xl sm:text-4xl lg:text-5xl font-bold gradient-text-ember mb-2">200+</div>
<div class="text-sm" style="color: var(--text-secondary);">Integracoes disponiveis</div>
<div class="text-sm" style="color: var(--text-secondary);">Integrações disponíveis</div>
</div>
<div class="text-center card-surface rounded-2xl p-6">
<div class="text-3xl sm:text-4xl lg:text-5xl font-bold gradient-text-frost mb-2">&lt;15min</div>
<div class="text-sm" style="color: var(--text-secondary);">Setup time</div>
<div class="text-sm" style="color: var(--text-secondary);">Tempo de setup</div>
</div>
<div class="text-center card-surface rounded-2xl p-6">
<div class="text-3xl sm:text-4xl lg:text-5xl font-bold gradient-text-ember mb-2">100%</div>
<div class="text-sm" style="color: var(--text-secondary);">Open source core</div>
<div class="text-3xl sm:text-4xl lg:text-5xl font-bold gradient-text-ember mb-2">🇧🇷</div>
<div class="text-sm" style="color: var(--text-secondary);">Feito no Brasil</div>
</div>
<div class="text-center card-surface rounded-2xl p-6">
<div class="text-3xl sm:text-4xl lg:text-5xl font-bold gradient-text-frost mb-2">$0</div>
<div class="text-sm" style="color: var(--text-secondary);">Para comecar</div>
<div class="text-sm" style="color: var(--text-secondary);">Para começar</div>
</div>
</div>
<div class="card-surface rounded-2xl p-6 sm:p-8 border-ember-500/20">
<p class="text-lg" style="color: var(--text-secondary);">
<strong style="color: var(--text-primary);">Filosofia:</strong> Incident management nao deveria custar o salario de um engenheiro.
On-call, alerting, AI Scribe e status pages &mdash; tudo incluido por
<span class="text-ember-400 font-semibold">$12/user/mes</span>.
<strong style="color: var(--text-primary);">Filosofia:</strong> Gerenciamento de incidentes não deveria custar o salário de um engenheiro.
On-call, alertas, IA Scribe e status pages &mdash; tudo incluído por
<span class="text-ember-400 font-semibold">$12/user/mês</span>.
</p>
</div>
</div>
@@ -1251,7 +1264,7 @@
<table class="w-full min-w-[700px]">
<thead>
<tr class="border-b" style="border-color: var(--border-color);">
<th class="px-6 py-4 text-left text-sm font-semibold uppercase tracking-wider" style="color: var(--text-muted);">Feature</th>
<th class="px-6 py-4 text-left text-sm font-semibold uppercase tracking-wider" style="color: var(--text-muted);">Recurso</th>
<th class="px-6 py-4 text-left text-sm font-semibold uppercase tracking-wider text-ember-400">Batida ✨</th>
<th class="px-6 py-4 text-left text-sm font-semibold uppercase tracking-wider" style="color: var(--text-muted);">PagerDuty</th>
<th class="px-6 py-4 text-left text-sm font-semibold uppercase tracking-wider" style="color: var(--text-muted);">incident.io</th>
@@ -1267,7 +1280,7 @@
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">$20/user</td>
</tr>
<tr class="transition-colors hover:bg-ember-500/5">
<td class="px-6 py-4 font-medium text-sm" style="color: var(--text-primary);">Setup Time</td>
<td class="px-6 py-4 font-medium text-sm" style="color: var(--text-primary);">Tempo de Setup</td>
<td class="px-6 py-4 text-sm font-semibold text-frost-400">&lt; 15 min ⚡</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Dias/Semanas</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Horas</td>
@@ -1282,31 +1295,31 @@
</tr>
<tr class="transition-colors hover:bg-ember-500/5">
<td class="px-6 py-4 font-medium text-sm" style="color: var(--text-primary);">On-call</td>
<td class="px-6 py-4 text-sm font-semibold text-ember-400">Incluido</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Incluido</td>
<td class="px-6 py-4 text-sm font-semibold text-ember-400">Incluído</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Incluído</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">+ $10/user</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Incluido</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Incluído</td>
</tr>
<tr class="transition-colors hover:bg-ember-500/5">
<td class="px-6 py-4 font-medium text-sm" style="color: var(--text-primary);">AI Scribe</td>
<td class="px-6 py-4 text-sm font-semibold text-ember-400">Incluido</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Nao disponivel</td>
<td class="px-6 py-4 font-medium text-sm" style="color: var(--text-primary);">IA Scribe</td>
<td class="px-6 py-4 text-sm font-semibold text-ember-400">Incluído</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Não disponível</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Pro only ($25)</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Nao disponivel</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Não disponível</td>
</tr>
<tr class="transition-colors hover:bg-ember-500/5">
<td class="px-6 py-4 font-medium text-sm" style="color: var(--text-primary);">Call Routing</td>
<td class="px-6 py-4 text-sm font-semibold text-ember-400">1 numero incluido</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Incluido</td>
<td class="px-6 py-4 font-medium text-sm" style="color: var(--text-primary);">Roteamento de Chamadas</td>
<td class="px-6 py-4 text-sm font-semibold text-ember-400">1 número incluído</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Incluído</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Pro only</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Nao disponivel</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Não disponível</td>
</tr>
<tr class="transition-colors hover:bg-ember-500/5">
<td class="px-6 py-4 font-medium text-sm" style="color: var(--text-primary);">Status Pages</td>
<td class="px-6 py-4 text-sm font-semibold text-ember-400">5 incluidas</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Nao disponivel</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">1 incluida</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Nao disponivel</td>
<td class="px-6 py-4 text-sm font-semibold text-ember-400">5 incluídas</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Não disponível</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">1 incluída</td>
<td class="px-6 py-4 text-sm" style="color: var(--text-secondary);">Não disponível</td>
</tr>
</tbody>
</table>
@@ -1314,8 +1327,8 @@
<div class="mt-8 text-center card-surface rounded-2xl p-6 sm:p-8 border-ember-500/20">
<p class="text-lg" style="color: var(--text-secondary);">
<strong style="color: var(--text-primary);">Nossa Promessa:</strong> On-call, AI Scribe, call routing e status pages &mdash; tudo incluido por
<span class="text-ember-400 font-semibold">$12/user/mes</span>. Sem surpresas.
<strong style="color: var(--text-primary);">Nossa Promessa:</strong> On-call, IA Scribe, roteamento de chamadas e status pages &mdash; tudo incluído por
<span class="text-ember-400 font-semibold">$12/user/mês</span>. Sem surpresas.
</p>
</div>
</div>
@@ -1345,13 +1358,13 @@
<div class="flex items-baseline gap-1">
<span class="text-4xl sm:text-5xl font-bold" style="color: var(--text-primary);">$0</span>
</div>
<div class="text-sm mt-1" style="color: var(--text-muted);">Free tier permanente</div>
<div class="text-sm mt-1" style="color: var(--text-muted);">Plano gratuito permanente</div>
</div>
<ul class="space-y-3 mb-8 text-sm" style="color: var(--text-secondary);">
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
Até <strong style="color: var(--text-primary);">5 usuarios</strong>
Até <strong style="color: var(--text-primary);">5 usuários</strong>
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
@@ -1367,7 +1380,7 @@
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
AI Scribe (5/mes)
IA Scribe (5/mês)
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
@@ -1375,11 +1388,11 @@
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
Community support
Suporte comunitário
</li>
</ul>
<a href="{{APP_URL}}/signup" class="block w-full btn-ghost px-6 py-3 rounded-xl text-sm font-semibold text-center">Comecar Gratis</a>
<a href="{{APP_URL}}/signup" class="block w-full btn-ghost px-6 py-3 rounded-xl text-sm font-semibold text-center">Começar Grátis</a>
</div>
<!-- Pro (Featured) -->
@@ -1392,15 +1405,15 @@
<div class="text-xs font-bold uppercase tracking-widest mb-2 text-ember-400">PRO</div>
<div class="flex items-baseline gap-1">
<span class="text-4xl sm:text-5xl font-bold" style="color: var(--text-primary);">$12</span>
<span class="text-lg" style="color: var(--text-muted);">/user/mes</span>
<span class="text-lg" style="color: var(--text-muted);">/user/mês</span>
</div>
<div class="text-sm mt-1" style="color: var(--text-muted);">cobrado anualmente ($15/mes mensal)</div>
<div class="text-sm mt-1" style="color: var(--text-muted);">cobrado anualmente ($15/mês mensal)</div>
</div>
<ul class="space-y-3 mb-8 text-sm" style="color: var(--text-secondary);">
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
<strong style="color: var(--text-primary);">Usuarios ilimitados</strong>
<strong style="color: var(--text-primary);">Usuários ilimitados</strong>
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
@@ -1408,11 +1421,11 @@
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
<strong style="color: var(--text-primary);">Call routing</strong> (1 numero/tenant)
<strong style="color: var(--text-primary);">Roteamento de chamadas</strong> (1 número/tenant)
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
<strong style="color: var(--text-primary);">AI Scribe ilimitado</strong> + postmortems com IA
<strong style="color: var(--text-primary);">IA Scribe ilimitado</strong> + postmortems com IA
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
@@ -1420,7 +1433,7 @@
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
Todas integracoes (+200)
Todas as integrações (+200)
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
@@ -1432,7 +1445,7 @@
</li>
</ul>
<a href="{{APP_URL}}/signup?plan=pro" class="block w-full btn-ember px-6 py-3 rounded-xl text-sm font-bold text-white text-center">Comecar com Pro</a>
<a href="{{APP_URL}}/signup?plan=pro" class="block w-full btn-ember px-6 py-3 rounded-xl text-sm font-bold text-white text-center">Começar com Pro</a>
</div>
<!-- Enterprise -->
@@ -1456,7 +1469,7 @@
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
Custom RBAC + audit logs
RBAC personalizado + logs de auditoria
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
@@ -1464,11 +1477,11 @@
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
Dedicated success manager
Gerente de sucesso dedicado
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
Custom data residency
Residência de dados personalizada
</li>
<li class="flex items-start gap-2">
<svg class="w-5 h-5 text-ember-400 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
@@ -1476,12 +1489,12 @@
</li>
</ul>
<button class="w-full btn-ghost px-6 py-3 rounded-xl text-sm font-semibold">Contact Sales</button>
<a href="mailto:contato@batida.io" class="block w-full btn-ghost px-6 py-3 rounded-xl text-sm font-semibold text-center">Falar com Vendas</a>
</div>
</div>
<p class="text-center text-sm mt-8" style="color: var(--text-muted);">
Free tier permanente. Sem cartao de credito. Upgrade quando quiser.
Plano gratuito permanente. Sem cartão de crédito. Upgrade quando quiser.
</p>
</div>
</section>
@@ -1543,7 +1556,7 @@
</svg>
</summary>
<div class="px-6 pb-5 leading-relaxed" style="color: var(--text-secondary);">
Todos os planos sao cobrados em USD ($12/user/mes no plano Pro anual). Aceitamos cartao de credito via Stripe.
Todos os planos são cobrados em USD ($12/user/mês no plano Pro anual). Aceitamos cartão de crédito via Stripe.
</div>
</details>
@@ -1555,7 +1568,7 @@
</svg>
</summary>
<div class="px-6 pb-5 leading-relaxed" style="color: var(--text-secondary);">
Claro. Sem contratos anuais forçados (exceto Enterprise). Cancele com um clique. Dados disponíveis por 30 dias pós-cancelamento.
Claro. Sem contratos anuais forçados (exceto plano Corporativo). Cancele com um clique. Dados disponíveis por 30 dias pós-cancelamento.
</div>
</details>
@@ -1567,7 +1580,7 @@
</svg>
</summary>
<div class="px-6 pb-5 leading-relaxed" style="color: var(--text-secondary);">
Sim. Criptografia AES-256, backups diarios. LGPD/GDPR compliant. SOC 2 audit em andamento.
Sim. Criptografia AES-256, backups diários. LGPD/GDPR compliant. Auditoria SOC 2 em andamento.
</div>
</details>
</div>
@@ -1587,26 +1600,20 @@
</h2>
<p class="text-xl mb-10 max-w-2xl mx-auto" style="color: var(--text-secondary);">
Junte-se aos times que estao <strong style="color: var(--text-primary);">transformando sua resposta a incidentes</strong>.
Junte-se aos times que estão <strong style="color: var(--text-primary);">transformando sua resposta a incidentes</strong>.
</p>
<div class="flex flex-col sm:flex-row gap-4 justify-center mb-12">
<button class="btn-ember px-10 py-5 rounded-xl text-lg font-bold text-white inline-flex items-center justify-center gap-2 group">
<a href="{{APP_URL}}/signup" class="btn-ember px-10 py-5 rounded-xl text-lg font-bold text-white inline-flex items-center justify-center gap-2 group">
<span>Criar Conta Grátis</span>
<svg class="w-5 h-5 group-hover:translate-x-1 transition-transform" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7l5 5m0 0l-5 5m5-5H6"/>
</svg>
</button>
<button class="btn-ghost px-10 py-5 rounded-xl text-lg font-semibold inline-flex items-center justify-center gap-2">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/>
</svg>
<span>Agendar Demo</span>
</button>
</a>
</div>
<p class="text-sm mb-12" style="color: var(--text-muted);">
Setup &lt; 15 min • Sem cartão • Suporte PT-BR nativo
Setup em &lt; 15 min • Sem cartão • Suporte PT-BR nativo
</p>
<div class="pt-8 border-t inline-block w-full" style="border-color: var(--border-color);">
@@ -1616,14 +1623,6 @@
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/></svg>
contato@batida.io
</a>
<a href="#" class="hover:text-ember-500 transition-colors flex items-center gap-2">
<svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>
LinkedIn
</a>
<a href="#" class="hover:text-ember-500 transition-colors flex items-center gap-2">
<svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>
Twitter/X
</a>
</div>
</div>
</div>
@@ -1632,7 +1631,7 @@
<!-- FOOTER -->
<footer class="border-t py-12 lg:py-16" style="background: var(--bg-primary); border-color: var(--border-color);">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid grid-cols-2 md:grid-cols-5 gap-8 mb-12">
<div class="grid grid-cols-2 md:grid-cols-3 gap-8 mb-12">
<!-- Brand -->
<div class="col-span-2 md:col-span-1">
<div class="flex items-center gap-2 mb-4">
@@ -1640,17 +1639,11 @@
<span class="text-lg font-bold" style="color: var(--text-primary);">Batida</span>
</div>
<p class="text-xs leading-relaxed mb-4" style="color: var(--text-muted);">
Incident management for modern DevOps teams. Built with ❤️ in Brazil.
Plataforma brasileira de gerenciamento de incidentes. Construída com ❤️ no Brasil.
</p>
<div class="flex gap-3">
<a href="#" class="w-8 h-8 rounded-lg flex items-center justify-center transition-colors card-surface" style="color: var(--text-muted);">
<svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>
</a>
<a href="#" class="w-8 h-8 rounded-lg flex items-center justify-center transition-colors card-surface" style="color: var(--text-muted);">
<svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24"><path d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"/></svg>
</a>
<a href="#" class="w-8 h-8 rounded-lg flex items-center justify-center transition-colors card-surface" style="color: var(--text-muted);">
<svg class="w-4 h-4" fill="currentColor" viewBox="0 0 24 24"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/></svg>
<a href="mailto:contato@batida.io" class="w-8 h-8 rounded-lg flex items-center justify-center transition-colors card-surface hover:text-ember-500" style="color: var(--text-muted);">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/></svg>
</a>
</div>
</div>
@@ -1659,51 +1652,18 @@
<div>
<h4 class="text-xs font-bold uppercase tracking-wider mb-4" style="color: var(--text-muted);">Produto</h4>
<ul class="space-y-2.5 text-sm">
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Features</a></li>
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Integrações</a></li>
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Preços</a></li>
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Changelog</a></li>
<li><a href="#features" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Features</a></li>
<li><a href="#integrations" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Integrações</a></li>
<li><a href="#pricing" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Preços</a></li>
</ul>
</div>
<div>
<h4 class="text-xs font-bold uppercase tracking-wider mb-4" style="color: var(--text-muted);">Recursos</h4>
<h4 class="text-xs font-bold uppercase tracking-wider mb-4" style="color: var(--text-muted);">Contato</h4>
<ul class="space-y-2.5 text-sm">
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Documentação</a></li>
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">API Reference</a></li>
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Blog</a></li>
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Community</a></li>
<li><a href="mailto:contato@batida.io" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">contato@batida.io</a></li>
</ul>
</div>
<div>
<h4 class="text-xs font-bold uppercase tracking-wider mb-4" style="color: var(--text-muted);">Empresa</h4>
<ul class="space-y-2.5 text-sm">
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Sobre Nós</a></li>
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Carreiras</a></li>
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Contato</a></li>
</ul>
</div>
<div>
<h4 class="text-xs font-bold uppercase tracking-wider mb-4" style="color: var(--text-muted);">Legal</h4>
<ul class="space-y-2.5 text-sm">
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Termos</a></li>
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Privacidade (LGPD)</a></li>
<li><a href="#" class="hover:text-ember-500 transition-colors" style="color: var(--text-secondary);">Security (SOC 2)</a></li>
</ul>
</div>
</div>
<!-- Newsletter -->
<div class="border-t pt-8 mb-8" style="border-color: var(--border-color);">
<div class="max-w-md">
<h4 class="text-xs font-bold uppercase tracking-wider mb-3" style="color: var(--text-muted);">Newsletter</h4>
<form class="flex gap-2">
<input type="email" placeholder="seu@email.com" class="flex-1 px-4 py-2.5 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-ember-500/50 transition-all" style="background: var(--bg-raised); border: 1px solid var(--border-color); color: var(--text-primary);">
<button type="submit" class="btn-ember px-5 py-2.5 rounded-lg text-sm font-bold text-white whitespace-nowrap">Assinar</button>
</form>
</div>
</div>
<!-- Copyright -->