/* Theme Name: Theme-Rnews
   Theme URI: https://rnews.com.br/
   Author: Célio Ricardo
   Author URI: https://rnews.com.br/
   Description: Tema leve otimizado para CWV e mobile.
   Version: 1.2
   Text Domain: Theme-Rnews */

/* Reset bsico para performance */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 16px; /* Fixo para predictibilidade */
  line-height: 1.6;
  color: #333;
  background: #fff;
  max-width: 100%; /* Mobile-first: fluido */
  margin: 0 auto;
}


/* Conteúdo principal - Mobile-first */
/*main {
  padding: 1rem;
}
*/
article {
  margin-bottom: 2rem;
}

h2 {
  font-size: 1.2rem; /* Pequeno em mobile */
}

img {
  max-width: 100%;
  height: auto; /* Evita CLS: height auto com width 100% */
  display: block; /* Remove espaos extras */
}
/* Otimizaço CLS: Reserve espao para imagens */
/* Thumbnails otimizados para CLS */
/* Imagens com reserva para CLS */
.post-thumbnail {
  width: 100%;
  aspect-ratio: 16/9;
  background: #eee;
}

.post-thumbnail img {
  width: 100%;
  height: auto;
  object-fit: cover;
}
/* Garante que a figura inline respeite o ratio reservado pelas dimensões */
.post-inline-figure { 
  margin: 16px 0; 
}
.post-inline-figure .post-thumbnail {
  display:block;
  width:100%;
  height:auto;
  /* browsers usam width/height para reservar espaço; este aspect-ratio é só fallback */
  aspect-ratio:auto;
}
/*IMAGE SINGLE*/
/* Wrapper da imagem inline */
.rn-inline-thumb{
  margin: 1rem 0;
}

/* CLS-safe: não force altura fixa; deixe width/height do <img> fazerem o reserve */
.rn-inline-thumb-img{
  display: block;
  width: 100%;
  height: auto; /* não sobrescreva os atributos nativos */
}

/* Media queries para desktop (mobile-first) */
@media (min-width: 768px) {
  h2 {
    font-size: 1.8rem;
  }
  main {
    padding: 2rem;
  }
.code-block .joinads .placeholderAd{min-height:250px}
  }
/*CONTENT-WRAPPER*/
/* Content-Wrapper otimizado para CLS */
.content-wrapper {
  display: flex;
  flex-direction: column; /* Stack em mobile, previne shifts horizontais */
  padding: 1rem; /* Fixo para consistência */
  box-sizing: border-box; /* Inclui padding no cálculo */
}

@media (min-width: 768px) {
  .content-wrapper {
    flex-direction: row; /* Side-by-side em desktop */
    min-height: 70vh;
  }
}

/* Ttulos e Contedo com Line-Height Fixo para Evitar Text Shifts */
h1,
h2,
.entry-content {
  line-height: 1.5; /* Fixo para prever altura */
  word-break: break-word; /* Evita overflows em títulos longos */
  /*hyphens: auto; /* Quebra automtica em mobile */
}

.post-title {
  min-height: 2em; /* Reserva para ttulos multi-linha */
  margin-bottom: 0rem;
  font-size: 2.5rem;
}

aside#sidebar-1 {
  display: none; /* Oculta em mobile para performance */
  padding: 1rem;
  background: #f8f8f8;
}

.widget {
  margin-bottom: 1rem;
}

/* Main otimizado para CLS */
/* Main com reserva agressiva para CLS */
main#primary.site-main {
min-height:auto;contain:content;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 2rem 1rem;
}

article {
  min-height: 300px; /* Reserva por post para evitar jumps */
}

@media (min-width: 768px) {
  main#primary.site-main {
    min-height: 80vh;
    contain: layout; /* Isola shifts internos */
  }
}

/* Desktop: Mostra sidebar ao lado */
@media (min-width: 768px) {
    .content-wrapper {
        display: flex;
        grid-column-gap: 12px;
        grid-row-gap: 30px;
        justify-content: center;
        align-items: stretch;
        width: 1400px;
        margin-left: auto;
        margin-right: auto;
        display: flex;
        position: relative;
    }
  main {
    flex: 3;
    margin-right: 2rem;
  }
  main.content-wrapper {
      margin-right: 0rem;
  }
  aside#sidebar-1 {
    display: block;
    flex: 1;
  }
}

/* Desktop ajustes */
@media (min-width: 768px) {
  .site-branding {
    text-align: left;
  }
}

.content-wrapper{min-height:auto}

/* Headings com font-size explcito para evitar APIs obsoletas */
h1,
h2,
h3,
h4,
h5,
h6 {
  /*font-size: 1.5rem;Tamanho base em mobile (ajuste conforme design) */
  line-height: 1.2;
  margin-top: 0;
  margin-bottom: 1rem;
}

h1 {
  font-size: 2rem; /* Maior para títulos principais */
}

h2 {
  font-size: 1.8rem;
}

h3 {
  font-size: 1.3rem;
}

h4 {
  font-size: 1.4rem;
}

/* Media query para desktop: Aumenta tamanhos */
@media (min-width: 768px) {
  h1 {
    font-size: 2.5rem;
  }
  h2 {
    font-size: 2rem;
  }
  h3 {
    font-size: 1.8rem;
  }
  h4 {
    font-size: 1.6rem;
  }
}

/* Especfico para headings em sees (para resolver o aviso) */
article h1,
aside h1,
nav h1,
section h1 {
  font-size: inherit; /* Ou defina explicitamente, ex: 2rem - herda do pai se precisar */
}

/* Seo de Posts Relacionados - Mobile-First */
.related-posts {
  display: flex;
  flex-direction: column; /* Stack vertical em mobile */
  margin-top: 2rem;
  padding: 1rem;
  background: #f8f8f8; /* Fundo leve, similar  imagem */
  border-top: 1px solid #ddd;
}

.previous-article,
.next-article {
  flex: 1;
  margin-bottom: 1rem;
}

.previous-article h4,
.next-article h4 {
  font-size: 1rem;
  color: #f5a623; /* Cor laranja similar  "PREVIOUS ARTICLE" na imagem */
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}

.previous-article a,
.next-article a {
  text-decoration: none;
  color: #333;
  font-weight: bold;
}

.previous-article p,
.next-article p {
  color: #666;
}

/* Desktop: Side-by-Side */
@media (min-width: 768px) {
  .related-posts {
    flex-direction: row;
    justify-content: space-between;
  }
  .previous-article {
    margin-right: 1rem;
  }
  .next-article {
    margin-left: 1rem;
  }
}

/* Seço de Tags - Mobile-First */
.post-tags {
  margin-top: 2rem;
  padding: 1rem;
  min-height: 150px; /* Para blocos dinâmicos */
}

.post-tags h4 {
  font-size: 1rem;
  margin-bottom: 0.9rem;
  color: #333;
}

.tags-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap; /* Wrap em mobile */
  gap: 0.5rem;
}

