NAC2

<!DOCTYPE html>
<html lang="pt-br" dir="ltr">

<head>
  <meta charset="utf-8">
  <title>.DEV</title>
  <link rel="stylesheet" href="./css/reset.css">
  <link rel="stylesheet" href="./css/style.css">
</head>

<body>
  <!-- aqui ficará todo o conteúdo da página -->
  <div class="container">
    <!-- área do cabeçalho principal - terá a logo e o menu -->
    <header class="cabecalho-principal">
      <!-- área da logo -->
      <section class="logo">
        <h1 class="texto-logo"><span class="azul">.DEV</span>COM</h1>
      </section>
      <!-- fim da área da logo -->

      <!-- menu principal -->
      <nav class="menu-principal">
        <ul>
          <li><a href="#">Clientes</a></li>
          <li><a href="#">Produtos</a></li>
          <li><a href="#">Serviços</a></li>
          <li><a href="#">Contato</a></li>
        </ul>
      </nav>
      <!-- fim do menu principal -->
    </header>
    <!-- fim da área do cabeçalho principal -->

    <section class="banner">
      <h2 class="texto-banner">Lorem ipsum dolor sit amet, consectetur adipisicing</h2>
    </section>

    <main class="conteudo-principal">
      <section class="conteudo-box">
        <img src="images/drop.png" alt="">
        <h2 class="titulo-box">Lorem</h2>
        <p class="texto-box">
          Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
        </p>
        <p>
          <a href="#" class="meus-links">Mais...</a>
        </p>
      </section>

      <section class="conteudo-box">
        <img src="images/drop3.png" alt="">
        <h2 class="titulo-box">Lorem</h2>
        <p class="texto-box">
          Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
        </p>
        <p>
          <a href="#" class="meus-links">Mais...</a>
        </p>
      </section>

      <section class="conteudo-box">
        <img src="images/drop2.png" alt="">
        <h2 class="titulo-box" >Lorem</h2>
        <p class="texto-box">
          Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod.
        </p>
        <p>
          <a href="#" class="meus-links">Mais...</a>
        </p>
      </section>
    </main>