/* Shared phone-sized layout fixes, loaded after the page-specific styles. */
body.napnet {
	overflow-x: clip;
}

/* Keep the same compact logo proportions across every page header. */
body.napnet .nap-site-header__bar {
	grid-template-columns: 108px minmax(0, 1fr) auto;
}

body.napnet .nap-site-header__logo {
	width: 108px;
	aspect-ratio: 7 / 5;
}

body.napnet :is(.main-page-wrapper, .site-content, .content-layout-wrapper, .wd-page-content, .entry-content) {
	min-width: 0;
}

body.napnet .wd-page-content :is(img, video, iframe, embed, object),
body.napnet .entry-content :is(img, video, iframe, embed, object) {
	max-width: 100%;
}

body.napnet .wd-page-content :is(p, li, a, h1, h2, h3, h4),
body.napnet .entry-content :is(p, li, a, h1, h2, h3, h4) {
	overflow-wrap: anywhere;
}

body.napnet .wd-page-content pre,
body.napnet .entry-content pre {
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

@media (max-width: 782px) {
	/* The WordPress admin bar scrolls away on phones; keep the sticky site header at the viewport edge. */
	body.admin-bar .nap-site-header {
		--nap-header-offset: 0px;
	}

	body.napnet:not(.home) :is(.wd-page-title, .page-title) {
		min-height: 170px;
		margin-top: -78px;
		padding: 86px 16px 22px;
	}

	body.napnet .wd-page-content :is(table, .shop_table),
	body.napnet .entry-content :is(table, .shop_table) {
		display: block;
		max-width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	body.nap-about-page-body .nap-about-stats__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	body.nap-about-page-body .nap-about-stats article:nth-child(2n) {
		border-left: 0;
	}

	body.nap-about-page-body .nap-about-stats span {
		font-size: 10px;
	}
}

@media (max-width: 980px) {
	body.napnet .nap-site-header__bar {
		grid-template-columns: minmax(0, 1fr) auto;
	}

	body.napnet .nap-site-header__logo {
		width: 92px;
	}
}

@media (max-width: 600px) {
	body.napnet .nap-site-header__logo {
		width: 82px;
	}
}

@media (max-width: 640px) {
	body.nap-articles-page .nap-articles {
		left: auto !important;
		right: auto !important;
		width: 100% !important;
		max-width: 100% !important;
		transform: none !important;
	}

	body.nap-about-page-body .nap-about-values h3 {
		font-size: 13px;
	}

	body.nap-about-page-body .nap-about-values p {
		font-size: 10px;
	}
}

@media (max-width: 380px) {
	body.napnet .nap-site-header__logo {
		width: 74px;
	}

	body.nap-about-page-body .nap-about-stats article {
		min-height: 82px;
	}

	body.nap-about-page-body .nap-about-stats span {
		font-size: 9px;
	}
}