.tag-link {
  display: inline-block;
  padding: 0.5rem 1rem;
  background: #e0e0e0; /* Cinza claro, similar aos botes na imagem */
  border-radius: 20px; /* Arredondado */
  text-decoration: none;
  color: #333;
  font-size: 0.9rem;
  transition: background 0.3s ease; /* Hover suave, sem impacto em CLS */
}

.tag-link:hover {
  background: #ccc;
}
.entry-content ul.tags-list {
    margin-left: 0rem;
    margin-top: 0em;
    margin-bottom: 1.5em;
    font-size: 1.2rem;
}
.entry-content ul.tags-list li {
    padding: 7px 7px 7px 0px;
    margin: 0 0 7px 0;
}
/* Desktop: Mais espaado */
@media (min-width: 768px) {
  .tags-list {
    flex-wrap: nowrap; /* Horizontal sem wrap */
  }
}

/*MEIO DE ARTIGO*/
/* Seo de Artigos Relacionados - Mobile-First */
/* ===== Bloco "Veja também" (inline, após 3º parágrafo) ===== */
.related-block { margin: 1.5rem 0; min-height: 150px; /* Para blocos dinmicos */}
.related-note { text-align: center; font-size: 13px; color: rgba(16,18,21,.6); margin-bottom: .5rem; }

