index.html

<!DOCTYPE html>
<html lang="pt-br">
<head>

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" 
    crossorigin>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;700&family=Open+Sans:wght@400;700&display=swap" rel="stylesheet">


    <title>Rocket.sect</title>


<link rel="stylesheet" href="style.css">

</head>

<body>

    <div class="page">
        
        <nav>
        
            <a id="logo" href="#">
                <img src="images/logo.svg" alt="logo rocket.sect">

            </a>
        
                <ul>

                <li><a href="#">Início</li></a>
                <li><a href="#">Serviços</li></a>
                <li><a href="#">Contatos</li></a>

                </ul>
            </nav>

    <main>
    
        <img src="images/img1.png" alt="uma mulher ao lado 
        do notebook com um cadeado ao lado">

    <section>

        <h1>Seus dados estão <span>protegidos</span>?</h1>

        <p>
            A informação é fundamental e de <strong>extrema importância</strong> para qualquer empresa.<br/>
            Aqui vai um <strong>texto</strong> como se fosse uma empresa de <span>segurança da informação</span> apresentando o seu produto e com o texto todo estilizado.
        </p>

    </section>

    </main>
  
    <footer>

        <div class="line"></div>

            para mais informações nos siga no instagram <a href="https://instagram.com/rocketsect" target="_blank">@rocketsect</a> 

    </footer>

</div>

<img id="cadeado" src="images/padlock.svg" alt="símbolo de cadeado no canto direito da página">
</body>
</html>