.sqx-pagefind-results {
	max-height: 360px;
	overflow: auto;
	margin-top: 8px;
	background: #fff;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 8px;
}
.sqx-pagefind-hit {
	display: block;
	padding: 10px 12px;
	color: #111;
	text-decoration: none;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}
.sqx-pagefind-hit strong {
	display: block;
	color: #005696;
	margin-bottom: 4px;
}
.sqx-pagefind-hit span {
	display: block;
	font-size: 13px;
	color: #555;
}
.sqx-pagefind-empty {
	margin: 0;
	padding: 10px 12px;
	color: #666;
	font-size: 13px;
}

/* ==== Tablet fix (768–1139px) — scrape overlay addition, 2026-09-16 ====
   The theme jumps from its mobile layout (max-width:767px) straight to a
   fixed 1120px desktop shell, so tablet viewports overflow horizontally
   (the live WordPress site has the same defect). This file is the one
   stylesheet every page links externally, so the fix rides here. Make the
   shell fluid, stack the bento hero columns, and let the footer widget
   columns wrap. The #page-prefixed selectors out-specify the inlined
   width:1120px !important rules. */
@media (min-width: 768px) and (max-width: 1139px) {
	html body #page .container-wrapper,
	html body .container-wrapper {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
		padding-left: 20px !important;
		padding-right: 20px !important;
	}

	/* bento hero: stack the two columns like mobile */
	html body #page section.aft-main-banner-section .af-main-banner-bento-posts,
	html body section.aft-main-banner-section .af-main-banner-bento-posts {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}
	html body #page section.aft-main-banner-section .bento-grid-wrapper,
	html body section.aft-main-banner-section .bento-grid-wrapper {
		width: 100% !important;
		min-width: 0 !important;
		flex-wrap: wrap !important;
	}
	html body #page section.aft-main-banner-section .bento-left-column,
	html body #page section.aft-main-banner-section .bento-right-column,
	html body section.aft-main-banner-section .bento-left-column,
	html body section.aft-main-banner-section .bento-right-column {
		width: 100% !important;
		max-width: 100% !important;
		flex: 1 1 100% !important;
		min-width: 0 !important;
	}

	/* footer: the three fixed-300px widget columns wrap instead of overflowing */
	html body #page .primary-footer .af-container-row,
	html body .primary-footer .af-container-row {
		display: flex !important;
		flex-wrap: wrap !important;
		gap: 24px !important;
		justify-content: flex-start !important;
	}
	html body #page .primary-footer .primary-footer-area,
	html body .primary-footer .primary-footer-area {
		min-width: 0 !important;
		max-width: 100% !important;
		flex: 1 1 300px !important;
	}
}