A alteração do html está assim até agora:

            <nav>
                <ul>
                    <li><a href="index.html">Home</a></li>
                    <li><a href="produtos.html">Produtos</a></li>
                    <li><a href="contato.html">Contato</a></li>
                </ul>
            </nav>
 </div>    

Sobre a Barbearia Alura

Localizada no coração da cidade a Barbearia Alura traz para o mercado o que há de melhor para o seu cabelo e barba. Fundada em 2019, a Barbearia Alura já é destaque na cidade e conquista novos clientes a cada dia.

Nossa missão é: "Proporcionar auto-estima e qualidade de vida aos clientes".

Oferecemos profissionais experientes e antenados às mudanças no mundo da moda. O atendimento possui padrão de excelência e agilidade, garantindo qualidade e satisfação dos nossos clientes.

Benefícios

<ul>
 <li class=" itens">Atendimento aos Clientes</li>
 <li class=" itens">Espaço Diferenciado</li>
 <li class=" itens">Localização</li>
 <li class=" itens">Profisionais Qualificados</li>
</ul>

© Copyright Barbearia Alura 2022

E o CSS:

header{ background: #BBBBBB; padding: 20px 0; } .caixa{ position: relative; width: 940px; margin: 0 auto; }

nav { position: absolute; top: 110px; right: 0; }

nav li { display: inline; margin: 0 0 0 15px; }

nav a{ text-transform: uppercase; color: #000000; font-weight: bold; font-size: 22px; text-decoration: none; }

nav a:hover{

 color: #c78c19;
 text-decoration: underline;

}

.produtos{ width: 940px; margin: 0 auto; padding: 50px 0;

}

.produtos li{ display: inline-block; text-align: center; width: 30%; vertical-align: top; margin: 0 1.5%; padding: 30px 20px; box-sizing: border-box; border: 2px solid #000000; border-radius: 10px; }

.produtos li:hover {

 border-color:#c78c19;

}

.produtos li:active {

border-color:#088c19;

}

.produtos Li:hover h2{

font-size: 34px;

}

.produtos h2{ font-size: 30px; font-weight: bold;}

.produto-descricao{ font-size: 18px; }

.produto-preco{ font-size: 22px; font-weight: bold; margin-top: 10px; }

footer {

text-align: center;
background: url("bg.jpg");
padding: 40px 0;

}

.copyright{

color: #ffffff;
font-size: 13px;
margin: 20px 0 0;

}

main{ width: 940px; margin: 0 auto; }

form {

margin: 40px 0; }

form label , form legend { display: block; font-size: 20px; margin: 0 0 10px; }

.input-padrao { display: block; margin: 0 0 20px; padding: 10px 25px; width: 50%; }

.checbox{ margin: 20px; }

.enviar{

width: 40%; padding: 15px 0; background: orange; color: white; font-weight: bold; font-size: 18px; border: none; border-radius: 5px; transition: 1s all; cursor:pointer; } .enviar:hover {

background: darkorange; transform: scale(1.2); }

table{

margin: 20px 0 40px; }

thead{

background: #555555; color: white; font-weight: bold;

}

td , th { border: 1px solid #000000; padding: 8px 15px;

}

/css da página inicial/

.banner{ width: 100%;

}

.tituloprincipal{ text-align: center; font-size: 2em; margin: 0 0 1em; clear: left;

}

.principal p { margin: 0 0 1em;

}

.principal strong { font-weight: bold;

}

.principal em {

font-style: italic; }

.utensilios{

width: 120px; float: left; margin: 0 20px 20px 0; }

.imagembeneficios{ width: 60%;

}