⚡ PORTAL MELHOR SABER |
• Quilombo Xambá, em Olinda (PE), oferece curso gratuito que une música, tecnologia e criação de instrumentos - Brasil de Fato • Teoria da Internet Morta: conspiração pode estar se tornando realidade? - CNN Brasil • Procon-PB leva tecnologia ao Maior São João para identificar metanol em bebidas - ParaibaOnline • S&P 500 e Nasdaq caem com Broadcom prejudicando ações de tecnologia - MSN • Por que o bitcoin (BTC) está caindo: IA, IPOs de tecnologia, computação quântica, temores de venda da Strategy convergem, diz NYDIG - CoinDesk • Neymar usa esteira com tecnologia da Nasa para tratar lesão na panturrilha - O POVO • Tecnologia dos drones que iluminam os shows de Alok será usada para lançar 67 espécies de sementes do alto e reflorestar duas áreas degradadas da Mata Atlântica em Barra Bonita - CPG Click Petróleo e Gás • Neymar usa esteira com tecnologia da Nasa para tratar lesão na panturrilha - Terra • Asfalto apresenta falhas em avenida que liga polos de educação e tecnologia em VG - vgnoticias.com.br • Verão é a janela mais provável para ataque dos EUA a Cuba, diz empresa chinesa de tecnologia de defesa - O Cafezinho • • Quilombo Xambá, em Olinda (PE), oferece curso gratuito que une música, tecnologia e criação de instrumentos - Brasil de Fato • Teoria da Internet Morta: conspiração pode estar se tornando realidade? - CNN Brasil • Procon-PB leva tecnologia ao Maior São João para identificar metanol em bebidas - ParaibaOnline • S&P 500 e Nasdaq caem com Broadcom prejudicando ações de tecnologia - MSN • Por que o bitcoin (BTC) está caindo: IA, IPOs de tecnologia, computação quântica, temores de venda da Strategy convergem, diz NYDIG - CoinDesk • Neymar usa esteira com tecnologia da Nasa para tratar lesão na panturrilha - O POVO • Tecnologia dos drones que iluminam os shows de Alok será usada para lançar 67 espécies de sementes do alto e reflorestar duas áreas degradadas da Mata Atlântica em Barra Bonita - CPG Click Petróleo e Gás • Neymar usa esteira com tecnologia da Nasa para tratar lesão na panturrilha - Terra • Asfalto apresenta falhas em avenida que liga polos de educação e tecnologia em VG - vgnoticias.com.br • Verão é a janela mais provável para ataque dos EUA a Cuba, diz empresa chinesa de tecnologia de defesa - O Cafezinho • • Quilombo Xambá, em Olinda (PE), oferece curso gratuito que une música, tecnologia e criação de instrumentos - Brasil de Fato • Teoria da Internet Morta: conspiração pode estar se tornando realidade? - CNN Brasil • Procon-PB leva tecnologia ao Maior São João para identificar metanol em bebidas - ParaibaOnline • S&P 500 e Nasdaq caem com Broadcom prejudicando ações de tecnologia - MSN • Por que o bitcoin (BTC) está caindo: IA, IPOs de tecnologia, computação quântica, temores de venda da Strategy convergem, diz NYDIG - CoinDesk • Neymar usa esteira com tecnologia da Nasa para tratar lesão na panturrilha - O POVO • Tecnologia dos drones que iluminam os shows de Alok será usada para lançar 67 espécies de sementes do alto e reflorestar duas áreas degradadas da Mata Atlântica em Barra Bonita - CPG Click Petróleo e Gás • Neymar usa esteira com tecnologia da Nasa para tratar lesão na panturrilha - Terra • Asfalto apresenta falhas em avenida que liga polos de educação e tecnologia em VG - vgnoticias.com.br • Verão é a janela mais provável para ataque dos EUA a Cuba, diz empresa chinesa de tecnologia de defesa - O Cafezinho •
| 24 HORAS COM VOCÊ ⚡

PMS — Manual de Estilo e Design (v4.2)

Princípio Central

O Portal Melhor Saber não é um site comum.
É uma infraestrutura de percepção, leitura e decisão.

Cada escolha foi definida com base em:

  • Padrões dos maiores portais globais
  • Neurociência cognitiva
  • Teoria das cores aplicada à conversão
  • Engenharia de leitura digital

Nada é aleatório.
Tudo é intencional.


1. Filosofia do Design

Clareza gera confiança
Interfaces limpas reduzem esforço mental.

Hierarquia guia o cérebro
O usuário não lê, ele escaneia.

Contraste direciona atenção
O olho segue o que se destaca.

