02 / 05Petit Comité
Brunch
R$ 198 por pessoa
Mesa de brunch completa com volante — queijo quente, toast de brie com mel, ovinhos mexidos com farofa de bacon.
Duração 3h · hora extra R$ 45
Design system
Guia de estilo do Clericot
Tokens, tipografia, componentes e animações usados no site — derivados do sistema editorial open-design.ai e re-tokenizados para a identidade Tropical Chique.
01
Cores
Linhas: rgba(30,58,38,.16/.08/.05) · sombra: 0 30px 60px -30px rgba(30,58,38,.25) · raio: 18px (cards) / 999px (pílulas)
02
Tipografia
A vida é melhor na praia.
Um cardápio pra cada hora do dia
Do primeiro café coado ao pôr do sol com uma taça de Clericot — tudo com os pés na areia da Curva da Jurema.
Cafeteria · cozinha autoral · Nº 01
20.31° S · 40.29° W
a vida e melhor na praiaRegra: a Halimun aparece sozinha — slogan, palavra dos azulejos, numerais por extenso, citação. Nunca dentro de uma frase em Filson.
LightBookRegularMediumBoldHeavyBlackItálico
03
Botões, pílulas e tags
Todos07Manhã01TodosMais pedidosMais pedidoNovoSazonalTemporada aberta
04
Componentes
01Semanal
Yoga na Praia
Aulas de frente pro mar, para todos os níveis — com café da manhã leve depois.
Item de cardápio
Entradas para compartilhar02
- Ceviche ClássicoMais pedidoR$ 88
Peixe branco cru muito fresco, cozido na acidez do limão, cebola roxa, coentro, pimenta dedo de moça e leite de tigre.
- Lula na ManteigaNovoR$ 92
Alho, ervas frescas e limão-siciliano. Servida com torradas.
Card Petit Comité
05 / 05Petit Comité
Buffet Clericot
R$ 366 por pessoa
Mesa buffet completa + volante circulante.
Duração 4h · hora extra R$ 85
FAQ
01Quais são os horários do Clericot?+
A cafeteria funciona das 07h às 19h; o Menu Praia é servido a partir das 11h.
05
Animações (SVG + CSS, recriadas a partir dos vídeos originais)
Assinatura: contorno real do wordmark (vetorizado do ativo oficial) revelado por uma máscara de 13 traços na ordem e no tempo reais de escrita (0,02 s → 1,8 s); “CAFÉ” em Filson Pro Medium sobe com overshoot aos 2,0 s. logo-clericot-anim.svg · 12 KB · cor via currentColor.
Ondas: 3 faixas com a geometria do ativo oficial (logo/Ativo 2ondas.png), pintadas por máscara com o tempo e a direção do vídeo (inferior ← 0,07–0,53 s · média a partir de 77% · superior ← 0,4–1,0 s) e flutuação infinita. ondas.svg · 12,6 KB.
Originais convertidos (opcionais)
assinatura-clericot.webm (VP9 alpha, 136 KB) · …-hevc-alpha.mov (HEVC alpha, 349 KB — Safari)
ondas.webm (VP9 alpha, 882 KB) · ondas-hevc-alpha.mov (812 KB). Formato original 9:16 (Stories).
Ilustração vetorial (do PDF “capa café na praia”)
Extraída do vetor logo/capa-cafe-ma-praia_vetor.pdf (28 caminhos) — inline, verde em currentColor, sol em --sun, recortes em --scene-bg. Arquivos: cena-praia.svg, capa-cafe-na-praia.svg (capa completa).
Borda de ondas (divisor)
Vetorizada do PNG do protótipo · borda-ondas.svg · usada no topo do rodapé e na base dos heros internos.
06
Ícones (traço 2, currentColor, viewBox 48)
Glifos de origem (80×30)
beanflameleafcupbottlebubblesbowl
07
Movimento
- Reveal no scroll: [data-reveal] opacidade + 28px, .9s, ease-out (cubic-bezier(.22,1,.36,1)), escalonado a cada 90ms.
- Header: esconde ao rolar para baixo (>100px) e volta ao subir.
- Ticker: marquee-x 60s/74s linear, pausa no hover.
- Tudo respeita prefers-reduced-motion.