Essência.

• producto físico que se ve bien en render o foto de estudio
• marca con tonos ámbar, miel, cobre o rosé
• venta con experiencia presencial (atelier, cata, sesión)
• catálogo corto de 4 a 8 ítems

• servicio sin producto físico
• catálogo grande con filtros
• marca infantil o colorida
• público con celulares antiguos (3D pesado; queda el póster)

Tono

Identidade

• Preto quente e marfim. Fundo #0e0b09, texto #f2ebe1, cinza quente #b0a396 para apoio. A interface quase não tem cor: âmbar, mel e rosa-fumê moram dentro do vidro (renders 3D). O mel #e6b97a aparece só em detalhes (notas olfativas, números de etapa, pirâmide, foco).
• Peça central: uma fita grossa de vidro âmbar atravessa o hero e faz uma volta, como o rastro de um perfume. É 3D de verdade (three.js), ao vivo, com um poster renderizado offline do mesmo quadro.
• Tipografia: Funnel Display (títulos, peso ~420, tracking -0.035em, entrelinha 0.95) e Funnel Sans (texto). Títulos grandes e calmos; nenhum rótulo em cima do título.
• Frascos como foto de produto: seis frascos modelados em three.js (tijolo, cubo e cilindro de vidro grosso, tampas de latão, pedra ou ébano, rótulo de papel), fotografados num fundo infinito escuro com pedestal de pedra.

Regras

• Cor viva só dentro das peças 3D/fotos. Botões, cards e fundos ficam em preto quente, marfim e bordas #3a3029. Sem brilho, sem gradiente decorativo, sem vidro na interface (a única sombra é a de leitura sob o título do hero).
• Um h1 (o título do hero, sempre em duas linhas: a segunda em marfim a 60%).
• Cantos: pílula para ações, 6px para imagens; o resto é linha fina.
• Números só quando são fato do negócio (concentração, ml, dias de maturação, preço de exemplo). Sem prova social.
• Foco visível em mel; contraste AA do texto de apoio (#b0a396 sobre #0e0b09).
• Mobile: hero em 100svh com o poster em retrato; coleção com rolagem lateral; pirâmide antes dos textos.

Adaptar à marca do cliente

• Cor da fita: troque as três cores por vértice (ambar, mel, rosa) e o attenuationColor em cena-fita.ts; rode yarn tsx scripts/essencia-render.ts fita para regerar os posters.
• Forma da fita: edite CAMINHO (pontos da curva), LARGURA, ESPESSURA e VOLTAS. O enquadramento por proporção de tela está em ajustar().
• Produtos: em scripts/essencia-cena.ts, a lista perfumes define forma, tampa e cor do líquido de cada frasco. Com fotos reais do cliente, basta trocar img no content.ts (4:5, fundo escuro).
• Outros nichos que vivem do mesmo esqueleto: vela aromática, gin artesanal, vinho natural, joalheria, chocolate: troque a pirâmide por "camadas" do produto (ex.: notas de degustação) e o ateliê pela experiência presencial.
• Tokens em tokens.css (--d-*); fontes Funnel Display e Funnel Sans (Google Fonts).