/*
Theme Name: Hello Elementor Child — Manhê
Theme URI: https://manhealimentos.com.br
Description: Tema filho do Hello Elementor com a identidade da Manhê para o blog. Todo o CSS é escopado pela classe de body .manhe-blog-ctx — as páginas montadas no Elementor (home, unidades, revendedor) não são afetadas.
Author: Manhê Alimentos
Template: hello-elementor
Version: 1.2.2
Text Domain: hello-elementor-child
*/

/* ==========================================================
   Fontes da marca — auto-hospedadas (nada de CDN do Google:
   o IP do visitante não sai do nosso servidor)
   ========================================================== */
@font-face {
	font-family: 'Young Serif';
	src: url('fonts/young-serif-latin.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Montserrat';
	src: url('fonts/montserrat-latin-var.woff2') format('woff2');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

/* ==========================================================
   Tokens — só nas páginas de blog (.manhe-blog-ctx)
   ========================================================== */
.manhe-blog-ctx {
	--manhe-vermelho: #C0392B;
	--manhe-vermelho-escuro: #A93226;
	--manhe-creme: #F5EFE6;
	--manhe-offwhite: #FAF6F1;
	--manhe-areia: #D8C6B3;
	--manhe-marrom: #6B4F3A;
	--manhe-oliva: #5C6B2A;
	--manhe-largura-leitura: 42rem;

	background: var(--manhe-offwhite);
	color: var(--manhe-marrom);
	font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 1.0625rem;
	line-height: 1.75;
	-webkit-font-smoothing: antialiased;
}

/* ==========================================================
   Cabeçalho e rodapé do tema (o logo vinha em 512px crus)
   ========================================================== */
.manhe-blog-ctx #site-header {
	background: var(--manhe-offwhite);
	border-bottom: 1px solid var(--manhe-areia);
	padding: 0.85rem 1.5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
}
/* Logo: a foto (quadrado escuro) é ilegível em tamanho de header sobre
   fundo claro. No blog ela sai, e entra a marca TIPOGRÁFICA — "Manhê"
   em Young Serif vermelho + selo "blog" — o mesmo sistema dos títulos. */
.manhe-blog-ctx #site-header .custom-logo-link picture,
.manhe-blog-ctx #site-header .custom-logo-link img {
	display: none;
}
.manhe-blog-ctx #site-header .custom-logo-link {
	display: inline-flex;
	align-items: baseline;
	gap: 0.5rem;
	text-decoration: none;
}
/* A logo REAL da marca (script), tingida no vermelho do design a partir
   da logo-manhe-branca.png. O texto 'Manhê' fica transparente por baixo
   da imagem — é o que o leitor de tela lê. */
.manhe-blog-ctx #site-header .custom-logo-link::before {
	content: 'Manhê';
	color: transparent;
	display: inline-block;
	overflow: hidden;
	width: 124px;
	height: 56px;
	background: url('images/logo-blog.png') no-repeat left center / contain;
}
.manhe-blog-ctx #site-header .custom-logo-link::after {
	content: 'blog';
	font-family: 'Montserrat', sans-serif;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--manhe-creme);
	background: var(--manhe-oliva);
	padding: 0.2rem 0.55rem;
	border-radius: 999px;
	transform: translateY(-0.3rem);
}
/* A tagline longa do header sai no blog — o hero já apresenta a página */
.manhe-blog-ctx #site-header .site-description {
	display: none;
}
.manhe-blog-ctx #site-header a {
	color: var(--manhe-marrom);
	text-decoration: none;
	font-weight: 600;
	font-size: 0.9rem;
}
.manhe-blog-ctx #site-header a:hover { color: var(--manhe-vermelho); }

