Seguindo em frente | HTML e CSS: Classes, posicionamento e Flexbox

Index.html

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Meu Portfolio</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header><img src="img/logoone.png" alt="Logo ONE"></header>
    <main>
        <h1>Eleve seu negócio digital a outro nível <strong class="titulo-destaque">com um Front-end de qualidade!</strong></h1>
        <p>Olá! Sou <strong class="texto-destaque">André Lopes</strong>, desenvolvedor Front-end com especialidade em <strong class="texto-destaque">React, HTML e CSS.</strong> Ajudo pequenos negócios e designers a colocarem em prática boas ideias. <strong class="urgente">Vamos conversar?</strong></p>
        <button><a href="https://www.instagram.com/agenciadigitalslz/">Instagram</a></button>
        <button><a href="https://github.com/agenciadigitalslz">GitHub</a></button>
        <img src="img/imagem.png" alt="Foto Andre Lopes">
    </main>
    <footer>© 2025, André Lopes</footer>
</body>
</html>

style.css

* {
    margin: 0;
    border: 2px solid black;
    padding: 0;
}

body {
    background-color: #000000; /* Preto */
    color: #ffffff; /* Branco */
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
}

.titulo-destaque {
    color: #d64d2b; /* Destaques laranja */

}

.texto-destaque {
    color: #d64d2b;
}

.urgente {
    color: red;
}