/*
 * Footer layout: a centred stack on phones, resolving to the logo opposite a
 * horizontal menu from tablet up. Core Navigation's internal markup and the
 * logo's footer-specific size cannot be expressed through block attributes.
 * Consumes global presets only.
 *
 * Breakpoint used: 40rem (tablet). See the canonical scale in style.css.
 */
.site-footer__columns {
	align-items: center;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--50);
	text-align: center;
}

.site-footer__region {
	min-width: 0;
}

/*
 * On a phone the logo is the centred focal point and carries a little more
 * weight. From tablet up it steps back to a quieter mark beside the menu. The
 * masthead's own cap is 15rem.
 */
.site-footer .parimaanam-site-logo {
	margin-inline: auto;
}

.site-footer .parimaanam-site-logo img {
	max-width: min(11rem, 55vw);
}

/*
 * On phones the links become a single centred column with hairline dividers.
 * Wrapping them into rows centred each row independently, so the rows started
 * at different x positions and the block read as scattered words rather than a
 * menu. A fixed two-by-two grid would align them, but the menu is
 * editor-managed: a fifth link would strand on a row of its own. One column
 * stays tidy at any number of links.
 */
.site-footer__secondary {
	margin-inline: auto;
	max-width: 17rem;
	width: 100%;
}

.site-footer__nav .wp-block-navigation__container {
	flex-direction: column;
	gap: 0;
	justify-content: center;
	width: 100%;
}

.site-footer__nav .wp-block-navigation-item {
	width: 100%;
}

.site-footer__nav .wp-block-navigation-item + .wp-block-navigation-item {
	border-top: 1px solid var(--wp--preset--color--line);
}

/*
 * Vertical padding gives the links a tap target closer to the 44px guideline;
 * as bare text they were only as tall as their line box.
 */
.site-footer__nav .wp-block-navigation-item__content {
	color: var(--wp--preset--color--ink);
	display: block;
	font-weight: 600;
	padding: 0.7rem 0;
	text-align: center;
	text-decoration: none;
	width: 100%;
}

.site-footer__nav .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--crimson-hover);
	text-decoration: underline;
}

/*
 * Core prints the group's flex justification as an inline style in the head,
 * which lands after this file at equal specificity. The extra ancestor is what
 * wins the cascade; without it the strip stays space-between and would split
 * the copyright and the privacy link apart once that link appears.
 */
.site-footer .site-footer__meta {
	border-top: 1px solid var(--wp--preset--color--line);
	color: var(--wp--preset--color--muted);
	justify-content: center;
	margin-top: var(--wp--preset--spacing--50);
	padding-top: var(--wp--preset--spacing--40);
	text-align: center;
}

.site-footer__meta p {
	margin: 0;
}

.site-footer__meta a {
	color: var(--wp--preset--color--muted);
}

.site-footer__meta a:hover {
	color: var(--wp--preset--color--crimson-hover);
}

@media (min-width: 40rem) {
	.site-footer__columns {
		flex-direction: row;
		flex-wrap: wrap;
		gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
		justify-content: space-between;
		text-align: left;
	}

	.site-footer .parimaanam-site-logo {
		margin-inline: 0;
	}

	.site-footer .parimaanam-site-logo img {
		max-width: min(9rem, 40vw);
	}

	.site-footer__secondary {
		margin-inline: 0;
		max-width: none;
		width: auto;
	}

	.site-footer__nav .wp-block-navigation__container {
		flex-direction: row;
		gap: var(--wp--preset--spacing--50);
		justify-content: flex-end;
		width: auto;
	}

	.site-footer__nav .wp-block-navigation-item {
		width: auto;
	}

	.site-footer__nav .wp-block-navigation-item + .wp-block-navigation-item {
		border-top: 0;
	}

	.site-footer__nav .wp-block-navigation-item__content {
		padding: 0.5rem 0;
		width: auto;
	}

	.site-footer .site-footer__meta {
		justify-content: space-between;
		text-align: left;
	}
}
