/* Shared buttons/links used inside code modules across pages */

.btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	vertical-align: middle;
	font-family: 'Epilogue', sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: 0.16px;
	text-transform: capitalize;
	color: var(--color-white);
	background-color: var(--color-accent);
	border-radius: 100px;
	padding: 20px 40px;
	text-decoration: none;
	box-shadow: 0px 20px 25px -5px rgba(255, 45, 107, 0.3), 0px 8px 10px -6px rgba(255, 45, 107, 0.3);
	transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.btn:hover {
	background-color: #E0245A;
	box-shadow: 0px 20px 25px -5px rgba(255, 45, 107, 0.45), 0px 8px 10px -6px rgba(255, 45, 107, 0.45);
	color: var(--color-white);
}

.text-link {
	display: inline-block;
	vertical-align: middle;
	margin-left: 32px;
	font-family: 'Epilogue', sans-serif;
	font-size: 16px;
	font-weight: 500;
	line-height: 16px;
	letter-spacing: 0.16px;
	text-transform: capitalize;
	color: var(--color-dark);
	text-decoration: underline;
	text-underline-offset: 4px;
	transition: color 0.2s ease;
}

.text-link:hover {
	color: var(--color-accent);
	text-decoration: underline;
}