.dynamichref {
 background-image: linear-gradient(
   to right,
   #ff6d00,
   #ff6d00 50%,
   rgba(15, 146, 255, 1) 50%
  );
  background-size: 200% 100%;
  background-position: -100%;
  display: inline-block;
  padding: 5px 0;
  position: relative;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all 0.2s ease-in-out;
}

.dynamichref:before {
  content: '';
  background: #ff6d00;
  display: block;
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 0;
  height: 3px;
  transition: all 0.3s ease-in-out;
}

.dynamichref:hover {
  background-position: 0;
}

.dynamichref:hover::before {
  width:100%;
}