:root{--button-color:#021526}.button{color:#fff;text-transform:uppercase;letter-spacing:.15rem;z-index:1;cursor:pointer;background:0 0;border:1px solid #fff;align-items:center;gap:.5rem;padding:.75rem 1.25rem;font-size:1rem;line-height:1;transition:all .3s;display:inline-flex;position:relative;overflow:hidden}.button:after{content:"";background-color:var(--button-color);z-index:-2;width:100%;height:100%;transition:all .3s;position:absolute;bottom:0;left:0}.button:before{content:"";z-index:-1;background-color:#0096d6;width:0%;height:100%;transition:all .3s;position:absolute;bottom:0;left:0}.button:hover{color:#fff}.button:hover:before{width:100%}