.manhe-blog-ctx #site-footer {
	border-top: 1px solid var(--manhe-areia);
	margin-top: 4rem;
	padding: 1.75rem 1.5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	flex-wrap: wrap;
	font-size: 0.85rem;
}
.manhe-blog-ctx #site-footer .custom-logo-link picture,
.manhe-blog-ctx #site-footer .custom-logo-link img {
	display: none;
}
.manhe-blog-ctx #site-footer .custom-logo-link::before {
	content: 'Manhê';
	color: transparent;
	display: inline-block;
	overflow: hidden;
	width: 84px;
	height: 38px;
	background: url('images/logo-blog.png') no-repeat left center / contain;
}
.manhe-blog-ctx #site-footer .custom-logo-link {
	text-decoration: none;
}

/* ==========================================================
   Índice do blog (home.php / archive.php / search.php)
   ========================================================== */
.manhe-blog {
	max-width: 46rem;
	margin: 0 auto;
	padding: 0 1.25rem 3rem;
}
.manhe-blog__hero {
	text-align: center;
	padding: 3rem 0 2.25rem;
}
.manhe-blog__titulo {
	font-family: 'Young Serif', Georgia, serif;
	font-weight: 400;
	color: var(--manhe-vermelho);
	font-size: clamp(2rem, 5vw, 2.75rem);
	line-height: 1.15;
	margin: 0 0 0.75rem;
}
.manhe-blog__sub {
	max-width: 34rem;
	margin: 0 auto;
	font-size: 1rem;
	color: var(--manhe-marrom);
}
.manhe-blog__vazio {
	text-align: center;
	padding: 3rem 0;
	color: var(--manhe-marrom);
}
.manhe-blog__lista {
	display: grid;
	gap: 2rem;
}

/* Card de post */
.manhe-card {
	background: var(--manhe-creme);
	border: 1px solid var(--manhe-areia);
	border-radius: 14px;
	overflow: hidden;
}
.manhe-card__media { display: block; }
.manhe-card__media img {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
.manhe-card__corpo { padding: 1.5rem 1.75rem 1.75rem; }
.manhe-card__meta {
	font-size: 0.8rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--manhe-oliva);
	font-weight: 600;
	margin: 0 0 0.5rem;
}
.manhe-card__titulo {
	font-family: 'Young Serif', Georgia, serif;
	font-weight: 400;
	font-size: 1.5rem;
	line-height: 1.25;
	margin: 0 0 0.6rem;
}
.manhe-card__titulo a {
	color: var(--manhe-marrom);
	text-decoration: none;
}
.manhe-card__titulo a:hover { color: var(--manhe-vermelho); }
.manhe-card__resumo { font-size: 0.98rem; }
.manhe-card__resumo p { margin: 0 0 0.9rem; }
.manhe-card__mais {
	color: var(--manhe-vermelho);
	font-weight: 600;
	text-decoration: none;
	font-size: 0.95rem;
}
.manhe-card__mais:hover { color: var(--manhe-vermelho-escuro); text-decoration: underline; }

/* Paginação */
.manhe-blog-ctx .navigation.pagination { margin-top: 2.5rem; }
.manhe-blog-ctx .nav-links {
	display: flex;
	justify-content: center;
	gap: 0.4rem;
	flex-wrap: wrap;
}
.manhe-blog-ctx .page-numbers {
	display: inline-block;
	padding: 0.35rem 0.9rem;
	border: 1px solid var(--manhe-areia);
	border-radius: 999px;
	color: var(--manhe-marrom);
	text-decoration: none;
	font-size: 0.9rem;
	font-weight: 600;
}
.manhe-blog-ctx .page-numbers.current,
.manhe-blog-ctx .page-numbers:hover {
	background: var(--manhe-vermelho);
	border-color: var(--manhe-vermelho);
	color: var(--manhe-creme);
}

/* ==========================================================
   Post (single.php)
   ========================================================== */
.manhe-post {
	max-width: var(--manhe-largura-leitura);
	margin: 0 auto;
	padding: 0 1.25rem 3rem;
}
.manhe-post__cabecalho {
	text-align: center;
	padding: 3rem 0 1.5rem;
}
.manhe-post__meta {
	font-size: 0.8rem;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	color: var(--manhe-oliva);
	font-weight: 600;
	margin: 0 0 0.9rem;
}
.manhe-post__titulo {
	font-family: 'Young Serif', Georgia, serif;
	font-weight: 400;
	color: var(--manhe-vermelho);
	font-size: clamp(1.9rem, 4.5vw, 2.6rem);
	line-height: 1.18;
	margin: 0;
}
.manhe-post__capa { margin: 1.5rem 0 0; }
.manhe-post__capa img {
	width: 100%;
	border-radius: 14px;
	display: block;
}