.relbox { background: #F4F4F4; border-radius: 12px; padding: 7px; box-shadow: 0 2px 4px rgba(0,0,0,.10); }
.relbox-title { margin: 0 0 12px; text-align: center; font: 700 20px/1.4 system-ui,-apple-system,"Segoe UI",Roboto; color: #d33; }

.rel-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.rel-item { background: #fff; border-radius: 12px; padding: 10px 8px; }

.rel-item .rel-link{
  display: flex;
  align-items: center;
  justify-content: space-between; /* texto à esquerda, imagem à direita */
  gap: 12px;
  text-decoration: none; /* opcional */
}
.rel-link::before { content: ""; width: 14px; height: 14px; border-radius: 50%; background: #d33; flex: 0 0 14px; }

.rel-item .rel-title{
  flex: 1 1 auto;
  line-height: 1.3;
}
.rel-item .rel-img{
  order: 2;                 /* garante imagem à direita */
  width: 80px;
  height: 80px;
  min-width: 80px;
  object-fit: cover;
  border-radius: 8px;       /* opcional */
  display: block;
}

@media (min-width: 768px) {
  .relbox { padding: 18px; }
  .rel-item .rel-link{ gap: 14px; }
  .rel-item .rel-img{
    width: 100px;
    height: 100px;
    min-width: 100px;
    border-radius: 10px;
    margin-left: 1px;
  }
  .rel-item .rel-title{
  font-size: 1.2rem;
  }
}
/*FIM RELATED ARTICLES*/

/* Estilo para a div com os botes */
.center {text-align: center;}
.social-buttons {
    /* margin-top: 20px; */
    /* text-align: center; */
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.social-buttons p {
  font-size: 18px;
  margin-bottom: 10px;
}

/* Estilo para os botões */
.btn-social {
  display: inline-block;
  padding: 10px 20px;
  margin: 5px;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  border-radius: 5px;
  transition: background-color 0.3s;
}

.btn-social.facebook {
  background-color: #3b5998;
}

.btn-social.insta {
  background-color: #9b0b8d;
}
.entry-content .social-buttons a {
  text-decoration: none;
  color: #ffffff;
}
.entry-content .social-buttons a:hover {
  text-decoration: none;
  color: #ffffff;
}
/* Efeito de hover para os botes */
.btn-social:hover {
  opacity: 0.8;
}

.social-buttons a:hover {
  text-decoration: none;
  color: #fdfdfd;
}

/* Bloco de Autor - Mobile-First */
.author-box {
  display: flex;
  align-items: flex-start;
}

.author-avatar {
  margin-right: 1rem;
}
.author-info .img-autor{ width:50px; height:50px; }
.author-info {
  flex: 1;
}

.author-name {
  font-size: 1.2rem;
  color: #ff0000; /* Vermelho como no print */
  margin-bottom: 0.5rem;
}

.author-bio {
  font-size: 0.9rem;
  color: #333;
  margin-bottom: 1rem;
}

.author-social {
  list-style: none;
  display: flex;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
}

.social-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30px;
  height: 30px;
  background: #ff0000; /* Vermelho como no print */
  border-radius: 50%;
  color: #fff;
  text-decoration: none;
  font-size: 1rem;
}

.social-icon:hover {
  background: #cc0000;
}

/* Desktop: Mais espaado */
@media (min-width: 768px) {
  .author-name {
    font-size: 1.5rem;
  }
}

/*CLS ENTRIES*/
/* Entry-Content otimizado para CLS - Mobile-First */
.entry-content {
  min-height: 50vh; /* Reserva espao baseado em contedo mdio - ajuste para 60vh se posts longos */
  line-height: 1.6 !important; /* Fixo para evitar reflow de texto */
  word-break: break-word; /* Quebra linhas longas */
  box-sizing: border-box;
}

.entry-content p{
  margin-bottom:1rem;
  letter-spacing:1px;
  font-size:1.1rem;
  line-height:30px;
}
.entry-content ol, .entry-content ul{margin-left: 1.2rem;margin-top: calc(.5rem * (1 - 1));margin-bottom: calc(.5rem * 1);}
.entry-content ol li, .entry-content ul li{margin-bottom: 1rem;letter-spacing: 1px;font-size: 1.1rem;line-height: 23px;}
.entry-content img,
.entry-content iframe{
  display:block;
  max-width:100%;
  height:auto;
  margin-bottom:1rem;   /* sem min-height aqui */
}

.entry-content img {
  border-radius: 7px;
}

.entry-content iframe {
  aspect-ratio: 16/9; /* Para embeds/vdeos */
}

/* Desktop ajustes */
@media (min-width: 768px) {
  .entry-content {
    min-height: 60vh;
    padding: 2rem 0rem;
  }
}

/*POST IMAGE HOME*/
/* Imagens em Posts - Visibilidade e CLS */
.post-image {
  display: block !important; /* Fora exibio, sobrepe hides */
  max-width: 100%;
  height: auto;
  aspect-ratio: 16/9; /* Reserva espao */
  margin-bottom: 1rem;
  opacity: 1; /* Evita fade-in hides */
}

article {
  margin-bottom: 2rem;
}

article a img {
  transition: none; /* Sem animaçes que possam hide */
}

/* Mobile/Desktop */
@media (min-width: 768px) {
  .post-image {
    width: 110px; /* Tamanho do HTML */
    height: 76px;
  }
}

/* Forar exibio de imagens */
img.wp-post-image,
img.post-image {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/*MENU*/
/* ===== Header RNEWS (mobile-first, sem JS, anti-CLS) ===== */
/* A11y util */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* Container (mantm seu padro) */
.container {
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: 16px;
}

/* Header base */
.site-header {
  position: relative;
  color: #000;
  padding: 0;
}

.header-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 56px;
}

/* Botões de ícone (hamburguer/lupa) */
.icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  color: #fff;
}

.icon-btn svg rect,
.icon-btn svg circle,
.icon-btn svg line {
  stroke: currentColor;
  fill: currentColor;
}

.icon-btn--menu {
  order: 0;
}

.icon-btn--search {
  order: 2;
}
.icon-btn--search {
  background: none;
  border: none;
  color: #555;          /* cor padro */
  cursor: pointer;
  transition: color 0.2s;
}

.icon-btn--search:hover {
  color: #0073e6;       /* cor ao passar o mouse */
}
/* Logo (usa width/height do HTML para travar CLS) */
.brand {
  display: flex;
  align-items: center;
  justify-content: center;
  order: 1;
  margin-inline: auto;
}

.custom-logo-link{display:inline-block;width:187px;height:40px;margin: 0 auto;}
.custom-logo-link img{display:block;width:100%;height:100%;aspect-ratio:187/40;object-fit:contain}
.custom-logo {
  height: auto;
  max-height: 40px;
  width: auto;
}

/* Toggles (sem JS) */
.nav-toggle,
.search-toggle {
  position: absolute;
  left: -9999px;
  opacity: 0;
}

/* Drawer (menu mobile) */
.drawer {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1000;
}

.drawer::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.drawer__inner {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: min(88vw, 360px);
  background: #0b0b0b;
  color: #fff;
  transform: translateX(-100%);
  transition: transform 0.25s ease;
  padding: 24px 20px 28px;
  display: flex;
  flex-direction: column;
}

.drawer__close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  background: #222;
  color: #fff;
  border-radius: 6px;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
}

.drawer .menu {
  list-style: none;
  margin: 48px 0 16px;
  padding: 0;
}

.drawer .menu > li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.drawer .menu a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 4px;
  color: #fff;
  text-decoration: none;
}

.drawer__social {
  margin-top: auto;
  display: flex;
  gap: 12px;
}

.social-btn {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: #191919;
  color: #fff;
}

/* Abrir/fechar o drawer */
.nav-toggle:checked ~ .drawer {
  pointer-events: auto;
}

.nav-toggle:checked ~ .drawer::before {
  opacity: 1;
}

.nav-toggle:checked ~ .drawer .drawer__inner {
  transform: translateX(0);
}
/*BARRA BUSCA*/
/* Wrapper da barra de busca */
/* ===== Barra de busca expansvel (acima do menu) ===== */
.searchbar {
  position: relative;
  max-height: 0;               /* recolhida por padro */
  overflow: hidden;
  background: #f9f9f9;            /* fundo claro, como no print 2 */
  transition: max-height .25s ease;
  border-top: 1px solid #eee;  /* opcional */
  border-bottom: 1px solid #eee;
  /* NÃO usar margin-top aqui; ela vem logo após o header-bar */
}

/* quando a lupa estiver marcada, expande */
.search-toggle:checked ~ .searchbar {
  /* sua .search-field tem padding-top/bottom de 40px (80px de altura),
     mais paddings do container; dar uma folga confortvel: */
  max-height: 140px;           /* ajuste fino se quiser 120~160 */
}

/* layout interno */
.searchbar .container {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 12px 16px;
}

/* form */
.searchbar .search-form {
  width: 80%;
  max-width: 920px;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 auto;
}

/* campo de texto (mantendo seu visual atual) */
.searchbar .search-form .search-field {
  flex: 1;
  min-height: 44px;
  padding: 20px 15px 20px 14px;
  font-size: 30px;
  color: #000;
  border: none;               /* evita borda ao focar */
  border-radius: 0;
}

.searchbar .search-form .search-field::placeholder {
  color: #555;
}

/* boto */
.searchbar .search-form .search-submit {
    border: 1px solid #ababab;
    color: #5c5c5c;
    letter-spacing: .5px;
    background-color: transparent;
    border-radius: 4px;
    height: 44px;
    padding: 0 10px;
    font-weight: 700;
    cursor: pointer;
    text-transform: uppercase;
}
.searchbar .search-form .search-submit:hover {
  opacity: .9;
  background: #06347a;
  color: #fff;
}

/* boto fechar dentro da barra */
.searchbar__close {
    cursor: pointer;
    color: #5c5c5c;
    background: #fff;
    user-select: none;
    border: 1px solid #ababab;
    border-radius: 4px;
    width: 50px;
    height: 44px;
    padding-left: 15px;
    padding-right: 15px;
    font-size: 20px;
    font-weight: 700;
    line-height: 39px;
}
/*.searchbar__close {
  font-size: 20px;
  font-weight: bold;
  cursor: pointer;
  color: #333;
  background-color: transparent;
  border: none;
  padding: 0;
  margin-left: 16px;
}*/
.searchbar__close:hover { background: #333; color: #fff; }
.search-field {
    color: #000;
    border-style: none;
    border-top-width: 1px;
    border-top-color: #000;
    border-left-width: 1px;
    border-left-color: #000;
    border-right-width: 1px;
    border-right-color: #000;
    border-radius: 0;
    margin-bottom: 0;
    padding: 40px 30px 40px 0;
    font-size: 30px;
}

input:-webkit-autofill {
  box-shadow: 0 0 0px 1000px #fff inset; /* cor de fundo que voc quiser */
  -webkit-text-fill-color: #000;         /* cor do texto */
  transition: background-color 5000s ease-in-out 0s;
}


input:focus {
  outline: none;
  border: none; /* Ou defina um estilo de borda diferente se necessário */
}
input:focus {
  caret-color: #3b3b3b; /* Cor do cursor */
  animation: blinkCaret 1s step-end infinite; /* Cria o efeito de piscar */
}

@keyframes blinkCaret {
  50% {
    caret-color: transparent;
  }
}
.searchfield {
  flex: 1;
  min-height: 44px;
  border: 1px solid #2a2a2a;
  background: #121212;
  color: #fff;
  border-radius: 8px;
  padding: 0 12px;
}

.searchsubmit {
  min-height: 44px;
  min-width: 44px;
  border: none;
  border-radius: 8px;
  background: #1f1f1f;
  color: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
}
/* responsivo */
@media (max-width: 420px) {
  .searchbar .search-form { width: 100%; }
    .searchbar .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 2px;
  }
    /* Ajustes do campo de pesquisa */
  .searchbar .search-form .search-field {
    flex: 1;
    padding: 10px;
    font-size: 18px; /* Aumenta o tamanho da fonte para mobile */
  }
    /* Fechar com maior visibilidade */
  .searchbar__close {
    font-size: 24px;
    margin: 1px 1px 1px 5px;
  }
}
/* DESKTOP (a partir de 768px) */
@media (min-width: 768px) {
  /* Para desktop, mantenha layout flexvel e expandido */
  .searchbar .container {
    justify-content: center; /* Centraliza no desktop */
    gap: 16px;
    padding: 20px 40px;
  }

  .searchbar .search-form .search-field {
        flex: 2;
        font-size: 24px;
        text-transform: uppercase;
    }

  .searchbar .search-submit {
    padding: 15px 30px;
    font-size: 20px;
  }

  /* Ajuste o boto de fechar para o desktop */
  .searchbar__close {
    font-size: 26px;
  }
}
/* Submenus simples (sem JS) */
.menu .sub-menu {
  display: none;
  padding-left: 14px;
}

.menu li:focus-within > .sub-menu,
.menu li:hover > .sub-menu {
  display: block;
}
/* ===== Dropdown sem quebrar o layout (desktop) ===== */
@media (min-width: 980px) {
  /* cada item pai vira um ncora para posicionar o submenu */
  .drawer .menu > li {
    position: relative;
  }

  /* submenu sobreposto (fora do fluxo) */
  .drawer .menu > li .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    display: none;                /* só aparece no hover/focus */
    min-width: 240px;
    background: #fff;             /* ajuste se seu header for escuro */
    color: #111;
    border: 1px solid #e9e9e9;
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,.08);
    padding: 8px 0;
    margin: 0;                    /* override de quaisquer margens */
    white-space: nowrap;          /* evita quebra de linha dos itens */
    z-index: 2000;                /* fica sobre o contedo */
  }

  /* itens do submenu */
  .drawer .menu > li .sub-menu > li {
    list-style: none;
    border-bottom: 1px solid #f2f2f2;
  }
  .drawer .menu > li .sub-menu > li:last-child {
    border-bottom: 0;
  }
  .drawer .menu > li .sub-menu a {
    display: block;
    padding: 10px 16px;
    text-decoration: none;
    color: inherit;               /* herda cor (ou defina a sua) */
  }
  .drawer .menu > li .sub-menu a:hover {
    background: #f7f7f7;
  }

  /* mostrar submenu no hover/teclado */
  .drawer .menu > li:hover > .sub-menu,
  .drawer .menu > li:focus-within > .sub-menu {
    display: block;
  }

  /* garante que nada do header crie empurrão por z-index */
  .site-header { position: relative; z-index: 100;}
  .drawer__inner { position: relative; z-index: 110; }
}


