.omg-site-footer {
	margin: 0;
	background: var(--wp--preset--color--base);
	box-shadow: 0 -4px 14px rgba(15, 48, 44, 0.07);
}

.omg-site-footer__inner,
.omg-site-footer__meta {
	width: 100%;
	margin-inline: auto;
}

/* One row: brand left, image exactly centered, icons right. The two outer
   items share the remaining space equally, which keeps the image in the middle
   regardless of their content. This stays a flex row because an image width
   set in the editor is stored as `flex-basis`. */
.omg-site-footer__inner {
	align-items: center;
	gap: var(--wp--preset--spacing--30);
	padding-block: var(--wp--preset--spacing--40);
}

.omg-site-footer__inner > .wp-block-group:first-child,
.omg-site-footer__icons {
	flex: 1 1 0;
	min-width: 0;
}

.omg-site-footer a {
	text-decoration: none;
}

.omg-site-footer__brand {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 600;
	line-height: 1.3;
}

.omg-site-footer .wp-block-site-tagline {
	margin: 0;
}

.omg-site-footer__image {
	flex: 0 0 auto;
	max-width: 100%;
	margin: 0;
}

/* Default size; a width set in the editor (on the image itself) wins. */
.omg-site-footer__image:not(.is-resized) {
	width: 240px;
}

.omg-site-footer__image:not(:has(img[src])) {
	display: none;
}

.omg-site-footer__image img {
	display: block;
	max-width: 100%;
	height: auto;
	margin-inline: auto;
}

.omg-site-footer__image:not(.is-resized) img {
	width: 100%;
}

.omg-site-footer__icons {
	gap: 0.65rem;
	justify-content: flex-end;
}

.omg-site-footer__icons .omg-icon-link {
	box-sizing: content-box;
	padding: 0.4rem;
}

.omg-site-footer__meta {
	gap: 1rem 2rem;
	border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--deep-green) 12%, transparent);
}

.omg-site-footer__meta p {
	margin: 0;
}

.omg-site-footer__meta a {
	text-underline-offset: 4px;
}

.omg-site-footer__meta a:hover {
	text-decoration: underline;
}

@media (max-width: 781px) {
	.omg-site-footer {
		padding-right: max(20px, env(safe-area-inset-right)) !important;
		padding-left: max(20px, env(safe-area-inset-left)) !important;
	}

	.omg-site-footer__meta {
		align-items: center !important;
		flex-direction: column;
		justify-content: center !important;
		text-align: center;
	}

	/* Keep this a wrapping ROW (not a column): the editor's image width is a
	   `flex-basis`, which in a column would become the image's height. Brand
	   and icons take the full width, so the image wraps onto its own centered
	   line at exactly the width set in the editor. */
	.omg-site-footer__inner {
		flex-wrap: wrap;
		justify-content: center !important;
		text-align: center;
		gap: var(--wp--preset--spacing--20);
		padding-block: var(--wp--preset--spacing--30);
	}

	.omg-site-footer__inner > .wp-block-group:first-child,
	.omg-site-footer__icons {
		flex: 0 0 100%;
	}

	.omg-site-footer__image {
		margin-block: var(--wp--preset--spacing--20);
	}

	.omg-site-footer__icons {
		justify-content: center !important;
	}

	.omg-site-footer__meta {
		gap: 0.65rem;
		padding-block: var(--wp--preset--spacing--20) !important;
	}

	.omg-site-footer__meta p {
		width: 100%;
	}

	.omg-site-footer__meta > p:last-child {
		order: -1;
	}
}
