body {
    background-color: #E9EEF6; /* Color de fondo de la página */
    color: #2C2C2C; /* Color del texto */
    font-family: 'Segoe UI', sans-serif; /* Tipo de letra */
    margin: 0; /* Quita márgenes por defecto */
    padding: 0; /* Quita relleno por defecto */
}

h1 {
    text-align: center; /* Centra el título */
    margin: 1rem 0; /* Espacio arriba y abajo */
}

header {
    background-color: #3A5BA0; /* Fondo azul del encabezado */
    color: white; /* Texto blanco */
    padding: 1rem; /* Espacio interno */
    text-align: center; /* Centra el texto */
}

header nav a {
    text-decoration: none; /* Quita el subrayado de los enlaces */
    color: #F5F7FA; /* Color del texto de los enlaces */
    font-weight: bold; /* Texto en negrita */
    padding: 8px 12px; /* Espacio dentro del enlace */
    transition: background-color 0.3s ease; /* Suaviza el cambio de color */
    margin: 0 10px; /* Espacio entre enlaces */
}

header nav a:hover {
    background-color: #4B7BEC; /* Cambia el fondo al pasar el mouse */
    border-radius: 5px; /* Bordes redondeados */
}

main {
    display: flex; /* Organiza los elementos en fila */
    justify-content: space-around; /* Espacia los elementos */
    align-items: center; /* Centra verticalmente */
    padding: 2rem; /* Espacio interno */
    gap: 2rem; /* Espacio entre elementos */
    flex-wrap: wrap; /* Permite que se acomoden si no caben */
}

.info {
    max-width: 45%; /* Ancho máximo de la sección de información */
}

.info img {
    margin-top: 1rem; /* Espacio arriba de la imagen */
    border-radius: 10px; /* Bordes redondeados */
    box-shadow: 0 2px 6px rgba(0,0,0,0.2); /* Sombra suave */
}

.skills {
    flex: 0.8; /* Tamaño flexible */
    min-width: 180px; /* Ancho mínimo */
    padding: 1.5rem; /* Espacio interno */
    background-color: #f0f4ff; /* Fondo claro */
    border-radius: 12px; /* Bordes redondeados */
    box-shadow: 0 8px 20px rgba(58, 91, 160, 0.3); /* Sombra azul */
}

.skills h2 {
    margin-bottom: 1rem; /* Espacio debajo del título */
}

.skills ul {
    list-style-type: square; /* Viñetas cuadradas */
    padding-left: 1.5rem; /* Espacio a la izquierda */
    column-count: 2; /* Divide la lista en dos columnas */
    column-gap: 1.5rem; /* Espacio entre columnas */
}

.skills ul li {
    margin-bottom: 0.5rem; /* Espacio entre ítems */
    font-weight: 500; /* Negrita media */
}

footer {
    background-color: #B0C4DE; /* Fondo del pie de página */
    color: #2C2C2C; /* Color del texto */
    padding: 2rem; /* Espacio interno */
    text-align: center; /* Centrado */
    margin-top: 2rem; /* Espacio arriba del footer */
    font-size: 1rem; /* Tamaño del texto */
}

footer section {
    margin: 1rem 0; /* Espacio vertical entre secciones */
}

footer a {
    color: #4B7BEC; /* Color de los enlaces */
    text-decoration: none; /* Sin subrayado */
    margin: 0 1rem; /* Espacio entre enlaces */
    font-weight: bold; /* Negrita */
}

footer a:hover {
    text-decoration: underline; /* Subrayado al pasar el mouse */
}