Minimal Arrow Button

<button class="arrow-btn">Learn more <span>→</span></button>

.arrow-btn {
  background: none;
  border: 0;
  color: #fff;
  font: 500 14px/1 system-ui, sans-serif;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,0.2);
}
.arrow-btn span {
  transition: transform .25s cubic-bezier(.4,0,.2,1);
}
.arrow-btn:hover span { transform: translateX(6px); }
.arrow-btn:hover { border-bottom-color: #fff; }