/*
Theme Name: Astra Child
Theme URI: https://entrementes.com.br/
Description: Tema filho do Astra para o Entrementes. Guarda o CSS custom e os templates sobrescritos, para que updates do Astra nao apaguem nada.
Author: Entrementes
Template: astra
Version: 1.0.0
Text Domain: astra-child
*/

:root {
	--entrementes-content-width: 1140px;

	/* Laranja da marca. Usar apenas em áreas grandes: em texto de 16px o
	   contraste é 3.48:1 sobre branco, abaixo do mínimo WCAG AA de 4.5:1. */
	--entrementes-laranja: #ec5930;

	/* Mesmo matiz, escurecido até passar AA: 4.91:1 no branco, 4.56:1 no bege. */
	--entrementes-laranja-texto: #ce3c13;

	/* Ritmo vertical dos cards. Antes a imagem colava no título (9px) e o
	   título no texto (5px), o que apertava a leitura. */
	--entrementes-espaco-imagem-titulo: 0.85em;
	--entrementes-espaco-titulo-texto: 0.4em;

	/* Respiro entre o menu e o conteúdo, e entre o conteúdo e o rodapé.
	   O wrapper #primary vinha sem padding nenhum, então a última fileira de
	   cards encostava na faixa escura do rodapé. */
	--entrementes-respiro-topo: 1.75rem;
	--entrementes-respiro-rodape: 3.5rem;

	/* Separação entre fileiras de cards nos arquivos. */
	--entrementes-espaco-entre-cards: 2rem;
}

/* O Astra zera o padding do #primary nos templates de page builder com
   `.ast-page-builder-template .site .site-content #primary`. Repetimos o mesmo
   escopo para ganhar por ordem, em vez de recorrer a !important. */
.ast-page-builder-template .site .site-content #primary,
.site-content #primary {
	padding-bottom: var(--entrementes-respiro-rodape);
	padding-top: var(--entrementes-respiro-topo);
}

/* Páginas de arquivo não têm #primary — o conteúdo vem direto do template de
   arquivo do Elementor, e a última fileira ficava a 10px do rodapé. */
.elementor-location-archive {
	padding-bottom: var(--entrementes-respiro-rodape);
	padding-top: var(--entrementes-respiro-topo);
}

/* ==========================================================================
   Tipografia e cores base
   ========================================================================== */

b,
strong {
	font-weight: 600;
}

/* Títulos grandes com line-height 1 encostavam as linhas umas nas outras
   quando quebravam em três — e as cedilhas e tis colidiam com a linha de baixo. */
.entry-content h1,
h1 {
	line-height: 1.12;
}

.entry-content h2,
h2 {
	line-height: 1.2;
}

.entry-content h3,
h3 {
	line-height: 1.3;
}

.entry-content h4,
h4 {
	line-height: 1.3;
}

.page-id-85 .entry-content h1,
.page-id-85 .entry-content h2,
.page-id-85 .entry-content h3,
.page-id-85 .entry-content h4,
.page-id-85 .entry-content h5,
.page-id-85 .entry-content h6 {
	margin-bottom: 5px;
}

/* ==========================================================================
   Fundos e cabecalho
   ========================================================================== */

.ast-primary-header-bar {
	background-color: #fdf5f3;
}

.ast-separate-container .ast-archive-description {
	background-color: #fdf5f3;
}

.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single:not(.ast-related-post) {
	background-color: #fdf5f3;
}

.ast-separate-container .error-404,
.ast-separate-container .no-results {
	background-color: #fdf5f3;
}

#ajaxsearchlite1 .probox,
div.asl_w .probox {
	background-color: #fdf5f3;
}

/* ==========================================================================
   Conteudo do post
   ========================================================================== */

.elementor-widget-theme-post-content a {
	color: var(--entrementes-laranja-texto);
	font-weight: 600;
}

.elementor-widget-theme-post-content p {
	line-height: 1.6;
	margin-bottom: 1.25em;
}

.elementor-widget-theme-post-content p:has(> strong:first-child) {
	margin-bottom: 0.5em;
}

.elementor-widget-theme-post-content p:has(> iframe) {
	margin-bottom: 2.25em;
	margin-top: 2.25em;
}

.elementor-widget-theme-post-content iframe {
	aspect-ratio: 16 / 9;
	display: block;
	height: auto;
	width: 100%;
}

.elementor-widget-theme-post-content iframe[width="315"][height="560"] {
	aspect-ratio: 9 / 16;
	margin-left: auto;
	margin-right: auto;
	max-width: 360px;
}

.single .post-navigation .nav-links,
#comments {
	display: none;
}

/* ==========================================================================
   Tags
   ========================================================================== */

.custom-tags {
	display: flex;
	flex-wrap: wrap;
}

.bloco-tags__titulo {
	font-size: 26px;
	font-weight: 600;
	margin-bottom: 0;
}