/* Desktop */
@media (min-width: 980px) {
  .header-bar {
    min-height: 56px;
  }
  .icon-btn--menu {
    display: none;
  }
  .brand {
    order: 0;
    margin: 0;
  }
  .icon-btn--search {
    order: 2;
    margin-left: auto;
  }
  /* Menu horizontal no desktop */
  .drawer {
    position: static;
    pointer-events: auto;
  }
  .drawer::before {
    display: none;
  }
  .drawer__inner {
    position: static;
    height: auto;
    width: auto;
    transform: none;
    background: transparent;
    padding: 0;
    flex-direction: row;
  }
  .drawer__close {
    display: none;
  }
  .drawer .menu {
    display: flex;
    gap: 28px;
    margin: 0;
    padding: 0;
  }
  .drawer .menu > li {
    border: none;
  }
  .drawer .menu a {
        padding: 18px 0;
        color: #064366;
        font-size: 17px;
        letter-spacing: 0.03em;
  }
  .drawer .menu a:hover {
    opacity: 1;
  }
  .nav-toggle {
    display: none;
  }
}

/* Paleta */
.site-header {
  background: #fff;
}

.icon-btn {
  color: #000;
}

/*HOME*/
/* ===== Grade da Home (mobile-first, anti-CLS) ===== */
.posts-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  padding: 1rem 1rem 0;
}

.post-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.post-card__thumb {
  display: block;
  width: 100%;
  aspect-ratio: 16/9;
  background: #eee;
  border-radius: 10px;
  overflow: hidden;
}

.post-card__thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.thumb-placeholder {
  display: block;
  width: 100%;
  height: 100%;
}

