.fancy-button{--black-700:hsla(0 0% 12%/1);--border_radius:0.75rem;--transtion:0.3s ease-in-out;--offset:2px;--keendom-orange:#ff8000;--keendom-red:#ff004f;cursor:pointer;position:relative;display:flex;align-items:center;justify-content:space-between;gap:.5rem;transform-origin:center;padding:.5rem 1rem;width:100%;background-color:transparent;border:none;border-radius:var(--border_radius);transform:scale(calc(1 + (var(--active, 0) * .1)));transition:transform var(--transtion)}.fancy-button:before{background-color:#1a1a1a;box-shadow:inset 0 .5px hsl(0,0%,25%),inset 0 -1px 2px 0 hsl(0,0%,0%),0 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active, 0)));transition:all var(--transtion);z-index:0}.fancy-button:after,.fancy-button:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;border-radius:var(--border_radius)}.fancy-button:after{background-color:rgba(255,128,0,.1);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);opacity:var(--active,0);transition:opacity var(--transtion);z-index:2}.fancy-button:is(:hover,:focus-visible){--active:1}.fancy-button:active{transform:scale(1)}.fancy-button .dots_border{--size_border:calc(100% + 2px);overflow:hidden;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--size_border);height:var(--size_border);background-color:transparent;border-radius:var(--border_radius);z-index:-10}.fancy-button .dots_border:before{content:"";position:absolute;top:30%;left:50%;transform:translate(-50%,-50%);transform-origin:left;transform:rotate(0deg);width:100%;height:2rem;background-image:linear-gradient(90deg,var(--keendom-orange),var(--keendom-red));mask:linear-gradient(transparent,white 120%);animation:rotate 2s linear infinite}@keyframes rotate{to{transform:rotate(1turn)}}@keyframes pulse-glow{0%{box-shadow:0 0 20px rgba(255,71,36,.3),0 0 40px rgba(255,107,53,.2)}to{box-shadow:0 0 30px rgba(255,71,36,.5),0 0 50px rgba(255,142,83,.3)}}.fancy-button .sparkle{position:relative;z-index:10;width:1.75rem}.fancy-button .sparkle .path{fill:currentColor;stroke:currentColor;transform-origin:center;color:hsl(0,0%,100%)}.fancy-button:is(:hover,:focus) .sparkle .path{animation:path 1.5s linear .5s infinite}.fancy-button .sparkle .path:first-child{--scale_path_1:1.2}.fancy-button .sparkle .path:nth-child(2){--scale_path_2:1.2}@keyframes path{0%,34%,71%,to{transform:scale(1)}17%{transform:scale(var(--scale_path_1,1))}49%{transform:scale(var(--scale_path_2,1))}83%{transform:scale(var(--scale_path_3,1))}}.fancy-button .text_button{position:relative;z-index:10;background-image:linear-gradient(90deg,hsla(0 0% 100%/1) 0,hsla(0 0% 100%/var(--active,0)) 120%);background-clip:text;-webkit-background-clip:text;font-size:.75rem;color:white}.fancy-button:hover .text_button{color:transparent}.fancy-button-orange{--black-700:hsla(0 0% 12%/1);--border_radius:0.75rem;--transtion:0.3s ease-in-out;--offset:2px;--keendom-orange:#FF6B35;--keendom-red:#FF8E53;cursor:pointer;position:relative;display:flex;align-items:center;justify-content:space-between;gap:.5rem;transform-origin:center;padding:.5rem 1rem;width:auto;background:linear-gradient(135deg,#FF4724,#FF335C);border:none;border-radius:var(--border_radius);transform:scale(calc(1 + (var(--active, 0) * .1)));box-shadow:0 0 20px rgba(255,71,36,.3);transition:transform var(--transtion);animation:pulse-glow 2s ease-in-out infinite alternate}.fancy-button-orange:before{background:linear-gradient(135deg,#FF4724,#FF335C);box-shadow:inset 0 .5px hsl(0,0%,25%),inset 0 -1px 2px 0 hsl(0,0%,0%),0 4px 10px -4px hsla(0 0% 0%/calc(1 - var(--active, 0)));transition:all var(--transtion);z-index:0}.fancy-button-orange:after,.fancy-button-orange:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;border-radius:var(--border_radius)}.fancy-button-orange:after{background-color:rgba(255,255,255,.1);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);opacity:var(--active,0);transition:opacity var(--transtion);z-index:2}.fancy-button-orange:is(:hover,:focus-visible){--active:1}.fancy-button-orange:active{transform:scale(1)}.fancy-button-orange .dots_border{--size_border:calc(100% + 2px);overflow:hidden;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--size_border);height:var(--size_border);background-color:transparent;border-radius:var(--border_radius);z-index:-10}.fancy-button-orange .dots_border:before{content:"";position:absolute;top:30%;left:50%;transform:translate(-50%,-50%);transform-origin:left;transform:rotate(0deg);width:100%;height:2rem;background-image:linear-gradient(90deg,var(--keendom-orange),var(--keendom-red),#FFB347,var(--keendom-orange));mask:linear-gradient(transparent,white 120%);animation:rotate 1.2s linear infinite}.fancy-button-orange .sparkle{position:relative;z-index:10;width:1.75rem}.fancy-button-orange .sparkle .path{fill:currentColor;stroke:currentColor;transform-origin:center;color:hsl(0,0%,100%)}.fancy-button-orange:is(:hover,:focus) .sparkle .path{animation:path 1.5s linear .5s infinite}.fancy-button-orange .sparkle .path:first-child{--scale_path_1:1.2}.fancy-button-orange .sparkle .path:nth-child(2){--scale_path_2:1.2}.fancy-button-orange .text_button{position:relative;z-index:10;background-image:linear-gradient(90deg,hsla(0 0% 100%/1) 0,hsla(0 0% 100%/var(--active,0)) 120%);background-clip:text;-webkit-background-clip:text;font-size:.75rem;color:white}.fancy-button-orange:hover .text_button{color:transparent}