.button {
	display: inline-block;
	width: fit-content;
	border-radius: 0.5rem;
	margin: 0.5rem 0;
	text-decoration: none;
	user-select: none;
	outline: none;

	span {
		display: inherit;
		border-radius: 0.5rem;
		padding: 0.5rem 1rem;
		font-size: 1.25rem;
		font-weight: 900;
		text-align: center;
		color: white;
		transform: translateY(-0.25rem);
		transition: transform 150ms cubic-bezier(0.3, 0.7, 0.4, 1);
	}

	&:focus-visible {
		outline: revert;
	}

	&:hover span,
	&:focus span {
		transform: translateY(-0.4rem);
	}

	&:active span {
		transform: translateY(-0.1rem);
	}
}

:focus {
	outline-offset: 0.25rem;
}
