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

	}

	.footer-inner {
		background-color: hsl(var(--clr-dark-brown));
		padding-block: var(--space-m);
		color: white;
	}

	.footer-inner a {
		color: white;
	}

	.footer-inner > div {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
	}

	@media(min-width: 768px){
		.footer-inner > div {
			flex-direction: row;
		}
	}

	.footer-inner ul{
		list-style: none;
		gap: var(--space-s);

	}

	.footer-inner .footer-navigation {
		line-height: 2.5;
		font-size: 0.9rem;
	}

	@media(min-width: 768px){
		.footer-inner .footer-navigation {
			line-height: inherit;
		}
	}

	.footer-inner .footer-navigation ul {
		display: block;
		columns: 2;
	}

	@media(min-width: 768px){
		.footer-inner .footer-navigation ul {
			columns: 1;
			display: flex;
		}
	}

	.footer-inner .site-meta{
		margin-top: 1rem;
		order: 1;
		text-align: center;
		font-size: 0.8rem;
		line-height: 1.5;
	}

	@media(min-width: 768px){
		.footer-inner .site-meta{
			margin: 0 1rem 0 auto;
			order: initial;
			text-align: right;
		}
	}

	.footer-inner .footer-social{
		font-family: FontAwesomeBrands;
		font-size: 2rem;
		margin-top: 1rem;
	}

	@media(min-width: 768px){
		.footer-inner .footer-social{
			margin: 0;
		}
	}

	.footer-inner .footer-social ul{
		justify-content: center;
	}

	@media(min-width: 768px){
		.footer-inner .footer-social ul{
			justify-content: flex-start;
			gap: 1rem
		}
	}

	.footer-inner .footer-social a:after{
		content: none;
	}
}