/* Conteúdo do post */
.manhe-post__content { padding-top: 1.5rem; }
.manhe-post__content p { margin: 0 0 1.4em; }
.manhe-post__content h2 {
	font-family: 'Young Serif', Georgia, serif;
	font-weight: 400;
	color: var(--manhe-marrom);
	font-size: 1.55rem;
	line-height: 1.25;
	margin: 2.2em 0 0.7em;
}
.manhe-post__content h3 {
	font-family: 'Young Serif', Georgia, serif;
	font-weight: 400;
	color: var(--manhe-marrom);
	font-size: 1.2rem;
	margin: 1.8em 0 0.6em;
}
.manhe-post__content a {
	color: var(--manhe-vermelho);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.manhe-post__content a:hover { color: var(--manhe-vermelho-escuro); }
.manhe-post__content strong { font-weight: 700; }
.manhe-post__content ul,
.manhe-post__content ol { margin: 0 0 1.4em; padding-left: 1.4em; }
.manhe-post__content li { margin-bottom: 0.4em; }
.manhe-post__content blockquote {
	background: var(--manhe-creme);
	border-left: 4px solid var(--manhe-vermelho);
	border-radius: 0 10px 10px 0;
	margin: 1.8em 0;
	padding: 1.1rem 1.4rem;
	font-size: 0.98rem;
}
.manhe-post__content blockquote p:last-child { margin-bottom: 0; }
.manhe-post__content img {
	max-width: 100%;
	height: auto;
	border-radius: 10px;
}
.manhe-post__content figure { margin: 1.8em 0; }
.manhe-post__content figcaption {
	font-size: 0.85rem;
	color: var(--manhe-oliva);
	margin-top: 0.5rem;
	text-align: center;
}
.manhe-post__content hr {
	border: 0;
	border-top: 1px solid var(--manhe-areia);
	margin: 2.5em 0;
}
.manhe-post__content table {
	display: block;
	overflow-x: auto;
	border-collapse: collapse;
	margin: 1.8em 0;
	font-size: 0.95rem;
}
.manhe-post__content th,
.manhe-post__content td {
	border: 1px solid var(--manhe-areia);
	padding: 0.55rem 0.9rem;
	text-align: left;
}
.manhe-post__content th {
	background: var(--manhe-creme);
	font-weight: 700;
	font-size: 0.88rem;
}
.manhe-post__content video,
.manhe-post__content iframe {
	max-width: 100%;
	border-radius: 10px;
}

/* Chamada pra comprar — link pro fim de todo post, home ou unidade mais próxima */
.manhe-post__cta {
	background: var(--manhe-creme);
	border: 1px solid var(--manhe-areia);
	border-radius: 14px;
	padding: 1.5rem 1.75rem;
	margin-top: 2.5rem;
	text-align: center;
}
.manhe-post__cta-texto {
	margin: 0 0 1rem;
	font-weight: 700;
	color: var(--manhe-marrom);
}
.manhe-post__cta-botoes {
	display: flex;
	justify-content: center;
	gap: 0.75rem;
	flex-wrap: wrap;
}
.manhe-botao {
	display: inline-block;
	border-radius: 999px;
	padding: 0.7rem 1.5rem;
	font-weight: 700;
	font-size: 0.95rem;
	text-decoration: none;
}
.manhe-botao--principal {
	background: var(--manhe-vermelho);
	color: var(--manhe-creme);
}
.manhe-botao--principal:hover { background: var(--manhe-vermelho-escuro); }
.manhe-botao--secundario {
	background: transparent;
	color: var(--manhe-vermelho);
	border: 1.5px solid var(--manhe-vermelho);
}
.manhe-botao--secundario:hover { background: var(--manhe-vermelho); color: var(--manhe-creme); }

/* Caixa de autoria */
.manhe-autor {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	background: var(--manhe-creme);
	border: 1px solid var(--manhe-areia);
	border-radius: 14px;
	padding: 1.25rem 1.5rem;
	margin-top: 2.5rem;
}
.manhe-autor__avatar {
	flex: 0 0 auto;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: var(--manhe-oliva);
	color: var(--manhe-creme);
	font-family: 'Young Serif', Georgia, serif;
	font-size: 1.3rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
.manhe-autor__nome {
	font-weight: 700;
	margin: 0.2rem 0 0.2rem;
}
.manhe-autor__bio {
	font-size: 0.92rem;
	margin: 0;
}

/* ==========================================================
   Comentários
   ========================================================== */
.manhe-blog-ctx .comments-area {
	margin-top: 2.5rem;
	border-top: 1px solid var(--manhe-areia);
	padding-top: 2rem;
}
.manhe-blog-ctx .comments-title,
.manhe-blog-ctx .comment-reply-title {
	font-family: 'Young Serif', Georgia, serif;
	font-weight: 400;
	font-size: 1.35rem;
	color: var(--manhe-marrom);
	margin: 0 0 1rem;
}
.manhe-blog-ctx .comment-list {
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
}
.manhe-blog-ctx .comment-list .children {
	list-style: none;
	padding-left: 1.5rem;
}
.manhe-blog-ctx .comment-body {
	border-bottom: 1px solid var(--manhe-areia);
	padding: 1.1rem 0;
	font-size: 0.98rem;
}
.manhe-blog-ctx .comment-author { font-weight: 700; }
.manhe-blog-ctx .comment-author .avatar { display: none; }
.manhe-blog-ctx .comment-metadata {
	font-size: 0.8rem;
	margin-bottom: 0.5rem;
}
.manhe-blog-ctx .comment-metadata a {
	color: var(--manhe-oliva);
	text-decoration: none;
}
.manhe-blog-ctx .reply a {
	color: var(--manhe-vermelho);
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
}
.manhe-blog-ctx .comment-form label {
	display: block;
	font-size: 0.85rem;
	font-weight: 600;
	margin-bottom: 0.3rem;
}
.manhe-blog-ctx .comment-form input[type="text"],
.manhe-blog-ctx .comment-form input[type="email"],
.manhe-blog-ctx .comment-form input[type="url"],
.manhe-blog-ctx .comment-form textarea {
	width: 100%;
	padding: 0.65rem 0.85rem;
	border: 1px solid var(--manhe-areia);
	border-radius: 8px;
	background: #FFFFFF;
	color: var(--manhe-marrom);
	font-family: inherit;
	font-size: 0.98rem;
	margin-bottom: 1rem;
}
.manhe-blog-ctx .comment-form input:focus,
.manhe-blog-ctx .comment-form textarea:focus {
	outline: 2px solid var(--manhe-vermelho);
	outline-offset: 1px;
	border-color: var(--manhe-vermelho);
}
.manhe-blog-ctx .form-submit input[type="submit"] {
	background: var(--manhe-vermelho);
	color: var(--manhe-creme);
	border: 0;
	border-radius: 999px;
	padding: 0.7rem 1.7rem;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 700;
	cursor: pointer;
}
.manhe-blog-ctx .form-submit input[type="submit"]:hover {
	background: var(--manhe-vermelho-escuro);
}
.manhe-blog-ctx .manhe-moderacao {
	font-size: 0.85rem;
	color: var(--manhe-oliva);
	margin-top: 0.75rem;
}

/* ==========================================================
   Responsivo
   ========================================================== */
@media (max-width: 640px) {
	.manhe-blog__hero,
	.manhe-post__cabecalho { padding-top: 2rem; }
	.manhe-card__corpo { padding: 1.15rem 1.25rem 1.4rem; }
	.manhe-autor { padding: 1rem 1.1rem; }
}