Haga lo que hicimos: 3

/* 1 - Espacio entre contenido y imagen /
.presentacion {
display: flex;
gap: 2rem; / espacio entre texto e imagen */
}

/* 2 y 3 - Media queries para diseño responsivo /
/ A partir de 1023px, cambia flex-direction a columna */
@media (max-width: 1023px) {
.presentacion {
flex-direction: column;
}
}

/* Entre 1200px y 1023px, invertir orden con column-reverse */
@media (max-width: 1200px) {
.presentacion {
flex-direction: column-reverse;
}
}

/* 4 - Ajustar padding encabezado para pantallas pequeñas /
@media (max-width: 768px) {
.encabezado {
padding: 1rem 1rem 0.5rem 1rem; / ajustar espacio arriba y laterales */
}

/* 5 - Centrar elementos del menú */
.header__menu {
    display: flex; /* asegúrate que esté */
    justify-content: center;
    gap: 1.5rem; /* opcional: espacio entre links */
}

/* 6 - Refinar diseño del encabezado */
.encabezado {
    padding: 1rem 2rem 1rem 2rem; /* ajustar según lo necesario */
}

}