/* ===== PPS Mobile Rendering Fixes ===== */
/* Fix 1: "Get Started" header button squished / text wrapping on mobile */
@media (max-width: 781px) {
	header .wp-block-buttons .wp-block-button__link {
		white-space: nowrap;
		width: auto;
		display: inline-block;
		padding-left: 1.25em;
		padding-right: 1.25em;
		text-align: center;
	}
	
	header.wp-block-group.is-nowrap {
		flex-wrap: wrap;
	}
}

/* Fix 2: "How PPS Engagements Work" numbered steps */
/* Only step cards (those containing a red number badge) are affected */
.wp-block-group.has-border-color.has-background:has(> p.has-white-color.has-background) > p.has-white-color.has-background {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5em;
	height: 2.5em;
	padding: 0;
	text-align: center;
	border-radius: 999px;
	box-sizing: border-box;
}

/* Step titles were white-on-light and invisible; make them readable */
.wp-block-group.has-border-color.has-background:has(> p.has-white-color.has-background) > h3.wp-block-heading {
	color: #111827;
}

/* Fix 3: Stack multi-column layouts (incl. Flagship "Typical outputs") on mobile */
@media (max-width: 781px) {
	.wp-block-columns.is-layout-flex {
		flex-wrap: wrap;
	}
	
	.wp-block-columns.is-layout-flex > .wp-block-column {
		flex-basis: 100% !important;
		min-width: 100% !important;
	}
}

/* ===== PPS rendered-browser corrections - 2026-08-02 =====
   Each rule below was reproduced in the live rendered browser at
   390 / 430 / 768 / 1024 / 1440. Narrowest reliable selectors, no !important. */

/* 1) Eyebrow pills: ".pps-search-section p" outranked ".pps-search-eyebrow",
      rendering #5F6B78 on #B11226 (1.29:1). Restores the intended white. */
.pps-search-section p.pps-search-eyebrow { color: #fff; }

/* 2) Full-bleed search buttons: width:100% with content-box padding rendered
      406px inside a 343px column and pushed the document past the viewport. */
.pps-search-buttons .pps-search-btn { box-sizing: border-box; }

/* 3) Service deliverables: the <=950px reset missed the higher-specificity
      :nth-last-child(2)/:last-child span-3 rules, creating implicit columns
      and up to 580px of horizontal overflow at 390/430. */
@media (max-width: 950px) {
  .pps-svc .grid.grid--deliverables > .card:nth-last-child(2),
  .pps-svc .grid.grid--deliverables > .card:last-child { grid-column: auto; }
}

/* 4) Article CTA callout heading inherited the post-content navy, rendering
      #0F172A on #0F172A (1.00:1, invisible). */
.pps-single-body .wp-block-post-content .pps-search-callout h2,
.pps-single-body .wp-block-post-content .pps-final h2 { color: #fff; }

/* 5) Header nav toggle focus ring was rgba(177,18,38,.35) = 1.94:1 on white. */
.pps-header .pps-header__nav
  .wp-block-navigation__responsive-container-open:focus-visible { outline-color: #b11226; }

/* 6) Article template rail: breadcrumb and hero outer containers now share the
      1180px header/footer rail; the reading column keeps its existing 622px
      measure. No block structure, copy, schema or metadata is touched. */
.pps-single-post .pps-single-hero { max-width: 1180px; margin-left: auto; margin-right: auto; }
.pps-single-post .pps-single-body { max-width: 1228px; } /* 1180 rail + 2x24 gutter */
.pps-single-post .pps-single-body > .wp-block-post-content { padding-left: 0; padding-right: 0; }
.pps-single-post .pps-single-body > .wp-block-post-content > * {
  max-width: 622px; margin-left: auto; margin-right: auto;
}
.pps-single-post .pps-single-body > .wp-block-post-content > .pps-breadcrumbs { max-width: 1180px; }
.pps-single-post .pps-single-body > .pps-single-taxonomy {
  max-width: 622px; margin-left: auto; margin-right: auto;
}
@media (max-width: 760px) {
  .pps-single-post .pps-single-hero-shell { padding-left: 16px; padding-right: 16px; }
  .pps-single-post .pps-single-body { padding-left: 16px; padding-right: 16px; }
}