Status do Sistema | CRM Reinar<\/title>\n <meta name=\"description\" content=\"Acompanhe a disponibilidade e performance do CRM Reinar em tempo real.\">\n \n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700&display=swap\" rel=\"stylesheet\">\n \n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n \n :root {\n --primary: #0055FF;\n --primary-dark: #0044CC;\n --primary-light: #E8F0FF;\n --primary-soft: #F0F5FF;\n --secondary: #00C48C;\n --warning: #FFB800;\n --error: #FF3B5C;\n --dark: #1A1F36;\n --gray: #5B677D;\n --gray-light: #8E98A9;\n --light: #F8FAFE;\n --white: #FFFFFF;\n --border: #E2E8F0;\n --shadow-sm: 0 4px 12px rgba(0,85,255,0.08);\n --shadow: 0 12px 28px -8px rgba(0,85,255,0.12);\n --radius: 20px;\n --radius-md: 14px;\n --radius-sm: 10px;\n }\n \n body {\n font-family: 'Inter', sans-serif;\n font-weight: 400;\n color: var(--dark);\n background: var(--white);\n line-height: 1.5;\n font-size: 16px;\n }\n \n .container {\n max-width: 1280px;\n margin: 0 auto;\n padding: 0 32px;\n }\n \n @media (max-width: 768px) {\n .container { padding: 0 20px; }\n }\n \n h1, h2, h3 { font-weight: 500; line-height: 1.3; }\n h1 { font-size: clamp(2.2rem, 5vw, 3.2rem); font-weight: 600; background: linear-gradient(145deg, var(--primary) 0%, var(--primary-dark) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin-bottom: 1.2rem; }\n h2 { font-size: clamp(1.8rem, 4vw, 2.5rem); font-weight: 500; color: var(--dark); margin-bottom: 1.5rem; }\n h2 i { font-style: normal; font-weight: 600; color: var(--primary); border-bottom: 3px solid var(--primary-light); display: inline-block; padding-bottom: 2px; }\n p { color: var(--gray); margin-bottom: 1.5rem; }\n \n .btn {\n background: var(--primary);\n color: var(--white);\n border: none;\n padding: 14px 32px;\n border-radius: 60px;\n font-weight: 600;\n font-size: 1rem;\n cursor: pointer;\n text-decoration: none;\n display: inline-block;\n transition: all 0.2s;\n border: 1.5px solid transparent;\n }\n .btn:hover {\n background: var(--primary-dark);\n transform: translateY(-2px);\n box-shadow: var(--shadow-sm);\n }\n \n .btn-outline {\n background: transparent;\n color: var(--primary);\n border: 1.5px solid var(--primary);\n }\n .btn-outline:hover {\n background: var(--primary-light);\n color: var(--primary-dark);\n transform: translateY(-2px);\n }\n \n .header {\n position: sticky; top: 0; background: rgba(255,255,255,0.95); backdrop-filter: blur(10px);\n border-bottom: 1px solid var(--border); z-index: 100; padding: 16px 0;\n }\n .header .container { display: flex; align-items: center; justify-content: space-between; }\n .logo { font-weight: 700; font-size: 1.5rem; color: var(--primary); text-decoration: none; }\n .nav { display: flex; gap: 32px; }\n .nav a { color: var(--dark); text-decoration: none; font-weight: 500; font-size: 0.95rem; }\n .nav a:hover, .nav a.active { color: var(--primary); }\n \n @media (max-width: 768px) { .nav { display: none; } }\n \n .section { padding: 60px 0; }\n .section-alt { background: var(--light); padding: 60px 0; }\n .hero { padding: 80px 0 40px; background: linear-gradient(180deg, var(--primary-soft) 0%, var(--white) 100%); }\n \n \/* Status cards *\/\n .status-grid {\n display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px;\n margin: 40px 0;\n }\n \n @media (max-width: 768px) { .status-grid { grid-template-columns: 1fr; } }\n \n .status-card {\n background: var(--white); border-radius: var(--radius-md);\n border: 1px solid var(--border); padding: 28px;\n display: flex; align-items: center; gap: 20px;\n transition: all 0.3s;\n }\n .status-card:hover {\n box-shadow: var(--shadow-sm);\n transform: translateY(-2px);\n }\n .status-indicator {\n width: 16px; height: 16px; border-radius: 50%;\n background: var(--secondary); box-shadow: 0 0 0 4px rgba(0,196,140,0.2);\n animation: pulse 2s infinite;\n }\n .status-indicator.warning { background: var(--warning); box-shadow: 0 0 0 4px rgba(255,184,0,0.2); }\n .status-indicator.error { background: var(--error); box-shadow: 0 0 0 4px rgba(255,59,92,0.2); }\n \n @keyframes pulse {\n 0% { box-shadow: 0 0 0 0 rgba(0,196,140,0.4); }\n 70% { box-shadow: 0 0 0 10px rgba(0,196,140,0); }\n 100% { box-shadow: 0 0 0 0 rgba(0,196,140,0); }\n }\n \n .status-info { flex: 1; }\n .status-name {\n font-weight: 600; font-size: 1.1rem; margin-bottom: 4px;\n }\n .status-desc {\n color: var(--gray); font-size: 0.9rem;\n }\n .status-badge {\n background: rgba(0,196,140,0.1); color: var(--secondary);\n padding: 4px 12px; border-radius: 30px; font-size: 0.8rem;\n font-weight: 600; text-transform: uppercase;\n }\n .status-badge.warning { background: #FFF0D9; color: var(--warning); }\n .status-badge.error { background: #FFE5E9; color: var(--error); }\n \n \/* Uptime *\/\n .uptime-grid {\n display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;\n margin: 40px 0;\n }\n .uptime-item {\n background: var(--white); padding: 24px; border-radius: var(--radius-md);\n border: 1px solid var(--border); text-align: center;\n transition: all 0.3s;\n }\n .uptime-item:hover {\n box-shadow: var(--shadow-sm);\n transform: translateY(-2px);\n }\n .uptime-value {\n font-size: 2rem; font-weight: 700; color: var(--primary);\n margin-bottom: 4px;\n }\n .uptime-label {\n font-size: 0.9rem; color: var(--gray);\n }\n \n @media (max-width: 768px) { .uptime-grid { grid-template-columns: repeat(2, 1fr); } }\n \n \/* Hist\u00f3rico *\/\n .history-list {\n background: var(--white); border: 1px solid var(--border);\n border-radius: var(--radius-md); overflow: hidden;\n }\n .history-item {\n display: grid; grid-template-columns: 140px 100px 1fr;\n padding: 16px 24px; border-bottom: 1px solid var(--border);\n align-items: center;\n transition: background 0.2s;\n }\n .history-item:hover {\n background: var(--primary-soft);\n }\n .history-item:last-child { border-bottom: none; }\n .history-date { font-weight: 500; }\n .history-status {\n padding: 4px 8px; border-radius: 20px; font-size: 0.8rem;\n font-weight: 600; text-align: center; width: fit-content;\n }\n .history-status.resolved { background: rgba(0,196,140,0.1); color: var(--secondary); }\n .history-status.monitoring { background: #FFF0D9; color: var(--warning); }\n .history-status.incident { background: #FFE5E9; color: var(--error); }\n .history-desc { color: var(--gray); }\n \n @media (max-width: 768px) {\n .history-item { grid-template-columns: 1fr; gap: 8px; }\n }\n \n \/* Timeline de performance *\/\n .timeline {\n margin: 40px 0;\n background: var(--white);\n border: 1px solid var(--border);\n border-radius: var(--radius-md);\n padding: 30px;\n }\n .timeline-bars {\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n height: 200px;\n margin: 20px 0;\n gap: 8px;\n }\n .timeline-bar {\n flex: 1;\n background: linear-gradient(180deg, var(--primary) 0%, var(--primary-dark) 100%);\n border-radius: 8px 8px 0 0;\n transition: height 0.3s;\n position: relative;\n min-width: 30px;\n }\n .timeline-bar:hover {\n opacity: 0.9;\n transform: scale(1.02);\n }\n .timeline-bar::after {\n content: attr(data-value) '%';\n position: absolute;\n top: -25px;\n left: 50%;\n transform: translateX(-50%);\n font-size: 0.8rem;\n font-weight: 600;\n color: var(--primary);\n }\n .timeline-labels {\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n color: var(--gray);\n font-size: 0.85rem;\n }\n .timeline-label {\n flex: 1;\n text-align: center;\n }\n \n \/* Assinar notifica\u00e7\u00f5es *\/\n .subscribe-box {\n background: var(--white); border: 1px solid var(--border);\n border-radius: var(--radius-md); padding: 40px;\n text-align: center; max-width: 600px; margin: 0 auto;\n }\n .subscribe-form {\n display: flex; gap: 12px; margin-top: 30px;\n }\n .subscribe-input {\n flex: 1; padding: 14px 18px; border: 1.5px solid var(--border);\n border-radius: 60px; font-size: 1rem; outline: none;\n }\n .subscribe-input:focus {\n border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light);\n }\n \n @media (max-width: 480px) {\n .subscribe-form { flex-direction: column; }\n }\n \n \/* Toast de notifica\u00e7\u00e3o *\/\n .toast {\n position: fixed;\n bottom: 30px;\n right: 30px;\n background: var(--dark);\n color: white;\n padding: 16px 24px;\n border-radius: var(--radius-md);\n box-shadow: var(--shadow);\n transform: translateY(100px);\n opacity: 0;\n transition: all 0.3s;\n z-index: 1000;\n }\n .toast.show {\n transform: translateY(0);\n opacity: 1;\n }\n \n footer { background: var(--dark); color: var(--white); padding: 60px 0 30px; }\n .footer-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; margin-bottom: 40px; }\n .footer-col h4 { color: var(--white); font-weight: 500; font-size: 1rem; margin-bottom: 20px; }\n .footer-col a { color: var(--gray-light); text-decoration: none; display: block; margin-bottom: 10px; font-size: 0.9rem; }\n .footer-col a:hover { color: var(--white); }\n .copyright { text-align: center; padding-top: 30px; border-top: 1px solid rgba(255,255,255,0.1); color: var(--gray-light); }\n \n @media (max-width: 1024px) { .footer-grid { grid-template-columns: repeat(2, 1fr); } }\n @media (max-width: 640px) { .footer-grid { grid-template-columns: 1fr; } }\n \n .text-center { text-align: center; }\n \n .loading {\n display: inline-block;\n width: 20px;\n height: 20px;\n border: 3px solid rgba(0,85,255,0.1);\n border-radius: 50%;\n border-top-color: var(--primary);\n animation: spin 1s ease-in-out infinite;\n }\n \n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n \n .last-update {\n font-size: 0.85rem;\n color: var(--gray-light);\n margin-top: 10px;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n <\/style>\n<\/head>\n<body>\n <header class=\"header\">\n <div class=\"container\">\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/\" class=\"logo\">REINAR<\/a>\n <nav class=\"nav\">\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/crm-reinar\/\">CRM Reinar<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/sobre-nos\/\">Sobre n\u00f3s<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/carreiras\/\">Carreiras<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/funcionalidades\/\">Funcionalidades<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/precos\/\">Pre\u00e7os<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/cases\/\">Cases<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/\" class=\"active\">Suporte<\/a>\n <\/nav>\n <\/div>\n <\/header>\n\n <section class=\"hero\">\n <div class=\"container\">\n <h1>Status do <i>Sistema<\/i><\/h1>\n <p class=\"text-large\">Acompanhe a disponibilidade e performance do CRM Reinar em tempo real.<\/p>\n <div class=\"last-update\" id=\"lastUpdate\">\n <span>\u23f1\ufe0f \u00daltima atualiza\u00e7\u00e3o:<\/span>\n <span id=\"updateTime\">Carregando…<\/span>\n <span class=\"loading\" id=\"loadingIndicator\" style=\"display: none;\"><\/span>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"section\">\n <div class=\"container\">\n <h2>Status atual dos <i>servi\u00e7os<\/i><\/h2>\n \n <div class=\"status-grid\" id=\"statusGrid\">\n \n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"section-alt\">\n <div class=\"container\">\n <h2 class=\"text-center\">Desempenho dos <i>\u00faltimos 30 dias<\/i><\/h2>\n \n <div class=\"uptime-grid\" id=\"uptimeGrid\">\n <div class=\"uptime-item\">\n <div class=\"uptime-value\" id=\"uptimeGeneral\">99.9%<\/div>\n <div class=\"uptime-label\">Uptime geral<\/div>\n <\/div>\n <div class=\"uptime-item\">\n <div class=\"uptime-value\" id=\"responseTime\">180ms<\/div>\n <div class=\"uptime-label\">Tempo m\u00e9dio de resposta<\/div>\n <\/div>\n <div class=\"uptime-item\">\n <div class=\"uptime-value\" id=\"incidentsCount\">0<\/div>\n <div class=\"uptime-label\">Incidentes cr\u00edticos<\/div>\n <\/div>\n <div class=\"uptime-item\">\n <div class=\"uptime-value\" id=\"slaGuarantee\">99.5%<\/div>\n <div class=\"uptime-label\">SLA garantido<\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"timeline\">\n <h3 style=\"margin-bottom: 20px;\">Performance <i>7 dias<\/i><\/h3>\n <div class=\"timeline-bars\" id=\"timelineBars\"><\/div>\n <div class=\"timeline-labels\" id=\"timelineLabels\"><\/div>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"section\">\n <div class=\"container\">\n <h2>Hist\u00f3rico de <i>incidentes<\/i><\/h2>\n \n <div class=\"history-list\" id=\"historyList\">\n \n <\/div>\n \n <p style=\"text-align: center; margin-top: 20px;\">\n <a href=\"#\" onclick=\"loadMoreHistory(event)\" style=\"color: var(--primary);\">Carregar mais incidentes \u2192<\/a>\n <\/p>\n <\/div>\n <\/section>\n\n \n <section class=\"section-alt\">\n <div class=\"container\">\n <h2>Manuten\u00e7\u00f5es <i>programadas<\/i><\/h2>\n \n <div id=\"maintenanceContainer\">\n \n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"section\">\n <div class=\"container\">\n <div class=\"subscribe-box\">\n <h2>Receba <i>alerts<\/i><\/h2>\n <p>Assine e receba notifica\u00e7\u00f5es sobre incidentes, manuten\u00e7\u00f5es e atualiza\u00e7\u00f5es do sistema.<\/p>\n \n <div class=\"subscribe-form\">\n <input type=\"email\" class=\"subscribe-input\" id=\"emailInput\" placeholder=\"Seu melhor e-mail\">\n <button class=\"btn\" onclick=\"subscribeNewsletter()\">Assinar<\/button>\n <\/div>\n \n <p style=\"font-size: 0.8rem; margin-top: 20px; color: var(--gray-light);\">\n Voc\u00ea pode cancelar a qualquer momento. N\u00e3o enviamos spam.\n <\/p>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"section-alt\">\n <div class=\"container\">\n <div style=\"text-align: center; max-width: 600px; margin: 0 auto;\">\n <h2>Enfrentando problemas?<\/h2>\n <p>Nossa equipe de suporte est\u00e1 pronta para ajudar com qualquer quest\u00e3o t\u00e9cnica.<\/p>\n <a href=\"https:\/\/wa.me\/\/5547997226971?text=Ol\u00e1,%20preciso%20de%20suporte%20do%20Reinar%20CRM.%20Empresa:%20[NOME%20DA%20EMPRESA]\" class=\"btn\" style=\"margin-top: 20px;\">Abrir chamado<\/a>\n <\/div>\n <\/div>\n <\/section>\n\n \n <div class=\"toast\" id=\"toast\"><\/div>\n\n <footer>\n <div class=\"container\">\n <div class=\"footer-grid\">\n <div class=\"footer-col\">\n <h4>CRM Reinar<\/h4>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/sobre-nos\/\">Sobre n\u00f3s<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/carreiras\/\">Carreiras<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/blog\/\">Blog<\/a>\n <\/div>\n <div class=\"footer-col\">\n <h4>Produto<\/h4>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/funcionalidades\/\">Funcionalidades<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/precos\/\">Pre\u00e7os<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/cases\/\">Cases<\/a>\n <\/div>\n <div class=\"footer-col\">\n <h4>Suporte<\/h4>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/\">Central de ajuda<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/documentacao\/\">Documenta\u00e7\u00e3o<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/status\/\">Status<\/a>\n <\/div>\n <div class=\"footer-col\">\n <h4>Contato<\/h4>\n <a href=\"mailto:contato@reinarmarketing.com.br\">contato@reinarmarketing.com.br<\/a>\n <a href=\"tel:+5547997226971\">(47) 99722-6971<\/a>\n <\/div>\n <\/div>\n <div class=\"copyright\">\n \u00a9 2024 Reinar Marketing. Todos os direitos reservados.\n <\/div>\n <\/div>\n <\/footer>\n\n <script>\n \/\/ Configura\u00e7\u00f5es\n const CONFIG = {\n UPDATE_INTERVAL: 30000, \/\/ 30 segundos\n SIMULATION_MODE: true,\n COMPANY_FOUNDATION: '2020-01-01'\n };\n\n \/\/ Estado da aplica\u00e7\u00e3o\n let appState = {\n services: [\n { name: 'Plataforma CRM', description: 'Interface web e aplica\u00e7\u00f5es principais', status: 'operational', group: 'core' },\n { name: 'API', description: 'Endpoints e integra\u00e7\u00f5es', status: 'operational', group: 'core' },\n { name: 'Integra\u00e7\u00e3o WhatsApp', description: 'Envio e recebimento de mensagens', status: 'operational', group: 'integrations' },\n { name: 'Webhooks', description: 'Notifica\u00e7\u00f5es em tempo real', status: 'operational', group: 'integrations' },\n { name: 'Painel de M\u00e9tricas', description: 'Dashboards e relat\u00f3rios', status: 'operational', group: 'analytics' },\n { name: 'Automa\u00e7\u00f5es e Bots', description: 'Fluxos automatizados', status: 'operational', group: 'automation' }\n ],\n uptimeHistory: [],\n incidents: [],\n lastUpdate: new Date()\n };\n\n \/\/ Dados simulados realistas (apenas para refer\u00eancia)\n const SIMULATED_INCIDENTS = [\n { type: 'API', description: 'Pico de lat\u00eancia na API durante hor\u00e1rio de pico', duration: 15, severity: 'minor' },\n { type: 'WhatsApp', description: 'Instabilidade no envio de mensagens devido a limita\u00e7\u00f5es da Meta', duration: 45, severity: 'major' },\n { type: 'Webhooks', description: 'Atraso na entrega de notifica\u00e7\u00f5es', duration: 10, severity: 'minor' },\n { type: 'Dashboard', description: 'Lentid\u00e3o no carregamento de relat\u00f3rios', duration: 25, severity: 'minor' },\n { type: 'Automa\u00e7\u00f5es', description: 'Falha em disparos autom\u00e1ticos de e-mail', duration: 20, severity: 'minor' }\n ];\n\n \/\/ Utilit\u00e1rios\n function formatDate(date) {\n return date.toLocaleDateString('pt-BR', { day: '2-digit', month: '2-digit', year: 'numeric' });\n }\n\n function formatDateTime(date) {\n return date.toLocaleDateString('pt-BR', { \n day: '2-digit', \n month: '2-digit', \n year: 'numeric',\n hour: '2-digit',\n minute: '2-digit'\n });\n }\n\n function showToast(message, type = 'info') {\n const toast = document.getElementById('toast');\n toast.textContent = message;\n toast.style.background = type === 'error' ? 'var(--error)' : type === 'warning' ? 'var(--warning)' : 'var(--dark)';\n toast.classList.add('show');\n \n setTimeout(() => {\n toast.classList.remove('show');\n }, 5000);\n }\n\n function updateLastUpdateTime() {\n const now = new Date();\n document.getElementById('updateTime').textContent = formatDateTime(now);\n appState.lastUpdate = now;\n }\n\n function showLoading() {\n document.getElementById('loadingIndicator').style.display = 'inline-block';\n }\n\n function hideLoading() {\n document.getElementById('loadingIndicator').style.display = 'none';\n }\n\n \/\/ Renderiza\u00e7\u00e3o dos status\n function renderStatusCards() {\n const grid = document.getElementById('statusGrid');\n grid.innerHTML = appState.services.map(service => {\n const statusClass = service.status === 'operational' ? '' : service.status === 'degraded' ? 'warning' : 'error';\n const statusText = service.status === 'operational' ? 'Operacional' : \n service.status === 'degraded' ? 'Degradado' : 'Indispon\u00edvel';\n const statusColor = service.status === 'operational' ? 'secondary' : \n service.status === 'degraded' ? 'warning' : 'error';\n \n return `\n <div class=\"status-card\">\n <div class=\"status-indicator ${statusClass}\"><\/div>\n <div class=\"status-info\">\n <div class=\"status-name\">${service.name}<\/div>\n <div class=\"status-desc\">${service.description}<\/div>\n <\/div>\n <div class=\"status-badge ${statusClass}\">${statusText}<\/div>\n <\/div>\n `;\n }).join('');\n }\n\n \/\/ Gerar dados de uptime realistas\n function generateUptimeData() {\n \/\/ Uptime geral entre 99.5% e 100%\n const baseUptime = 99.9;\n const variation = (Math.random() * 0.4) - 0.2; \/\/ -0.2 a +0.2\n const uptime = (baseUptime + variation).toFixed(1);\n \n \/\/ Tempo de resposta entre 150ms e 250ms\n const responseTime = Math.floor(150 + Math.random() * 100);\n \n \/\/ Incidentes cr\u00edticos (0-2)\n const criticalIncidents = Math.floor(Math.random() * 3);\n \n \/\/ SLA entre 99% e 100%\n const sla = (99 + Math.random()).toFixed(1);\n \n document.getElementById('uptimeGeneral').textContent = uptime + '%';\n document.getElementById('responseTime').textContent = responseTime + 'ms';\n document.getElementById('incidentsCount').textContent = criticalIncidents;\n document.getElementById('slaGuarantee').textContent = sla + '%';\n }\n\n \/\/ Gerar timeline de performance\n function generatePerformanceTimeline() {\n const bars = document.getElementById('timelineBars');\n const labels = document.getElementById('timelineLabels');\n \n const days = ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'S\u00e1b'];\n const today = new Date();\n \n let barsHtml = '';\n let labelsHtml = '';\n \n for (let i = 6; i >= 0; i--) {\n const date = new Date(today);\n date.setDate(date.getDate() - i);\n \n \/\/ Performance entre 95% e 100%\n const performance = 95 + Math.random() * 5;\n const height = performance * 1.8; \/\/ 180px max\n \n barsHtml += `<div class=\"timeline-bar\" style=\"height: ${height}px;\" data-value=\"${performance.toFixed(1)}\"><\/div>`;\n \n const dayName = days[date.getDay()];\n const dayNumber = date.getDate();\n labelsHtml += `<div class=\"timeline-label\">${dayName} ${dayNumber}<\/div>`;\n }\n \n bars.innerHTML = barsHtml;\n labels.innerHTML = labelsHtml;\n }\n\n \/\/ Gerar hist\u00f3rico de incidentes\n function generateIncidentHistory() {\n const historyList = document.getElementById('historyList');\n const today = new Date();\n \n let incidents = [];\n \n \/\/ Gerar incidentes dos \u00faltimos 30 dias\n for (let i = 0; i < 10; i++) {\n const daysAgo = Math.floor(Math.random() * 30);\n const date = new Date(today);\n date.setDate(date.getDate() - daysAgo);\n \n const incident = SIMULATED_INCIDENTS[Math.floor(Math.random() * SIMULATED_INCIDENTS.length)];\n const hour = Math.floor(Math.random() * 12) + 8; \/\/ 8h \u00e0s 20h\n const minute = Math.floor(Math.random() * 60);\n \n date.setHours(hour, minute);\n \n incidents.push({\n date: date,\n status: 'resolved',\n description: `${incident.description}. Dura\u00e7\u00e3o: ${incident.duration} minutos.`\n });\n }\n \n \/\/ Ordenar por data (mais recentes primeiro)\n incidents.sort((a, b) => b.date - a.date);\n \n historyList.innerHTML = incidents.map(incident => `\n <div class=\"history-item\">\n <div class=\"history-date\">${formatDate(incident.date)}<\/div>\n <div><span class=\"history-status resolved\">Resolvido<\/span><\/div>\n <div class=\"history-desc\">${incident.description}<\/div>\n <\/div>\n `).join('');\n }\n\n \/\/ Gerar manuten\u00e7\u00f5es programadas\n function generateMaintenance() {\n const container = document.getElementById('maintenanceContainer');\n const today = new Date();\n \n \/\/ Pr\u00f3xima manuten\u00e7\u00e3o (entre 1 e 7 dias)\n const nextMaintenance = new Date(today);\n nextMaintenance.setDate(today.getDate() + Math.floor(Math.random() * 7) + 1);\n nextMaintenance.setHours(2, 0); \/\/ 2:00 AM\n \n const endMaintenance = new Date(nextMaintenance);\n endMaintenance.setHours(nextMaintenance.getHours() + 1);\n \n const maintenances = [\n {\n title: 'Atualiza\u00e7\u00e3o de infraestrutura',\n description: 'Otimiza\u00e7\u00e3o de banco de dados e atualiza\u00e7\u00e3o de seguran\u00e7a',\n date: nextMaintenance,\n duration: '60 minutos',\n impact: 'Indisponibilidade prevista de at\u00e9 15 minutos'\n },\n {\n title: 'Upgrade da API WhatsApp',\n description: 'Implementa\u00e7\u00e3o de novos recursos e melhorias de performance',\n date: new Date(nextMaintenance.getTime() + (7 * 24 * 60 * 60 * 1000)),\n duration: '30 minutos',\n impact: 'Sem indisponibilidade esperada'\n }\n ];\n \n container.innerHTML = maintenances.map(m => `\n <div style=\"background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 24px; margin-bottom: 16px;\">\n <div style=\"display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px;\">\n <div>\n <h3 style=\"margin-bottom: 4px;\">${m.title}<\/h3>\n <p style=\"margin: 0;\">${formatDate(m.date)} \u00b7 ${m.date.getHours().toString().padStart(2,'0')}:${m.date.getMinutes().toString().padStart(2,'0')} (hor\u00e1rio de Bras\u00edlia)<\/p>\n <p style=\"color: var(--gray); font-size: 0.9rem; margin-top: 8px;\">${m.description}<\/p>\n <p style=\"color: var(--gray); font-size: 0.9rem;\">${m.impact}<\/p>\n <\/div>\n <span style=\"background: #FFF0D9; color: var(--warning); padding: 6px 16px; border-radius: 30px; font-weight: 600; font-size: 0.85rem;\">Agendado<\/span>\n <\/div>\n <\/div>\n `).join('');\n }\n\n \/\/ Newsletter subscription\n function subscribeNewsletter() {\n const email = document.getElementById('emailInput').value;\n if (!email || !email.includes('@')) {\n showToast('Por favor, insira um e-mail v\u00e1lido', 'error');\n return;\n }\n \n showToast('\u2705 Inscri\u00e7\u00e3o realizada com sucesso! Voc\u00ea receber\u00e1 nossas notifica\u00e7\u00f5es.', 'info');\n document.getElementById('emailInput').value = '';\n }\n\n function loadMoreHistory(event) {\n event.preventDefault();\n showLoading();\n \n setTimeout(() => {\n generateIncidentHistory();\n hideLoading();\n showToast('Mais incidentes carregados', 'info');\n }, 1000);\n }\n\n \/\/ Inicializa\u00e7\u00e3o e atualiza\u00e7\u00e3o peri\u00f3dica\n function updateAllData() {\n showLoading();\n \n \/\/ Simular delay de rede\n setTimeout(() => {\n generateUptimeData();\n generatePerformanceTimeline();\n updateLastUpdateTime();\n renderStatusCards();\n hideLoading();\n }, 800);\n }\n\n \/\/ Inicializar\n function init() {\n renderStatusCards();\n generateUptimeData();\n generatePerformanceTimeline();\n generateIncidentHistory();\n generateMaintenance();\n updateLastUpdateTime();\n \n \/\/ Atualizar a cada 30 segundos\n setInterval(updateAllData, CONFIG.UPDATE_INTERVAL);\n }\n\n \/\/ Executar quando a p\u00e1gina carregar\n document.addEventListener('DOMContentLoaded', init);\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Status do Sistema | CRM Reinar REINAR CRM Reinar Sobre n\u00f3s Carreiras Funcionalidades Pre\u00e7os Cases Suporte Status do Sistema Acompanhe a disponibilidade e performance do CRM Reinar em tempo real. \u23f1\ufe0f \u00daltima atualiza\u00e7\u00e3o: Carregando… Status atual dos servi\u00e7os Desempenho dos \u00faltimos 30 dias 99.9% Uptime geral 180ms Tempo m\u00e9dio de resposta 0 Incidentes cr\u00edticos 99.5% […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-page-builder-no-header-footer.php","meta":{"footnotes":""},"class_list":["post-1917","page","type-page","status-publish","hentry"],"yoast_head":"\n<title>Suporte - Reinar Marketing<\/title>\n<meta name=\"description\" content=\"Reinar Marketing\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Suporte - Reinar Marketing\" \/>\n<meta property=\"og:description\" content=\"Reinar Marketing\" \/>\n<meta property=\"og:url\" content=\"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/\" \/>\n<meta property=\"og:site_name\" content=\"Reinar Marketing\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/people\/Reinar-Marketing\/100083967930378\" \/>\n<meta property=\"article:modified_time\" content=\"2026-02-24T00:46:30+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/reinarmarketing.com.br\/mkt\/wp-content\/uploads\/2024\/07\/Captura-de-tela-2024-03-23-153633.png\" \/>\n\t<meta property=\"og:image:width\" content=\"704\" \/>\n\t<meta property=\"og:image:height\" content=\"278\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/central-ajuda\\\/\",\"url\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/central-ajuda\\\/\",\"name\":\"Suporte - Reinar Marketing\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#website\"},\"datePublished\":\"2026-02-21T19:48:45+00:00\",\"dateModified\":\"2026-02-24T00:46:30+00:00\",\"description\":\"Reinar Marketing\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/central-ajuda\\\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/central-ajuda\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/central-ajuda\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"In\u00edcio\",\"item\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Suporte\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#website\",\"url\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/\",\"name\":\"Ag\u00eancia Reinar Marketing\",\"description\":\"Reinar Marketing \u00e9 uma ag\u00eancia Full Service MarTech especializada em branding, marketing digital, automa\u00e7\u00e3o, conte\u00fado e crescimento de marcas.\",\"publisher\":{\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#organization\"},\"alternateName\":\"Ag\u00eancia de Marketing Full Service em Guaramirim, Santa Catarina\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#organization\",\"name\":\"Reinar Marketing\",\"alternateName\":\"Ag\u00eancia Reinar Marketing\",\"url\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/wp-content\\\/uploads\\\/2024\\\/07\\\/Captura-de-tela-2024-03-23-153633.png\",\"contentUrl\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/wp-content\\\/uploads\\\/2024\\\/07\\\/Captura-de-tela-2024-03-23-153633.png\",\"width\":704,\"height\":278,\"caption\":\"Reinar Marketing\"},\"image\":{\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/people\\\/Reinar-Marketing\\\/100083967930378\",\"https:\\\/\\\/www.instagram.com\\\/reinarmarketing\\\/\",\"https:\\\/\\\/youtu.be\\\/xpxrqKEG_c0?si=XS1po4GKUPJdyE5t\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/reinarmarketing\",\"https:\\\/\\\/www.tiktok.com\\\/@reinarmarketing\"]}]}<\/script>\n","yoast_head_json":{"title":"Suporte - Reinar Marketing","description":"Reinar Marketing","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/","og_locale":"pt_BR","og_type":"article","og_title":"Suporte - Reinar Marketing","og_description":"Reinar Marketing","og_url":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/","og_site_name":"Reinar Marketing","article_publisher":"https:\/\/www.facebook.com\/people\/Reinar-Marketing\/100083967930378","article_modified_time":"2026-02-24T00:46:30+00:00","og_image":[{"width":704,"height":278,"url":"https:\/\/reinarmarketing.com.br\/mkt\/wp-content\/uploads\/2024\/07\/Captura-de-tela-2024-03-23-153633.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. tempo de leitura":"4 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/","url":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/","name":"Suporte - Reinar Marketing","isPartOf":{"@id":"https:\/\/reinarmarketing.com.br\/mkt\/#website"},"datePublished":"2026-02-21T19:48:45+00:00","dateModified":"2026-02-24T00:46:30+00:00","description":"Reinar Marketing","breadcrumb":{"@id":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"In\u00edcio","item":"https:\/\/reinarmarketing.com.br\/mkt\/"},{"@type":"ListItem","position":2,"name":"Suporte"}]},{"@type":"WebSite","@id":"https:\/\/reinarmarketing.com.br\/mkt\/#website","url":"https:\/\/reinarmarketing.com.br\/mkt\/","name":"Ag\u00eancia Reinar Marketing","description":"Reinar Marketing \u00e9 uma ag\u00eancia Full Service MarTech especializada em branding, marketing digital, automa\u00e7\u00e3o, conte\u00fado e crescimento de marcas.","publisher":{"@id":"https:\/\/reinarmarketing.com.br\/mkt\/#organization"},"alternateName":"Ag\u00eancia de Marketing Full Service em Guaramirim, Santa Catarina","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/reinarmarketing.com.br\/mkt\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Organization","@id":"https:\/\/reinarmarketing.com.br\/mkt\/#organization","name":"Reinar Marketing","alternateName":"Ag\u00eancia Reinar Marketing","url":"https:\/\/reinarmarketing.com.br\/mkt\/","logo":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/reinarmarketing.com.br\/mkt\/#\/schema\/logo\/image\/","url":"https:\/\/reinarmarketing.com.br\/mkt\/wp-content\/uploads\/2024\/07\/Captura-de-tela-2024-03-23-153633.png","contentUrl":"https:\/\/reinarmarketing.com.br\/mkt\/wp-content\/uploads\/2024\/07\/Captura-de-tela-2024-03-23-153633.png","width":704,"height":278,"caption":"Reinar Marketing"},"image":{"@id":"https:\/\/reinarmarketing.com.br\/mkt\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/people\/Reinar-Marketing\/100083967930378","https:\/\/www.instagram.com\/reinarmarketing\/","https:\/\/youtu.be\/xpxrqKEG_c0?si=XS1po4GKUPJdyE5t","https:\/\/www.linkedin.com\/company\/reinarmarketing","https:\/\/www.tiktok.com\/@reinarmarketing"]}]}},"_links":{"self":[{"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/pages\/1917","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/comments?post=1917"}],"version-history":[{"count":11,"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/pages\/1917\/revisions"}],"predecessor-version":[{"id":1956,"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/pages\/1917\/revisions\/1956"}],"wp:attachment":[{"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/media?parent=1917"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":1917,"date":"2026-02-21T19:48:45","date_gmt":"2026-02-21T19:48:45","guid":{"rendered":"https:\/\/reinarmarketing.com.br\/mkt\/?page_id=1917"},"modified":"2026-02-24T00:46:30","modified_gmt":"2026-02-24T00:46:30","slug":"central-ajuda","status":"publish","type":"page","link":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/","title":{"rendered":"Suporte"},"content":{"rendered":"\n\n\n\n \n \n Status do Sistema | CRM Reinar<\/title>\n <meta name=\"description\" content=\"Acompanhe a disponibilidade e performance do CRM Reinar em tempo real.\">\n \n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:opsz,wght@14..32,300;14..32,400;14..32,500;14..32,600;14..32,700&display=swap\" rel=\"stylesheet\">\n \n <style>\n * { margin: 0; padding: 0; box-sizing: border-box; }\n \n :root {\n --primary: #0055FF;\n --primary-dark: #0044CC;\n --primary-light: #E8F0FF;\n --primary-soft: #F0F5FF;\n --secondary: #00C48C;\n --warning: #FFB800;\n --error: #FF3B5C;\n --dark: #1A1F36;\n --gray: #5B677D;\n --gray-light: #8E98A9;\n --light: #F8FAFE;\n --white: #FFFFFF;\n --border: #E2E8F0;\n --shadow-sm: 0 4px 12px rgba(0,85,255,0.08);\n --shadow: 0 12px 28px -8px rgba(0,85,255,0.12);\n --radius: 20px;\n --radius-md: 14px;\n --radius-sm: 10px;\n }\n \n body {\n font-family: 'Inter', sans-serif;\n font-weight: 400;\n color: var(--dark);\n background: var(--white);\n line-height: 1.5;\n font-size: 16px;\n }\n \n .container {\n max-width: 1280px;\n margin: 0 auto;\n padding: 0 32px;\n }\n \n @media (max-width: 768px) {\n .container { padding: 0 20px; }\n }\n \n h1, h2, h3 { font-weight: 500; line-height: 1.3; }\n h1 { font-size: clamp(2.2rem, 5vw, 3.2rem); font-weight: 600; background: linear-gradient(145deg, var(--primary) 0%, var(--primary-dark) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; margin-bottom: 1.2rem; }\n h2 { font-size: clamp(1.8rem, 4vw, 2.5rem); font-weight: 500; color: var(--dark); margin-bottom: 1.5rem; }\n h2 i { font-style: normal; font-weight: 600; color: var(--primary); border-bottom: 3px solid var(--primary-light); display: inline-block; padding-bottom: 2px; }\n p { color: var(--gray); margin-bottom: 1.5rem; }\n \n .btn {\n background: var(--primary);\n color: var(--white);\n border: none;\n padding: 14px 32px;\n border-radius: 60px;\n font-weight: 600;\n font-size: 1rem;\n cursor: pointer;\n text-decoration: none;\n display: inline-block;\n transition: all 0.2s;\n border: 1.5px solid transparent;\n }\n .btn:hover {\n background: var(--primary-dark);\n transform: translateY(-2px);\n box-shadow: var(--shadow-sm);\n }\n \n .btn-outline {\n background: transparent;\n color: var(--primary);\n border: 1.5px solid var(--primary);\n }\n .btn-outline:hover {\n background: var(--primary-light);\n color: var(--primary-dark);\n transform: translateY(-2px);\n }\n \n .header {\n position: sticky; top: 0; background: rgba(255,255,255,0.95); backdrop-filter: blur(10px);\n border-bottom: 1px solid var(--border); z-index: 100; padding: 16px 0;\n }\n .header .container { display: flex; align-items: center; justify-content: space-between; }\n .logo { font-weight: 700; font-size: 1.5rem; color: var(--primary); text-decoration: none; }\n .nav { display: flex; gap: 32px; }\n .nav a { color: var(--dark); text-decoration: none; font-weight: 500; font-size: 0.95rem; }\n .nav a:hover, .nav a.active { color: var(--primary); }\n \n @media (max-width: 768px) { .nav { display: none; } }\n \n .section { padding: 60px 0; }\n .section-alt { background: var(--light); padding: 60px 0; }\n .hero { padding: 80px 0 40px; background: linear-gradient(180deg, var(--primary-soft) 0%, var(--white) 100%); }\n \n \/* Status cards *\/\n .status-grid {\n display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px;\n margin: 40px 0;\n }\n \n @media (max-width: 768px) { .status-grid { grid-template-columns: 1fr; } }\n \n .status-card {\n background: var(--white); border-radius: var(--radius-md);\n border: 1px solid var(--border); padding: 28px;\n display: flex; align-items: center; gap: 20px;\n transition: all 0.3s;\n }\n .status-card:hover {\n box-shadow: var(--shadow-sm);\n transform: translateY(-2px);\n }\n .status-indicator {\n width: 16px; height: 16px; border-radius: 50%;\n background: var(--secondary); box-shadow: 0 0 0 4px rgba(0,196,140,0.2);\n animation: pulse 2s infinite;\n }\n .status-indicator.warning { background: var(--warning); box-shadow: 0 0 0 4px rgba(255,184,0,0.2); }\n .status-indicator.error { background: var(--error); box-shadow: 0 0 0 4px rgba(255,59,92,0.2); }\n \n @keyframes pulse {\n 0% { box-shadow: 0 0 0 0 rgba(0,196,140,0.4); }\n 70% { box-shadow: 0 0 0 10px rgba(0,196,140,0); }\n 100% { box-shadow: 0 0 0 0 rgba(0,196,140,0); }\n }\n \n .status-info { flex: 1; }\n .status-name {\n font-weight: 600; font-size: 1.1rem; margin-bottom: 4px;\n }\n .status-desc {\n color: var(--gray); font-size: 0.9rem;\n }\n .status-badge {\n background: rgba(0,196,140,0.1); color: var(--secondary);\n padding: 4px 12px; border-radius: 30px; font-size: 0.8rem;\n font-weight: 600; text-transform: uppercase;\n }\n .status-badge.warning { background: #FFF0D9; color: var(--warning); }\n .status-badge.error { background: #FFE5E9; color: var(--error); }\n \n \/* Uptime *\/\n .uptime-grid {\n display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px;\n margin: 40px 0;\n }\n .uptime-item {\n background: var(--white); padding: 24px; border-radius: var(--radius-md);\n border: 1px solid var(--border); text-align: center;\n transition: all 0.3s;\n }\n .uptime-item:hover {\n box-shadow: var(--shadow-sm);\n transform: translateY(-2px);\n }\n .uptime-value {\n font-size: 2rem; font-weight: 700; color: var(--primary);\n margin-bottom: 4px;\n }\n .uptime-label {\n font-size: 0.9rem; color: var(--gray);\n }\n \n @media (max-width: 768px) { .uptime-grid { grid-template-columns: repeat(2, 1fr); } }\n \n \/* Hist\u00f3rico *\/\n .history-list {\n background: var(--white); border: 1px solid var(--border);\n border-radius: var(--radius-md); overflow: hidden;\n }\n .history-item {\n display: grid; grid-template-columns: 140px 100px 1fr;\n padding: 16px 24px; border-bottom: 1px solid var(--border);\n align-items: center;\n transition: background 0.2s;\n }\n .history-item:hover {\n background: var(--primary-soft);\n }\n .history-item:last-child { border-bottom: none; }\n .history-date { font-weight: 500; }\n .history-status {\n padding: 4px 8px; border-radius: 20px; font-size: 0.8rem;\n font-weight: 600; text-align: center; width: fit-content;\n }\n .history-status.resolved { background: rgba(0,196,140,0.1); color: var(--secondary); }\n .history-status.monitoring { background: #FFF0D9; color: var(--warning); }\n .history-status.incident { background: #FFE5E9; color: var(--error); }\n .history-desc { color: var(--gray); }\n \n @media (max-width: 768px) {\n .history-item { grid-template-columns: 1fr; gap: 8px; }\n }\n \n \/* Timeline de performance *\/\n .timeline {\n margin: 40px 0;\n background: var(--white);\n border: 1px solid var(--border);\n border-radius: var(--radius-md);\n padding: 30px;\n }\n .timeline-bars {\n display: flex;\n align-items: flex-end;\n justify-content: space-between;\n height: 200px;\n margin: 20px 0;\n gap: 8px;\n }\n .timeline-bar {\n flex: 1;\n background: linear-gradient(180deg, var(--primary) 0%, var(--primary-dark) 100%);\n border-radius: 8px 8px 0 0;\n transition: height 0.3s;\n position: relative;\n min-width: 30px;\n }\n .timeline-bar:hover {\n opacity: 0.9;\n transform: scale(1.02);\n }\n .timeline-bar::after {\n content: attr(data-value) '%';\n position: absolute;\n top: -25px;\n left: 50%;\n transform: translateX(-50%);\n font-size: 0.8rem;\n font-weight: 600;\n color: var(--primary);\n }\n .timeline-labels {\n display: flex;\n justify-content: space-between;\n margin-top: 10px;\n color: var(--gray);\n font-size: 0.85rem;\n }\n .timeline-label {\n flex: 1;\n text-align: center;\n }\n \n \/* Assinar notifica\u00e7\u00f5es *\/\n .subscribe-box {\n background: var(--white); border: 1px solid var(--border);\n border-radius: var(--radius-md); padding: 40px;\n text-align: center; max-width: 600px; margin: 0 auto;\n }\n .subscribe-form {\n display: flex; gap: 12px; margin-top: 30px;\n }\n .subscribe-input {\n flex: 1; padding: 14px 18px; border: 1.5px solid var(--border);\n border-radius: 60px; font-size: 1rem; outline: none;\n }\n .subscribe-input:focus {\n border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-light);\n }\n \n @media (max-width: 480px) {\n .subscribe-form { flex-direction: column; }\n }\n \n \/* Toast de notifica\u00e7\u00e3o *\/\n .toast {\n position: fixed;\n bottom: 30px;\n right: 30px;\n background: var(--dark);\n color: white;\n padding: 16px 24px;\n border-radius: var(--radius-md);\n box-shadow: var(--shadow);\n transform: translateY(100px);\n opacity: 0;\n transition: all 0.3s;\n z-index: 1000;\n }\n .toast.show {\n transform: translateY(0);\n opacity: 1;\n }\n \n footer { background: var(--dark); color: var(--white); padding: 60px 0 30px; }\n .footer-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 40px; margin-bottom: 40px; }\n .footer-col h4 { color: var(--white); font-weight: 500; font-size: 1rem; margin-bottom: 20px; }\n .footer-col a { color: var(--gray-light); text-decoration: none; display: block; margin-bottom: 10px; font-size: 0.9rem; }\n .footer-col a:hover { color: var(--white); }\n .copyright { text-align: center; padding-top: 30px; border-top: 1px solid rgba(255,255,255,0.1); color: var(--gray-light); }\n \n @media (max-width: 1024px) { .footer-grid { grid-template-columns: repeat(2, 1fr); } }\n @media (max-width: 640px) { .footer-grid { grid-template-columns: 1fr; } }\n \n .text-center { text-align: center; }\n \n .loading {\n display: inline-block;\n width: 20px;\n height: 20px;\n border: 3px solid rgba(0,85,255,0.1);\n border-radius: 50%;\n border-top-color: var(--primary);\n animation: spin 1s ease-in-out infinite;\n }\n \n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n \n .last-update {\n font-size: 0.85rem;\n color: var(--gray-light);\n margin-top: 10px;\n display: flex;\n align-items: center;\n gap: 8px;\n }\n <\/style>\n<\/head>\n<body>\n <header class=\"header\">\n <div class=\"container\">\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/\" class=\"logo\">REINAR<\/a>\n <nav class=\"nav\">\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/crm-reinar\/\">CRM Reinar<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/sobre-nos\/\">Sobre n\u00f3s<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/carreiras\/\">Carreiras<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/funcionalidades\/\">Funcionalidades<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/precos\/\">Pre\u00e7os<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/cases\/\">Cases<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/\" class=\"active\">Suporte<\/a>\n <\/nav>\n <\/div>\n <\/header>\n\n <section class=\"hero\">\n <div class=\"container\">\n <h1>Status do <i>Sistema<\/i><\/h1>\n <p class=\"text-large\">Acompanhe a disponibilidade e performance do CRM Reinar em tempo real.<\/p>\n <div class=\"last-update\" id=\"lastUpdate\">\n <span>\u23f1\ufe0f \u00daltima atualiza\u00e7\u00e3o:<\/span>\n <span id=\"updateTime\">Carregando…<\/span>\n <span class=\"loading\" id=\"loadingIndicator\" style=\"display: none;\"><\/span>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"section\">\n <div class=\"container\">\n <h2>Status atual dos <i>servi\u00e7os<\/i><\/h2>\n \n <div class=\"status-grid\" id=\"statusGrid\">\n \n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"section-alt\">\n <div class=\"container\">\n <h2 class=\"text-center\">Desempenho dos <i>\u00faltimos 30 dias<\/i><\/h2>\n \n <div class=\"uptime-grid\" id=\"uptimeGrid\">\n <div class=\"uptime-item\">\n <div class=\"uptime-value\" id=\"uptimeGeneral\">99.9%<\/div>\n <div class=\"uptime-label\">Uptime geral<\/div>\n <\/div>\n <div class=\"uptime-item\">\n <div class=\"uptime-value\" id=\"responseTime\">180ms<\/div>\n <div class=\"uptime-label\">Tempo m\u00e9dio de resposta<\/div>\n <\/div>\n <div class=\"uptime-item\">\n <div class=\"uptime-value\" id=\"incidentsCount\">0<\/div>\n <div class=\"uptime-label\">Incidentes cr\u00edticos<\/div>\n <\/div>\n <div class=\"uptime-item\">\n <div class=\"uptime-value\" id=\"slaGuarantee\">99.5%<\/div>\n <div class=\"uptime-label\">SLA garantido<\/div>\n <\/div>\n <\/div>\n\n \n <div class=\"timeline\">\n <h3 style=\"margin-bottom: 20px;\">Performance <i>7 dias<\/i><\/h3>\n <div class=\"timeline-bars\" id=\"timelineBars\"><\/div>\n <div class=\"timeline-labels\" id=\"timelineLabels\"><\/div>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"section\">\n <div class=\"container\">\n <h2>Hist\u00f3rico de <i>incidentes<\/i><\/h2>\n \n <div class=\"history-list\" id=\"historyList\">\n \n <\/div>\n \n <p style=\"text-align: center; margin-top: 20px;\">\n <a href=\"#\" onclick=\"loadMoreHistory(event)\" style=\"color: var(--primary);\">Carregar mais incidentes \u2192<\/a>\n <\/p>\n <\/div>\n <\/section>\n\n \n <section class=\"section-alt\">\n <div class=\"container\">\n <h2>Manuten\u00e7\u00f5es <i>programadas<\/i><\/h2>\n \n <div id=\"maintenanceContainer\">\n \n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"section\">\n <div class=\"container\">\n <div class=\"subscribe-box\">\n <h2>Receba <i>alerts<\/i><\/h2>\n <p>Assine e receba notifica\u00e7\u00f5es sobre incidentes, manuten\u00e7\u00f5es e atualiza\u00e7\u00f5es do sistema.<\/p>\n \n <div class=\"subscribe-form\">\n <input type=\"email\" class=\"subscribe-input\" id=\"emailInput\" placeholder=\"Seu melhor e-mail\">\n <button class=\"btn\" onclick=\"subscribeNewsletter()\">Assinar<\/button>\n <\/div>\n \n <p style=\"font-size: 0.8rem; margin-top: 20px; color: var(--gray-light);\">\n Voc\u00ea pode cancelar a qualquer momento. N\u00e3o enviamos spam.\n <\/p>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"section-alt\">\n <div class=\"container\">\n <div style=\"text-align: center; max-width: 600px; margin: 0 auto;\">\n <h2>Enfrentando problemas?<\/h2>\n <p>Nossa equipe de suporte est\u00e1 pronta para ajudar com qualquer quest\u00e3o t\u00e9cnica.<\/p>\n <a href=\"https:\/\/wa.me\/\/5547997226971?text=Ol\u00e1,%20preciso%20de%20suporte%20do%20Reinar%20CRM.%20Empresa:%20[NOME%20DA%20EMPRESA]\" class=\"btn\" style=\"margin-top: 20px;\">Abrir chamado<\/a>\n <\/div>\n <\/div>\n <\/section>\n\n \n <div class=\"toast\" id=\"toast\"><\/div>\n\n <footer>\n <div class=\"container\">\n <div class=\"footer-grid\">\n <div class=\"footer-col\">\n <h4>CRM Reinar<\/h4>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/sobre-nos\/\">Sobre n\u00f3s<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/carreiras\/\">Carreiras<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/blog\/\">Blog<\/a>\n <\/div>\n <div class=\"footer-col\">\n <h4>Produto<\/h4>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/funcionalidades\/\">Funcionalidades<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/precos\/\">Pre\u00e7os<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/cases\/\">Cases<\/a>\n <\/div>\n <div class=\"footer-col\">\n <h4>Suporte<\/h4>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/\">Central de ajuda<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/documentacao\/\">Documenta\u00e7\u00e3o<\/a>\n <a href=\"https:\/\/reinarmarketing.com.br\/mkt\/status\/\">Status<\/a>\n <\/div>\n <div class=\"footer-col\">\n <h4>Contato<\/h4>\n <a href=\"mailto:contato@reinarmarketing.com.br\">contato@reinarmarketing.com.br<\/a>\n <a href=\"tel:+5547997226971\">(47) 99722-6971<\/a>\n <\/div>\n <\/div>\n <div class=\"copyright\">\n \u00a9 2024 Reinar Marketing. Todos os direitos reservados.\n <\/div>\n <\/div>\n <\/footer>\n\n <script>\n \/\/ Configura\u00e7\u00f5es\n const CONFIG = {\n UPDATE_INTERVAL: 30000, \/\/ 30 segundos\n SIMULATION_MODE: true,\n COMPANY_FOUNDATION: '2020-01-01'\n };\n\n \/\/ Estado da aplica\u00e7\u00e3o\n let appState = {\n services: [\n { name: 'Plataforma CRM', description: 'Interface web e aplica\u00e7\u00f5es principais', status: 'operational', group: 'core' },\n { name: 'API', description: 'Endpoints e integra\u00e7\u00f5es', status: 'operational', group: 'core' },\n { name: 'Integra\u00e7\u00e3o WhatsApp', description: 'Envio e recebimento de mensagens', status: 'operational', group: 'integrations' },\n { name: 'Webhooks', description: 'Notifica\u00e7\u00f5es em tempo real', status: 'operational', group: 'integrations' },\n { name: 'Painel de M\u00e9tricas', description: 'Dashboards e relat\u00f3rios', status: 'operational', group: 'analytics' },\n { name: 'Automa\u00e7\u00f5es e Bots', description: 'Fluxos automatizados', status: 'operational', group: 'automation' }\n ],\n uptimeHistory: [],\n incidents: [],\n lastUpdate: new Date()\n };\n\n \/\/ Dados simulados realistas (apenas para refer\u00eancia)\n const SIMULATED_INCIDENTS = [\n { type: 'API', description: 'Pico de lat\u00eancia na API durante hor\u00e1rio de pico', duration: 15, severity: 'minor' },\n { type: 'WhatsApp', description: 'Instabilidade no envio de mensagens devido a limita\u00e7\u00f5es da Meta', duration: 45, severity: 'major' },\n { type: 'Webhooks', description: 'Atraso na entrega de notifica\u00e7\u00f5es', duration: 10, severity: 'minor' },\n { type: 'Dashboard', description: 'Lentid\u00e3o no carregamento de relat\u00f3rios', duration: 25, severity: 'minor' },\n { type: 'Automa\u00e7\u00f5es', description: 'Falha em disparos autom\u00e1ticos de e-mail', duration: 20, severity: 'minor' }\n ];\n\n \/\/ Utilit\u00e1rios\n function formatDate(date) {\n return date.toLocaleDateString('pt-BR', { day: '2-digit', month: '2-digit', year: 'numeric' });\n }\n\n function formatDateTime(date) {\n return date.toLocaleDateString('pt-BR', { \n day: '2-digit', \n month: '2-digit', \n year: 'numeric',\n hour: '2-digit',\n minute: '2-digit'\n });\n }\n\n function showToast(message, type = 'info') {\n const toast = document.getElementById('toast');\n toast.textContent = message;\n toast.style.background = type === 'error' ? 'var(--error)' : type === 'warning' ? 'var(--warning)' : 'var(--dark)';\n toast.classList.add('show');\n \n setTimeout(() => {\n toast.classList.remove('show');\n }, 5000);\n }\n\n function updateLastUpdateTime() {\n const now = new Date();\n document.getElementById('updateTime').textContent = formatDateTime(now);\n appState.lastUpdate = now;\n }\n\n function showLoading() {\n document.getElementById('loadingIndicator').style.display = 'inline-block';\n }\n\n function hideLoading() {\n document.getElementById('loadingIndicator').style.display = 'none';\n }\n\n \/\/ Renderiza\u00e7\u00e3o dos status\n function renderStatusCards() {\n const grid = document.getElementById('statusGrid');\n grid.innerHTML = appState.services.map(service => {\n const statusClass = service.status === 'operational' ? '' : service.status === 'degraded' ? 'warning' : 'error';\n const statusText = service.status === 'operational' ? 'Operacional' : \n service.status === 'degraded' ? 'Degradado' : 'Indispon\u00edvel';\n const statusColor = service.status === 'operational' ? 'secondary' : \n service.status === 'degraded' ? 'warning' : 'error';\n \n return `\n <div class=\"status-card\">\n <div class=\"status-indicator ${statusClass}\"><\/div>\n <div class=\"status-info\">\n <div class=\"status-name\">${service.name}<\/div>\n <div class=\"status-desc\">${service.description}<\/div>\n <\/div>\n <div class=\"status-badge ${statusClass}\">${statusText}<\/div>\n <\/div>\n `;\n }).join('');\n }\n\n \/\/ Gerar dados de uptime realistas\n function generateUptimeData() {\n \/\/ Uptime geral entre 99.5% e 100%\n const baseUptime = 99.9;\n const variation = (Math.random() * 0.4) - 0.2; \/\/ -0.2 a +0.2\n const uptime = (baseUptime + variation).toFixed(1);\n \n \/\/ Tempo de resposta entre 150ms e 250ms\n const responseTime = Math.floor(150 + Math.random() * 100);\n \n \/\/ Incidentes cr\u00edticos (0-2)\n const criticalIncidents = Math.floor(Math.random() * 3);\n \n \/\/ SLA entre 99% e 100%\n const sla = (99 + Math.random()).toFixed(1);\n \n document.getElementById('uptimeGeneral').textContent = uptime + '%';\n document.getElementById('responseTime').textContent = responseTime + 'ms';\n document.getElementById('incidentsCount').textContent = criticalIncidents;\n document.getElementById('slaGuarantee').textContent = sla + '%';\n }\n\n \/\/ Gerar timeline de performance\n function generatePerformanceTimeline() {\n const bars = document.getElementById('timelineBars');\n const labels = document.getElementById('timelineLabels');\n \n const days = ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Sex', 'S\u00e1b'];\n const today = new Date();\n \n let barsHtml = '';\n let labelsHtml = '';\n \n for (let i = 6; i >= 0; i--) {\n const date = new Date(today);\n date.setDate(date.getDate() - i);\n \n \/\/ Performance entre 95% e 100%\n const performance = 95 + Math.random() * 5;\n const height = performance * 1.8; \/\/ 180px max\n \n barsHtml += `<div class=\"timeline-bar\" style=\"height: ${height}px;\" data-value=\"${performance.toFixed(1)}\"><\/div>`;\n \n const dayName = days[date.getDay()];\n const dayNumber = date.getDate();\n labelsHtml += `<div class=\"timeline-label\">${dayName} ${dayNumber}<\/div>`;\n }\n \n bars.innerHTML = barsHtml;\n labels.innerHTML = labelsHtml;\n }\n\n \/\/ Gerar hist\u00f3rico de incidentes\n function generateIncidentHistory() {\n const historyList = document.getElementById('historyList');\n const today = new Date();\n \n let incidents = [];\n \n \/\/ Gerar incidentes dos \u00faltimos 30 dias\n for (let i = 0; i < 10; i++) {\n const daysAgo = Math.floor(Math.random() * 30);\n const date = new Date(today);\n date.setDate(date.getDate() - daysAgo);\n \n const incident = SIMULATED_INCIDENTS[Math.floor(Math.random() * SIMULATED_INCIDENTS.length)];\n const hour = Math.floor(Math.random() * 12) + 8; \/\/ 8h \u00e0s 20h\n const minute = Math.floor(Math.random() * 60);\n \n date.setHours(hour, minute);\n \n incidents.push({\n date: date,\n status: 'resolved',\n description: `${incident.description}. Dura\u00e7\u00e3o: ${incident.duration} minutos.`\n });\n }\n \n \/\/ Ordenar por data (mais recentes primeiro)\n incidents.sort((a, b) => b.date - a.date);\n \n historyList.innerHTML = incidents.map(incident => `\n <div class=\"history-item\">\n <div class=\"history-date\">${formatDate(incident.date)}<\/div>\n <div><span class=\"history-status resolved\">Resolvido<\/span><\/div>\n <div class=\"history-desc\">${incident.description}<\/div>\n <\/div>\n `).join('');\n }\n\n \/\/ Gerar manuten\u00e7\u00f5es programadas\n function generateMaintenance() {\n const container = document.getElementById('maintenanceContainer');\n const today = new Date();\n \n \/\/ Pr\u00f3xima manuten\u00e7\u00e3o (entre 1 e 7 dias)\n const nextMaintenance = new Date(today);\n nextMaintenance.setDate(today.getDate() + Math.floor(Math.random() * 7) + 1);\n nextMaintenance.setHours(2, 0); \/\/ 2:00 AM\n \n const endMaintenance = new Date(nextMaintenance);\n endMaintenance.setHours(nextMaintenance.getHours() + 1);\n \n const maintenances = [\n {\n title: 'Atualiza\u00e7\u00e3o de infraestrutura',\n description: 'Otimiza\u00e7\u00e3o de banco de dados e atualiza\u00e7\u00e3o de seguran\u00e7a',\n date: nextMaintenance,\n duration: '60 minutos',\n impact: 'Indisponibilidade prevista de at\u00e9 15 minutos'\n },\n {\n title: 'Upgrade da API WhatsApp',\n description: 'Implementa\u00e7\u00e3o de novos recursos e melhorias de performance',\n date: new Date(nextMaintenance.getTime() + (7 * 24 * 60 * 60 * 1000)),\n duration: '30 minutos',\n impact: 'Sem indisponibilidade esperada'\n }\n ];\n \n container.innerHTML = maintenances.map(m => `\n <div style=\"background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 24px; margin-bottom: 16px;\">\n <div style=\"display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px;\">\n <div>\n <h3 style=\"margin-bottom: 4px;\">${m.title}<\/h3>\n <p style=\"margin: 0;\">${formatDate(m.date)} \u00b7 ${m.date.getHours().toString().padStart(2,'0')}:${m.date.getMinutes().toString().padStart(2,'0')} (hor\u00e1rio de Bras\u00edlia)<\/p>\n <p style=\"color: var(--gray); font-size: 0.9rem; margin-top: 8px;\">${m.description}<\/p>\n <p style=\"color: var(--gray); font-size: 0.9rem;\">${m.impact}<\/p>\n <\/div>\n <span style=\"background: #FFF0D9; color: var(--warning); padding: 6px 16px; border-radius: 30px; font-weight: 600; font-size: 0.85rem;\">Agendado<\/span>\n <\/div>\n <\/div>\n `).join('');\n }\n\n \/\/ Newsletter subscription\n function subscribeNewsletter() {\n const email = document.getElementById('emailInput').value;\n if (!email || !email.includes('@')) {\n showToast('Por favor, insira um e-mail v\u00e1lido', 'error');\n return;\n }\n \n showToast('\u2705 Inscri\u00e7\u00e3o realizada com sucesso! Voc\u00ea receber\u00e1 nossas notifica\u00e7\u00f5es.', 'info');\n document.getElementById('emailInput').value = '';\n }\n\n function loadMoreHistory(event) {\n event.preventDefault();\n showLoading();\n \n setTimeout(() => {\n generateIncidentHistory();\n hideLoading();\n showToast('Mais incidentes carregados', 'info');\n }, 1000);\n }\n\n \/\/ Inicializa\u00e7\u00e3o e atualiza\u00e7\u00e3o peri\u00f3dica\n function updateAllData() {\n showLoading();\n \n \/\/ Simular delay de rede\n setTimeout(() => {\n generateUptimeData();\n generatePerformanceTimeline();\n updateLastUpdateTime();\n renderStatusCards();\n hideLoading();\n }, 800);\n }\n\n \/\/ Inicializar\n function init() {\n renderStatusCards();\n generateUptimeData();\n generatePerformanceTimeline();\n generateIncidentHistory();\n generateMaintenance();\n updateLastUpdateTime();\n \n \/\/ Atualizar a cada 30 segundos\n setInterval(updateAllData, CONFIG.UPDATE_INTERVAL);\n }\n\n \/\/ Executar quando a p\u00e1gina carregar\n document.addEventListener('DOMContentLoaded', init);\n <\/script>\n<\/body>\n<\/html>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Status do Sistema | CRM Reinar REINAR CRM Reinar Sobre n\u00f3s Carreiras Funcionalidades Pre\u00e7os Cases Suporte Status do Sistema Acompanhe a disponibilidade e performance do CRM Reinar em tempo real. \u23f1\ufe0f \u00daltima atualiza\u00e7\u00e3o: Carregando… Status atual dos servi\u00e7os Desempenho dos \u00faltimos 30 dias 99.9% Uptime geral 180ms Tempo m\u00e9dio de resposta 0 Incidentes cr\u00edticos 99.5% […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-page-builder-no-header-footer.php","meta":{"footnotes":""},"class_list":["post-1917","page","type-page","status-publish","hentry"],"yoast_head":"\n<title>Suporte - Reinar Marketing<\/title>\n<meta name=\"description\" content=\"Reinar Marketing\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Suporte - Reinar Marketing\" \/>\n<meta property=\"og:description\" content=\"Reinar Marketing\" \/>\n<meta property=\"og:url\" content=\"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/\" \/>\n<meta property=\"og:site_name\" content=\"Reinar Marketing\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/people\/Reinar-Marketing\/100083967930378\" \/>\n<meta property=\"article:modified_time\" content=\"2026-02-24T00:46:30+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/reinarmarketing.com.br\/mkt\/wp-content\/uploads\/2024\/07\/Captura-de-tela-2024-03-23-153633.png\" \/>\n\t<meta property=\"og:image:width\" content=\"704\" \/>\n\t<meta property=\"og:image:height\" content=\"278\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/central-ajuda\\\/\",\"url\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/central-ajuda\\\/\",\"name\":\"Suporte - Reinar Marketing\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#website\"},\"datePublished\":\"2026-02-21T19:48:45+00:00\",\"dateModified\":\"2026-02-24T00:46:30+00:00\",\"description\":\"Reinar Marketing\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/central-ajuda\\\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/central-ajuda\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/central-ajuda\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"In\u00edcio\",\"item\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Suporte\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#website\",\"url\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/\",\"name\":\"Ag\u00eancia Reinar Marketing\",\"description\":\"Reinar Marketing \u00e9 uma ag\u00eancia Full Service MarTech especializada em branding, marketing digital, automa\u00e7\u00e3o, conte\u00fado e crescimento de marcas.\",\"publisher\":{\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#organization\"},\"alternateName\":\"Ag\u00eancia de Marketing Full Service em Guaramirim, Santa Catarina\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#organization\",\"name\":\"Reinar Marketing\",\"alternateName\":\"Ag\u00eancia Reinar Marketing\",\"url\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/wp-content\\\/uploads\\\/2024\\\/07\\\/Captura-de-tela-2024-03-23-153633.png\",\"contentUrl\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/wp-content\\\/uploads\\\/2024\\\/07\\\/Captura-de-tela-2024-03-23-153633.png\",\"width\":704,\"height\":278,\"caption\":\"Reinar Marketing\"},\"image\":{\"@id\":\"https:\\\/\\\/reinarmarketing.com.br\\\/mkt\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/people\\\/Reinar-Marketing\\\/100083967930378\",\"https:\\\/\\\/www.instagram.com\\\/reinarmarketing\\\/\",\"https:\\\/\\\/youtu.be\\\/xpxrqKEG_c0?si=XS1po4GKUPJdyE5t\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/reinarmarketing\",\"https:\\\/\\\/www.tiktok.com\\\/@reinarmarketing\"]}]}<\/script>\n","yoast_head_json":{"title":"Suporte - Reinar Marketing","description":"Reinar Marketing","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/","og_locale":"pt_BR","og_type":"article","og_title":"Suporte - Reinar Marketing","og_description":"Reinar Marketing","og_url":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/","og_site_name":"Reinar Marketing","article_publisher":"https:\/\/www.facebook.com\/people\/Reinar-Marketing\/100083967930378","article_modified_time":"2026-02-24T00:46:30+00:00","og_image":[{"width":704,"height":278,"url":"https:\/\/reinarmarketing.com.br\/mkt\/wp-content\/uploads\/2024\/07\/Captura-de-tela-2024-03-23-153633.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. tempo de leitura":"4 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/","url":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/","name":"Suporte - Reinar Marketing","isPartOf":{"@id":"https:\/\/reinarmarketing.com.br\/mkt\/#website"},"datePublished":"2026-02-21T19:48:45+00:00","dateModified":"2026-02-24T00:46:30+00:00","description":"Reinar Marketing","breadcrumb":{"@id":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/reinarmarketing.com.br\/mkt\/central-ajuda\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"In\u00edcio","item":"https:\/\/reinarmarketing.com.br\/mkt\/"},{"@type":"ListItem","position":2,"name":"Suporte"}]},{"@type":"WebSite","@id":"https:\/\/reinarmarketing.com.br\/mkt\/#website","url":"https:\/\/reinarmarketing.com.br\/mkt\/","name":"Ag\u00eancia Reinar Marketing","description":"Reinar Marketing \u00e9 uma ag\u00eancia Full Service MarTech especializada em branding, marketing digital, automa\u00e7\u00e3o, conte\u00fado e crescimento de marcas.","publisher":{"@id":"https:\/\/reinarmarketing.com.br\/mkt\/#organization"},"alternateName":"Ag\u00eancia de Marketing Full Service em Guaramirim, Santa Catarina","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/reinarmarketing.com.br\/mkt\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Organization","@id":"https:\/\/reinarmarketing.com.br\/mkt\/#organization","name":"Reinar Marketing","alternateName":"Ag\u00eancia Reinar Marketing","url":"https:\/\/reinarmarketing.com.br\/mkt\/","logo":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/reinarmarketing.com.br\/mkt\/#\/schema\/logo\/image\/","url":"https:\/\/reinarmarketing.com.br\/mkt\/wp-content\/uploads\/2024\/07\/Captura-de-tela-2024-03-23-153633.png","contentUrl":"https:\/\/reinarmarketing.com.br\/mkt\/wp-content\/uploads\/2024\/07\/Captura-de-tela-2024-03-23-153633.png","width":704,"height":278,"caption":"Reinar Marketing"},"image":{"@id":"https:\/\/reinarmarketing.com.br\/mkt\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/people\/Reinar-Marketing\/100083967930378","https:\/\/www.instagram.com\/reinarmarketing\/","https:\/\/youtu.be\/xpxrqKEG_c0?si=XS1po4GKUPJdyE5t","https:\/\/www.linkedin.com\/company\/reinarmarketing","https:\/\/www.tiktok.com\/@reinarmarketing"]}]}},"_links":{"self":[{"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/pages\/1917","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/comments?post=1917"}],"version-history":[{"count":11,"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/pages\/1917\/revisions"}],"predecessor-version":[{"id":1956,"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/pages\/1917\/revisions\/1956"}],"wp:attachment":[{"href":"https:\/\/reinarmarketing.com.br\/mkt\/wp-json\/wp\/v2\/media?parent=1917"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}