.cta{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(225,126,73,.22);
  transition:transform .18s ease,box-shadow .25s ease,filter .25s ease;
  animation:cta-breathe 3.2s ease-in-out infinite;
}

.cta::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:-80%;
  left:-45%;
  width:30%;
  height:260%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);
  transform:rotate(18deg);
  animation:cta-shine 3.8s ease-in-out infinite;
}

.cta::after{
  content:"";
  position:absolute;
  z-index:-2;
  inset:1px;
  border-radius:13px;
  border:1px solid rgba(255,255,255,.2);
  pointer-events:none;
}

.cta:hover{
  filter:saturate(1.1) brightness(1.05);
  box-shadow:0 14px 34px rgba(225,126,73,.34);
  transform:translateY(-2px);
}

.cta:active{
  transform:scale(.975);
  box-shadow:0 5px 15px rgba(225,126,73,.22);
  transition-duration:.08s;
}

.cta:focus-visible{
  outline:3px solid rgba(255,255,255,.9);
  outline-offset:3px;
}

.cta>span{
  transition:transform .22s ease;
}

.cta:hover>span{
  transform:translateX(4px);
}

@keyframes cta-breathe{
  0%,100%{box-shadow:0 10px 28px rgba(225,126,73,.2)}
  50%{box-shadow:0 13px 34px rgba(225,126,73,.38)}
}

@keyframes cta-shine{
  0%,58%{left:-45%;opacity:0}
  64%{opacity:1}
  82%,100%{left:125%;opacity:0}
}

@media(prefers-reduced-motion:reduce){
  .cta,.cta::before{animation:none}
  .cta{transition:none}
}
