.bc-neumorphic-button { 
display:  block;
width: fit-content;
height: fit-content;
background-color:  transparent; 
white-space: wrap; 
--left-color: rgba(180,180,180,.7); --right-color: rgba(255,255,255,1); --spread: 2px; box-shadow: var(--spread) calc(var(--spread) * 0.5) var(--spread) var(--left-color),inset calc(var(--spread) * 1.5) var(--spread) calc(var(--spread) * 2.5) var(--right-color);
border-radius:  100px; font-size: 16px; padding: 8px 15px; --duration: 0.3s; --ease: ease-in-out; transition: all var(--duration) var(--ease);
} 
.bc-neumorphic-button:hover,
.bc-neumorphic-button:focus { 
box-shadow: calc(var(--spread) * -1) calc(var(--spread) * -0.5) var(--spread) var(--left-color),inset calc(var(--spread) * -1.5) calc(var(--spread) * -1) calc(var(--spread) * 1.5) var(--right-color);
}