Design System — Website Institucional
8 cores fixas extraídas diretamente do logotipo. Nunca usar vermelho ou rosa — conforme briefing do cliente.
Duas fontes do Google Fonts formando um par sofisticado: serif clássico para títulos e sans-serif moderno para corpo e UI.
7 tokens de espaçamento formando uma escala harmônica. Use esses valores nos campos Padding e Margin do Elementor para manter consistência.
5 níveis de border-radius para diferentes contextos, mais 2 níveis de sombra para criar hierarquia visual.
5 variações de botão para diferentes hierarquias de ação. Todos com altura mínima de 44px para garantir acessibilidade mobile.
Padrões visuais que se repetem por todo o site. Crie como Templates Globais no Elementor para reutilização.
Header/Navbar · BG #0B1C33 · Sticky com shadow ao scroll · Logo FN completo · Links Instrument Sans 12px · CTA Gold
Estrutura responsiva em 4 breakpoints com largura máxima de container de 1200px.
| Device | Breakpoint | Container | Colunas | Gutter |
|---|---|---|---|---|
| Mobile | ≤ 767px xs | 100% − 32px | 1–2 colunas | 16px |
| Tablet | 768–1024px md | 720px | 2–3 colunas | 20px |
| Desktop | ≥ 1025px lg | 1200px | 3–4 colunas | 24px |
| Wide | ≥ 1440px xl | 1360px | 4 colunas | 24px |
Landing Pages
Ideal para quem quer gerar resultados rápidos e aumentar as vendas, a Landing Page é a ferramenta certa!
A Landing Page tem um objetivo único e claro: fazer o visitante entrar em contato ou comprar. Tudo é estrategicamente desenvolvido para conduzir a pessoa até o clique final em um ambiente 100% voltado à conversão.
Sites Institucionais
A principal função de um Site Institucional é de apresentar com detalhes os serviços da empresa para o público-alvo com o objeivo de captar novos clientes, fortalecer a marca ou ampliar oportunidades de negócio.
Diferente das redes sociais, um Site Institucional oferece um ambiente profissional e controlado, onde sua marca se destaca e se comunica diretamente com potenciais clientes.