.btn1{--dark:#181818;--light:#d9d9d9;--active:0;cursor:pointer;position:relative;display:flex!important;align-items:center;gap:.5rem;transform-origin:center;background-color:transparent;border:none}.btn1:hover{--active:1;background:0 0}.icon_cont{overflow:clip;display:flex;justify-content:center;align-items:center;width:calc(var(--active) * 1.5rem + ( 1 - var(--active) ) * .5rem);height:calc(var(--active) * 1.5rem + ( 1 - var(--active) ) * .5rem);background:#3176eb;border:1px solid var(--light);border-radius:9999px;transition:all .5s ease-in-out}.text_button{position:relative;display:inline-block;padding-block:.5rem;font-size:1rem;font-weight:600;color:#000;text-transform:capitalize}.text_button::before{content:"";position:absolute;bottom:0;right:0;width:calc(( 1 - var(--active) ) * 100%);height:1px;background-color:var(--light);border-radius:9999px;transition:width .5s ease-in-out}