Blog Portfolio - Copy this React, Tailwind Component to your project

Crie-o-frontend-de-um-site-para-um-blog-pessoal-que-também-funcione-como-portfólio.-Aqui-estão-os-requisitos:-1.-Design-Geral:-•-Visual-moderno,-minimalista-e-responsivo.-•-Paleta-de-cores:-branco,-preto,-cinza-com-detalhes-em-uma-cor-primária-de-destaque-(ex:-azul-ou-dourado).-•-Tipografia-limpa-e-legível-(ex:-fontes-como-Poppins-ou-Roboto).-•-Espaçamento-amplo-entre-seções.-2.-Header:-•-Inclua-o-título-do-blog-ou-logo-no-canto-esquerdo.-•-Um-menu-de-navegação-à-direita-com-as-opções:-“Sobre”,-“Blog”,-“Portfólio”-e-“Contato”.-•-Botão-para-alternar-entre-modo-claro-e-escuro.-3.-Página-Inicial:-•-Banner-principal-no-topo-com-um-texto-de-boas-vindas-(ex:-“Bem-vindo-ao-meu-blog-e-portfólio-pessoal!”).-•-Seção-destacando-os-últimos-três-posts-do-blog-com-título,-resumo-e-botão-“Leia-mais”.-•-Uma-seção-para-portfólio-com-imagens-miniaturas-clicáveis-que-redirecionam-para-páginas-específicas.-4.-Página-de-Blog:-•-Lista-de-posts-com-título,-data,-resumo-e-botão-“Leia-mais”.-•-Um-campo-de-busca-no-topo-da-página.-•-Paginação-no-final-da-lista.-5.-Página-de-Portfólio:-•-Galeria-de-projetos-com-imagens-em-grade.-•-Cada-imagem-deve-abrir-uma-página-individual-ao-ser-clicada,-com-detalhes-do-projeto-(título,-descrição,-tecnologias-usadas).-6.-Página-de-Contato:-•-Formulário-com-os-campos:-Nome,-E-mail,-Assunto-e-Mensagem.-•-Botão-“Enviar”.-•-Seção-com-links-para-redes-sociais-(ícones-estilizados).-7.-Rodapé:-•-Links-rápidos-para-“Sobre”,-“Blog”,-“Portfólio”-e-“Contato”.-•-Copyright-com-o-ano-atual-e-o-nome-do-autor.-•-Ícones-das-redes-sociais.-8.-Extras:-•-Animações-suaves-ao-passar-o-mouse-sobre-botões-ou-links.-•-Indicador-visual-de-carregamento-de-página.-•-Código-HTML,-CSS-e-JavaScript-bem-estruturado-e-compatível-com-as-boas-práticas.