
/* reglas generales */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    list-style: none;
}

body {
    font-family:"Poppins", sans-serif;
    margin: 0;
    color: #2c2b2b;
    background-color: #fff7ecda
}

nav{
    margin-inline: auto;
}

/* todos los parrafos */
p {
    line-height: 1.6;
}

p,
li,
figcaption {
    text-wrap: pretty;
}

p:first-child
li:first-child {
    margin-block-start: 0;
}

p :last-child,
li :last-child {
    margin-block-end: 0;
}

h1,
h2,
h3 {
    color:  rgb(44, 43, 43);
    line-height: 1.1;
    text-wrap: balance;
}

header {
    padding: 50px 50px 50px 50px;
 }


 /* todas las imagenes */

img{
    max-width: 100;
 }

figure {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

figure img{
    display: block;
    width: 20%;
    object-fit: cover;
    object-position: center;
 }

/* vinculos */

a {
    text-decoration: none;
    color: #2c2b2b;
}

/* contenedoras */

header .contenedora {
    margin-inline: auto;
}

.con-sombra-chica {
    border: 2px solid #375e36;
  box-shadow: .2rem .2rem #375e36;
}

/* componentes superiores y contenidos */

 header,
 footer {
    background-color: #82bd80;
    color: #fbfaeb;
    padding: 1rem;
 }


/* menú */

header nav ul {
    margin-block-end: 0;
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    place-content: center;
}

header nav li {
    margin-block-start: .5rem;
    width: 100px;
}

header nav a {
    background-color: #fbfaeb;
    color: #274726;
    display: block;
    padding-block: 0.50em .35em;
    text-align: center;
    border-radius: 100vw;
    font-weight: bold;
}

header nav ul li a  :hover
header nav ul li a  :focus-visible {
    background-color: rgb(201, 219, 171);
    transition: .10s;
}

.contenedora nav {
    margin-inline: auto;
    align-items: center;
}

.contenedora figure img{
    margin-inline: auto;
    width: 50%;
}

/* componente central y contenidos */

section {
    padding-block: 2rem 4rem;
    display: block;
}

section > h1,
section > h2,
section > h3 {
    padding: .5em 1em;
}

/* sección Webapp y video */

.Webapp {
    padding-bottom: 1rem;
}

.Video {
    display: flex;
    width: 90%;
    margin-inline: auto;
    margin-bottom: 1rem;
}

.titulo-webapp {
    border-block-end: 4px solid #375e36;
    padding-block-end: .35rem;
    margin-inline: auto;
    width: 90%;
    font-size: 2rem;
    margin-bottom: 1rem;
}

.texto-webapp {
    margin-inline: auto;
    width: 80%;
}

.texto-webapp li {
    list-style: disc;
    margin: 0.5em 0 0 1em;
}


/* sección equipo */

.contenido {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(min(15rem, 100%), 1fr));
   grid-gap: .5rem;
}

.contenido {
  width: 75%;
  margin-inline: auto;
}

.contenido a {
  font-size: 20px;
}

h1 {
  font-size: 35px;
  margin-bottom: 1rem;
  padding: 0 1.5rem;
  background-color: rgb(252, 242, 225);border-radius: 0.5rem;
  border-left: solid 10px #375e36;
  border-right: solid 10px #375e36;
  margin-inline: auto;
  width: 70%;
  text-align: center;
}

.contenido article,
.academicos > ul > li {
    background-color: #274726;
    padding: 1em;
}

.contenido img,
.academicos img {
    background-color: wheat;
    width: min(100%, 10em);
}

.integrante {
   padding-bottom: 2rem;
   border-radius: 1rem;
}

.integrante img {
   width: 100%;
   border-radius: 1rem 1rem 1rem 1rem;
}

.integrante p {
   font-size: 16px;
   font-weight: 600;
   padding: 0 1.5rem 0.5rem 1.5rem;
}

.integrante h3 {
    font-size: 25px;
    color: #82bd80;
    padding: 1.5rem 1.5rem 0.5rem 1.5rem;
}

.contenido a,
.academicos a {
  color: hsl(130, 32%, 46%);
  font-size: 1.5em;
  padding-block: .125em .25em;
}

/* sección académicos */

.academicos {
    margin-inline: auto;
    width: 75%;
 }
 
.academicos h1 {
  font-size: 35px;
  margin-bottom: 1rem;
  padding: 0 1.5rem;
  background-color: rgb(252, 242, 225);border-radius: 0.5rem;
  border-left: solid 10px #375e36;
  border-right: solid 10px #375e36;
  margin-inline: auto;
  text-align: center;
  width: 100%;
}
 
.academicos ul li{
   display: flex;
   flex-wrap: wrap;
   gap: 1rem;
   align-items: flex-start;
   align-content: flex-start;
   margin: 0;
 }
 
.academicos figure img {
   display: block;
   width: 8em;
   background-color: white;
   padding: .5rem;
   margin-top: 2rem;
   margin-bottom: 2rem;
   border-radius: 1rem;
   margin-inline: auto;
 }
 
footer{
    text-align: justify;
}


/* plan */

.MVP img {
    margin-inline: auto;
    width: 75%;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.Arquetipo img {
    margin-inline: auto;
    width: 75%;
    margin-top: .1rem;
    margin-bottom: 2rem;
}

/* mapa */

.mapa img {
    margin-inline: auto;
    width: 75%;
    margin-top: .1rem;
    margin-bottom: 2rem;
}