/*
 * Blog no molde das paginas novas do site (11-nov-2026).
 * Tokens do site: tinta #0a0a09, papel #f4f2ef, areia #cfc4b4, cinza #545454, linha rgba(10,10,9,.16).
 * Epilogue 400 nos titulos, Mulish 400/500 no texto. Coluna de leitura 42rem (a mesma do estilo de leitura dos posts).
 * Substitui o CSS do Writee (liberado para todos em 11-nov-2026; ver cn_blog_novo() no functions.php do tema-filho).
 */

:root {
  --cb-ink: #0a0a09;
  --cb-muted: #545454;
  --cb-paper: #f4f2ef;
  --cb-sand: #cfc4b4;
  --cb-rule: rgba(10, 10, 9, .16);
  --cb-col: 42rem;
  --cb-gutter: 1.25rem;
}

body { background: #fff; color: var(--cb-ink); }

/* Estrutura do Writee: tudo em coluna unica, sem as caixas dele */
.site-main, .site-container, .site-row, .site-content {
  display: block; float: none; width: auto; max-width: none; margin: 0; padding: 0;
}
.entry, .entry-row, .entry-full-center { margin: 0; padding: 0; }
.entry-center, .entry-full-center { text-align: left !important; }
.site-sidebar, .entry-footer, .entry-paginated-link:empty, .fa { display: none !important; }
img { max-width: 100%; height: auto; }

/* Titulos com linhas equilibradas: nenhuma palavra sozinha na ultima linha */
h1, h2, h3, h4, h5, h6 { text-wrap: balance; }

/* ---------- Post ---------- */

/* Topo escuro so com texto */
.single-post .entry-header {
  background: var(--cb-ink); color: #fff;
  padding: 4.5rem max(var(--cb-gutter), calc(50% - var(--cb-col) / 2)) 4rem;
}
.single-post .entry-header .entry-meta { margin: 0; }
.single-post .entry-cat a {
  font-family: Mulish, sans-serif; font-weight: 500; font-size: .8125rem; letter-spacing: .08em;
  text-transform: uppercase; color: var(--cb-sand); text-decoration: none;
}
.single-post h1.entry-title {
  margin: .875rem 0 1.25rem; font-family: Epilogue, sans-serif; font-weight: 400;
  font-size: clamp(1.875rem, 1.35rem + 1.7vw, 2.5rem); line-height: 1.15; letter-spacing: -.02em;
  color: #fff; text-wrap: balance;
}
.single-post .entry-header .entry-author,
.single-post .entry-header .entry-date {
  font-family: Mulish, sans-serif; font-size: .9375rem; line-height: 1.5; color: rgba(255, 255, 255, .72);
}
.single-post .entry-header .entry-author a { color: inherit; text-decoration: none; }

/* Foto de capa, texto e o que vem depois: tudo na mesma coluna */
.single-post .entry-media,
.single-post .entry-tags,
.single-post .entry-navigation {
  max-width: var(--cb-col); margin-left: auto; margin-right: auto; padding-left: var(--cb-gutter); padding-right: var(--cb-gutter);
  box-sizing: content-box;
}
.single-post .entry-media { margin-top: 2.5rem; }
.single-post .entry-media img { display: block; width: 100%; border-radius: 10px; }
.single-post .entry-content { margin-top: 2.5rem; padding-left: var(--cb-gutter); padding-right: var(--cb-gutter); box-sizing: content-box; }
.single-post .entry-content iframe, .single-post .entry-content video { max-width: 100%; }

/* Texto do post: titulos e destaques na linguagem do site (o estilo de leitura de nering-blog-style continua valendo) */
body.single-post .entry-content h2 {
  font-family: Epilogue, sans-serif; font-weight: 400; font-size: 1.75rem; line-height: 1.25; letter-spacing: -.015em; color: var(--cb-ink);
}
body.single-post .entry-content h2::after { background: var(--cb-sand); }
body.single-post .entry-content h3 { font-family: Epilogue, sans-serif; font-weight: 400; font-size: 1.3rem; color: var(--cb-ink); }
body.single-post .entry-content a {
  color: var(--cb-ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em;
  text-decoration-color: rgba(10, 10, 9, .45);
}
body.single-post .entry-content a:hover { text-decoration-color: currentColor; }
body.single-post .entry-content li::marker { color: var(--cb-muted); }
body.single-post .entry-content blockquote { background: var(--cb-paper); border-left-color: var(--cb-ink); }
body.single-post .entry-content .nering-faq { background: var(--cb-paper); border-color: var(--cb-rule); box-shadow: none; }

/* Etiquetas, se houver */
.single-post .entry-tags { margin-top: 2rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.single-post .entry-tags a {
  font-size: .875rem; padding: .25rem .75rem; border: 1px solid var(--cb-rule); border-radius: 999px; color: var(--cb-ink); text-decoration: none;
}

/* Post anterior / proximo */
.single-post .entry-navigation {
  display: flex; justify-content: space-between; gap: 1rem;
  margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid var(--cb-rule);
}
.single-post .entry-navigation .entry-next { margin-left: auto; text-align: right; }
.single-post .entry-navigation a {
  font-family: Mulish, sans-serif; font-weight: 500; font-size: 1rem; color: var(--cb-ink); text-decoration: none;
}
.single-post .entry-navigation a:hover { text-decoration: underline; text-underline-offset: .2em; }
.single-post .entry-previous a::before { content: "\2190\00a0"; }
.single-post .entry-next a::after { content: "\00a0\2192"; }

/* Leia tambem: faixa de papel com cartoes, como o bloco "Do blog" do site */
.widget_related_posts {
  margin-top: 4rem; padding: 3.5rem var(--cb-gutter) 4rem; background: var(--cb-paper);
}
.widget_related_posts .widget-title, .widget_related_posts .entry-list { max-width: 75rem; margin-left: auto; margin-right: auto; }
.widget_related_posts .widget-title {
  margin-top: 0; margin-bottom: 2rem; font-family: Epilogue, sans-serif; font-weight: 400; font-size: 1.75rem; line-height: 1.2;
  letter-spacing: -.015em; color: var(--cb-ink); text-transform: none;
}
.widget_related_posts .entry-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; }
.widget_related_posts .entry { display: flex; flex-direction: column; gap: .75rem; }
.widget_related_posts .entry-media { overflow: hidden; border-radius: 6px; aspect-ratio: 16 / 10; background: var(--cb-sand); }
.widget_related_posts .entry-media a, .widget_related_posts .entry-media img { display: block; width: 100%; height: 100%; }
.widget_related_posts .entry-media img { object-fit: cover; }
/* child-fixes.css tem "#content img { height:auto }" (id ganha de classe): nas fotos dos cartoes a altura tem que encher o quadro */
.standard-container .entry-media img, .widget_related_posts .entry-media img { height: 100% !important; }
.widget_related_posts .entry-cat a, .standard-container .entry-cat a {
  font-family: Mulish, sans-serif; font-weight: 500; font-size: .75rem; letter-spacing: .08em; text-transform: uppercase;
  color: var(--cb-muted); text-decoration: none;
}
.widget_related_posts .entry-title { margin: 0; font-family: Epilogue, sans-serif; font-weight: 400; font-size: 1.125rem; line-height: 1.3; }
.widget_related_posts .entry-title a { color: var(--cb-ink); text-decoration: none; }
.widget_related_posts .entry-title a:hover { text-decoration: underline; text-underline-offset: .2em; }

/* ---------- Listas: capa do blog, categoria, busca e arquivo ---------- */

/* Titulo da pagina numa faixa escura (na capa, o titulo que ja existia escondido para o Google fica visivel) */
.home.blog .site-content > h1.screen-reader-text,
.site-content-header {
  position: static !important; clip: auto !important; clip-path: none !important; width: auto !important; height: auto !important;
  overflow: visible !important; margin: 0 !important;
  background: var(--cb-ink); color: #fff; padding: 4rem max(var(--cb-gutter), calc(50% - 37.5rem)) 3.5rem !important;
}
.home.blog .site-content > h1.screen-reader-text,
.site-content-header .site-header-title {
  margin: 0; font-family: Epilogue, sans-serif; font-weight: 400; font-size: clamp(1.875rem, 1.35rem + 1.7vw, 2.5rem);
  line-height: 1.15; letter-spacing: -.02em; color: #fff; text-transform: none;
}
.site-content-header .site-header-title a { display: none; }

/* Grade de cartoes (mesmas medidas do bloco "Do blog" da home do site) */
.standard-container {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem 2rem;
  max-width: 75rem; margin: 0 auto; padding: 3.5rem var(--cb-gutter) 3rem; box-sizing: content-box;
}
.standard-container .entry-row, .standard-container .entry-full-center { display: flex; flex-direction: column; gap: .75rem; height: 100%; }
.standard-container .entry-media { order: -1; overflow: hidden; border-radius: 6px; aspect-ratio: 16 / 10; background: var(--cb-sand); }
.standard-container .entry-media a, .standard-container .entry-media img { display: block; width: 100%; height: 100%; }
.standard-container .entry-media img { object-fit: cover; transition: transform .6s cubic-bezier(.16, 1, .3, 1); }
.standard-container .entry:hover .entry-media img { transform: scale(1.04); }
.standard-container .entry-header { display: flex; flex-direction: column; gap: .5rem; }
.standard-container .entry-header .entry-meta { margin: 0; }
.standard-container .entry-title { margin: 0; font-family: Epilogue, sans-serif; font-weight: 400; font-size: 1.375rem; line-height: 1.3; letter-spacing: -.01em; text-wrap: balance; }
.standard-container .entry-title a { color: var(--cb-ink); text-decoration: none; }
.standard-container .entry-title a:hover { text-decoration: underline; text-underline-offset: .2em; text-decoration-thickness: 1px; }
.standard-container .entry-date { font-family: Mulish, sans-serif; font-size: .9375rem; color: var(--cb-muted); }
.standard-container .entry-author, .standard-container .entry-content { display: none; }

/* Paginacao */
.navigation.pagination { max-width: 75rem; margin: 0 auto; padding: 0 var(--cb-gutter) 4.5rem; box-sizing: content-box; }
.navigation.pagination .nav-links { display: flex; flex-wrap: wrap; gap: .5rem; }
.navigation.pagination .page-numbers {
  display: inline-flex; align-items: center; justify-content: center; min-width: 2.75rem; height: 2.75rem; padding: 0 .875rem;
  box-sizing: border-box; border: 1px solid var(--cb-rule); border-radius: 6px;
  font-family: Mulish, sans-serif; font-weight: 500; font-size: 1rem; color: var(--cb-ink); text-decoration: none;
}
.navigation.pagination .page-numbers.current { background: var(--cb-ink); border-color: var(--cb-ink); color: #fff; }
.navigation.pagination a.page-numbers:hover { border-color: var(--cb-ink); }

/* Pagina de erro (404) e busca sem resultado */
.error404 .entry-header { background: var(--cb-ink); padding: 4rem max(var(--cb-gutter), calc(50% - 37.5rem)) 3.5rem; }
.error404 .entry-title {
  margin: 0; font-family: Epilogue, sans-serif; font-weight: 400; font-size: clamp(1.875rem, 1.35rem + 1.7vw, 2.5rem);
  line-height: 1.15; letter-spacing: -.02em; color: #fff;
}
.error404 .entry-content, .site-content .no-results {
  max-width: var(--cb-col); margin: 3rem auto 4.5rem; padding: 0 var(--cb-gutter); box-sizing: content-box;
  font-size: 1.0625rem; line-height: 1.65;
}
.error404 .entry-content p { text-align: left; margin: 0 0 1.5rem; }
.search-form { display: flex; gap: .5rem; }
.search-form label { flex: 1; }
.search-form .search-field {
  width: 100%; height: 2.75rem; padding: 0 .875rem; box-sizing: border-box; border: 1px solid var(--cb-rule); border-radius: 6px; font: inherit;
}
.search-form .search-submit {
  height: 2.75rem; padding: 0 1.25rem; border: 0; border-radius: 6px; background: var(--cb-ink); color: #fff;
  font-family: Mulish, sans-serif; font-weight: 500; font-size: 1rem; cursor: pointer;
}

/* ---------- Celular e tablet ---------- */
@media (max-width: 991px) {
  .standard-container, .widget_related_posts .entry-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .single-post .entry-header { padding-top: 3rem; padding-bottom: 2.5rem; }
  .single-post .entry-media { margin-top: 1.5rem; }
  .single-post .entry-content { margin-top: 1.75rem; }
  .home.blog .site-content > h1.screen-reader-text, .site-content-header { padding-top: 3rem !important; padding-bottom: 2.5rem !important; }
  .standard-container { grid-template-columns: minmax(0, 1fr); gap: 2.5rem; padding-top: 2.5rem; }
  .widget_related_posts { padding-top: 2.5rem; padding-bottom: 3rem; }
  .widget_related_posts .entry-list { grid-template-columns: minmax(0, 1fr); gap: 1.75rem; }
  .single-post .entry-navigation { flex-direction: column; }
  .single-post .entry-navigation .entry-next { text-align: left; margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .standard-container .entry-media img { transition: none; }
  .standard-container .entry:hover .entry-media img { transform: none; }
}