.custom-a-tag {
	margin: 10px 5px 10px 0;
}

.custom-a-tag a {
	border: 1px solid var(--entrementes-laranja);
	border-radius: 12px;
	color: var(--entrementes-laranja-texto) !important;
	font-size: 16px;
	padding: 7px;
}

.custom-a-tag a:hover {
	background-color: var(--entrementes-laranja-texto) !important;
	color: #fff !important;
}

.tag-cloud-link {
	color: var(--entrementes-laranja-texto) !important;
}

/* ==========================================================================
   Seção Vídeos
   ========================================================================== */

.videos-filtro {
	margin: 0 auto;
	max-width: var(--entrementes-content-width);
	padding: 0 10px;
}

.videos-filtro .custom-a-tag a.is-active {
	background-color: var(--entrementes-laranja-texto) !important;
	color: #fff !important;
}

.category-videos .subhomes-cat img {
	aspect-ratio: 9 / 16;
	object-fit: cover;
	width: 100%;
}

/* ==========================================================================
   Posts relacionados (YARPP) e destaques
   ========================================================================== */

.yarpp-related-widget h3 {
	font-weight: bold;
	margin-bottom: 0.5em;
}

.yarpp-related-widget h3:first-child {
	padding-top: 5px;
}

.mb-05 {
	margin-bottom: 0 !important;
}

.mb-05 a {
	font-weight: bold;
}

.mb-05 img {
	margin-bottom: var(--entrementes-espaco-imagem-titulo) !important;
}

.card__titulo {
	margin-bottom: var(--entrementes-espaco-titulo-texto) !important;
}

.card__texto {
	line-height: 1.5;
}

/* Os arquivos misturam thumbs 16:9 (podcast) e 9:16 (vídeo). Sem uma proporção
   comum os cards ficavam com alturas muito diferentes e a grade abria buracos.
   A seção Vídeos, que só tem material vertical, usa 9:16 mais abaixo. */
.subhomes-cat img,
.destaque-bottom img,
.highlight-see-more img {
	aspect-ratio: 16 / 9;
	object-fit: cover;
	width: 100%;
}

.mb-1 {
	margin-bottom: 1em !important;
}

.excerpt a {
	line-height: 1.2;
}

.destaque-bottom img {
	margin-bottom: 0.5em;
}

.destaque-bottom h4 {
	font-weight: bold;
	margin-bottom: 0;
}

/* ==========================================================================
   Rodape
   ========================================================================== */

.ast-footer-html-1 {
	width: auto;
}

/* ==========================================================================
   Breakpoints
   ========================================================================== */

@media (max-width: 921px) {
	.ast-header-html-1 {
		width: 50%;
	}

	/* No mobile os cards empilham sem padding nenhum, então o texto de um
	   encostava na imagem do seguinte. */
	.cat-destaque-2,
	.cat-destaque-3 {
		margin-bottom: var(--entrementes-espaco-entre-cards);
	}

	.category-videos .subhomes-cat {
		display: flex;
		flex-wrap: wrap;
		margin-left: -8px;
		margin-right: -8px;
	}

	.category-videos .cat-destaque-2,
	.category-videos .cat-destaque-3 {
		flex: 0 0 50%;
		max-width: 50%;
		padding: 0 8px;
	}

	.site-footer-section-1 img {
		float: none;
	}

	.elementor-1607 .elementor-element.elementor-element-924d0da > .elementor-widget-container {
		padding: 0;
	}
}

@media (min-width: 921px) {
	.subhomes-cat {
		align-items: flex-start;
		display: -webkit-box;
		display: flex;
		flex-wrap: wrap;
		margin-left: -15px;
		margin-right: -15px;
	}

	.cat-destaque-2 {
		-webkit-box-flex: 0;
		flex: 0 0 50%;
		max-width: 50%;
		padding: 0 15px var(--entrementes-espaco-entre-cards);
	}

	.cat-destaque-3 {
		-webkit-box-flex: 0;
		flex: 0 0 33.3333333333%;
		max-width: 33.3333333333%;
		padding: 0 15px var(--entrementes-espaco-entre-cards);
	}

	.category-videos .cat-destaque-2,
	.category-videos .cat-destaque-3 {
		flex: 0 0 25%;
		max-width: 25%;
	}

	.destaques-relacionados {
		display: flex;
	}

	.destaque-bottom {
		margin-right: 20px;
		width: 100%;
	}

	.ast-separate-container .ast-single-related-posts-container {
		padding: 0 0 5.34em 6.67em;
	}

	.elementor-117 .elementor-element.elementor-element-ca6e410 > .elementor-element-populated {
		padding-top: 0;
	}

	.elementor-1607 .elementor-element.elementor-element-924d0da > .elementor-widget-container {
		padding: 0;
	}
}
