@layer components {
	footer,
	[role="contentinfo"] {

	}

	.site-footer {
		background-color: hsl(var(--clr-dark-gray));
		padding-block: var(--space-2xl) var(--space-m);
		color: white;
		row-gap: 1em;
	}

	.site-footer a {
		color: white;
	}

	.site-footer .logo-wrap {
		text-align: center;
	}

	@media(min-width: 1025px) {
		.site-footer .logo-wrap {
			text-align: left;
		}
	}

	.site-footer .nav-wrap {
		display: flex;
		gap: 1em;
		align-items: center;
		flex-direction: column;
		text-align: center;
	}

	.site-footer .nav-wrap > div {
		font-size: 1.125em;
	}

	@media(min-width: 1025px) {
		.site-footer .nav-wrap {
			flex-direction: row;
			text-align: left;
		}
	}

	.site-footer .nav-wrap ul:not(.social-navigation ul) {
		flex-direction: column;
		gap: var(--space-s);
		padding-left: 0;
	}

	@media(min-width: 1025px) {
		.site-footer .nav-wrap ul:not(.social-navigation ul) {
			flex-direction: row;
		}
	}

	.site-footer .nav-wrap ul:not(.social-navigation ul) li {
		margin: 0;
	}

	.site-footer .social-navigation {
		font-size: 2em;
		margin-top: .5em;
	}

	@media(min-width: 1025px) {
		.site-footer .social-navigation {
			margin-left: auto;
			margin-top: 0;
		}
	}

	.site-footer .social-navigation ul {
		gap: 1em;
		justify-content: center;
		padding-left: 0;
	}

	@media(min-width: 1025px) {
		.site-footer .social-navigation ul {
			justify-content: flex-start;
		}
	}

	.site-footer .social-icon {
		font-family: FontAwesomeBrands;
	}

	.site-footer p {
		margin-bottom: 1em;
		font-size: 1rem;
	}
}