COMPONENTES · 05 · CARDS
A família inteira

Cards

Oito papéis, um contrato de hover. Todos usam raio de 18px, hairline e sombra pequena em repouso, porque elevação no Celere vem de sombra somada a hairline, nunca de sombra pesada.

5.1 · CARD DE SOLUÇÃO
F1 Viabilidade

Budget Paramétrico

O orçamento que viabiliza apenas bom negócio, ainda na compra do terreno. Indicador por m² em cima de base própria de 737 projetos.

F4 Executivo

Budget Analytics

A base única de informação para gerenciar a obra: EAP de 8 níveis, composição por serviço e insumo com preço rastreado.

F7 Execução

Acompanhamento de Prazos

Baseline contra replanejado, programação semanal e causa de não cumprimento padronizada em 19 códigos.

5.2 · CARD DE PROJETO

// a "foto" é composição de CSS: degradê de céu, malha de blueprint, silhueta de torre com laje a cada 9px, grua em SVG e cota de medição. Zero arquivo externo.

REV01 · 2026
Times Square LB in Incorporadora · Fortaleza, CE
Área construída
9.246,924 m²
Área privativa
7.832,844 m²
Custo orçado
R$ 23,9 mi
F5 · PLANEJAMENTO
Portal 5 Ponta Negra1.388 tarefas no cronograma

Cronograma replanejado em abril

O card inteiro é clicável, mas o link envolve só o título, que é o rótulo real do destino. O pseudo-elemento estende a área de clique até a borda.

Tarefas1.388
Críticas425
Atraso mediano111 d
5.3 · MÉTRICA E KPI
Custos orçados
+0bi

em custo de construção orçado pela Celere

fonte única · stats.ts
Projetos
+0

projetos entregues em 11 anos de operação

fonte única · stats.ts
Área
+0mi m²

de área em projeto orçado e fiscalizado

fonte única · stats.ts
Clientes
+0

incorporadoras e construtoras atendidas

fonte única · stats.ts
Desembolso acumulado · Times Square
39,1%
−5,2 pp
JAN 2024ABR 2026
realizado previsto você está aqui
Restrições pendentes por semana
366
+117 vencidas
S1 JANS4 ABR
pendentes meta de 300 semana corrente
5.4 · CARD DE OBRA

Times Square

LB in · REV01 · 1.937 nós
Atenção
Avanço físico41%
Avanço financeiro39,1%
TÉRMINO 31/12/2026 · 17 DIAS ALÉM DA BASE
−3 pp Abrir a obra

Casa Romana

Casa Forte · REV03 · 862 nós
No prazo
Avanço físico67%
Avanço financeiro64,8%
TÉRMINO 18/08/2026 · ADERENTE À BASE

Portal 5 Ponta Negra

Portal 5 · REV02 · 1.388 tarefas
Atrasado
Avanço físico22%
Avanço financeiro30,3%
FINANCEIRO À FRENTE DO FÍSICO EM 8,3 PP
−16 pp Abrir a obra

// duas barras no mesmo card contam a história inteira: dinheiro saindo na frente do serviço executado é o sinal clássico de medição paga adiantada. O tick laranja é o previsto do mês.

5.5 · ALERTA DE DESVIO E ESTADO VAZIO

Alvenaria 15 pontos abaixo do previsto

Realizado em 46% contra 61% previstos para abril. O pacote responde por 8,79% do orçamento, então o impacto no desembolso do próximo mês é relevante.

SEMÁFORO PPP · JUSTIFICAR · SEMANA S4 DE 27 A 30/04

Nenhuma medição lançada em maio

A programação de maio já existe, mas ninguém lançou avanço ainda. Comece pelas 26 folhas executáveis da semana S1.

Nenhuma restrição vencida nesta frente

As 12 restrições da estrutura foram removidas dentro do prazo. Nada exige decisão aqui.

Ver todas as frentes
5.6 · O HOVER CORRETO
Certo
Passe o cursor aquia imagem cresce, o card fica parado

Sombra pequena vira média, hairline vira teal, imagem dá zoom de 1,05 dentro do overflow: hidden. Geometria do card intacta.

Errado, não repita
Passe o cursor na borda de baixoo card foge do ponteiro e pisca

Este card translada 14px e escala 1,03 no hover. Aproxime o cursor pela borda inferior e ele entra em laço de entra e sai.

Por que nunca se translada o elemento que recebe o hover

O :hover é resolvido pela posição do ponteiro sobre a caixa do elemento. Se o próprio elemento que ganhou o hover se move, ele pode sair de baixo do cursor: o navegador então perde o hover, devolve o card para a posição original, o cursor volta a estar sobre ele, o hover reacende, e o ciclo se repete a cada quadro. É o flickering clássico, e ele acontece exatamente na borda que o dedo ou o mouse mais usa.

Em toque a coisa fica pior: no celular não existe hover, mas existe o estado grudado depois do tap, e um card que se desloca 14px joga o conteúdo para fora do ponto que a pessoa acabou de tocar. Além disso translada e escala forçam nova composição da camada inteira, o que custa quadro em lista longa de obra.

A saída é a do DS: mover o que está dentro, nunca a caixa. Sombra e cor da hairline mudam sem alterar geometria, e a imagem cresce presa a um contêiner com overflow: hidden. O card continua exatamente onde estava, e o cursor nunca perde o alvo.

// :focus-within repete o efeito de hover, porque quem navega por teclado merece o mesmo destaque de quem navega com mouse.

// count-up roda uma vez por card, no primeiro momento em que ele entra na viewport, e em prefers-reduced-motion o número já aparece no valor final.