Consistência gera autoridade
Padrão repetido fortalece a marca.


2. Sistema de Cores

O PMS utiliza três pilares:

Autoridade (Verde Petróleo)
Confiança, estabilidade, inteligência.

Ação (Verde CTA)
Cliques, decisões, conversão.

Sofisticação (Dourado + Champanhe)
Valor, exclusividade, percepção premium.

Fundamento científico:
Verde → segurança e progresso
Escuro → credibilidade
Claro → conforto visual
Dourado → percepção de valor

Resultado: interface que guia e converte.


3. Sistema Tipográfico

Escaneabilidade máxima com esforço mínimo

Base:
Fonte Inter
Sistema clamp responsivo
Hierarquia progressiva
Peso de 800 a 400

Como o cérebro lê:
Impacto → seleção → profundidade

Decisões:

Títulos grandes
Baseados em Apple, Stripe e portais globais
Objetivo: capturar atenção

Texto principal em 16px
Menor esforço, maior retenção

Texto mínimo em 11px
Uso exclusivo para metadados

Ajustes finos:
Letter-spacing controlado
Line-height progressivo
Equilíbrio de peso


4. Sistema Responsivo

Uso de clamp()

Permite:

  • Menos complexidade
  • Fluidez entre telas
  • Melhor performance

Funcionamento:
Mínimo (mobile)
Escala fluida
Máximo (desktop)


5. Experiência e Comportamento

O PMS foi projetado para:

  • Reduzir esforço de leitura
  • Aumentar permanência
  • Facilitar decisão

Efeitos:
Leitura mais rápida
Menos fadiga
Mais retenção
Mais conversão


6. Padrão Global e Diferencial

Segue:
Boas práticas globais
Legibilidade
Estrutura moderna

Diferencia:
Clareza agressiva
Sistema simples (MISMIC)
Foco em conversão


7. Visão de Longo Prazo

O PMS é:

  • Escalável
  • Automatizável
  • Consistente
  • Atemporal

Objetivo:

  • Máquina de conteúdo
  • Ativo digital contínuo
  • Autoridade automatizada

Conclusão

O PMS não é apenas design.

É:

  • Engenharia de percepção
  • Arquitetura de atenção
  • Sistema de decisão

Fluxo:
Olhar → leitura → ação


Fechamento

  • Sistema coerente
  • Base científica válida
  • Alinhado ao mercado global
  • Pronto para escalar

Global Colors

1. VERDE PETRO (#0A2A30)
2. PETROL DARK (#051A1E)
3. VERDE CTA (#2BA745)
4. CTA HOVER (#34C759)
5. DOURADO (#C5A059)
6. BG ÁGUA (#F6FBFB)
7. BEGE/CHAMP (#F4EBDD)
9. BRANCO (#FFFFFF)
10. TEXT BOLD (#121212)
11. TEXT REG (#333333)
12. TEXT MUTED (#666666)

Hierarquia Tipográfica

01. Header XL
Size: clamp(2.5rem, 5vw, 3.375rem) [40-54px] | Weight: 800 | LH: 1.1
Portal Melhor Saber
02. Header L (H1)
Size: clamp(2rem, 4vw, 2.75rem) [32-44px] | Weight: 800 | LH: 1.15
Análises Estratégicas
03. Header M (H2)
Size: clamp(1.75rem, 3vw, 2.25rem) [28-36px] | Weight: 700 | LH: 1.2
IA Aplicada aos Negócios
04. Header S (H3)
Size: clamp(1.5rem, 2.5vw, 1.875rem) [24-30px] | Weight: 700 | LH: 1.3
Seção de Destaque
05. Header XS (H4)
Size: clamp(1.25rem, 2vw, 1.5rem) [20-24px] | Weight: 600 | LH: 1.4
Sub-título
06. Text L
Size: clamp(1.125rem, 1.5vw, 1.25rem) [18-20px] | Weight: 400 | LH: 1.6
Texto de Apoio Premium
07. Text M (CORPO)
Size: 1rem (16px) | Weight: 400 | LH: 1.6
Corpo do texto principal.
08. Text S
Size: 0.875rem (14px) | Weight: 400 | LH: 1.5
Texto de apoio.
09. Text XS
Size: 0.6875rem (11px) | Weight: 400 | LH: 1.4
Data/Tags (metadados).

Botões de Ação

Botão S — Compacto

Botões de Ação

Hierarquia Tipográfica

Header XL (40px)
Header H1 (36px)
Corpo M (16px)
Rolar para cima

Portal Melhor Saber

Conecte de forma rápida e segura usado login social de sua preferência: