Lista de exercícios | HTML e CSS: ambientes de desenvolvimento, estrutura de arquivos e tags

Boa tarde, aqui está o código e o fisual de como ficou a página:

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Portfolio de Henrique Varga</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <header></header>
    <h1>Explorando a Tecnologia: Meu Caminho em <strong>Desenvolvimento de sistemas e Soluções Tecnológicas</strong></h1>
    <p>Olá! Sou Henrique Varga, estudante em análise em desenvolvimento de sistemas. Quero poder evoluir profionalmente na área da técnologia, estudar novos idiomas além dos que já conheço e resolver desafios para poder adquir mais conhecimentos sobre. Vamos conversar?</p>
   
    <a href="https://instagram.com/henrique_varga">Instagram</a>
    <a href="https://github.com/VargaHenrique">Github</a>
   
    
    <div class="fotoPerfil">
    <img src="Foto minha.jpg" alt="fotoDoHenrique"  height="500px" width="350px">
    </div>
    
    <footer>
        <ul>
            <li>Email: rique******@gmail.com</li>
            <li>Telefone: ***********</li>
        </ul>
    </footer>
</body>
</html>

CSS:

body{
    background-color: indigo;
    color: white;
    
    font-family:Arial, Helvetica, sans-serif;
    margin: 15px;
}

p{
    display: flex;
    width: 40%;
    font-size: larger;
    margin-left: 240px;
}

h1{
    width: 40%;
    margin-top: 10%;
    margin-left: 240px;
}

a{
  color:chartreuse;
  margin-left: 245px;
  
}

.fotoPerfil{
display: flex;
justify-content: end;
margin-top: -20%;
margin-right: 240px;
}

strong{
    color: darkorange;
}

Insira aqui a descrição dessa imagem para ajudar na acessibilidade