South Import's

Segundo o próprio site, a South Import's vende iPhone, iPad, Mac, Apple Watch, AirPods, consoles e acessórios sempre lacrados e originais, com atendimento pessoal em São Leopoldo e no Vale do Sinos (Novo Hamburgo, Sapucaia do Sul, Estância Velha, Portão, Campo Bom e Canoas) e envio com rastreio para o resto do Brasil. A loja é tocada por dois atendentes, o Gabriel e o João, tio e sobrinho, que respondem pessoalmente pelo WhatsApp antes, durante e depois da compra. O site não vende online: ele apresenta o estoque, explica a diferença entre os modelos e leva a conversa para o WhatsApp de um dos dois.

Desenhamos a página inicial para parecer uma vitrine, não um formulário. O topo reúne um bloco de texto com o título e a chamada ao lado de uma galeria em cascata com fotos reais do estoque e do atendimento, em três colunas. A ordem das seções segue a lógica de uma visita à loja: diferenciais de atendimento, uma seção de rolagem que troca o texto e a foto a cada passo (Atendimento de Verdade, Direto da Fonte, Tudo Explicado), os três passos da compra, uma chamada para a linha completa de produtos, o texto institucional por categoria (iPhone, iPad, Mac pessoal, profissional e para empresas, Apple Watch e acessórios), os guias do blog, depoimentos e perguntas frequentes. Cada seção termina ou cruza com um convite ao WhatsApp. No celular, a seção de rolagem vira uma lista empilhada, porque sua versão de desktop depende da altura da viewport. Dentro da identidade da South Import's, o visual usa fundo claro, tipografia Manrope, navy escuro na barra superior e no rodapé e dourado nos acentos: ícones, numerais e o logotipo.

Desenvolvemos o site com Vite, JavaScript e Tailwind CSS. A fonte Manrope é servida do próprio domínio; um comentário no código registra que isso evitou um carregamento bloqueante do Google Fonts que custava cerca de 3,6s na primeira pintura. O JSON-LD reúne loja, site, página e perguntas frequentes num só grafo, com geolocalização e área de atendimento. O FAQ é nativo, em elementos <details> e <summary>, com dados estruturados FAQPage correspondentes. O blog é gerado a partir de arquivos Markdown por um script próprio, comentado no código, e hoje reúne 14 guias de compra sobre iPhone, iPad, Mac, garantia e procedência. O botão flutuante do WhatsApp abre um menu com os dois atendentes, Gabriel e João, cada um com seu próprio link de conversa. Não identificamos Google Tag Manager, Analytics, Meta Pixel nem Clarity instalados.

• Galeria em cascata no hero, com fotos reais do estoque e do atendimento em três colunas.
• Seção de rolagem no desktop que troca texto e imagem em três passos, e vira lista empilhada no celular.
• Blog com 14 guias de compra, gerado a partir de arquivos Markdown, com dados estruturados de Blog e BreadcrumbList.
• Botão flutuante do WhatsApp que abre um menu com os dois atendentes, Gabriel e João, cada um com seu link próprio.
• FAQ nativo em acordeão (<details>/<summary>), com dados estruturados FAQPage que replicam as mesmas cinco perguntas.