.btn.demo{
  position:relative;
  overflow:hidden;
  border:1px solid #bfdc38;
  color:#11142b;
  background:linear-gradient(135deg,#e7ff7c 0%,#d9ff43 100%);
  box-shadow:0 12px 28px rgba(24,44,255,.16),inset 0 1px 0 rgba(255,255,255,.65);
}
.btn.demo::before{
  content:"";
  position:absolute;
  top:-80%;
  left:-35%;
  width:30%;
  height:260%;
  background:rgba(255,255,255,.45);
  transform:rotate(24deg);
  transition:left .45s ease;
  pointer-events:none;
}
.btn.demo:hover{
  border-color:#aeca2f;
  color:#11142b;
  transform:translateY(-2px);
  box-shadow:0 16px 34px rgba(24,44,255,.22),inset 0 1px 0 rgba(255,255,255,.7);
}
.btn.demo:hover::before{left:115%}
.btn.demo:focus-visible{outline:3px solid rgba(24,44,255,.32);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.btn.demo::before{display:none}}