/* ==========================================================================
   seo-pages-2026.css
   Scoped styles for new SEO content pages (2026 additions)
   Requires: class="seo-page-2026" on the <main> element
   ========================================================================== */

/* --- Content Cards (faq-box override) ------------------------------------ */
.seo-page-2026 .faq-box {
	border-left: 3px solid #2d6a4f;
	background: #f9fafb;
	border-radius: 0 6px 6px 0;
	margin: 12px 0;
	padding: 20px 28px;
}

/* Cancel the stale two-column rule */
.seo-page-2026 .faq-box > *:first-child {
	max-width: 100%;
}

.seo-page-2026 .faq-box h4 {
	margin-bottom: 6px;
}

/* --- Closing / Final Tips Box -------------------------------------------- */
.closing-box {
	background: #f0f7f4;
	border-radius: 8px;
	padding: 48px 56px;
	border-top: 4px solid #2d6a4f;
	margin-bottom: 60px;
}

@media (max-width: 768px) {
	.closing-box {
		padding: 32px 20px;
	}
}

/* --- Section Divider ------------------------------------------------------ */
.section-hr {
	border: none;
	border-top: 1px solid #eaeaea;
	margin: 0;
}

/* --- Consistent left-aligned container headings -------------------------- */
.seo-page-2026 .container > h2:first-child,
.seo-page-2026 .container > h3:first-child {
	margin-bottom: 20px;
}

/* --- Body copy spacing inside containers ---------------------------------- */
.seo-page-2026 .container > p {
	line-height: 1.75;
	margin-bottom: 12px;
}

/* --- Highlight / info boxes ----------------------------------------------- */
.seo-page-2026 .bg-white.text-sm.color-blue {
	padding: 20px 28px;
	border: 1px solid #d0e4f0;
	border-radius: 6px;
	background: #f4f8fb !important;
}

/* --- Responsive Tables ---------------------------------------------------- */
.seo-page-2026 .table-responsive {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border-radius: 6px;
	/* Faint right shadow hints at scrollability on mobile */
	box-shadow: inset -4px 0 6px -4px rgba(0,0,0,0.08);
}

.seo-page-2026 .table-responsive table {
	min-width: 520px; /* Prevents table from collapsing below readable width */
}

@media (max-width: 768px) {
	.seo-page-2026 .table-responsive table th,
	.seo-page-2026 .table-responsive table td {
		padding: 10px 12px !important;
		font-size: 0.85rem;
	}
}