EstadIA

Guia de marca

Cores, tipografia, voz e um prompt pronto para gerar artes e PDFs. Tudo o que uma pessoa — ou uma IA — precisa para falar como o EstadIA.

Documento único para gerar artes, PDFs, posts, apresentações e anúncios do EstadIA. Feito para ser colado inteiro no prompt de uma IA — está tudo aqui, sem depender de arquivo externo.

Fonte da verdade viva: packages/ui/src/tokens.css (cores) e apps/painel/public/icones/ (ícones). Se este documento divergir do código, o código ganha.

1. O que é o EstadIA, em uma frase

O PMS que cuida da sua pousada — calendário à prova de overbooking, reservas diretas com Pix e um agente de IA que atende no WhatsApp.

Para quem: dono e recepção de pousadas, hotéis pequenos, chalés e cabanas no Brasil, de 5 a 30 unidades.

A promessa central: "o funcionário que a pousada nunca conseguiu contratar."

O que NÃO é: não é OTA, não é site de reservas, não é chatbot. É o sistema que a pousada usa por dentro — e que também atende por fora.

2. Conceito visual

Porta aberta com a luz acesa.

Hospitalidade + inteligência. A moldura é a casa; o vão em gradiente é a luz que ficou acesa esperando o hóspede. Toda arte da marca deve caber nessa ideia: acolhimento com tecnologia por trás, nunca tecnologia exibida.

3. Cores

Base

NomeHexUso
Tinta Noturna#0A1B2ETexto, fundos escuros, superfícies. É a cor dominante da marca.
Areia Clara#F7F2EAFundo claro, texto sobre escuro. Bege quente, nunca branco puro.

Gradiente "Pôr do Sol do Rosa" — o acento

