# M5 · «Sinalética»

**Referência:** Induscity — `~/projects/inspira/library/items/2026-08-04-demo2-steelthemes-com/`
**Família:** `corporate-proof-stack` — Corporate proof stack

## O que a família é

> *«Fotografia de trabalho real em full bleed, grotesca pesada por cima, um
> acento quente único sobre navy ou preto, e o corpo a provar-se com números,
> ícones e testemunhos.»*

## Porque é que serve a EAB

É a variante **mais direta e menos sofisticada das cinco, e isso é o ponto**.
Um comprador de componentes para calçado não anda à procura de um ateliê nem de
um mostruário de arquitetura: quer ver o que a fábrica faz, quanto produz e como
se fala com ela. Esta família é a linguagem que ele já reconhece de todos os
fornecedores industriais.

A 1.ª volta não tinha nada assim — era toda contida. Esta é o teste ao extremo
oposto: **e se a EAB falasse alto?**

O acento âmbar tem ainda um argumento próprio: **é a cor da sinalética de
fábrica**, e a EAB é uma fábrica.

## O que copiar da estrutura

- **Hero full-bleed de fotografia de trabalho real**, com grotesca **muito
  pesada em maiúsculas largas** por cima.
- **Eyebrow do hero em versaletes maiúsculas espaçadas.**
- **Títulos de secção em minúsculas de peso médio, com um filete curto do acento
  por baixo** — a assinatura da referência.
- **Blocos de números sobre preto**, a toda a largura.
- **Grelha de cartões com botão-seta** no canto.
- **Secções alternadas** entre branco e `#F4F4F4`.
- **Barra de contacto sempre visível** com telefone e horário — sinalética.
- ⚠️ **`avoid` da família, e é fácil cair nele:** hero com badge + título +
  subtítulo + dois botões + estatísticas a competir pelo mesmo espaço. Escolhe.
  E nada de grelhas de ícones repetidos sem hierarquia.

## A paleta

Na estrutura do original: **branco** · **`#F4F4F4`** em secções alternadas ·
**`#171717`** em menu, rodapé e blocos de números · corpo a **`#6E6E6E`**.

**Acento âmbar `#F2A93D`.** É o do original e é cor de sinalética industrial.

⚠️ **Mede o âmbar sobre branco** — âmbares a esta luminosidade costumam chumbar
em texto pequeno. Se chumbar, o âmbar fica **só em filetes, fundos e ícones**, e
o texto do CTA passa a preto sobre âmbar. Escreve o número no relatório.

⚠️ **O âmbar e a folha verde-oliva da marca não estão na mesma família.** É o
risco cromático desta variante. Se brigarem no header, usa a marca a **1 cor**
(`eab-marca-1cor.svg`) no topo e a versão a cores só onde houver espaço.

## A animação

Direta e afirmativa, como o resto.

- **Contadores** nos blocos de número — é a família da prova por números.
- **Filete do acento a crescer** da esquerda por baixo do título quando a secção
  entra no viewport.
- **Cartões que levantam** ligeiramente no hover, com a seta a deslizar para a
  direita. ⚠️ É a única das cinco onde uma sombra suave é permitida — a família
  admite-a.
- **Barra de progresso do acento** no topo da página.
- Transições curtas (150–250 ms), `ease-out`. Nada contemplativo.

## O risco

**É a que mais depende de fotografia de fábrica, e é a que menos a tem.** O hero
full-bleed de «trabalho real» tem exactamente uma foto candidata — o balancé a
cortar. Se ela não aguentar o full-bleed a 1440 px, a variante cai.

**E é a que mais facilmente parece um template.** A família inteira vem de temas
comerciais. O que a salva ou a afunda é a densidade de dados reais da EAB por
cima da estrutura.