/* Main navigation, 17px.
   Still expressed as a clamp rather than a flat 17px. The Theme lays the nav
   out as a row from 900px up, and the custom CSS had already tightened its gap
   to 14px because eight items plus the brand lockup only just fit between 900
   and 994px. At a flat 17px the row runs out of room at about 960px and spills
   past the gutter again, so the size eases back to the Theme's original 16px
   below roughly 1100px, where the row is tightest, and reaches 17px above it. */
.main-nav a {
	font-size: clamp(16px, 1.45vw, 17px);
}

/* Top bar, 17px for the address and the two links.
   The Theme sets the size on .topbar .container rather than on .topbar, so the
   bar has to be addressed at that level or the rule is simply outranked.
   The phone pill stays at 20px, deliberately larger than everything around it,
   with its padding trimmed because 20px type in the Theme's 5px padding made
   the pill tall enough to stretch the whole bar. */
@media all and (min-width: 900px) {
	.topbar,
	.topbar .container {
		font-size: 17px;
	}
	.topbar .phone-pill {
		font-size: clamp(15px, 1.45vw, 20px);
		padding: 3px 18px;
	}
}

/* Phones: call first, then who it is for, then where.
   The bar is re-ordered so the tap-to-call pill leads on its own full-width
   row, with the two links and the address sharing the row beneath it, links
   left and address right. Only the visual order changes; the markup order, and
   therefore the reading order for a screen reader, is untouched.
   The pill needs flex and a min-height, not padding: the Theme leaves it an
   inline element, and vertical padding on an inline box is painted without
   changing the height the layout reserves, so padding alone left it at 32px,
   under the ~44px both Apple and Google ask for.
   The city, state and ZIP are hidden here so the street address and the two
   links fit one row: the address is a directions link, and nobody needs to read
   "Las Vegas" on a Las Vegas practice's phone header. */
@media all and (max-width: 899px) {
	.topbar .container {
		flex-wrap: wrap;
		row-gap: 4px;
	}
	.topbar .phone-pill {
		order: -1;
		flex: 0 0 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 44px;
		font-size: 17px;
	}
	.topbar .topbar-links {
		order: 1;
	}
	.topbar .container > a:not(.phone-pill) {
		order: 2;
	}
	.topbar .topbar-city {
		display: none;
	}
	.topbar-links a {
		display: inline-block;
		padding-top: 9px;
		padding-bottom: 9px;
	}
}