:root{
  --turquesa: #05535a;   
  --rosa:     #ed89b2;   
  --crema:    #fefded;   
  --negro:    #1a1a1a;
}

*{ box-sizing: border-box; }
html{ font-size:100%; }
body{
  margin:0;
  font-family: Arial, sans-serif;
  line-height:1.6;
  color: var(--negro);
  background-color: var(--crema);
}

.cabecera{
  background-color: var(--turquesa);
  padding: 3vh 6vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.menu, .logo{ display: inline-block; vertical-align: middle; }
.logo{
  max-width: 18vw;
  height: auto;
}
.menu a{
  color: var(--rosa);
  text-decoration: none;
  display: inline-block;
  margin-right: 2rem;
  font-weight: bold;
}
.menu a:last-child{ margin-right: 0; }
.presentacion{
  display: grid;
  grid-template-columns: 1fr minmax(24vw, 36%);
  align-items: center;
  column-gap: 3rem;     
  row-gap: 0;           
  padding: 4vh 6vw;
  margin: 2vh 0 0 0;
  background: transparent;
}

.titulo-principal{
  grid-column: 1;
  font-size: 2.2rem;
  color: var(--rosa);
  margin-bottom: -0.8rem;           
  padding: 0;
  line-height: 0.9;     
  letter-spacing: -0.02em; 
}
.bajada{
  grid-column: 1;
  font-size: 1rem;
  margin-top: -0.8rem;  
  margin-bottom: 0;
  color: var(--turquesa);
  line-height: 1.6;
  word-wrap: break-word;
}

.avatar{
  grid-column: 2;
  display: block;
  width: 28vw;
  max-width: 18rem;
  height: auto;
  border-radius: 1rem;
  margin: 0;
  border: none;
  object-fit: cover;
}

.subtitulo{
  font-size: 1.5rem;
  color: var(--rosa);
  padding: 0.3rem 0.6rem;
  margin: 3rem 0 1rem 0;
  background: var(--turquesa);
  border-left: none;
  display: inline-block;
}

.trayectoria{ padding: 2rem 6vw; margin-top: 0; }
.cajas{
  margin: 1rem 0 2rem 0;
  display: flex;
  justify-content: space-between;
  gap: 2%;
  flex-wrap: wrap;
}
.caja{
  flex: 1 1 48%;
  background: var(--turquesa);
  border: none;
  border-radius: 0.9rem;
  padding: 1rem;
  color: var(--crema);
}
.aprobadas{ order: 1; }
.en-curso{  order: 2; }
.caja h3{
  margin: 0 0 0.6rem 0;
  font-size: 1.2rem;
  color: var(--rosa);
}
.caja ul, .caja li{ color: var(--crema); }

.grafico{ padding: 0 0 2rem 0; margin-top: 0.5rem; }
.grafico p{ margin: 0 0 0.8rem 0; }
progress{
  width: 60%;
  height: 2rem;
  border-radius: 0.6rem;
  overflow: hidden;
  border: none;
  background-color: var(--rosa);
}
progress::-webkit-progress-value{ background-color: var(--turquesa); }
progress::-webkit-progress-bar{ background-color: var(--rosa); }
progress::-moz-progress-bar{ background-color: var(--turquesa); }

.datos-academicos{
  display: block;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  margin: 0 6vw 2rem 6vw;
  color: var(--negro);
}
.datos-academicos .subtitulo{
  background: var(--turquesa);
  color: var(--rosa);
  margin: 0 0 1rem 0;
  padding: 0.3rem 0.6rem;
}
.datos-academicos h3,
.datos-academicos p{ color: var(--negro); }


.prototipos{ padding: 0 6vw 2rem 6vw; }
.prototipos .subtitulo{
  background: var(--turquesa);
  color: var(--rosa);
  margin: 0 0 1rem 0;
  padding: 0.3rem 0.6rem;
}
.prototipos-img{
  display: block;
  width: 100%;
  max-width: 80vw;
  height: auto;
  border: none;
}

.companeras{
  padding: 2rem 6vw;
  text-align: left;
}
.cuadro{
  display: inline-block;
  vertical-align: top;
  width: 40%;
  aspect-ratio: 6 / 1;
  margin: 1rem 2%;
  border: 0.3rem solid var(--rosa);
  border-radius: 1rem;
  background: var(--crema);
  text-align: center;
  position: relative;
}
.cuadro-link{
  position: absolute;
  inset: 0;
  display: inline-block;
  color: var(--rosa);
  text-decoration: none;
  font-weight: bold;
  padding: 1.2rem;
}
.cuadro-link:hover{ text-decoration: underline; }

.pie{
  background: var(--turquesa);
  color: var(--rosa);
  padding: 3vh 6vw;
  font-size: 0.95rem;
  border-top: none;
}