.gridpixl-button{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 25px;font-size:15px;font-weight:500;line-height:1.2;transition:.3s;overflow:hidden;color:var(--text-color);background-color:var(--gridpixl-color-primary,#92003b);--text-color:var(--gridpixl-color-primary-fg, #FFFFFF)}.gridpixl-button:hover{color:var(--text-color);background-color:var(--gridpixl-color-secondary,#010051);--text-color:var(--gridpixl-color-secondary-fg, #FFFFFF)}.gridpixl-button .button-icon,.gridpixl-button .button-text{position:relative;display:flex;align-items:center;justify-content:center}.gridpixl-button .button-icon{transition:.3s}.gridpixl-button .button-icon svg{width:1em;height:1em;fill:currentColor}.gridpixl-button[class*=icon-anim-flip] .button-icon{position:relative;width:1em;height:1em;overflow:hidden}.gridpixl-button[class*=icon-anim-flip] .button-icon>*{position:absolute;top:50%;left:50%;transition:.3s;opacity:1;transform:translate(-50%,-50%)}.gridpixl-button[class*=icon-anim-flip] .button-icon>:last-child{opacity:0;transform:translate(var(--end-x,-50%),var(--end-y,-50%))}.gridpixl-button[class*=icon-anim-flip]:hover .button-icon>*{opacity:0;transform:translate(var(--hover-x,-50%),var(--hover-y,-50%))}.gridpixl-button[class*=icon-anim-flip]:hover .button-icon>:last-child{opacity:1;transform:translate(-50%,-50%)}.gridpixl-button.icon-anim-flip-top{--end-x:-50%;--end-y:150%;--hover-x:-50%;--hover-y:-150%}.gridpixl-button.icon-anim-flip-right{--end-x:-150%;--end-y:-50%;--hover-x:150%;--hover-y:-50%}.gridpixl-button.icon-anim-flip-bottom{--end-x:-50%;--end-y:-150%;--hover-x:-50%;--hover-y:150%}.gridpixl-button.icon-anim-flip-left{--end-x:150%;--end-y:-50%;--hover-x:-150%;--hover-y:-50%}.gridpixl-button.icon-anim-flip-top-right{--end-x:-150%;--end-y:150%;--hover-x:150%;--hover-y:-150%}.gridpixl-button.icon-anim-flip-top-left{--end-x:150%;--end-y:150%;--hover-x:-150%;--hover-y:-150%}.gridpixl-button.icon-anim-rotate .button-icon>*{transition:.3s}.gridpixl-button.icon-anim-rotate:hover .button-icon>*{transform:var(--anim-rotate,rotate(90deg))}.gridpixl-button[class*=text-anim-flip] .button-text{position:relative;overflow:hidden;color:transparent}.gridpixl-button[class*=text-anim-flip] .button-text::after,.gridpixl-button[class*=text-anim-flip] .button-text::before{content:attr(data-text);position:absolute;inset:0;color:var(--text-color);transition:.3s}.gridpixl-button[class*=text-anim-flip] .button-text::before{opacity:0}.gridpixl-button[class*=text-anim-flip] .button-text::after,.gridpixl-button[class*=text-anim-flip]:hover .button-text::before{opacity:1}.gridpixl-button[class*=text-anim-flip]:hover .button-text::after{opacity:0}.gridpixl-button.text-anim-flip-top .button-text::before{transform:translateY(150%)}.gridpixl-button.text-anim-flip-top .button-text::after,.gridpixl-button.text-anim-flip-top:hover .button-text::before{transform:translateY(0)}.gridpixl-button.text-anim-flip-bottom .button-text::before,.gridpixl-button.text-anim-flip-top:hover .button-text::after{transform:translateY(-150%)}.gridpixl-button.text-anim-flip-bottom .button-text::after,.gridpixl-button.text-anim-flip-bottom:hover .button-text::before{transform:translateY(0)}.gridpixl-button.text-anim-flip-bottom:hover .button-text::after{transform:translateY(150%)}