O HAVEN é uma landing page de altíssimo padrão para uma barbearia boutique enraizada em técnicas clássicas. O projeto foi concebido para elevar a experiência de autocuidado masculino através de uma estética de Magazine Editorial, priorizando a tipografia serifada monumental, composições assimétricas e uma narrativa visual imersiva.
- Estética de Santuário: Design inspirado em publicações de luxo, utilizando uma paleta sóbria, texturas orgânicas e um sistema de grid que valoriza o "espaço em branco".
- Ritual Digital: Transições suaves e orquestração de animações que replicam a calma e a precisão de um atendimento premium.
- Arquitetura Global: Sistema de internacionalização (PT/EN) robusto, permitindo uma navegação fluida sem poluição de URLs, focado em SEO e performance.
- The Gentleman's Sanctuary: Um cabeçalho monumental que estabelece a atmosfera de exclusividade e o patrimônio da marca desde o primeiro segundo.
- Scroll-Spy Rituals: Sistema de navegação inteligente que guia o usuário através dos pilares da marca: Ofício, Honra e Maestria.
- Interactive Ledger: Showcase de serviços (Corte Assinatura, Protocolo Haven, Escultura de Barba) com micro-interações de hover e foco em detalhes técnicos.
- The Collective (Team): Carrossel interativo de portraits dos mestres barbeiros, destacando a biografia e especialidade de cada artesão.
- The Path of Perfection: Seção explicativa "How It Works" que detalha as etapas do ritual, da consulta master ao pós-trato.
- Membership Protocols: Sistema de planos de assinatura (Aprendiz, Mestre e Lenda) apresentado com design de cartões de luxo e diferenciação de benefícios.
O projeto utiliza o next-intl com detecção inteligente:
- Cookie-Based Locale: O idioma é gerenciado via
NEXT_LOCALE, mantendo a URL limpa (haven.guibus.dev/) e garantindo persistência na preferência do usuário. - Server-Side Rendering: Todas as mensagens são processadas no servidor, garantindo tempos de carregamento instantâneos e indexação perfeita.
- Tailwind CSS v4: Aproveita o compilador de nova geração para um CSS ultra-otimizado e gerenciamento de variáveis de design complexas.
- Framer Motion 12: Implementação de
useScrolleuseTransformpara efeitos de paralaxe sofisticados e revelação de seções baseada em viewport. - Biome Toolchain: Garantia de código limpo, rápido e padronizado com um dos ecossistemas de linting mais performáticos da atualidade.
