/* --------------------------------------------------------------
   Blog posts — layout responsivo
   Criado em 14/08/2026. O single.php do tema nao carregava nenhum
   CSS com media query, entao os artigos ficavam sem layout mobile
   e as tabelas estouravam a tela.
   Escopo: apenas .single-post e .blog (listagem). Nao toca em pagina.
   -------------------------------------------------------------- */

.single-post .entry-content,
.single-post .entry-header {
	max-width: 46rem;
	margin-left: auto;
	margin-right: auto;
	padding-left: 1.25rem;
	padding-right: 1.25rem;
	box-sizing: border-box;
}

.single-post .entry-content {
	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	font-size: clamp(1rem, 0.95rem + 0.25vw, 1.125rem);
	line-height: 1.75;
	color: #24313d;
	overflow-wrap: break-word;
}

/* ---------- Titulos ---------- */

.single-post .entry-title {
	font-size: clamp(1.6rem, 1.25rem + 1.6vw, 2.5rem);
	line-height: 1.22;
	color: #123a5c;
	margin: 0 0 .75rem;
}

.single-post .entry-content h2 {
	font-size: clamp(1.35rem, 1.15rem + 0.9vw, 1.85rem);
	line-height: 1.28;
	color: #123a5c;
	margin: 2.5rem 0 .85rem;
	padding-top: .6rem;
	border-top: 3px solid #d9edf5;
}

.single-post .entry-content h3 {
	font-size: clamp(1.12rem, 1rem + 0.5vw, 1.4rem);
	line-height: 1.35;
	color: #17527d;
	margin: 1.9rem 0 .6rem;
}

.single-post .entry-content p { margin: 0 0 1.15rem; }

.single-post .entry-content strong { color: #0f2f4a; }

/* ---------- Listas ---------- */

.single-post .entry-content ul,
.single-post .entry-content ol {
	margin: 0 0 1.3rem;
	padding-left: 1.35rem;
}

.single-post .entry-content li { margin-bottom: .55rem; }

/* ---------- Links ---------- */

.single-post .entry-content a {
	color: #0d6ea8;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.single-post .entry-content a:hover { color: #08415f; }

/* ---------- Imagens ---------- */

.single-post .entry-content figure { margin: 2rem 0; }

.single-post .entry-content img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: 10px;
}

.single-post .entry-content figcaption {
	font-size: .875rem;
	line-height: 1.5;
	color: #5b6b78;
	margin-top: .6rem;
	text-align: left;
}

/* ---------- Tabelas: o principal problema no celular ---------- */

.single-post .entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 1.75rem 0;
	font-size: .95rem;
	background: #fff;
}

.single-post .entry-content caption {
	caption-side: top;
	text-align: left;
	font-size: .875rem;
	color: #5b6b78;
	padding-bottom: .5rem;
}

.single-post .entry-content th,
.single-post .entry-content td {
	border: 1px solid #dbe6ee;
	padding: .7rem .8rem;
	text-align: left;
	vertical-align: top;
}

.single-post .entry-content thead th {
	background: #eaf4fa;
	color: #123a5c;
	font-weight: 600;
}

.single-post .entry-content tbody tr:nth-child(even) { background: #f7fbfd; }

/* ---------- Mobile ---------- */

@media (max-width: 782px) {

	.single-post .entry-content,
	.single-post .entry-header {
		padding-left: 1rem;
		padding-right: 1rem;
	}

	/* a tabela passa a rolar na horizontal em vez de estourar a tela */
	.single-post .entry-content table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		white-space: nowrap;
		font-size: .9rem;
	}

	.single-post .entry-content th,
	.single-post .entry-content td {
		padding: .6rem .65rem;
	}

	.single-post .entry-content figure { margin: 1.5rem 0; }

	.single-post .entry-content h2 { margin-top: 2rem; }
}

/* ---------- Listagem /blog/ ---------- */

.blog .site-main,
.archive .site-main {
	max-width: 58rem;
	margin: 0 auto;
	padding: 1.5rem 1.25rem 3rem;
	box-sizing: border-box;
}

.blog .site-main article,
.archive .site-main article {
	border: 1px solid #e3ecf3;
	border-radius: 12px;
	padding: 1.25rem;
	margin-bottom: 1.5rem;
	background: #fff;
}

.blog .site-main article img,
.archive .site-main article img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
}

.blog .site-main .entry-title,
.archive .site-main .entry-title {
	font-size: clamp(1.15rem, 1rem + 0.7vw, 1.5rem);
	line-height: 1.3;
	margin: .85rem 0 .5rem;
}

.blog .site-main .entry-title a,
.archive .site-main .entry-title a {
	color: #123a5c;
	text-decoration: none;
}

@media (max-width: 782px) {
	.blog .site-main,
	.archive .site-main {
		padding: 1rem 1rem 2rem;
	}
	.blog .site-main article,
	.archive .site-main article { padding: 1rem; }
}