.btn{display:inline-block;position:relative;padding:1.2rem 2rem;border-radius:1000px;font-weight:400;font-size:1.4rem;line-height:100%;text-transform:uppercase;transition:transform .3s;text-decoration:none;--bg-color:#1b1b1e;--border-color:#f56e0f;--ripple-color:#f56e0f;--text-color:#fbfbfb;--text-after-color:#fbfbfb;background:var(--bg-color)}.btn .btn-border{z-index:3;border:1px solid;border-radius:1000px;border-color:var(--border-color)}.btn .btn-border,.btn .btn-ripple{display:block;position:absolute;inset:0}.btn .btn-ripple{z-index:1;overflow:hidden;transform:translateZ(0);border-radius:inherit}.btn .btn-ripple span{display:block;width:100%;height:100%;transform:translateY(101%);background:var(--ripple-color);border-radius:50% 50% 0 0;transition:transform .5s cubic-bezier(.4,0,0,1),border-radius .5s cubic-bezier(.4,0,0,1)}.btn .btn-title{position:relative;display:block;overflow:hidden;z-index:2;color:var(--text-color)}.btn .btn-title span{display:block;transition:transform .8s cubic-bezier(.16,1,.3,1)}.btn .btn-title span:after{content:attr(data-text);display:block;position:absolute;top:110%;left:0;color:var(--text-after-color)}.btn:disabled{opacity:.5;pointer-events:none;touch-action:none}.btn:hover{text-decoration:none;transform:scaleX(1.02);transition:transform .6s cubic-bezier(.34,5.56,.64,1)}.btn:hover .btn-ripple span{border-radius:0;transform:translateY(0);transition-duration:.5s,.9s}.btn:hover .btn-title span{transform:translateY(-110%)}