/* @import url("https://googleapis.com"); */

:root {
	/* --- Colors (Unchanged) --- */
	--bg-primary: #ffffff;
	--bg-secondary: #f4f7f9;
	--brand-maroon: #800000;
	--brand-maroon-hover: #5a0000;
	--accent-sky-blue: #4a90e2;
	--accent-sky-blue-hover: #357abd;
	--text-body: #333333;
	--text-heading: #800000;
	--text-on-accent: #ffffff;

	/* --- Updated Typography (Option A) --- */
	/* --font-headings: 'Quicksand', system-ui, sans-serif;
  --font-body: 'Inter', system-ui, sans-serif; */
	--font-headings: "Outfit", system-ui, sans-serif;
	--font-body: "Public Sans", system-ui, sans-serif;
	--font-logo: "Birthstone", cursive;
}

body {
	font-family: var(--font-body);
	color: var(--text-body);
	background-color: var(--bg-primary);
	display: flex;
	flex-direction: column;
	min-height: 100dvh; /* Takes full viewport height, adjusting for mobile address bars */
	margin: 0;
}

a {
	color: var(--brand-maroon);
	text-transform: capitalize;
	text-decoration: none;
	/* background-color: red; */
}

a:hover {
	color: var(--brand-maroon-hover);
}

header,
footer {
	padding-block: 0.5em;
	background-color: var(--brand-maroon);
	color: var(--text-on-accent);
}

footer {
	margin-top: auto;
}

h1 {
	font-family: var(--font-headings);
}

#logo {
	font-family: var(--font-logo);
	font-size: 1.75rem;
	text-align: center;
	padding: 0.5em 1em;
}

header a {
	color: var(--text-on-accent);
}

/* Navigation */

#headerNav li a,
#footerNav li a {
	color: var(--text-on-accent);
	padding: 0.25em 0.75em;
	/* background-color: var(--accent-sky-blue);
	&:hover {
		background-color: var(--accent-sky-blue-hover);
	} */
}

#footerNav {
	text-align: center;
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 0.25em;
	align-items: center;
}

#footerNav li a {
	display: block;
	font-size: 1.75rem;
	text-decoration: underline;
	width: 10em;
	padding: 0.25em 0.75em;
	/* background-color: var(--accent-sky-blue);
	&:hover {
		background-color: var(--accent-sky-blue-hover);
	} */
}

#footerLegal {
	text-align: center;
	padding: 0.25em;
}