/* Base reset for blog pages (single post, author archive, Blog Hub template) */
.abcis-page { margin: 0; font-family: Poppins, system-ui, sans-serif; background: #ffffff; -webkit-font-smoothing: antialiased; }
.abcis-page a { color: #1e8a3b; text-decoration: none; }
.abcis-page a:hover { color: #14682c; }
.abcis-page, .abcis-page * { box-sizing: border-box; }

.abcis-card { transition: box-shadow .2s ease, transform .2s ease; }
.abcis-card:hover { box-shadow: 0 14px 30px rgba(19,43,83,0.11); transform: translateY(-3px); }
.abcis-read-more { transition: gap .2s ease; }
.abcis-read-more:hover { gap: 14px !important; }
.abcis-btn-primary { transition: background .2s ease; }
.abcis-btn-primary:hover { background: #14682c !important; }
.abcis-btn-dark { transition: background .2s ease; }
.abcis-btn-dark:hover { background: #16385f !important; }
.abcis-nav-link { transition: color .2s ease; }
.abcis-nav-link:hover { color: #8ecfa2 !important; }

/* Tables wider than the article scroll inside this wrapper (scrollbar kept visible so it is discoverable on touch screens). */
.abcis-table-scroll { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 1.5em 0; scrollbar-width: thin; }
.abcis-table-scroll::-webkit-scrollbar { height: 6px; }
.abcis-table-scroll::-webkit-scrollbar-thumb { background: #b8c0cc; border-radius: 3px; }
.abcis-table-scroll table { margin: 0 auto; }

/* Breadcrumb on a single post: keep one line, truncate a long title with an ellipsis. */
.abcis-breadcrumb > a, .abcis-breadcrumb > span { flex: 0 0 auto; white-space: nowrap; }
.abcis-breadcrumb > .abcis-breadcrumb-current { flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; }

.abcis-article-body img { max-width: 100% !important; height: auto !important; }

/* Tablet: 3 columns are too narrow, use 2. */
@media (min-width: 769px) and (max-width: 1024px) {
	.abcis-grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 768px) {
	.abcis-page section { padding-left: 20px !important; padding-right: 20px !important; }
	.abcis-grid-featured,
	.abcis-grid-3,
	.abcis-grid-cta,
	.abcis-hero-grid,
	.abcis-grid-stats,
	.abcis-grid-bio,
	.abcis-grid-author-featured { grid-template-columns: 1fr !important; }
	.abcis-grid-stats { grid-template-columns: repeat(2, 1fr) !important; row-gap: 20px !important; }
	.abcis-featured-media { min-height: 220px !important; }
	/* Keep the post image's own ratio and scale it down to fit, instead of cropping it to a fixed height. */
	.abcis-hero-image { height: auto !important; min-height: 0 !important; background: transparent !important; }
	.abcis-hero-image img { position: static !important; width: 100% !important; height: auto !important; object-fit: contain !important; display: block; }
	.abcis-grid-3 > *,
	.abcis-grid-bio > * { min-width: 0; }
	.abcis-h1 { font-size: 32px !important; }
	.abcis-h2-lg { font-size: 24px !important; }
	.abcis-h2 { font-size: 22px !important; }
	.abcis-cta-form { flex-direction: column !important; }
	.abcis-hero-grid { justify-items: center; text-align: center; }
	.abcis-hero-grid img { margin: 0 auto; }
	.abcis-hero-actions { justify-content: center; }
	.abcis-hero-social { width: 100%; justify-content: center; margin-left: 0 !important; margin-top: 6px; }
	.abcis-flex-between { flex-direction: column !important; align-items: flex-start !important; }
	.abcis-prevnext a { max-width: 100% !important; }
	.abcis-prevnext { flex-direction: column !important; gap: 20px !important; }
	.abcis-header-nav { display: none !important; }
	.abcis-header-cta { padding: 8px 14px !important; font-size: 11px !important; }

	/* Jump-to-section links and byline: stack instead of wrapping around "|" separators. */
	.abcis-quick-nav { flex-direction: column !important; align-items: flex-start !important; gap: 10px !important; }
	.abcis-byline { flex-direction: column !important; align-items: flex-start !important; gap: 6px !important; }
	.abcis-sep { display: none !important; }

	/* On narrow screens keep cells readable; the table grows wider than the screen and scrolls inside its wrapper. */
	.abcis-table-scroll table { width: auto !important; min-width: 100% !important; max-width: none !important; margin: 0 !important; }
	.abcis-table-scroll table th,
	.abcis-table-scroll table td { min-width: 120px; }

	/* The footer already has a Get In Touch button on mobile. */
	.abcis-cta-contact { display: none !important; }

	.abcis-article-body h2 { font-size: 22px !important; line-height: 1.3 !important; }
	.abcis-article-body h3 { font-size: 19px !important; line-height: 1.35 !important; }
	.abcis-article-body h4 { font-size: 17px !important; }
	.abcis-article-body p,
	.abcis-article-body li { font-size: 15.5px !important; line-height: 1.75 !important; }
}
