.diploproceso{
  width:100%;
  display:flex;
  justify-content:center;
  padding:132px 20px 138px 20px;
  background-color:#f4f6f8;
}

.diploproceso .container{
  width:100%;
  max-width:1170px;
  display:flex;
  flex-direction:column;
  align-items:center;
}

.diploproceso .title{
  font-size:38px;
  line-height:44px;
  text-transform:uppercase;
  color:#173e50;
  text-align:center;
}

.diploproceso .subtitulo{
  margin-top:12px;
  max-width:760px;
  text-align:center;
  font-size:17px;
  line-height:24px;
  color:#1f2a30;
}

.diploproceso .tarjetas{
  width:100%;
  display:flex;
  justify-content:space-between;
  gap:18px;
  margin-top:42px;
}

.diploproceso .card{
  width:100%;
  flex:1 1 0;
  display:flex;
  flex-direction:column;
  padding:28px 28px 30px 28px;
  background-color:white;
  border-radius:14px;
  box-shadow:0 2px 14px rgba(21,38,53,.12);
  min-height:224px;
}

.diploproceso .numero{
  font-size:44px;
  line-height:44px;
  color:#d7c46d;
}

.diploproceso .tituloCard{
  margin-top:10px;
  font-size:17px;
  line-height:22px;
  letter-spacing:0.02em;
  text-transform:uppercase;
  color:#173e50;
}

.diploproceso .textoCard{
  margin-top:14px;
  font-size:15px;
  line-height:22px;
  color:#48535a;
}

.diploproceso .cta{
  margin-top:36px;
  display:flex;
  justify-content:center;
}

.diploproceso .boton{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  text-decoration:none;
  padding:15px 28px;
  min-width:316px;
  background-color:#C9B96B;
  color:#173e50;
  border-radius:3px;
  font-size:13px;
  line-height:16px;
  letter-spacing:0.18em;
  text-transform:uppercase;
}

.diploproceso .boton:hover{
  background-color:#D7C56E;
}

@media(max-width:895px){

  .diploproceso{
    padding:110px 20px 120px 20px;
  }

  .diploproceso .tarjetas{
    flex-wrap:wrap;
    justify-content:center;
    gap:16px;
  }

  .diploproceso .card{
    flex:1 1 320px;
    max-width:360px;
  }

  .diploproceso .cta{
    margin-top:30px;
  }

  .diploproceso .boton{
    min-width:280px;
  }

}

@media(max-width:600px){

  .diploproceso{
    padding:80px 20px 86px 20px;
  }

  .diploproceso .title{
    font-size:34px;
    line-height:39px;
  }

  .diploproceso .subtitulo{
    font-size:15px;
    line-height:22px;
  }

  .diploproceso .tarjetas{
    gap:14px;
    margin-top:32px;
  }

  .diploproceso .card{
    width:100%;
    max-width:360px;
    padding:22px 20px 24px 20px;
    min-height:auto;
    justify-content: center;
    align-items: center;
  }

  .diploproceso .numero{
    font-size:36px;
    line-height:36px;
  }

  .diploproceso .tituloCard{
    font-size:15px;
    line-height:20px;
  }

  .diploproceso .textoCard{
    font-size:14px;
    line-height:20px;
  }

  .diploproceso .cta{
    margin-top:28px;
    width:100%;
  }

  .diploproceso .boton{
    width:100%;
    min-width:0;
    padding:18px 18px;
    font-size:12.5px;
    line-height: 19px;
    letter-spacing:0.06em;
  }

}