body {
	background: url('background.webp') no-repeat center top fixed;
	-webkit-background-size: cover;

	display: flex;
	flex-direction: column;
	place-content: stretch;
	height: 100vh;
}

.crave-hero {
	display: flex;
	place-content: center;
	padding: 4rem;
	flex-grow: 0;

	& .crave-hero-logo {
		width: clamp(200c, 30vw, 450px);
		height: clamp(200px, 25vh, 400px);
		filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.25));

		& .fill {
			fill: white;
		}
	}
}

.crave-content {
	flex-grow: 1;
}

.crave-footer {
	flex-grow: 0;
	background: var(--bs-dark);
	padding: 1rem;
	color: var(--bs-light);

	& a {
		color: var(--bs-light);
		transition: color 0.3s linear;

		&:hover {
			color: #d4858b;
		}
	}
}

.crave-menu {
	height: clamp(200px, 45vh, 400px);
}

.text-pink {
	color: #d4858b;
}

.btn-primary {
	--bs-btn-bg: #d4858b;
	--bs-btn-border-color: #d4858b;

	--bs-btn-hover-bg: #c77278;
	--bs-btn-hover-border-color: #c77278;

	--bs-btn-active-bg: #dd9a9f;
	--bs-btn-active-border-color: #dd9a9f;

	--bs-btn-disabled-bg: #b19799;
	--bs-btn-disabled-border-color: #b19799;
}

.display-6 {
	font-size: 1.5rem;
	color: var(--bs-light);
	text-align: center;
	margin: 0;
	padding: 0;
	font-weight: 600;
	text-shadow: 1px 2px 4px rgba(0, 0, 0, 0.75);
}