First Commit

This commit is contained in:
marco
2026-09-01 10:46:29 -03:00
commit bf96b77e9c
10000 changed files with 3508600 additions and 0 deletions
+460
View File
@@ -0,0 +1,460 @@
{% extends "@index/layout.twig" %}
{% block title %}{{ platformName }} - Fluxo de Caixa Pro com Inteligência Artificial{% endblock %}
{% block head %}
<style>
:root {
--primary-gradient: linear-gradient(135deg, #1e3a8a 0%, #3b82f6 100%);
--ai-gradient: linear-gradient(135deg, #8b5cf6 0%, #d946ef 100%);
--dark-bg: #0f172a;
--success-color: #22c55e;
--danger-color: #ef4444;
--info-color: #06b6d4;
}
body {
font-family: 'Inter', system-ui, -apple-system, sans-serif;
overflow-x: hidden;
background: #f8fafc !important;
}
.hero-section {
background: var(--dark-bg);
background-image:
radial-gradient(circle at 20% 30%, rgba(59, 130, 246, 0.15) 0%, transparent 40%),
radial-gradient(circle at 80% 70%, rgba(139, 92, 246, 0.15) 0%, transparent 40%);
color: white;
padding: 120px 0 80px;
position: relative;
overflow: hidden;
}
.hero-badge {
background: rgba(139, 92, 246, 0.1);
border: 1px solid rgba(139, 92, 246, 0.3);
color: #a78bfa;
padding: 8px 20px;
border-radius: 50px;
font-size: 0.9rem;
font-weight: 600;
display: inline-block;
margin-bottom: 25px;
backdrop-filter: blur(10px);
}
.hero-title {
font-size: clamp(2.5rem, 5vw, 4rem);
font-weight: 800;
line-height: 1.1;
margin-bottom: 25px;
letter-spacing: -0.02em;
}
.text-gradient {
background: var(--primary-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.text-ai-gradient {
background: var(--ai-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.hero-subtitle {
font-size: 1.25rem;
color: #94a3b8;
margin-bottom: 40px;
max-width: 600px;
line-height: 1.6;
}
.btn-glow {
position: relative;
padding: 16px 35px;
font-size: 1.1rem;
font-weight: 600;
border-radius: 12px;
transition: all 0.3s ease;
border: none;
}
.btn-success-glow {
background: linear-gradient(135deg, #25d366 0%, #128c7e 100%);
color: white;
box-shadow: 0 0 20px rgba(37, 211, 102, 0.4);
}
.btn-success-glow:hover {
transform: translateY(-2px);
box-shadow: 0 0 30px rgba(37, 211, 102, 0.6);
color: white;
}
.btn-whatsapp-cta {
background: white;
color: #128c7e !important;
padding: 18px 45px;
font-size: 1.2rem;
font-weight: 800;
border-radius: 15px;
transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
border: none;
display: inline-flex;
align-items: center;
gap: 12px;
box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2);
}
.btn-whatsapp-cta:hover {
transform: scale(1.05) translateY(-5px);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
background: #f8fafc;
}
.btn-whatsapp-cta i {
font-size: 1.5rem;
}
/* Dashboard Mockup from Imagem3 */
.mockup-wrapper {
position: relative;
z-index: 1;
margin-top: 50px;
}
.mockup-container {
background: white;
border-radius: 20px;
padding: 25px;
box-shadow: 0 40px 100px -20px rgba(0,0,0,0.5);
border: 1px solid rgba(255,255,255,0.1);
}
.mockup-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30px;
flex-wrap: wrap;
gap: 15px;
}
.mockup-title {
color: #1e293b;
font-size: 1.5rem;
font-weight: 700;
margin: 0;
}
.mockup-actions {
display: flex;
gap: 10px;
}
.mockup-btn {
padding: 8px 16px;
border-radius: 8px;
font-size: 0.85rem;
font-weight: 600;
border: 1px solid #e2e8f0;
display: flex;
align-items: center;
gap: 8px;
background: white;
color: #64748b;
}
.btn-ai-action {
background: #06b6d4;
color: white;
border: none;
}
.mockup-cards {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 20px;
margin-bottom: 30px;
}
.mockup-card {
padding: 20px;
border-radius: 12px;
border-left: 4px solid #cbd5e1;
background: #f8fafc;
}
.card-receitas { border-left-color: var(--success-color); }
.card-despesas { border-left-color: var(--danger-color); }
.card-saldo { border-left-color: var(--info-color); }
.card-pendentes { border-left-color: #eab308; }
.card-label {
font-size: 0.75rem;
text-transform: uppercase;
font-weight: 700;
color: #64748b;
margin-bottom: 5px;
}
.card-value {
font-size: 1.25rem;
font-weight: 800;
color: #1e293b;
}
.ai-floating-badge {
position: absolute;
top: -20px;
right: -20px;
background: var(--ai-gradient);
color: white;
padding: 15px 25px;
border-radius: 15px;
box-shadow: 0 15px 30px rgba(139, 92, 246, 0.4);
display: flex;
align-items: center;
gap: 12px;
z-index: 2;
animation: float 6s ease-in-out infinite;
}
@keyframes float {
0%, 100% { transform: translateY(0) rotate(0deg); }
50% { transform: translateY(-15px) rotate(2deg); }
}
.ai-pulse {
width: 10px;
height: 10px;
background: white;
border-radius: 50%;
position: relative;
}
.ai-pulse::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
background: white;
border-radius: 50%;
animation: pulse 2s infinite;
}
@keyframes pulse {
0% { transform: scale(1); opacity: 0.8; }
100% { transform: scale(3); opacity: 0; }
}
/* Features Section */
.features-section {
padding: 100px 0;
}
.feature-card {
background: white;
padding: 40px;
border-radius: 24px;
border: 1px solid #e2e8f0;
transition: all 0.3s ease;
height: 100%;
}
.feature-card:hover {
transform: translateY(-10px);
box-shadow: 0 20px 40px rgba(0,0,0,0.05);
border-color: #3b82f6;
}
.icon-box {
width: 50px;
height: 50px;
border-radius: 12px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20px;
font-size: 1.25rem;
}
.chart-placeholder {
height: 200px;
background: linear-gradient(to top, #f1f5f9 0%, transparent 100%);
border-radius: 8px;
display: flex;
align-items: flex-end;
gap: 8px;
padding: 15px;
}
.chart-bar {
flex: 1;
background: #e2e8f0;
border-radius: 4px 4px 0 0;
transition: height 1s ease;
}
.chart-bar.active { background: #3b82f6; }
</style>
{% endblock %}
{% block layout_body %}
{# Hero Section #}
<section class="hero-section">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="hero-badge">
<i class="bi bi-stars"></i> Nova Era da Gestão Financeira
</div>
<h1 class="hero-title">
Seu Fluxo de Caixa <br>
<span class="text-ai-gradient">Potencializado por IA</span>
</h1>
<p class="hero-subtitle">
O Fluxo de Caixa Pro utiliza IA para analisar a saúde financeira do seu negócio, alertando sobre misturas de contas pessoais, sugerindo reservas de emergência e prevendo o saldo futuro.
</p>
<div class="d-flex gap-3 flex-wrap">
<a href="https://wa.me/5535992261684?text=Olá! Gostaria de saber mais sobre o Fluxo de Caixa Pro." target="_blank" class="btn btn-glow btn-success-glow">
<i class="bi bi-whatsapp"></i> Falar com Especialista
</a>
</div>
</div>
<div class="col-lg-6">
<div class="mockup-wrapper">
<div class="ai-floating-badge">
<div class="ai-pulse"></div>
<div>
<div class="fw-bold" style="font-size: 0.85rem;">IA Ativa</div>
<div style="font-size: 0.75rem; opacity: 0.9;">Otimizando projeções...</div>
</div>
</div>
<div class="mockup-container">
<div class="mockup-header">
<h3 class="mockup-title">Dashboard Pro</h3>
<div class="mockup-actions">
<div class="mockup-btn"><i class="bi bi-bank"></i> Conciliação</div>
<div class="mockup-btn btn-ai-action"><i class="bi bi-cpu"></i> Análise IA</div>
</div>
</div>
<div class="mockup-cards">
<div class="mockup-card card-receitas">
<div class="card-label">Receitas</div>
<div class="card-value">R$ 45.200,00</div>
</div>
<div class="mockup-card card-despesas">
<div class="card-label">Despesas</div>
<div class="card-value">R$ 28.150,00</div>
</div>
<div class="mockup-card card-saldo">
<div class="card-label">Saldo</div>
<div class="card-value text-info">R$ 17.050,00</div>
</div>
</div>
<div class="mt-4">
<div class="d-flex justify-content-between align-items-center mb-3">
<h6 class="fw-bold m-0" style="color: #1e293b;">Projeção de Saldo (12 meses)</h6>
<span class="badge bg-success-subtle text-success">Cenário Otimista +24%</span>
</div>
<div class="chart-placeholder">
<div class="chart-bar" style="height: 30%;"></div>
<div class="chart-bar" style="height: 45%;"></div>
<div class="chart-bar" style="height: 40%;"></div>
<div class="chart-bar active" style="height: 65%;"></div>
<div class="chart-bar" style="height: 55%;"></div>
<div class="chart-bar" style="height: 80%;"></div>
<div class="chart-bar active" style="height: 95%;"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
{# Features Section #}
<section class="features-section">
<div class="container">
<div class="text-center mb-5">
<span class="text-primary fw-bold text-uppercase tracking-wider">Recursos Premium</span>
<h2 class="display-5 fw-bold mt-2" style="color: #0f172a;">Por que escolher o Pro?</h2>
</div>
<div class="row g-4">
<div class="col-md-3">
<div class="feature-card">
<div class="icon-box bg-blue-subtle text-primary">
<i class="bi bi-lightning-charge-fill"></i>
</div>
<h4 class="fw-bold mb-3">Análise Preditiva</h4>
<p class="text-muted small">Previsões baseadas em dados históricos reais para os próximos 12 meses, identificando tendências de crescimento.</p>
</div>
</div>
<div class="col-md-3">
<div class="feature-card">
<div class="icon-box bg-purple-subtle text-purple" style="color: #8b5cf6;">
<i class="bi bi-robot"></i>
</div>
<h4 class="fw-bold mb-3">IA Consultiva</h4>
<p class="text-muted small">Receba recomendações automáticas sobre reserva de emergência e separação entre contas pessoais e empresariais.</p>
</div>
</div>
<div class="col-md-3">
<div class="feature-card">
<div class="icon-box bg-info-subtle text-info">
<i class="bi bi-graph-up-arrow"></i>
</div>
<h4 class="fw-bold mb-3">Gestão de Riscos</h4>
<p class="text-muted small">Identificação imediata de déficit operacional e gaps de caixa (contas a pagar vs receber).</p>
</div>
</div>
<div class="col-md-3">
<div class="feature-card">
<div class="icon-box bg-green-subtle text-success">
<i class="bi bi-file-earmark-excel"></i>
</div>
<h4 class="fw-bold mb-3">Exportação Pro</h4>
<p class="text-muted small">Gere relatórios detalhados em Excel com um clique para contabilidade ou reuniões de diretoria.</p>
</div>
</div>
</div>
</div>
</section>
{# CTA Section #}
<section class="py-5">
<div class="container">
<div class="bg-primary rounded-5 p-5 text-center text-white" style="background: var(--primary-gradient) !important;">
<h2 class="display-6 fw-bold mb-4">Pronto para transformar sua gestão?</h2>
<p class="lead mb-4 opacity-75">Fale agora mesmo conosco e descubra como a IA pode dominar suas finanças.</p>
<a href="https://wa.me/5535992261684?text=Olá! Gostaria de uma demonstração do Fluxo de Caixa Pro." target="_blank" class="btn-whatsapp-cta">
<i class="bi bi-whatsapp"></i> Solicitar Demonstração Grátis
</a>
</div>
</div>
</section>
{% endblock %}
{% block scripts %}
<script>
// Simulação de animação das barras do gráfico
document.addEventListener('DOMContentLoaded', () => {
const bars = document.querySelectorAll('.chart-bar');
bars.forEach((bar, index) => {
const finalHeight = bar.style.height;
bar.style.height = '0';
setTimeout(() => {
bar.style.height = finalHeight;
}, index * 100);
});
});
</script>
{% endblock %}
+180
View File
@@ -0,0 +1,180 @@
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
{# SEO Meta Tags #}
<title>{{ title|default(seo.meta_title|default(platformName)) }}</title>
<meta name="description" content="{{ seo.meta_description }}">
{% if seo.meta_keywords %}
<meta name="keywords" content="{{ seo.meta_keywords }}">
{% endif %}
<link rel="canonical" href="{{ canonical_url|default(url(request_path|default(''))) }}">
{# Open Graph / Facebook #}
<meta property="og:type" content="website">
<meta property="og:url" content="{{ url(request_path|default('')) }}">
<meta property="og:title" content="{{ seo.og_title|default(title|default(platformName)) }}">
<meta property="og:description" content="{{ seo.og_description|default(seo.meta_description) }}">
{% if seo.og_image %}
<meta property="og:image" content="{{ url('storage/uploads/seo/' ~ seo.og_image) }}">
{% endif %}
{# Twitter #}
<meta name="twitter:card" content="{{ seo.twitter_card|default('summary_large_image') }}">
<meta name="twitter:url" content="{{ url(request_path|default('')) }}">
<meta name="twitter:title" content="{{ seo.og_title|default(title|default(platformName)) }}">
<meta name="twitter:description" content="{{ seo.og_description|default(seo.meta_description) }}">
{% if seo.og_image %}
<meta name="twitter:image" content="{{ url('storage/uploads/seo/' ~ seo.og_image) }}">
{% endif %}
{# Google Verification #}
{% if seo.google_site_verification %}
<meta name="google-site-verification" content="{{ seo.google_site_verification }}">
{% endif %}
{# JSON-LD Structured Data #}
{% if seo.json_ld_type and seo.json_ld_type != 'none' %}
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "{{ seo.json_ld_type }}",
"name": "{{ seo.json_ld_name }}",
"url": "{{ seo.json_ld_url }}",
"description": "{{ seo.json_ld_description }}",
{% if seo.json_ld_phone %}"telephone": "{{ seo.json_ld_phone }}",{% endif %}
{% if seo.json_ld_email %}"email": "{{ seo.json_ld_email }}",{% endif %}
{% if seo.json_ld_address %}
"address": {
"@type": "PostalAddress",
"streetAddress": "{{ seo.json_ld_address }}",
"addressLocality": "{{ seo.json_ld_city }}",
"addressRegion": "{{ seo.json_ld_state }}",
"postalCode": "{{ seo.json_ld_zip }}",
"addressCountry": "{{ seo.json_ld_country }}"
},
{% endif %}
"sameAs": [
{% set social_links = seo.json_ld_social_links|split('\n') %}
{% for link in social_links %}
"{{ link|trim }}"{{ not loop.last ? ',' : '' }}
{% endfor %}
]
}
</script>
{% endif %}
{# Google Analytics #}
{% if seo.google_analytics_id %}
<script async src="https://www.googletagmanager.com/gtag/js?id={{ seo.google_analytics_id }}"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', '{{ seo.google_analytics_id }}');
</script>
{% endif %}
{# Bootstrap CSS #}
<link rel="stylesheet" href="{{ asset_url('css/bootstrap.min.css') }}">
{# Theme Specific Assets #}
<link rel="stylesheet" href="{{ asset_url('css/landing-page.css') }}">
{# Bootstrap Icons #}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
{# Quill Editor CSS (se habilitado) #}
{# Alpine.js #}
<script src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js" defer></script>
{% block head %}{% endblock %}
{# Customizer CSS #}
<style id="theme-customizer-css">
:root {
--primary-color: {{ theme_settings.primary_color|default('#0d6efd') }};
--bg-color: {{ theme_settings.background_color|default('#f8f9fa') }};
--text-color: {{ theme_settings.text_color|default('#212529') }};
}
body {
background-color: var(--bg-color) !important;
color: var(--text-color) !important;
}
.text-primary, .btn-primary {
color: var(--primary-color) !important;
}
.bg-primary, .btn-primary {
background-color: var(--primary-color) !important;
border-color: var(--primary-color) !important;
}
{% if theme_settings.container_width == 'container-fluid' %}
.container {
max-width: 100% !important;
}
{% endif %}
</style>
</head>
<body style="background:#f8f9fa;">
{% block layout_navbar %}
{# Navbar Global #}
{% if not is_maintenance_mode or (auth.user is defined and auth.user.role == 'super_admin') %}
{% include 'partials/nav-bar.twig' %}
{% endif %}
{% endblock %}
{% block layout_body %}
{# Conteúdo da página #}
<main class="container py-4">
{% block content %}{% endblock %}
</main>
{% endblock %}
{# Footer Global #}
{% if not is_maintenance_mode or (auth.user is defined and auth.user.role == 'super_admin') %}
{% include 'partials/footer.twig' %}
{% endif %}
{# Bootstrap JS #}
<script src="{{ asset_url('js/bootstrap.bundle.js') }}"></script>
{# Quill Editor JS (se habilitado) #}
{% block scripts %}{% endblock %}
<link rel="stylesheet" type="text/css" href="/consent/cookieconsent.min.css" />
<script src="/consent/cookieconsent.min.js"></script>
<script>
window.addEventListener("load", function(){
window.cookieconsent.initialise({
"palette": {
"popup": {
"background": "#216942",
"text": "#b2d192"
},
"button": {
"background": "#afed71"
}
},
"content": {
"message": "{{ __('layout.cookie_consent.message') }}",
"dismiss": "{{ __('layout.cookie_consent.dismiss') }}",
"link": "{{ __('layout.footer.terms') }}",
"href": "/user_terms.html"
}
})});
</script>
</body>
</html>