linear-gradient(160deg, #FF7A59, #F0508F, #7C5CFC)
NomeHexQuando isolada
Coral#FF7A59Alertas, atenção
Magenta#F0508FDestaque, erro
Violeta#7C5CFCIA, automação, links

Regras de cor:

  • O gradiente é acento, não fundo de página inteira. Ele aparece no botão principal, na luz da porta, em detalhes — nunca como plano de fundo de um cartaz inteiro.
  • Máximo um elemento em gradiente por peça. Dois competem e a peça perde o centro.
  • Fundo escuro (#0A1B2E) é o padrão da marca em peças de marketing.
  • Nunca use branco puro (#FFFFFF) como fundo — é #F7F2EA. O branco gela a marca.
  • Nada de nude, marrom ou laranja-terra. Foram deliberadamente removidos.

Variante do painel (produto)

Dentro do app, a Areia vira Gelo #F4F6FB e o Coral vira Rosa-quartzo #DD7C9F — pastéis frios, porque ali é ferramenta de trabalho e frio cansa menos em oito horas de uso. Em peças de marketing, use a paleta quente da seção acima.

4. Tipografia

Display · Outfit

Aa

A pousada nunca dorme

R$ 249 · 14 UHs

Títulos, números grandes, o nome da marca.

Corpo · Inter

Aa

Todas as unidades e noites numa grade só, atualizando sozinha na tela. Sem recarregar, sem dúvida sobre qual é a verdade.

Texto corrido, legendas, tabelas.

PapelFonteOnde usar
DisplayOutfit (600/700)Títulos, números grandes, o nome da marca
CorpoInter (400/500)Texto corrido, legendas, tabelas

Ambas gratuitas no Google Fonts. Sem terceira fonte, sem fonte decorativa, sem serifada.

Hierarquia: título em Outfit semibold, corpo em Inter regular. O contraste entre as duas é sutil de propósito — a marca não grita.

5. O logotipo

16px

24px

32px

48px

96px

Abaixo de 32px o símbolo deixa de comunicar — a moldura some e sobra uma mancha colorida. Não é opinião: está aí para conferir. Em tamanhos menores, use a letra E sobre bloco Tinta.

Símbolo: porta aberta, moldura em Areia a 28% de opacidade, vão preenchido com o gradiente, maçaneta em Tinta. Fundo Tinta com cantos arredondados (raio 112 em 512 = 22%).

Nome escrito: EstadIA — E e IA maiúsculos, "stad" minúsculo. As duas letras finais em caixa alta são intencionais: é estadia + IA.

Nunca: EstadIa · ESTADIA · Estadia · Estad.IA · EstadAI

Regras:

  • Área de respiro mínima ao redor: metade da altura do símbolo
  • Tamanho mínimo: 32px. Verificado renderizando: a 96 e 48px a porta lê perfeitamente; a 32 ainda lê, mas a moldura já afina; a 24 vira um retângulo e a 16 vira uma mancha colorida. O favicon de 32px está no limite exato — abaixo disso o símbolo deixa de comunicar.
  • Sobre foto, use o símbolo sobre um bloco Tinta — nunca solto
  • Não rotacione, não distorça, não troque as cores do gradiente
Lacuna conhecida: falta uma versão simplificada para ≤24px (moldura mais grossa, sem maçaneta). Enquanto ela não existe, em tamanhos muito pequenos prefira a letra E em Outfit sobre bloco Tinta.

6. Voz

Como o EstadIA fala: direto, quente, sem jargão. Como um colega competente explicando algo — nunca como um manual, nunca como um vendedor.

As cinco regras

  1. Nomeie o problema real, não a funcionalidade. ✅ "A mesma noite vendida duas vezes" ❌ "Sistema de gestão de disponibilidade multicanal"
  1. Fale a língua da pousada, não a da engenharia. ✅ "hóspede", "diária", "noite", "recepção", "UH" ❌ "usuário", "SKU", "inventário", "endpoint", "onboarding"
  1. Concreto vence adjetivo. ✅ "Responde o hóspede, checa disponibilidade, envia o Pix e confirma" ❌ "Solução completa e inovadora de atendimento"
  1. Honestidade sobre limite é parte da voz. ✅ "O contador enxerga só o relatório — nada de tarifas, nada de reservas" ❌ omitir o que o produto não faz
  1. Português do Brasil, sempre. Nada de "booking", "check-in flow", "dashboard". Diga reserva, chegada, painel.

Emoji

Com parcimônia e só onde há afeto real: mensagem ao hóspede (😊 💛 🎒). Nunca em título, em peça institucional ou em material para o dono.

Exemplos aprovados (frases reais do produto)

"Todas as unidades e noites numa grade só, atualizando sozinha na tela. Sem recarregar, sem dúvida sobre qual é a verdade."
"Oi! Amanhã é o grande dia — sua reserva está confirmada e esperamos você."
"Reserva direta economiza a comissão da OTA."

7. Estilo visual das peças

Faça:

  • Fundo Tinta com muito respiro; a peça pode ser 60% espaço vazio
  • Um único ponto de gradiente por peça
  • Cantos arredondados generosos (12–24px)
  • Ícones de traço fino (1.6–1.7px), nunca preenchidos, exceto logos de marca
  • Sombras suaves e baixas, ou nenhuma
  • Fotografia real de pousada: madeira, luz natural, serra ou litoral brasileiro. Nada de banco de imagens genérico de escritório

Não faça:

  • Gradiente cobrindo a peça inteira
  • Mais de duas famílias de cor por peça
  • Ícones 3D, mockups de laptop flutuando, pessoas apontando para gráficos
  • Texto sobre foto sem bloco de contraste
  • Branco puro em qualquer lugar

8. PROMPT PRONTO — cole isto em qualquer IA

Você vai criar uma peça visual para o EstadIA.

MARCA
EstadIA é um sistema de gestão (PMS) para pousadas brasileiras pequenas,
de 5 a 30 unidades. Promessa: "o funcionário que a pousada nunca conseguiu
contratar". Conceito visual: PORTA ABERTA COM A LUZ ACESA — hospitalidade
com tecnologia por trás, nunca tecnologia exibida.

CORES (use exatamente estes valores)
- Tinta Noturna #0A1B2E — cor dominante, fundos e texto
- Areia Clara #F7F2EA — fundo claro e texto sobre escuro. NUNCA branco puro
- Gradiente de acento: linear-gradient(160deg, #FF7A59, #F0508F, #7C5CFC)
- Isoladas: Coral #FF7A59, Magenta #F0508F, Violeta #7C5CFC

REGRAS DE COR
- O gradiente é ACENTO, nunca fundo da peça inteira
- No máximo UM elemento em gradiente por peça
- Fundo padrão de marketing: Tinta #0A1B2E
- Proibido: branco puro, nude, marrom, laranja-terra

TIPOGRAFIA
- Títulos: Outfit, peso 600/700
- Corpo: Inter, peso 400/500
- Nenhuma outra fonte

O NOME
Escreve-se "EstadIA" — E maiúsculo, "stad" minúsculo, IA maiúsculo.
Nunca EstadIa, ESTADIA, Estadia ou Estad.IA.

VOZ (se houver texto)
Português do Brasil, direto e quente, sem jargão. Nomeie o problema real,
não a funcionalidade. Use "hóspede", "diária", "noite", "recepção" — nunca
"usuário", "booking", "dashboard". Concreto vence adjetivo.

ESTILO
Muito respiro (a peça pode ser 60% vazio). Cantos arredondados 12–24px.
Ícones de traço fino 1.6px, nunca preenchidos. Sombras suaves ou nenhuma.
Se usar foto: pousada real brasileira, madeira, luz natural, serra ou
litoral. Proibido: mockup de laptop flutuando, ícone 3D, pessoa apontando
para gráfico, banco de imagem corporativo.

PEÇA A CRIAR
[descreva aqui: formato, tamanho, mensagem principal]

9. Formatos que já existem

ArquivoTamanhoOnde
marca.svgvetor 512apps/painel/public/icones/
icone-192.png · icone-512.pngapp / lojasidem
icone-mascara-512.pngmaskable (Android)idem
apple-icon.png180×180idem
favicon-32.png32×32idem

Ainda faltam (para a Play Store e material de venda): banner 1024×500, capturas de tela do app, capa de apresentação, modelo de proposta em PDF.

10. Endereços oficiais

  • Produto: https://estadia.corpsys.com.br
  • Site de cada pousada: slug.estadia.corpsys.com.br (ou domínio próprio)
  • Privacidade: /privacidade · Termos: /termos