.giant-button {
	display: block;
	width: 100%;
	cursor: pointer;
	border: .3em solid;
	font-size: clamp(2em, 9vw, 3em);
	font-family: Saira Extra Condensed, system-ui, sans-serif;
	text-align: center;
	font-weight: inherit;
	text-transform: uppercase;
	text-decoration: none;
	color: inherit;
	background-color: inherit;
	border-radius: 2em;
	margin: 0 auto;
	padding: .5em 1em .4em .75em;
	box-shadow: 0 8px 6px -6px #000;
}
.giant-button:hover {
	border-color: rgba(255,255,255,.3);
	background-color: #222;
	color: #fff;
	transition: all .3s;
	transform: scale(1.05);
}
@media (prefers-reduced-motion: reduce) {
	.giant-button:hover {
		transition: none;
		transform: none;
	}
}

.giant-button:hover,
.giant-button:focus {
	background-image: linear-gradient(238deg, #ff0000, #ff8000, #ffff00, #80ff00, #00ff00, #00ff80, #00ffff, #0080ff, #0000ff, #8000ff, #ff0080);
	background-size: 1200% 1200%;
	background-position: 2% 80%;
	color: #fff;
	text-decoration: none;
	text-shadow: 0 0 2px rgba(0,0,0,.9);
	animation: rainbow 4s ease-out alternate infinite;
}
@media (prefers-reduced-motion: reduce) {
	.giant-button:hover,
	.giant-button:focus {
		animation: none;
	}
}