Crie um website completo, sofisticado, responsivo e funciona...

Prompt

Crie um website completo, sofisticado, responsivo e funcional para **Óticas Zarref International**, uma ótica localizada no Centro de Salto, São Paulo, Brasil. **Objetivo:** desenvolver uma experiência digital de altíssima qualidade, que transmita confiança, elegância e modernidade, incentive visitas à loja física e gere contatos pelo WhatsApp. **Direção visual:** - Estética premium editorial, inspirada em boutiques internacionais de eyewear. - Design original, sofisticado, minimalista e com forte identidade visual. Evite aparência genérica de template ou de site produzido por IA. - Paleta elegante em tons de marfim, grafite e verde-petróleo, com detalhes em dourado discreto. - Tipografia expressiva, imagens impactantes, excelente hierarquia visual, espaçamento refinado e animações sutis. - Interface impecável em desktop e dispositivos móveis. **Elementos obrigatórios:** 1. Header elegante, navegação funcional, logo tipográfico da Zarref e botão de contato. 2. Hero premium com composição visual marcante, título memorável e CTA principal. 3. Coleção visual de armações de grau, óculos de sol e modelos contemporâneos, com filtros funcionais. 4. Cards sofisticados de produtos com imagens ou ilustrações de qualidade, sem inventar preços, marcas comercializadas ou disponibilidade de estoque. 5. Experiência interativa "Encontre seu estilo": um guia de três etapas que recomenda estilos de armações conforme preferências do visitante. 6. Seção sobre a ótica, destacando atendimento personalizado e escolha assistida de óculos, sem inventar história, certificações ou dados comerciais. 7. Seção editorial sobre tipos de lentes e conforto visual, com informações responsáveis e sem alegações médicas não comprovadas. 8. Depoimentos: não inventar avaliações reais. Se necessário, criar um layout demonstrativo claramente identificado como exemplo. 9. Seção de localização e contato com referência a Salto, SP, e espaço para endereço, horário e telefone confirmados. 10. Rodapé completo com navegação, contato e links relevantes. **Funcionalidades:** - Menu mobile funcional. - Filtros de coleção que realmente alterem os itens exibidos. - Guia interativo de escolha de armações com resultados diferentes. - Transições suaves e animações responsivas. - Botões funcionais, inclusive navegação e contato. - Acessibilidade básica, HTML semântico, estados de foco e contraste apropriado. **Qualidade técnica:** - Gere uma implementação completa, pronta para visualização. - Priorize HTML, CSS e JavaScript em um arquivo HTML autossuficiente para facilitar testes entre plataformas. - Não dependa de backend, credenciais ou API. - Imagens externas só se forem confiáveis e utilizáveis; caso contrário, use ilustrações SVG elegantes. - Não deixe botões decorativos sem ação. - Não use lorem ipsum, blocos incompletos ou conteúdo genérico. - Não invente promoções, preços, garantias ou marcas comerciais. - Otimize para performance, responsividade e SEO local básico. **Critério final:** o resultado precisa parecer um site que uma agência de alto nível apresentaria a uma ótica premium, com acabamento visual profissional e interações realmente utilizáveis. Não explique o planejamento nem faça perguntas. Implemente diretamente o site completo e apresente uma prévia funcional quando o ambiente permitir.