/* Ttulo com clamp (evita jumps) */
.post-card__title {
  margin: 0;
  line-height: 1.35;
  font-size: 1.125rem;
  min-height: 2.7em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.post-card__title a {
  color: #111;
  text-decoration: none;
}

.post-card__title a:hover {
  text-decoration: underline;
}

.post-card__meta {
  font-size: 0.875rem;
  color: #666;
}

/* Grid responsivo */
@media (min-width: 640px) {
  .posts-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 980px) {
  .posts-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Paginaço nativa do WP */
.navigation.pagination {
  margin: 24px 0;
  padding: 0 1rem;
}

.navigation.pagination .nav-links {
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
}

.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid #ddd;
  border-radius: 8px;
  text-decoration: none;
  color: #333;
  background: #fff;
}

.page-numbers.current {
  background: #000;
  color: #fff;
  border-color: #000;
}

.page-numbers:hover {
  border-color: #aaa;
}

/* ===== Primeira Dobra: 4 ltimos de cuidados-pessoais ===== */
.first-fold {
  padding: 12px 0;
  background: #fff;
}

.ff-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.ff-card {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.ff-card__thumb {
  display: block;
  width: 100%;
  aspect-ratio: 16/9;
  background: #eee;
  border-radius: 12px;
  overflow: hidden;
}

.ff-card__thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ff-card__title {
  margin: 0;
  line-height: 1.35;
  font-size: 1.125rem;
  min-height: 2.7em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ff-card__title a {
  color: #111;
  text-decoration: none;
}

.ff-card__title a:hover {
  text-decoration: underline;
}

/* Desktop: 4 colunas e separador da dobra */
@media (min-width: 980px) {
  .first-fold {
    padding: 16px 0 8px;
    border-bottom: 1px solid #eee;
    margin-bottom: 12px;
  }
  .ff-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;
  }
}

/* Tablet: 2 colunas */
@media (min-width: 640px) and (max-width: 979.98px) {
  .ff-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
/*ARTIGO*/
/* Estilo para a descrião abaixo do ttulo */
/*Anuncios Join*/
/* --- Container principal dos anúncios --- */
.ad-site{
    width: 100%;
    min-height: 250px;
    display: block;
    margin: 20px 0;
    text-align: center;
    padding: 0;
}
.ad-slot {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 16px auto;
  width: 100%;
  text-align: center;
  position: relative;
}
  .code-block .joinads .placeholderAd::before{
    content:"";display:block;width:100%;height:100%;
    background:#f3f4f6;
    background-image:linear-gradient(90deg,#f3f4f6 0,#ececec 50%,#f3f4f6 100%);
    background-size:200% 100%;
    animation:rnShimmer 1.2s infinite linear
  }
  @keyframes rnShimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
  .code-block .joinads .placeholderAd.is-filled::before{display:none}
.code-block .joinads{display:block}
.code-block .joinads .placeholderAd{display:block;width:100%;margin:0 auto}
/* --- Versão específica do bloco abaixo do título --- */
.ad-slot-top { 
  width: min(100%, 336px);
  height: 250px;          /* altura fixa */
  margin: 16px auto;
  display: flex; 
  align-items: center; 
  justify-content: center;
}

.ad-slot-top iframe { 
  width: 100%; 
  height: 100%; 
  display: block; 
}
/* Opcional: para anncios responsivos, você pode ajustar a altura em telas menores */
@media (max-width: 767px) {
 .ad-slot-top {
   min-height: 250px;   /*Ajuste do tamanho mnimo, compatvel com a regra anterior */
   height: 250px;     /*Garante que a altura seja fixada para 280px, sem encolher */
  }
}

.ad-slot-top:empty::before { content:""; display:block; width:100%; height:100%;}

/*Fim anuncios artigo*/

.post-description {
    margin-top: 10px;
    margin-bottom: 20px;
    font-size: 1.5rem;
    line-height: 2rem;
}
.entry-content ul {
    margin-left:0;
    margin-top: 1.5em;
    margin-bottom: 1.5em;
    font-size: 1.2rem;
}
.entry-content ul li {
    padding: 7px 7px 7px 7px;
    margin: 0 0 7px 0;
}
.entry-content a {
  color: #3a62a4;
  font-weight: bold;
  text-decoration: none; /* remove o sublinhado, se no quiser */
}

.entry-content a:hover {
  color: #d33;
}
.rel-link:hover::before {
    background: #3a72a4; 
}
/*META*/
/* Estilos para o autor e meta informaes */
/* Container principal */
.post-meta {
  display: flex;
  align-items: center;
  gap: 10px; /* Espao entre foto e texto */
  flex-wrap: wrap; /* Permite quebra no mobile */
}
.post-meta .rn-cat-label .badge {
    padding: 1.0em 2em;
    border-radius: 5px;
}
/* Bloco do autor */
.author-info {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto; /* não estica */
}

/* Foto do autor */
.img-autor img {
  border-radius: 50%;
  width: 50px;
  height: 50px;
}

/* Texto (nome + datas) */
.post-info-text {
  display: flex;
  flex-direction: row; /* Desktop lado a lado */
  align-items: center;
  gap: 15px;
  font-size: 14px;
  color: #464b59;
}

/* Nome do autor */
.autor-name {
  font-weight: 600;
}

/* Datas */
.post-dates {
  display: flex;
  flex-direction: row;
  gap: 15px;
  font-size: 13px;
  color: #666;
}

.post-dates p {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0;
}

/* MOBILE */
/* MOBILE (at 768px) — avatar à esquerda, textos  direita em coluna */
@media (max-width: 768px){

  .post-meta{
    display:flex;
    flex-direction: row !important;   /* mantm em LINHA no mobile */
    align-items: flex-start;
    gap: 10px;
  }

  /* avatar NO estica */
  .post-meta > .author-info{
    flex: 0 0 auto !important;
    margin:0 !important; padding:0 !important;
  }
  .author-info .img-autor img{
    width:100%; height:100%; border-radius:50%; object-fit:cover; display:block;
  }

  /* bloco de textos ocupa o restante, em COLUNA */
  .post-meta > .post-info-text{
    flex: 1 1 auto !important;
    min-width: 0;
    display:flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    margin:0 !important;
  }

  /* Nome do autor (opcional: esconder "Publicado por:" no mobile) */
  .autor-name p{ margin:0; font-weight:600; line-height:1.2; }
  .autor-name p strong{ display:none; }  /* remova esta linha se quiser manter o rótulo */

  /* Datas: uma por linha, coladas ao nome */
  .post-dates{ display:block; margin:0; }
  .post-dates p{
    display:flex; align-items:center; gap:6px;
    margin:0; line-height:1.25; font-size:13px; color:#5E6472;
  }
  .post-dates p + p{ margin-top:4px; }
  .post-dates svg{ width:16px; height:16px; transform:translateY(1px); flex:0 0 16px; }
}



/*MOBILE GERAL*/
@media (max-width: 768px) {
    .content-wrapper {
        padding: 0rem;
    }
    main#primary.site-main {
        padding: 0px;
    }
    .post-title {
    font-size: 1.4rem;
    }
    h2 {
        font-size: 1.4rem;
   }
    h3 {
        font-size: 1.2rem;
   }
   .entry-content ul {
        margin-left: 0.25rem;
    }
    .entry-content .relbox ul{
        margin-left: 0;
    }
    .rel-title {
    display: -webkit-box;
    -webkit-line-clamp: 3;   /* nmero de linhas permitido */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis; /* adiciona os "..." no final */
    max-height: 4.5em;       /* ~3 linhas (ajuste conforme font-size/line-height) */
    line-height: 1.5em;      /* altura da linha */
    }
}
/*ARTIGOS RELACIONADOS FIM ARTIGO*/
/* bloco */
.related-articles {
  margin-top: 2.5rem;
  border-top: 2px solid #111;
  padding-top: 1.25rem;
}
.ra-title {
  text-align: center;
  font-weight: 700;
  letter-spacing: .04em;
  margin-bottom: 1rem;
}

/* grid */
.ra-grid {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr;           /* Mobile: 1 col */
  gap: 22px;
  margin: 0;
  padding: 0;
}
@media (min-width: 640px) {
  .ra-grid { grid-template-columns: repeat(2, 1fr); }  /* Tablet: 2 */
}
@media (min-width: 1024px) {
  .ra-grid { grid-template-columns: repeat(4, 1fr); }  /* Desktop: 4 */
}

/* card */
.ra-card { display: block; }
.ra-link {
  display: grid;
  grid-template-rows: auto auto auto 1fr;
  gap: .5rem;
  text-decoration: none;
  color: inherit;
}

/* mdia 16:9 com cover */
.ra-media {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 8px;
  background: #f3f4f6;
}
.ra-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* meta */
.ra-cat {
  color: #0a8a4b;
  font-weight: 700;
  font-size: .85rem;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.ra-post-title {
  font-weight: 700;
  line-height: 1.25;
  font-size: 1.05rem;
}
@media (min-width: 768px) {
    .ra-post-title {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        max-height: calc(1.65em * 2);
    }
}
.ra-excerpt {
  color: #6b7280;
  font-size: .95rem;
  line-height: 1.35;
  margin: 0;
}

/* foco/hover acessvel */
.ra-link:focus-visible { outline: 2px solid #111; outline-offset: 2px; }
.ra-link:hover .ra-post-title { text-decoration: underline; }


/*FIM ARTIGO*/


/* Sidebar se adapta ao seu layout existente */
/*SIDEBAR*/
/* Aspect-ratio helpers para reservar espao (anti-CLS) */
.aspect{position:relative;display:block;width:100%}
.aspect > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.aspect-16x9{aspect-ratio:16/9}

/* Sidebar bloco */
.sb-least-viewed{display:block}
.sb-featured {
    display: block;
    margin-bottom: 20px;
    background: #ffffff;
    border-radius: 3px;
    padding: 4px;
}
.sb-featured .sb-featured-body{padding-top:10px}
.sb-badge{
  display:inline-block;background:#f6c31a;color:#111;
  font-size:.72rem;line-height:1;padding:6px 8px;border-radius:3px;font-weight:700
}

.sb-title{font-size:1.2rem;line-height:1.25;margin:.5rem 0 .35rem}
.sb-title a{color:#111;text-decoration:none}
.sb-title a:hover{text-decoration:underline}

.sb-meta{font-size:.82rem;color:#666;display:flex;align-items:center;gap:.35rem}
.sb-meta .sb-comments::before{content:" "; opacity:.7}
.sb-dot{opacity:.8}

.sb-excerpt{font-size:.95rem;color:#444;margin:.6rem 0 0}

/* Lista menor */
article.sb-item{
    min-height: 0px;
    margin-bottom: 0rem;
}
.sb-item {
    background: #ffffff;
    padding: 11px 4px;
    display: grid;
    grid-template-columns: 96px 1fr;
    gap: 12px;
    align-items: center;
    border-radius: 7px;
}
.sb-item{display:grid;grid-template-columns:96px 1fr;gap:12px;align-items:center}
.sb-thumb{width:96px}
.sb-item-title{font-size:.98rem;line-height:1.25;margin:0}
.sb-item-title a{color:#111;text-decoration:none}
.sb-item-title a:hover{text-decoration:underline}
.sb-item-date{font-size:.8rem;color:#777;display:block;margin-top:.25rem}

/* Responsivo (ajusta tipografia em telas maiores) */
@media (min-width: 768px){
  .sb-title{font-size:1.35rem}
}
/*ADS*/
@media (min-width:1024px){ .site-content, .content-area { overflow: visible; } }

/* Sidebar sticky  apenas desktop */
@media (min-width: 1024px) {
  /* garante que o continer da sidebar no corte o sticky */
  #sidebar-1 { overflow: visible; }

  /* o bloco do anúncio que deve grudar */
  #sidebar-1 .sb-ads {
    position: sticky;
    top: 40px;              /* ajuste conforme seu header fixo */
  }

  /* tamanho base do anncio */
  #sidebar-1 .sb-ads .adsbygoogle {
    display: block;
    width: 100%;
    min-height: 336px;      /* ajuste ao formato usado */
  }
}
/*FIM SIDEBAR*/

/*INDEX*/
/* ===== Primeira dobra: layout 3 colunas desktop / 1 coluna mobile ===== */
.container { max-width: 1200px; margin: 0 auto; padding: 16px; }
.grid { display: grid; gap: 24px; }
.fold10-grid {
  grid-template-columns: 1.1fr 2fr 1fr; /* esquerda / centro / direita */
  align-items: start;
}
@media (max-width: 1023px){
  .fold10-grid { grid-template-columns: 1fr; }
}

/* Aspect ratios sem JS */
.ratio-16x9 { aspect-ratio: 16 / 9; width: 100%; object-fit: cover; }
.ratio-1x1  { aspect-ratio: 1 / 1;  width: 100%; object-fit: cover; }
.thumb { display:block; border-radius: 6px; }

/* Cards */
.card { position: relative; overflow: hidden; border-radius: 8px; background: #fff; }
.card .media img { display:block; }
.card-md .meta { padding: 12px 4px; }
.card-md .title-sm {font-size: clamp(18px, 1.2vw, 20px); line-height: 1.25; margin: 6px 0; }
.card-md .excerpt { font-size: 14px; color: #4a4a4a; margin: 0; }
article.card-md {
    margin-bottom: 0rem;
}
/* Hero principal */
.hero { position: relative; color: #fff; }
.hero .overlay {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: clamp(12px, 2.5vw, 24px);
    background: linear-gradient(to top, rgb(0 0 0 / 100%), rgba(0, 0, 0, 0) 100%);
}
.title-hero { font-size: clamp(20px, 2.6vw, 20px); line-height: 1.12; margin: 6px 0 6px; }
.excerpt-lg { font-size: clamp(14px, 1.6vw, 16px); opacity: .9; margin: 0; }

/* Hero secundário */
.hero-sub { position: relative; margin-top: 24px; color: #fff; }
.hero-sub .overlay {
  position: absolute; inset: 0; display:flex; flex-direction: column; justify-content:flex-end;
  padding: clamp(12px, 2.2vw, 20px);
  background: linear-gradient(to top, rgb(0 0 0 / 99%), rgba(0, 0, 0, 0) 100%);
}
.title-hero-sub { font-size: clamp(20px, 2.6vw, 20px); line-height: 1.16; margin: 6px 0 6px; }
.title-hero-sub { display: inline-block;}
.excerpt-md { font-size: clamp(14px, 1.5vw, 16px); opacity:.9; margin: 0; }

/* Lista lateral (mini) */
.mini { display: grid; grid-template-columns: 96px 1fr; gap: 12px; align-items: center; padding-bottom: 15px; border-bottom: 1px solid rgba(0,0,0,.08); margin-bottom: 16px; }
.mini:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.mini .thumb-wrap { display:block; }
.mini-meta .title-mini { font-size: 14px; line-height: 1.35; margin: 2px 0; }
.meta-row { font-size: 12px; color: #666; display:flex; align-items:center; gap:6px; }
/* Limita título a 4 linhas no desktop */
@media (min-width: 768px) {
  .meta .title-sm {display: -webkit-box;
    -webkit-line-clamp: 3;   /* mximo de 4 linhas */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: calc(1.35em * 4); /* 4 linhas baseado no line-height */
  }
  .mini-meta .title-mini {
    display: -webkit-box;
    -webkit-line-clamp: 4;   /* mximo de 4 linhas */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: calc(1.35em * 4); /* 4 linhas baseado no line-height */
  }
  .card-md .excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 2;   /* mximo de 4 linhas */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: calc(1.45em * 2); /* 4 linhas baseado no line-height */
}
}

/* Badge de categoria */
.badge {
  display:inline-block; font: 700 12px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  letter-spacing:.02em; color:#1e7e34; /* verde */
  background: #eaf8ee; border-radius: 4px; padding: 6px 8px; margin-bottom: 0px;
}
/*  Categoria (badge) s do tamanho do texto  */
.badge,
a.badge {
  display: inline-block !important;   /* sai do block */
  width: auto !important;             /* nada de 100% */
  max-width: 100%;
  padding: .35rem .6rem;
  line-height: 1.1;
  border-radius: .5rem;
  background: rgba(241,255,245,.96);  /* verde clarinho do exemplo */
  color: #166534;                     /* verde do texto */
  font-weight: 700;
  text-transform: none;               /* mantm como est (remova se quiser caps) */
  box-shadow: 0 0 0 1px rgba(22,101,52,.10) inset; /* opcional */
}

/* Evita que algum grid/overlay force stretch */
.card .badge,
.hero .badge,
.mini .badge {
  align-self: flex-start;             /* não estica na coluna */
}

/* Se houver link interno, garante comportamento inline */
.badge > a { display: inline; width: auto !important; }

.index article {
    min-height: 0px;
}

/* Links */
.title-hero a, .title-hero-sub a, .title-sm a, .title-mini a { color: inherit; text-decoration: none; }
.title-hero a:hover, .title-hero-sub a:hover, .title-sm a:hover, .title-mini a:hover { text-decoration: underline; }
/*SEGUNDA DOBRA*/
/* ===== Seo abaixo da primeira dobra (4 cards) ===== */
.grid-4 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
  align-items: start;
}
@media (max-width: 1199px){
  .grid-4 { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1023px){
  .grid-4 { grid-template-columns: repeat(2, 1fr); gap: 24px; }
}
@media (max-width: 639px){
  .grid-4 { grid-template-columns: 1fr; gap: 20px; }
}

.card-quad { background:#fff; border-radius:8px; overflow:hidden; }
.card-quad .meta { padding: 12px 4px; }
.title-quad { font-size: clamp(18px, 2.1vw, 22px); line-height:1.3; margin: 6px 0 4px; }
.title-quad a{ 
    color: inherit;
    text-decoration: none;
}
.title-quad a:hover{ 
    text-decoration: underline;
}
.excerpt-quad { font-size: 14px; color:#60626a; margin: 0; }
.ratio-16x9 { aspect-ratio: 16 / 9; width: 100%; object-fit: cover; display:block; border-radius: 6px; }

/* aproveita a badge já usada no topo */
.badge {
  display:inline-block; font: 700 12px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  letter-spacing:.02em; color:#1e7e34; background:#eaf8ee; border-radius:4px; padding:6px 8px; margin-bottom:8px;
}
@media (min-width: 768px) {
    .meta .title-quad {
        display: -webkit-box;
        -webkit-line-clamp: 4;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        max-height: calc(1.35em * 4);
    }
}
/*QUARTA DOBRA*/
/* main.css */

/* PERF-PATCH: reserva de espaço para anncios (evita CLS) */
.ads-slot{ display:block; min-height:280px; }
@media (min-width:768px){ .ads-slot{ min-height:250px; } }


/* PERF-PATCH: Floating Ad (CSS-only, sem JS) */
.floating-ad { position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999; }
.floating-ad details { width: 100%; background: #fff; border-top: 1px solid rgba(0,0,0,.08); box-shadow: 0 -4px 16px rgba(0,0,0,.08); }
.floating-ad summary { list-style: none; display: flex; align-items: center; gap: 8px; padding: 0px 12px; cursor: pointer; user-select: none; }
.floating-ad summary::-webkit-details-marker { display: none; }
.floating-ad .fad-inner { padding: 8px 12px; }
.floating-ad .fad-label { font: 600 12px/1.2 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; opacity: .7; margin-bottom: 6px; }
.floating-ad .fad-slot { min-height: 130px; display: block; }
@media (max-width: 767px){ .floating-ad .fad-slot { min-height: 280px; } }

/* Estado colapsado: mantém uma barra fina de 44px sem causar CLS */
.floating-ad details:not([open]) { overflow: hidden; }
.floating-ad details:not([open]) .fad-inner { display: none; }

/* cone seta rotaciona conforme estado */
.floating-ad summary .icon { transition: transform .2s ease; }
.floating-ad details[open] summary .icon { transform: rotate(0deg); }
.floating-ad details:not([open]) summary .icon { transform: rotate(180deg); }

/*4bloco*/
/* ===== 3 bloco: lista horizontal (4 itens) ===== */
.rows4-wrap { display: grid; gap: 28px; }
.row-card {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 20px;
  align-items: start;
  padding: 0 0 24px;
  border-bottom: 1px solid rgba(0,0,0,.08);
}
.row-card:last-child { border-bottom: 0; padding-bottom: 0; }
.row-media { display:block; }
.row-thumb { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; display:block; }

.row-meta .badge {
  display:inline-block; font: 700 12px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  letter-spacing:.02em; color:#ffffff; background:#eaf8ee; border-radius:4px; padding:6px 8px; margin-bottom:8px;
}
.row-title { font-size: clamp(20px, 2.2vw, 26px); line-height: 1.28; margin: 4px 0 6px; }
.row-title a { color: inherit; text-decoration: none; }
.row-title a:hover { text-decoration: underline; }
.row-excerpt { font-size: 15px; color:#60626a; margin: 0; }

/* responsivo */
@media (max-width: 1023px){
  .row-card { grid-template-columns: 1fr; gap: 12px; }
}
@media (min-width: 768px) {
    .row-title {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        max-height: calc(1.65em * 2);
    }
}
/*QUINTO BLOCO*/
/* ====== AJUSTE DE ALTURA BLOCO 5 (alinhado com a coluna direita) ====== */
.block5-grid{
  display:grid;
  grid-template-columns: 1.6fr 1fr;
  gap:28px;
  align-items:stretch;            /* <- faz as colunas terem a mesma altura */
}
@media (max-width:1023px){
  .block5-grid{ grid-template-columns:1fr; }
}

/* Coluna esquerda precisa se esticar 100% */
.b5-left{ display:grid; grid-template-rows: 1fr; }
.b5-feature{ position:relative; border-radius:8px; overflow:hidden; height:100%; }
.b5-feature .media{ display:block; height:100%; }
.b5-feature .thumb{
  width:100%;
  height:100%;                   /* <- em vez de travar por aspect-ratio */
  object-fit:cover;              /* preenche sem distorcer */
  display:block;
}
.b5-feature .overlay.soft{
  position:absolute; inset:0;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:clamp(12px,2.2vw,22px);
  background:linear-gradient(to top, rgb(0 0 0 / 99%), rgba(0, 0, 0, 0) 100%);
  color:#fff;
}
.b5-title{ font-size:clamp(22px,3.2vw,36px); line-height:1.18; margin:6px 0; }
.b5-excerpt{ font-size:clamp(14px,1.6vw,16px); opacity:.92; margin:0; }

/* Coluna direita: 2x2 com linhas de mesma altura */
.b5-right{}
.b5-sidegrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-auto-rows:1fr;            /* <- todas as 4 clulas com a mesma altura */
  gap:22px;
}
@media (max-width:1023px){
  .b5-sidegrid{ grid-template-columns:1fr; grid-auto-rows:auto; gap:16px; }
}

.b5-card{ display:flex; flex-direction:column; }
.b5-card .media{ display:block; }
.b5-card .thumb{
  width:100%;
  aspect-ratio:16/9;             /* para os cards pode manter 16:9 */
  object-fit:cover;
  border-radius:6px;
  display:block;
}
.b5-card .meta{ padding:10px 2px; display:flex; flex-direction:column; }
.b5-card-title{ font-size:clamp(16px,2.1vw,20px); line-height:1.34; margin:4px 0 0; }

/* badge reaproveitada */
.badge{
  display:inline-block; font:700 12px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  letter-spacing:.02em; color:#1e7e34; background:#eaf8ee; border-radius:4px; padding:6px 8px; margin-bottom:8px;
}
.b5-title a,.b5-card-title a{ color:inherit; text-decoration:none; }
.b5-title a:hover,.b5-card-title a:hover{ text-decoration:underline; }
.b5-card-title{
  display:-webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow:hidden;
}
/* ===== Lateral 2x2 ===== */
.sidegrid4-wrap{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:20px;
}
@media (max-width: 1023px){
  .sidegrid4-wrap{ grid-template-columns:1fr; }
}

.sidegrid4-item{ display:flex; flex-direction:column; }
.sidegrid4-item .thumb{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  border-radius:8px;
  display:block;
}
.sidegrid4-item .meta{ padding:10px 2px; }
.sidegrid4-title{ font-size:clamp(16px, 2vw, 20px); line-height:1.34; margin:4px 0 0; }
.sidegrid4-title a{ color:inherit; text-decoration:none; }
.sidegrid4-title a:hover{ text-decoration:underline; }

.badge{
  display:inline-block; font:700 12px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  letter-spacing:.02em; color:#ffffff; background:#eaf8ee; border-radius:4px; padding:6px 8px; margin-bottom:0px;
}
/*FOOTER*/
/* ===== Footer ===== */
.site-footer{
  background:#ebebeb; /* cor de base (ajuste à sua paleta) */
  color:#fff;
  margin-top: clamp(24px, 6vw, 64px);
  padding: clamp(24px, 5vw, 56px) 0;
}
.site-footer a{ color:#162664; text-decoration:none; }
.site-footer a:hover{ text-decoration:underline; }

.foot-top{
  text-align:center;
  max-width: 1100px;
}
.site-footer .brand img{ height:40px; width:auto; }
.site-footer .site-name{ font-weight:700; font-size:22px; }

.foot-lead{
  margin: 14px auto 0;
  max-width: 820px;
  font-size: clamp(15px, 1.5vw, 18px);
  line-height: 1.6;
  opacity: .95;
  color:#162664;
}

.foot-sep{
  border:0; height:1px;
  background: rgba(255,255,255,.25);
  margin: clamp(22px, 4vw, 36px) 0;
}

.foot-grid{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: clamp(16px, 3vw, 40px);
  align-items: start;
  max-width: 1100px;
}
@media (max-width: 900px){
  .foot-grid{ grid-template-columns: 1fr; }
}

.foot-col{}
.foot-title{
  font-weight:700;
  font-size: clamp(16px, 1.6vw, 20px);
  margin: 0 0 10px;
  opacity: .9;
  color: #162664;
}

.foot-menu{
  list-style:none;
  margin:0; padding:0;
  display:grid; gap:10px;
}
.foot-menu li a{
  display:inline-block;
  font-size: clamp(14px, 1.4vw, 16px);
  line-height:1.5;
  opacity:.95;
}

.foot-social li a{
  display:flex; align-items:center; gap:10px;
}

/* Bottom bar */
.foot-bottom{
  margin-top: clamp(20px, 4vw, 36px);
  border-top: 1px solid rgba(255,255,255,.2);
  padding-top: clamp(12px, 2vw, 18px);
  display:flex; justify-content:space-between; gap:16px; align-items:center;
  font-size: 14px;
  max-width: 1100px;
}
.foot-bottom .copy{color:#162664;}
@media (max-width: 700px){
  .foot-bottom{ flex-direction:column; text-align:center; }
}

/* Container utilitrio (se ainda no existir) */
.container{ width: min(1200px, 100%); margin-inline:auto; }
/* cones sociais (usa currentColor) */
.foot-social li a{
  display:flex; align-items:center; gap:10px;
  font-size: clamp(14px, 1.4vw, 16px);
}
.foot-social .social-ico{
  width: 22px; height: 22px;
  flex: 0 0 22px;
  fill: currentColor;
  opacity: .95;
}
.foot-social li a:hover .social-ico{ opacity: 1; }
.foot-social .label{ line-height:1.2; }
.index section img, .index section .card {
    border-radius: 0 !important;
}
/*CATEGORY*/
.category .content-wrapper, .search .content-wrapper, .author .content-wrapper{
    padding: 0rem;
}
.category main#primary.site-main, .search main#primary.site-main, .author main#primary.site-main{
    padding: 2rem 0rem;
}

/**/
/* abaixo da dobra */
.related-articles,
.comments-area,
.sidebar,
.site-footer{
  content-visibility: auto;
  contain-intrinsic-size: 1px 800px; /* reserva mínima p/ evitar CLS */
}

@media (min-width: 768px) {
    .category .content-wrapper, .search .content-wrapper, .author .content-wrapper{
        width: 1200px;
    }
    .category main, .search main, .author main{
        margin-right: 0rem;
    }
}

/* =====Anti CLS Estilo Visual - Bloco Meta e Compartilhamento ===== */

.post-meta {
  font-size: 0.95rem;
  line-height: 1.4;
  color: #333;
  margin: 1.5rem 0;
}

.post-meta .autor-name strong,
.post-meta .post-dates strong {
  color: #111;
  font-weight: 600;
}

.post-meta .autor-name p,
.post-meta .post-dates p {
  margin: 0 0 4px;
}

/* Badge de categoria */
.rn-cat-label .badge {
  display: inline-block;
  padding: 4px 10px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #fff;
  border-radius: 4px;
  line-height: 1.2;
}

/* Lista de botes */
.rn-share-list {
  gap: 12px;
}

.rn-share-btn {
  background: #d62828; /* cor base dos ícones */
  color: #fff;
  transition: background 0.25s ease, transform 0.2s ease;
}

.rn-share-btn:hover {
  background: #9c1e1e;
  transform: translateY(-2px);
}

.rn-share-btn svg {
  fill: #fff;
}
.rn-share-btn svg {display:block;width:22px;height:22px;flex:0 0 auto}

/* Responsividade */
@media (max-width:640px){
    .post-meta {margin: 1rem 0;font-size: 0.9rem; grid-template-columns: 50px 1fr; min-height:0 }
    .code-block .joinads{display:block}
    .code-block .joinads .placeholderAd{
      display:block;width:100%;margin:0 auto;min-height:280px /* 336x280 */
    }
  .rn-share-block {
    gap: 10px;
    flex-direction: row;
    flex-wrap: wrap;
  }
}
/*BANNERS*/
/* banner centrado e responsivo */
.custom-banner{
  width:100%;
  margin: 16px auto;               /* espaço acima/abaixo */
  display:flex;                     /* centraliza horizontalmente */
  justify-content:center;
}

.custom-banner a{
  display:block;
  max-width:780px;                  /* largura máxima do criativo */
  width:100%;                       /* ocupa 100% até o limite */
}

.custom-banner img{
  display:block;
  width:100%;
  height:auto;                      /* mantém proporção */
  border-radius:5px;
  /* opcional: reforça a proporção mesmo sem height (fallback moderno) */
  aspect-ratio: 780 / 90;
}

/* opcional: em desktop, se quiser um respiro extra */
@media (min-width: 992px){
  .custom-banner{ margin: 22px auto; }
}
/* Menu inline entre logo e lupa no desktop */
@media (min-width: 980px) {
  .header-bar { display: flex; align-items: center; gap: 18px; }

  /* ordem: logo (0), menu (1), lupa (2) */
  .header-bar .brand { order: 0; margin: 0; }
  .header-bar .drawer { order: 1; flex: 1 1 auto; }        /* o menu ocupa o meio */
  .header-bar .drawer__inner { width: 100%; }
  .header-bar .drawer .menu { justify-content: center; }   /* centralize; use flex-start se preferir à esquerda */
  .header-bar .icon-btn--search { order: 2; margin-left: 12px; }
}