/* -----------------
 fuentes
 ----------------- */

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

* { /* Resetea los márgenes y rellenos predeterminados */
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* ----------------
   reglas generales
   ---------------- */
   
body {
    font-family: 'Montserrat', sans-serif, 'Antonio';
    line-height: 1.6; /* Ajusta el espaciado entre líneas */
    background-color: rgb(248, 248, 248);
    color: #333;
}

a{
    text-decoration: none; /* Elimina el subrayado del enlace */
    font-weight: bold; /* Hace que el enlace sea más prominente */
    color: white;
}

ul {
    list-style: none; /* Elimina los puntos de la lista */
    padding-inline-start: 0; /* Elimina el espacio antes de la lista */
}

.contenedora {
    max-width: 75rem; /* Ajusta el ancho máximo del contenedor */
    margin-inline: auto; /* Centra el contenedor horizontalmente */
}

h1 {
    font-size: 65px;
    line-height:1em;
    font-family: Antonio;
    font-weight: bold;
    text-transform: uppercase; /* Convierte el texto a mayúsculas */
    text-align: center;
    color: #0C2239;
    padding: 1.5rem;
}

h2, h3 {
    margin-bottom: 2rem;
    font-family: antonio;
    font-weight: bold;
    font-size: 24px;
    text-transform: uppercase;
    text-align: center;
}

p {
    margin-bottom: 1rem;
    text-align: center;
    padding: 1rem;
    
}

figure {
    margin: 0; /* elimina margen predeterminado */
  }

footer {
    background-color: #0C2239;
    color: #fff;
    font-size: 0.8rem ;
    text-align: center;
    padding: 1rem;
}

/*-----------------
   reglas de header
   ---------------- */

header {
    background:linear-gradient(86.63deg, #0C2239 -14.08%, #3276B8 44.31%, #8290b8 125.44%);
    color: whitesmoke;
    padding: 2rem;
    text-align: center;
    font-family: antonio;
}

nav ul {
    list-style: none;
    display: flex; /* Utiliza flexbox para centrar los elementos */
    justify-content: center; /* Centra los elementos horizontalmente */
    align-items: center; /* Centra los elementos verticalmente */
    gap: 4rem;
}

nav a {
    color: whitesmoke;
    text-decoration: none;
    text-transform: uppercase;
}

nav a:hover {
    color: #afafaf; /* Cambia el color al pasar el ratón */
}

header img { /* Ajusta el tamaño de la imagen del navegador */
    width: 100px;
    margin-bottom: 2rem;
}

/*-----------------
   reglas de main
   ---------------- */
   
  /*-----------------
   reglas de equipo
   ---------------- */ 

.equipo { /* Reglas generales del equipo */
    background-color:#0C2239;
    color: white;
    font-family: antonio;
    text-transform: uppercase;
    padding: 2rem;
}

.equipo .contenedora {
  display: flex;
  flex-wrap: wrap; /* Permite que los elementos se envuelvan si no caben en una fila */
  justify-content: center; /* Centra los elementos horizontalmente */
  align-items: center; /* Centra los elementos verticalmente */
  gap: 2rem; /* Espacio entre los miembros del equipo */
}

.equipo img { /* Ajusta el tamaño de las imágenes */
    width: 200px;
    height: 200px;
    object-fit: cover; /* Recorta la imagen para ajustarse al tamaño */
    border-radius: 10px; /* Agrega bordes redondeados */
    margin-top: 1rem; /* Ajusta el espacio superior de la imagen */
}

.equipo img:hover {
    transform: scale(1.1); /* Aumenta el tamaño de la imagen al pasar el ratón */
    transition: transform 0.3s ease; /* Agrega una transición suave */
}

.miembros {
    text-align: center;
    margin-bottom: 2rem;
}

/* -----------------
   reglas de datos academicos
   ---------------- */

.datosacademicos {
    padding: 2rem;
    background-color: #3276B8;
    color: white;
}

.subtitulos {
    font-family: antonio;
    font-size: 15px;
    margin-top: 1rem;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

/* -----------------
   reglas de plan
   ---------------- */
.plan h2 {
    background-color: #3276B8;
    color: white;
}

/*-----------------
   reglas de mapa
   ---------------- */

.mapa h2 {
    background-color: #0C2239;
    color: white;
}