Adjunto el avance de mi curriculum de acuerdo a la guía del curso: **Hoja de estilos** ``` @import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:ital,wght@0,1

Muy buen trabajo, lo que te sugueriría es que la imagen le des un poquito de forma los bordes para que no quede tan lineal, pon la imagen dentro de un div y le das estilo desde el css , pero muy buen trabajo

Desafío: curriculum | HTML y CSS: header, footer y variables CSS | Alura Latam

Adjunto el avance de mi curriculum de acuerdo a la guía del curso:

Hoja de estilos

@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

*{
  margin: 0;
  padding: 0;
}


body {
  background-color: black;
  color: white;
  box-sizing: border-box;
}

.header{
  padding: 2% 0 0 10%;

}

.header__nav{
  display: flex;
  justify-content: flex-start;
  gap: 80px;
}

.header__nav__enlace{
  font-family: "Montserrat", sans-serif;
  font-size: 24px;
  font-weight: 600;
  color: #22D4FD;
  text-decoration: none;
}

.contenido{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5% 10%;
}

.contenido__descripcion__titulo{
  font-size: 36px;
  font-family: "Krona One", sans-serif;
}

.contenido__descripcion{
  font-size: 24px;
  width: 615px;
  font-family: "Montserrat", sans-serif;
  display: flex;
  flex-direction: column;
  gap: 40px;
}

.contenido__descripcion__btn{
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
  gap: 32px;
}

.contenido__descripcion__btn__style{
  width: 378px;
  background-color: #000000;
  font-size: 24px;
  border-radius: 8px;
  padding: 16px 0;
  font-family: "Montserrat", sans-serif;
  font-size: 24px;
  font-weight: 600;
  border: 2px solid #22D4FD;
  display: flex;
  justify-content: center;
  gap: 16px;
  text-decoration: none;
  color: #f6f6f6;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.contenido__descripcion__btn__subtitulo{
  font-size: 24px;
  font-family: "Krona One", sans-serif;
  font-weight: 100;
}

.contenido__descripcion__btn__style:hover {
  color: #fff; /* color de fuente hover */
}
.contenido__descripcion__btn__style::after {
  content: "";
  background: #4741d7; /* color de fondo hover */
  position: absolute;
  z-index: -1;
  padding: 16px 20px;
  display: block;
  top: 0;
  bottom: 0;
  left: 100%;
  right: -100%;
  -webkit-transition: all 0.35s;
  transition: all 0.35s;
}
.contenido__descripcion__btn__style:hover::after {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  -webkit-transition: all 0.35s;
  transition: all 0.35s;
}

#pregunta{
  color: #22d4fd;
}

#foto-perfil{
  width: 550px;
  height: 550px;
}

.footer{
  background-color: #22D4FD;
  padding: 23.64px 0;
  text-align: center;
  font-size: 24px;
  font-family: "Montserrat", sans-serif;
  color: #000000;
}

html del home

<!DOCTYPE html>
<html lang="es-col">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Prueba</title>
  <link rel="stylesheet" href="/css/styles.css">
</head>

<body>
  <header class="header">
    <nav class="header__nav">
      <a class="header__nav__enlace" href="index.html">Home</a>
      <a class="header__nav__enlace" href="about.html">Sobre mi</a>
    </nav>
  </header>
  <main class="contenido">
    <section class="contenido__descripcion">
      <h1 class="contenido__descripcion__titulo">
        ¡Bienvenidos(as) a mi perfil! <strong id="pregunta">¿Quien soy?</strong>
      </h1>
      <p class="contenido__descripcion__texto">
        ¡Hola! Soy Alejandro Ospina, desarrollador backend, y coordinador de proyectos en Colombina SA.
        Cuento con una especialización en java-spring y actualmente estoy estudiando con Alura Latam. 
        Tengo más de 3 años de experiencia en el sector educativo, 2 años desarrollando software empíricamente
        y poco más de un año en el sector energético. Soy una persona muy enfocada en el aprendizaje continuo, 
        pues soy un fiel creyente de que cualquier conocimiento es valioso para cualquier ámbito profesional.
      </p>
      <div class="contenido__descripcion__btn">
        <h2 class="contenido__descripcion__btn__subtitulo">Accede a mis redes:</h2>
          <a class="contenido__descripcion__btn__style" href="https://www.github.com/">
            <img src="/img/github.png" alt="github">
            GitHub
          </a>
          <a class="contenido__descripcion__btn__style" href="https://www.linkedin.com/">
            <img src="/img/linkedin.png" alt="linkedin">
            Linkedin
          </a>
      </div>
    </section>
    <img id="foto-perfil" src="/img/92472300_3046939528697099_114877365712060416_n.jpg" alt="imagen">
  </main>
  <footer class="footer">
    <p>
      &#169 Derechos reservados 2024, Alejandro Ospina.
    </p>
  </footer>
</body>
</html>

No pude anexar el html del about me por temas de espacio; sin embargo, este último es similar al home.

home about me