/* VARIÁVEIS DE COR */
:root {
--bg-darkest: #01040A;
--bg-gradient-end: #004d7a;
--panel-top: rgba(22, 55, 130, 0.45);
--panel-bottom: rgba(4, 16, 66, 0.8);
--blue-highlight: #2A56C6;
--neon-cyan: #4DD0E1;
--text-main: #ffffff;
--text-muted: #8c9baf;
}/* Ajuste para Elementor: Wrapper principal */
.relatorio-wrapper {
margin: 0;
padding: 0;
overflow-x: hidden;
font-family: 'Montserrat', sans-serif;
background: linear-gradient(to top right, var(--bg-darkest) 0%, #03153b 50%, var(--bg-gradient-end) 100%);
background-attachment: fixed;
color: var(--text-main);
position: relative;
width: 100%;
min-height: 100vh;
}/* ARCO LUMINOSO ÉPICO AO FUNDO */
.epic-arc {
position: fixed;
bottom: -40vw;
left: 50%;
transform: translateX(-50%);
width: 140vw;
height: 80vw;
border-radius: 50%;
background: transparent;
box-shadow: 0 -15px 120px 40px rgba(42, 86, 198, 0.15), inset 0 20px 50px rgba(255,255,255,0.03);
border-top: 2px solid rgba(255, 255, 255, 0.3);
z-index: 0; /* Ajustado para ficar atrás do conteúdo no Elementor */
pointer-events: none;
}/* UTILITÁRIO GLASSMORPHISM */
.glass-panel {
background: linear-gradient(180deg, var(--panel-top) 0%, var(--panel-bottom) 100%);
backdrop-filter: blur(24px);
-webkit-backdrop-filter: blur(24px);
border: 1px solid rgba(255, 255, 255, 0.05);
border-top: 1px solid rgba(255, 255, 255, 0.15);
border-left: 1px solid rgba(255, 255, 255, 0.08);
border-radius: 28px;
box-shadow: 0 30px 60px rgba(0, 0, 0, 0.5), inset 0 0 20px rgba(255,255,255,0.02);
}/* HERO INSTITUCIONAL FULL WIDTH */
.hero{
position:relative;
min-height:85vh;
background-image:url('https://limaopropaganda.com.br/wp-content/uploads/2026/03/IMG_0948-scaled.jpg');
background-size:cover;
background-position:center top;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:#fff;
padding:80px 20px;
z-index: 2;
}.hero::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(180deg, rgba(1,4,10,0.5) 0%, rgba(1,4,10,0.85) 70%, transparent 100%);
}.hero-content{
position:relative;
z-index:2;
max-width:900px;
animation: fadeIn 1.2s ease-out;
}.hero img{
max-width:280px;
margin-bottom:30px;
filter: drop-shadow(0 0 20px rgba(255,255,255,0.15));
}.hero h1{
font-size:48px;
margin-bottom:15px;
font-weight:700;
background: linear-gradient(180deg, #FFFFFF 0%, #A0B0C0 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
letter-spacing: -1px;
}.hero p{
font-size:18px;
color: var(--text-muted);
letter-spacing: 1px;
text-transform: uppercase;
margin: 0;
}/* STATS ADS - INDICADORES DE ANÚNCIOS */
.stats{
position:relative;
padding:40px 20px 80px 20px;
z-index: 2;
margin-top: -60px;
}.stats-container{
position:relative;
max-width:1000px;
margin:auto;
display:flex;
flex-wrap:wrap;
gap:40px;
justify-content:center;
}.stat-box{
flex:1 1 350px;
padding:45px 30px;
text-align:center;
transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), box-shadow 0.4s;
}.stat-box:hover{
transform:translateY(-10px);
box-shadow: 0 20px 50px rgba(13, 38, 125, 0.4), inset 0 0 20px rgba(255,255,255,0.05);
border-top: 1px solid var(--neon-cyan);
}.stat-box h2{
font-size:46px;
margin:0;
color:#ffffff;
text-shadow: 0 0 25px rgba(255, 255, 255, 0.2);
}.stat-box span{
display:block;
margin-top:10px;
font-weight:600;
font-size:14px;
color: var(--neon-cyan);
text-transform: uppercase;
letter-spacing: 2px;
}/* SECTION GERAL */
.section{
padding:60px 20px;
max-width:1400px;
margin:auto;
position: relative;
z-index: 2;
}.section h2{
text-align:center;
margin-bottom:50px;
font-size:32px;
color:#ffffff;
font-weight: 700;
letter-spacing: -0.5px;
}/* TABELA DE CAMPANHAS */
.table-wrapper {
max-width: 1200px;
margin: 0 auto;
border-radius: 24px;
overflow: hidden;
padding: 1px;
}.relatorio-wrapper table{
width:100%;
border-collapse:collapse;
text-align: left;
margin: 0;
}.relatorio-wrapper th{
padding:22px;
font-weight:600;
color:var(--text-muted);
font-size: 14px;
text-transform: uppercase;
letter-spacing: 1px;
border-bottom: 1px solid rgba(255,255,255,0.05);
}.relatorio-wrapper td{
padding:20px 22px;
border-bottom:1px solid rgba(255,255,255,0.03);
color: #d1d8e0;
font-size: 15px;
}.relatorio-wrapper tbody tr {
transition: background 0.3s;
}.relatorio-wrapper tbody tr:hover{
background: rgba(255,255,255,0.06);
}.total-row td {
color:#ffffff !important;
font-weight:700;
border-bottom: none !important;
border-top: 1px solid rgba(255,255,255,0.1) !important;
background: rgba(0,0,0,0.2);
}/* --- PAINEL DE GRÁFICO ORGÂNICO --- */
.organic-panel {
max-width: 800px;
margin: 0 auto;
padding: 50px;
display: flex;
flex-direction: column;
}.organic-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 30px;
}.organic-title span {
font-size: 14px;
color: var(--text-muted);
font-weight: 500;
}.organic-title h3 {
font-size: 52px;
margin: 5px 0 0 0;
font-weight: 600;
color: #fff;
letter-spacing: -1px;
}.organic-stats {
text-align: right;
padding-top: 10px;
}.organic-stats span {
font-size: 13px;
color: var(--text-muted);
}.organic-stats .positive {
display: block;
color: #00E676;
font-weight: 600;
font-size: 16px;
margin-top: 6px;
}/* TOGGLE BUTTONS */
.toggle-wrapper {
display: flex;
justify-content: center;
margin-bottom: 40px;
}.toggle-container {
display: flex;
background: rgba(0, 0, 0, 0.25);
border-radius: 30px;
padding: 5px;
border: 1px solid rgba(255,255,255,0.03);
box-shadow: inset 0 2px 10px rgba(0,0,0,0.4);
}.toggle-btn {
background: transparent;
border: none;
color: var(--text-muted);
padding: 10px 30px;
font-size: 14px;
font-weight: 600;
font-family: 'Montserrat', sans-serif;
cursor: pointer;
border-radius: 25px;
transition: all 0.3s ease;
}.toggle-btn.active {
background: linear-gradient(180deg, #1E4B9A 0%, #0E2965 100%);
color: #fff;
box-shadow: 0 4px 10px rgba(0,0,0,0.3), inset 0 1px 1px rgba(255,255,255,0.15);
}/* AREA DO GRÁFICO */
.organic-canvas-wrapper {
position: relative;
height: 320px;
width: 100%;
}.organic-footer {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 30px;
padding-top: 20px;
}.organic-footer-info h4 {
margin: 0;
font-size: 14px;
color: var(--text-muted);
font-weight: 400;
}.organic-footer-info p {
margin: 5px 0 0 0;
font-size: 22px;
font-weight: 600;
display: flex;
align-items: center;
gap: 8px;
}.organic-footer-info p span {
color: var(--neon-cyan);
font-size: 18px;
}.info-icon {
background: rgba(255,255,255,0.05);
padding: 10px 20px;
border-radius: 20px;
color: var(--text-main);
font-size: 14px;
font-weight: 600;
display: flex;
align-items: center;
gap: 8px;
border: 1px solid rgba(255,255,255,0.05);
}/* ANÁLISE ESTRATÉGICA */
.analysis{
max-width: 1200px;
margin: 60px auto 0;
padding:50px 60px;
font-size:17px;
line-height:1.8;
}.analysis h3{
color:#ffffff;
font-size: 28px;
margin-top: 0;
margin-bottom: 30px;
border-bottom: 1px solid rgba(255,255,255,0.1);
padding-bottom: 15px;
}.analysis p{
color: #aeb9c6;
margin-bottom: 20px;
}.analysis strong{
color: var(--neon-cyan);
font-weight: 600;
}/* FOOTER */
.footer{
border-top: 1px solid rgba(255,255,255,0.05);
background: rgba(1, 4, 10, 0.5);
color:var(--text-muted);
padding:80px 20px;
text-align:center;
position: relative;
z-index: 2;
margin-top: 60px;
}.footer img{
max-width:180px;
margin-bottom:20px;
opacity: 0.5;
transition: 0.3s;
filter: grayscale(100%);
}.footer img:hover {
opacity: 1;
filter: grayscale(0%);
}.footer p{
font-size: 14px;
margin: 0;
letter-spacing: 0.5px;
}/* =========================================
RESPONSIVO (MÓBILE & TABLET)
========================================= */
@media(max-width:992px){
.analysis { padding: 40px; }
}@media(max-width:768px){
.hero { min-height: 60vh; padding: 50px 15px; }
.hero h1 { font-size: 32px; letter-spacing: 0; }
.hero p { font-size: 14px; }
.hero img { max-width: 200px; }
.stats { padding: 30px 15px 50px 15px; margin-top: -30px; }
.stats-container { gap: 20px; }
.stat-box { flex: 1 1 100%; padding: 30px 20px; }
.stat-box h2 { font-size: 36px; }
.section { padding: 40px 15px; }
.section h2 { font-size: 24px; margin-bottom: 30px; }
.table-wrapper { border-radius: 16px; padding: 0; }
.relatorio-wrapper table { display: block; overflow-x: auto; white-space: nowrap; width: 100%; }
.relatorio-wrapper th, .relatorio-wrapper td { padding: 15px; font-size: 13px; }
.organic-panel { padding: 25px 20px; border-radius: 20px; }
.organic-header { flex-direction: column; gap: 10px; margin-bottom: 25px; }
.organic-title h3 { font-size: 36px; margin-top: 0; }
.organic-stats { text-align: left; padding-top: 0; }
.toggle-wrapper { margin-bottom: 25px; }
.toggle-container { width: 100%; display: flex; }
.toggle-btn { flex: 1; padding: 10px 15px; font-size: 12px; text-align: center; }
.organic-canvas-wrapper { height: 250px; }
.organic-footer { flex-direction: column; align-items: flex-start; gap: 20px; margin-top: 20px; padding-top: 15px; }
.organic-footer-info p { font-size: 18px; }
.info-icon { width: 100%; justify-content: center; box-sizing: border-box; }
.analysis { padding: 30px 20px; margin-top: 40px; border-radius: 20px; }
.analysis h3 { font-size: 22px; margin-bottom: 20px; }
.analysis p { font-size: 15px; }
.footer { padding: 50px 15px; }
}@keyframes fadeIn {
from { opacity: 0; transform: translateY(30px); }
to { opacity: 1; transform: translateY(0); }
}
Relatório Estratégico Digital
Período: 24 de Janeiro a 03 de Março de 2026
490.344
Pessoas Alcançadas681.229
Impressões TotaisDetalhamento de Campanhas Patrocinadas
| Campanha | Alcance | Impressões | Investimento (R$) |
|---|
| Virada Científica - VG | 18.310 | 21.225 | 21,10 |
| Ambulância - Alto Araguaia | 9.697 | 15.214 | 28,04 |
| Castanheira - Patrulha Agrícola | 15.202 | 22.016 | 28,05 |
| Nortelândia - Elka | 12.077 | 18.518 | 28,38 |
| Pá Carregadeira - Paranatinga | 12.052 | 18.557 | 28,29 |
| Novo Horizonte - Ambulância | 15.592 | 23.160 | 28,41 |
| Educação - General Carneiro | 12.442 | 17.796 | 33,45 |
| De Gari a Deputado | 31.506 | 37.189 | 37,93 |
| Caminhão - Livramento | 20.945 | 30.905 | 36,26 |
| Poço - Poconé | 15.706 | 25.521 | 49,93 |
| Hospital Regional em VG | 28.276 | 42.435 | 49,94 |
| Ambulância - Peixoto | 22.089 | 35.528 | 49,99 |
| IML VG | 32.095 | 44.105 | 49,99 |
| Agricultura Familiar - Poconé | 26.413 | 40.455 | 49,93 |
| Vídeos Reels (Alcance) | 44.848 | 54.502 | 59,98 |
| Caminhada Saudável - Aulão | 27.171 | 35.252 | 49,98 |
| Visita - Juscimeira | 7.277 | 11.455 | 29,61 |
| Corte Entrevista - VG | 28.195 | 39.111 | 50,00 |
| Lideranças - Juscimeira / Dom Aquino | 14.709 | 22.050 | 49,99 |
| Visita - Juscimeira (2) | 13.321 | 19.608 | 29,81 |
| Picape - Campo Verde | 16.755 | 23.541 | 29,97 |
| Lei Órfãos | 35.027 | 45.566 | 49,99 |
| Passarela - FEB | 30.639 | 37.520 | 41,59 |
| TOTAL | 490.344 | 681.229 | 910,61 |
Desempenho Orgânico nas Redes Sociais
Análise Estratégica
1. Consolidação Regional: A forte presença em Várzea Grande e Cuiabá demonstra consolidação de base urbana estratégica.
2. Estratégia Multiplataforma: Instagram para dinamismo e aproximação. Facebook para autoridade institucional.
3. Potencial de Expansão: O interior do estado apresenta oportunidade de ampliação via segmentação estratégica de anúncios.
4. Posicionamento Digital: A combinação entre mídia paga e crescimento orgânico fortalece a construção de imagem e presença contínua.
const dataOrganic = {
facebook: {
label: "Alcance Total - Facebook",
total: "185.340",
growth: "+ 8.2 %",
audience: "Feminino, 25 a 44 anos",
labels: ["Fev 01", "Fev 08", "Fev 15", "Fev 22", "Mar 01", "Mar 08"],
data: [18000, 22500, 21000, 26000, 29500, 34500]
},
instagram: {
label: "Alcance Total - Instagram",
total: "242.890",
growth: "+ 15.7 %",
audience: "Feminino, 18 a 34 anos",
labels: ["Fev 01", "Fev 08", "Fev 15", "Fev 22", "Mar 01", "Mar 08"],
data: [25000, 28500, 31000, 34500, 42000, 45890]
}
};window.organicChartInstance = null;// Função que renderiza de fato o gráfico
function renderChart() {
const canvas = document.getElementById('organicChart');
if (!canvas) return;const ctx = canvas.getContext('2d');
// Destrói instância anterior (evita bug de sobreposição no Elementor)
if (window.organicChartInstance instanceof Chart) {
window.organicChartInstance.destroy();
}const gradient = ctx.createLinearGradient(0, 0, 0, 300);
gradient.addColorStop(0, 'rgba(42, 86, 198, 0.6)');
gradient.addColorStop(1, 'rgba(4, 16, 66, 0)');const initialData = dataOrganic.facebook;window.organicChartInstance = new Chart(ctx, {
type: 'line',
data: {
labels: initialData.labels,
datasets: [{
label: 'Alcance',
data: initialData.data,
borderColor: '#4DD0E1',
borderWidth: 3,
backgroundColor: gradient,
fill: true,
tension: 0.4,
pointBackgroundColor: '#ffffff',
pointBorderColor: '#2A56C6',
pointBorderWidth: 3,
pointRadius: 0,
pointHoverRadius: 6,
pointHoverBackgroundColor: '#ffffff',
pointHoverBorderColor: '#2A56C6',
pointHoverBorderWidth: 4,
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
layout: { padding: { top: 20, bottom: 20 } },
plugins: {
legend: { display: false },
tooltip: {
backgroundColor: '#16367f',
borderColor: 'rgba(255,255,255,0.1)',
borderWidth: 1,
titleFont: { family: 'Montserrat', size: 12, weight: 'normal' },
titleColor: '#4DD0E1',
bodyFont: { family: 'Montserrat', size: 16, weight: '600' },
bodyColor: '#ffffff',
padding: 14,
cornerRadius: 12,
displayColors: false,
caretSize: 8,
callbacks: {
label: function(context) {
return context.parsed.y.toLocaleString('pt-PT') + ' pessoas';
}
}
}
},
scales: {
y: {
beginAtZero: false,
grid: { color: 'rgba(255, 255, 255, 0.05)', drawBorder: false, borderDash: [4, 4] },
ticks: { color: '#8c9baf', font: { family: 'Montserrat', size: 11 }, maxTicksLimit: 5, padding: 10 },
border: { display: false }
},
x: {
grid: { color: 'rgba(255, 255, 255, 0.05)', drawBorder: false, borderDash: [4, 4] },
ticks: { color: '#8c9baf', font: { family: 'Montserrat', size: 11 }, padding: 10 },
border: { display: false }
}
},
interaction: { intersect: false, mode: 'index' },
animation: { duration: 800, easing: 'easeOutQuart' }
}
});
}// Função global chamada pelos botões
window.switchOrganicData = function(platform) {
document.getElementById('btn-facebook').classList.remove('active');
document.getElementById('btn-instagram').classList.remove('active');
document.getElementById('btn-' + platform).classList.add('active');const info = dataOrganic[platform];document.getElementById('organicLabel').innerText = info.label;
document.getElementById('organicTotal').innerText = info.total;
document.getElementById('organicGrowth').innerText = info.growth;
document.getElementById('organicAudience').innerText = info.audience;if(window.organicChartInstance) {
window.organicChartInstance.data.labels = info.labels;
window.organicChartInstance.data.datasets[0].data = info.data;
window.organicChartInstance.update();
}
}// ROTINA DE CARREGAMENTO SEGURO (O FIX PARA O ELEMENTOR)
function safeLoadChart() {
// Se a biblioteca Chart JS ainda não foi carregada pelo Head
if (typeof Chart === 'undefined') {
if (!document.getElementById('chartjs-script-injected')) {
let script = document.createElement('script');
script.id = 'chartjs-script-injected';
script.src = 'https://cdn.jsdelivr.net/npm/chart.js';
document.head.appendChild(script);
}
// Continua checando a cada 200ms até carregar
setTimeout(safeLoadChart, 200);
return;
}// Verifica se o Canvas HTML já existe na página
if (!document.getElementById('organicChart')) {
// Se o Elementor ainda está renderizando a tela, aguarda
setTimeout(safeLoadChart, 200);
return;
}// Se tudo está pronto, renderiza
renderChart();
}// Inicia a rotina imediatamente e como fallback quando o DOM carregar
safeLoadChart();
document.addEventListener("DOMContentLoaded", safeLoadChart);
