/*
Theme Name:   Jesus e a Bíblia Child
Theme URI:    https://jesuseabiblia.com
Description:  Tema filho para jesuseabiblia.com — identidade de biblioteca bíblica acadêmica
Author:       Diego Nascimento
Template:     generatepress
Version:      1.0.0
Text Domain:  jesuseabiblia-child
*/

/* ============================================================
   IMPORTAÇÃO DE FONTES
   Lora — serifada clássica para títulos e corpo de texto bíblico
   Source Serif 4 — leitura longa, elegante e legível no mobile
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Source+Serif+4:opsz,wght@8..60,300;8..60,400;8..60,500;8..60,600&family=Crimson+Pro:wght@400;500;600&display=swap');

/* ============================================================
   VARIÁVEIS — SISTEMA DE DESIGN
   ============================================================ */
:root {
  /* Cores principais */
  --cor-vermelho:        #7a1515;
  --cor-vermelho-escuro: #5a0e0e;
  --cor-vermelho-claro:  #9b2020;
  --cor-vermelho-tenue:  #f5eded;

  /* Neutros quentes */
  --cor-creme:           #faf7f2;
  --cor-creme-medio:     #f2ede4;
  --cor-creme-escuro:    #e8e0d4;
  --cor-bege:            #d4c9b8;
  --cor-marrom-claro:    #a89880;
  --cor-marrom:          #6b5a48;
  --cor-texto:           #1e1a16;
  --cor-texto-secundario:#5a4e42;
  --cor-texto-terciario: #8a7a6a;

  /* Superfícies */
  --cor-fundo:           #faf7f2;
  --cor-card:            #ffffff;
  --cor-borda:           #ddd5c8;
  --cor-borda-sutil:     #ede8e0;

  /* Tipografia */
  --fonte-titulo:        'Lora', 'Georgia', serif;
  --fonte-corpo:         'Source Serif 4', 'Georgia', serif;
  --fonte-ui:            'Crimson Pro', 'Georgia', serif;
  --fonte-mono:          'Courier New', monospace;

  /* Escalas tipográficas mobile-first */
  --texto-xs:    0.75rem;   /* 12px */
  --texto-sm:    0.875rem;  /* 14px */
  --texto-base:  1.0625rem; /* 17px — leitura confortável no mobile */
  --texto-lg:    1.1875rem; /* 19px */
  --texto-xl:    1.375rem;  /* 22px */
  --texto-2xl:   1.625rem;  /* 26px */
  --texto-3xl:   2rem;      /* 32px */
  --texto-4xl:   2.5rem;    /* 40px */

  /* Espaçamentos */
  --espaco-1:  0.25rem;
  --espaco-2:  0.5rem;
  --espaco-3:  0.75rem;
  --espaco-4:  1rem;
  --espaco-5:  1.25rem;
  --espaco-6:  1.5rem;
  --espaco-8:  2rem;
  --espaco-10: 2.5rem;
  --espaco-12: 3rem;
  --espaco-16: 4rem;

  /* Bordas e sombras */
  --raio-sm:   4px;
  --raio-md:   8px;
  --raio-lg:   12px;
  --sombra-sm: 0 1px 3px rgba(90,50,20,.08);
  --sombra-md: 0 4px 12px rgba(90,50,20,.10);
  --sombra-lg: 0 8px 24px rgba(90,50,20,.12);

  /* Transições */
  --transicao: 0.2s ease;
}

/* ============================================================
   RESET E BASE
   ============================================================ */
*, *::before, *::after {
  box-sizing: border-box;
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  font-family: var(--fonte-corpo);
  font-size: var(--texto-base);
  line-height: 1.75;
  color: var(--cor-texto);
  background-color: var(--cor-fundo);
  -webkit-font-smoothing: antialiased;
}

/* ============================================================
   TIPOGRAFIA GLOBAL
   ============================================================ */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--fonte-titulo);
  font-weight: 600;
  line-height: 1.25;
  color: var(--cor-texto);
  margin-top: var(--espaco-8);
  margin-bottom: var(--espaco-4);
}

h1 { font-size: var(--texto-2xl); }
h2 { font-size: var(--texto-xl); }
h3 { font-size: var(--texto-lg); }
h4 { font-size: var(--texto-base); font-weight: 600; }

p {
  margin-bottom: var(--espaco-5);
  font-size: var(--texto-base);
  line-height: 1.8;
}

a {
  color: var(--cor-vermelho);
  text-decoration: none;
  transition: color var(--transicao);
}

a:hover {
  color: var(--cor-vermelho-escuro);
  text-decoration: underline;
}

strong, b {
  font-weight: 600;
  color: var(--cor-texto);
}

em, i {
  font-style: italic;
}

/* Citações bíblicas */
blockquote {
  margin: var(--espaco-6) 0;
  padding: var(--espaco-5) var(--espaco-6);
  background: var(--cor-creme-medio);
  border-left: 3px solid var(--cor-vermelho);
  border-radius: 0 var(--raio-md) var(--raio-md) 0;
  font-style: italic;
  font-size: var(--texto-lg);
  line-height: 1.7;
  color: var(--cor-texto-secundario);
}

blockquote p:last-child {
  margin-bottom: 0;
}

blockquote cite {
  display: block;
  margin-top: var(--espaco-3);
  font-size: var(--texto-sm);
  font-style: normal;
  font-weight: 500;
  color: var(--cor-vermelho);
  letter-spacing: .03em;
}

/* ============================================================
   HEADER / CABEÇALHO
   ============================================================ */
.site-header,
.site-branding {
  background: var(--cor-vermelho-escuro) !important;
}

.site-title a,
.site-title a:visited {
  color: #fff !important;
  font-family: var(--fonte-titulo) !important;
  font-size: var(--texto-xl) !important;
  font-weight: 700 !important;
  letter-spacing: .02em;
}

.site-description {
  color: rgba(255,255,255,.65) !important;
  font-family: var(--fonte-ui) !important;
  font-size: var(--texto-sm) !important;
  font-style: italic;
}

/* Linha decorativa abaixo do header */
.site-header::after {
  content: '';
  display: block;
  height: 2px;
  background: linear-gradient(90deg, var(--cor-vermelho-claro), var(--cor-bege), transparent);
}

/* ============================================================
   NAVEGAÇÃO
   ============================================================ */
.main-navigation {
  background: var(--cor-vermelho) !important;
}

.main-navigation a {
  color: rgba(255,255,255,.88) !important;
  font-family: var(--fonte-ui) !important;
  font-size: var(--texto-base) !important;
  font-weight: 500 !important;
  letter-spacing: .02em;
  padding: var(--espaco-4) var(--espaco-5) !important;
}

.main-navigation a:hover,
.main-navigation .current-menu-item > a {
  color: #fff !important;
  background: var(--cor-vermelho-escuro) !important;
  text-decoration: none !important;
}

/* Menu mobile hamburguer */
.menu-toggle {
  color: #fff !important;
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.3) !important;
  border-radius: var(--raio-sm) !important;
  padding: var(--espaco-2) var(--espaco-3) !important;
}

/* ============================================================
   CONTAINER PRINCIPAL
   ============================================================ */
.site-content {
  background: var(--cor-fundo);
}

.content-area {
  padding: var(--espaco-6) var(--espaco-4);
}

@media (min-width: 768px) {
  .content-area {
    padding: var(--espaco-8) var(--espaco-6);
  }
}

/* ============================================================
   POSTS — LISTA / ARQUIVO
   ============================================================ */
.post {
  background: var(--cor-card);
  border: 1px solid var(--cor-borda-sutil);
  border-radius: var(--raio-lg);
  padding: var(--espaco-6);
  margin-bottom: var(--espaco-6);
  box-shadow: var(--sombra-sm);
  transition: box-shadow var(--transicao), transform var(--transicao);
}

.post:hover {
  box-shadow: var(--sombra-md);
  transform: translateY(-1px);
}

/* Título do post na listagem */
.entry-title {
  font-family: var(--fonte-titulo) !important;
  font-size: var(--texto-xl) !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin-top: 0 !important;
  margin-bottom: var(--espaco-3) !important;
}

.entry-title a {
  color: var(--cor-texto) !important;
}

.entry-title a:hover {
  color: var(--cor-vermelho) !important;
  text-decoration: none !important;
}

/* Meta do post */
.entry-meta {
  font-family: var(--fonte-ui) !important;
  font-size: var(--texto-sm) !important;
  color: var(--cor-texto-terciario) !important;
  margin-bottom: var(--espaco-4) !important;
  display: flex;
  align-items: center;
  gap: var(--espaco-3);
  flex-wrap: wrap;
}

.entry-meta a {
  color: var(--cor-texto-terciario) !important;
}

.entry-meta a:hover {
  color: var(--cor-vermelho) !important;
}

/* Categorias badge */
.entry-categories,
.cat-links {
  display: inline-flex;
  align-items: center;
  gap: var(--espaco-2);
  flex-wrap: wrap;
}

.entry-categories a,
.cat-links a {
  display: inline-block;
  padding: 2px var(--espaco-3);
  background: var(--cor-vermelho-tenue);
  color: var(--cor-vermelho) !important;
  border-radius: 20px;
  font-family: var(--fonte-ui) !important;
  font-size: var(--texto-xs) !important;
  font-weight: 600 !important;
  letter-spacing: .05em;
  text-transform: uppercase;
  text-decoration: none !important;
}

/* ============================================================
   POST SINGULAR — CONTEÚDO
   ============================================================ */
.single .entry-header {
  margin-bottom: var(--espaco-8);
  padding-bottom: var(--espaco-6);
  border-bottom: 1px solid var(--cor-borda-sutil);
}

.single .entry-title {
  font-size: var(--texto-2xl) !important;
  line-height: 1.2 !important;
  margin-bottom: var(--espaco-4) !important;
}

@media (min-width: 768px) {
  .single .entry-title {
    font-size: var(--texto-3xl) !important;
  }
}

/* Imagem destacada */
.post-thumbnail {
  margin-bottom: var(--espaco-6);
  border-radius: var(--raio-md);
  overflow: hidden;
}

.post-thumbnail img {
  width: 100%;
  height: auto;
  display: block;
}

/* Corpo do artigo */
.entry-content {
  font-size: var(--texto-base);
  line-height: 1.85;
}

.entry-content h2 {
  font-size: var(--texto-xl);
  margin-top: var(--espaco-10);
  margin-bottom: var(--espaco-4);
  padding-bottom: var(--espaco-3);
  border-bottom: 1px solid var(--cor-borda-sutil);
  color: var(--cor-vermelho-escuro);
}

.entry-content h3 {
  font-size: var(--texto-lg);
  margin-top: var(--espaco-8);
  color: var(--cor-texto);
}

.entry-content h4 {
  font-size: var(--texto-base);
  font-weight: 700;
  margin-top: var(--espaco-6);
  color: var(--cor-texto);
}

/* Links no conteúdo */
.entry-content a {
  color: var(--cor-vermelho);
  text-decoration: underline;
  text-decoration-color: rgba(122,21,21,.3);
  text-underline-offset: 2px;
}

.entry-content a:hover {
  color: var(--cor-vermelho-escuro);
  text-decoration-color: var(--cor-vermelho-escuro);
}

/* Listas */
.entry-content ul,
.entry-content ol {
  padding-left: var(--espaco-6);
  margin-bottom: var(--espaco-5);
}

.entry-content li {
  margin-bottom: var(--espaco-2);
  line-height: 1.75;
}

.entry-content ul li::marker {
  color: var(--cor-vermelho);
}

/* Separador */
.entry-content hr {
  border: none;
  border-top: 1px solid var(--cor-borda-sutil);
  margin: var(--espaco-8) 0;
}

/* Referências bibliográficas */
.entry-content p:last-of-type,
.referencias {
  font-size: var(--texto-sm);
  color: var(--cor-texto-terciario);
  font-style: italic;
}

/* ============================================================
   NAVEGAÇÃO BÍBLIA DE ESTUDO — BREADCRUMB TOPO
   ============================================================ */
.jeb-breadcrumb {
  display: flex;
  align-items: center;
  gap: var(--espaco-2);
  padding: var(--espaco-3) var(--espaco-4);
  background: var(--cor-creme-medio);
  border-bottom: 1px solid var(--cor-borda-sutil);
  font-family: var(--fonte-ui);
  font-size: var(--texto-sm);
  color: var(--cor-texto-terciario);
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

.jeb-breadcrumb a {
  color: var(--cor-vermelho);
  text-decoration: none;
}

.jeb-breadcrumb a:hover {
  text-decoration: underline;
}

.jeb-breadcrumb .sep {
  color: var(--cor-borda);
  font-size: var(--texto-xs);
}

.jeb-breadcrumb .atual {
  color: var(--cor-texto-secundario);
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ============================================================
   NAVEGAÇÃO BÍBLIA DE ESTUDO — ANTERIOR / PRÓXIMO
   ============================================================ */
.jeb-nav-capitulos {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--espaco-3);
  margin: var(--espaco-10) 0 var(--espaco-6);
  padding-top: var(--espaco-8);
  border-top: 1px solid var(--cor-borda-sutil);
}

.jeb-nav-capitulos .nav-item {
  display: flex;
  flex-direction: column;
  gap: var(--espaco-1);
  padding: var(--espaco-4);
  background: var(--cor-card);
  border: 1px solid var(--cor-borda-sutil);
  border-radius: var(--raio-md);
  text-decoration: none;
  color: var(--cor-texto);
  transition: border-color var(--transicao), box-shadow var(--transicao);
  -webkit-tap-highlight-color: transparent;
}

.jeb-nav-capitulos .nav-item:hover {
  border-color: var(--cor-vermelho);
  box-shadow: var(--sombra-sm);
  text-decoration: none;
}

.jeb-nav-capitulos .nav-item.proximo {
  text-align: right;
}

.jeb-nav-capitulos .nav-label {
  font-family: var(--fonte-ui);
  font-size: var(--texto-xs);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--cor-vermelho);
}

.jeb-nav-capitulos .nav-titulo {
  font-family: var(--fonte-titulo);
  font-size: var(--texto-sm);
  font-weight: 500;
  color: var(--cor-texto);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ============================================================
   BOTÃO VOLTAR AO LIVRO
   ============================================================ */
.jeb-voltar-livro {
  text-align: center;
  margin: var(--espaco-4) 0 var(--espaco-8);
}

.jeb-voltar-livro a {
  display: inline-flex;
  align-items: center;
  gap: var(--espaco-2);
  padding: var(--espaco-3) var(--espaco-6);
  background: transparent;
  border: 1.5px solid var(--cor-vermelho);
  border-radius: var(--raio-md);
  color: var(--cor-vermelho);
  font-family: var(--fonte-ui);
  font-size: var(--texto-sm);
  font-weight: 600;
  letter-spacing: .03em;
  text-decoration: none;
  transition: background var(--transicao), color var(--transicao);
  -webkit-tap-highlight-color: transparent;
}

.jeb-voltar-livro a:hover {
  background: var(--cor-vermelho);
  color: #fff;
  text-decoration: none;
}

/* ============================================================
   SEÇÃO DE ESTUDOS RELACIONADOS
   ============================================================ */
.jeb-relacionados {
  margin: var(--espaco-8) 0 0;
  padding: var(--espaco-6);
  background: var(--cor-creme-medio);
  border: 1px solid var(--cor-borda-sutil);
  border-radius: var(--raio-lg);
}

.jeb-relacionados__titulo {
  font-family: var(--fonte-ui);
  font-size: var(--texto-xs);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--cor-vermelho);
  margin: 0 0 var(--espaco-4);
  padding-bottom: var(--espaco-3);
  border-bottom: 1px solid var(--cor-borda);
}

.jeb-relacionados__lista {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--espaco-2);
}

.jeb-relacionados__lista li a {
  display: flex;
  align-items: flex-start;
  gap: var(--espaco-3);
  padding: var(--espaco-3) var(--espaco-4);
  background: var(--cor-card);
  border: 1px solid var(--cor-borda-sutil);
  border-radius: var(--raio-md);
  color: var(--cor-texto);
  text-decoration: none;
  font-size: var(--texto-sm);
  line-height: 1.45;
  transition: border-color var(--transicao);
  -webkit-tap-highlight-color: transparent;
}

.jeb-relacionados__lista li a::before {
  content: "→";
  color: var(--cor-vermelho);
  font-size: var(--texto-sm);
  flex-shrink: 0;
  margin-top: 1px;
}

.jeb-relacionados__lista li a:hover {
  border-color: var(--cor-vermelho);
  text-decoration: none;
}

/* ============================================================
   SEÇÃO DE CAPÍTULOS DO LIVRO (página do livro)
   ============================================================ */
.jeb-capitulos-grade {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(52px, 1fr));
  gap: var(--espaco-2);
  margin: var(--espaco-6) 0;
}

.jeb-capitulos-grade a {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1;
  background: var(--cor-card);
  border: 1px solid var(--cor-borda-sutil);
  border-radius: var(--raio-md);
  color: var(--cor-texto-secundario);
  font-family: var(--fonte-ui);
  font-size: var(--texto-sm);
  font-weight: 500;
  text-decoration: none;
  transition: background var(--transicao), border-color var(--transicao), color var(--transicao);
  -webkit-tap-highlight-color: transparent;
}

.jeb-capitulos-grade a:hover {
  background: var(--cor-vermelho);
  border-color: var(--cor-vermelho);
  color: #fff;
  text-decoration: none;
}

/* ============================================================
   PÁGINA INICIAL — DESTAQUES
   ============================================================ */
.jeb-destaque-biblia {
  background: linear-gradient(135deg, var(--cor-vermelho-escuro) 0%, var(--cor-vermelho) 100%);
  color: #fff;
  padding: var(--espaco-8) var(--espaco-6);
  border-radius: var(--raio-lg);
  margin-bottom: var(--espaco-8);
  position: relative;
  overflow: hidden;
}

.jeb-destaque-biblia::before {
  content: '✦';
  position: absolute;
  right: var(--espaco-6);
  top: var(--espaco-4);
  font-size: 4rem;
  opacity: .08;
  font-family: var(--fonte-titulo);
}

.jeb-destaque-biblia h2 {
  color: #fff;
  font-size: var(--texto-xl);
  margin-top: 0;
}

.jeb-destaque-biblia p {
  color: rgba(255,255,255,.85);
  margin-bottom: var(--espaco-5);
}

.jeb-destaque-biblia a.botao {
  display: inline-block;
  padding: var(--espaco-3) var(--espaco-6);
  background: #fff;
  color: var(--cor-vermelho) !important;
  border-radius: var(--raio-md);
  font-family: var(--fonte-ui);
  font-weight: 700;
  font-size: var(--texto-sm);
  letter-spacing: .04em;
  text-decoration: none !important;
}

/* ============================================================
   SIDEBAR
   ============================================================ */
.widget {
  background: var(--cor-card);
  border: 1px solid var(--cor-borda-sutil);
  border-radius: var(--raio-lg);
  padding: var(--espaco-5);
  margin-bottom: var(--espaco-5);
  box-shadow: var(--sombra-sm);
}

.widget-title {
  font-family: var(--fonte-ui) !important;
  font-size: var(--texto-xs) !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--cor-vermelho) !important;
  margin-top: 0 !important;
  margin-bottom: var(--espaco-4) !important;
  padding-bottom: var(--espaco-3) !important;
  border-bottom: 1px solid var(--cor-borda-sutil) !important;
}

.widget ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.widget ul li {
  border-bottom: 1px solid var(--cor-borda-sutil);
  padding: var(--espaco-2) 0;
}

.widget ul li:last-child {
  border-bottom: none;
}

.widget ul li a {
  color: var(--cor-texto-secundario);
  font-size: var(--texto-sm);
  text-decoration: none;
}

.widget ul li a:hover {
  color: var(--cor-vermelho);
}

/* ============================================================
   COMENTÁRIOS
   ============================================================ */
.comment-list {
  list-style: none;
  padding: 0;
}

.comment-body {
  background: var(--cor-card);
  border: 1px solid var(--cor-borda-sutil);
  border-radius: var(--raio-md);
  padding: var(--espaco-5);
  margin-bottom: var(--espaco-4);
}

.comment-author .fn {
  font-family: var(--fonte-ui);
  font-weight: 600;
  color: var(--cor-texto);
}

.comment-metadata a {
  font-size: var(--texto-xs);
  color: var(--cor-texto-terciario);
}

.comment-content {
  font-size: var(--texto-sm);
  line-height: 1.75;
  margin-top: var(--espaco-3);
}

/* Formulário de comentário */
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form textarea {
  width: 100%;
  padding: var(--espaco-3) var(--espaco-4);
  border: 1px solid var(--cor-borda);
  border-radius: var(--raio-md);
  background: var(--cor-card);
  font-family: var(--fonte-corpo);
  font-size: var(--texto-sm);
  color: var(--cor-texto);
  transition: border-color var(--transicao);
  -webkit-appearance: none;
}

.comment-form input:focus,
.comment-form textarea:focus {
  outline: none;
  border-color: var(--cor-vermelho);
  box-shadow: 0 0 0 3px rgba(122,21,21,.08);
}

.comment-form .submit,
.comment-form input[type="submit"] {
  padding: var(--espaco-3) var(--espaco-8);
  background: var(--cor-vermelho);
  color: #fff;
  border: none;
  border-radius: var(--raio-md);
  font-family: var(--fonte-ui);
  font-weight: 700;
  font-size: var(--texto-sm);
  letter-spacing: .04em;
  cursor: pointer;
  transition: background var(--transicao);
  -webkit-appearance: none;
  touch-action: manipulation;
}

.comment-form .submit:hover,
.comment-form input[type="submit"]:hover {
  background: var(--cor-vermelho-escuro);
}

/* ============================================================
   PAGINAÇÃO
   ============================================================ */
.pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--espaco-2);
  margin: var(--espaco-10) 0;
  flex-wrap: wrap;
}

.pagination a,
.pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 var(--espaco-3);
  border: 1px solid var(--cor-borda);
  border-radius: var(--raio-md);
  font-family: var(--fonte-ui);
  font-size: var(--texto-sm);
  color: var(--cor-texto-secundario);
  text-decoration: none;
  transition: background var(--transicao), border-color var(--transicao), color var(--transicao);
}

.pagination a:hover {
  background: var(--cor-creme-medio);
  border-color: var(--cor-vermelho);
  color: var(--cor-vermelho);
  text-decoration: none;
}

.pagination .current {
  background: var(--cor-vermelho);
  border-color: var(--cor-vermelho);
  color: #fff;
}

/* ============================================================
   RODAPÉ
   ============================================================ */
.site-footer {
  background: var(--cor-texto) !important;
  color: rgba(255,255,255,.6) !important;
  padding: var(--espaco-8) var(--espaco-5) !important;
  font-family: var(--fonte-ui) !important;
  font-size: var(--texto-sm) !important;
}

.site-footer a {
  color: rgba(255,255,255,.75) !important;
  text-decoration: none;
}

.site-footer a:hover {
  color: #fff !important;
}

/* Linha decorativa no topo do rodapé */
.site-footer::before {
  content: '';
  display: block;
  height: 2px;
  background: linear-gradient(90deg, var(--cor-vermelho), var(--cor-bege), transparent);
  margin-bottom: var(--espaco-8);
}

/* ============================================================
   UTILITÁRIOS
   ============================================================ */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  border: 0;
}

/* Melhorias de leitura no mobile */
@media (max-width: 480px) {
  .entry-content {
    font-size: 1rem;
  }

  .entry-content h2 {
    font-size: var(--texto-lg);
  }

  blockquote {
    padding: var(--espaco-4) var(--espaco-4);
    font-size: var(--texto-base);
  }

  .jeb-nav-capitulos {
    grid-template-columns: 1fr;
  }

  .jeb-nav-capitulos .nav-item.proximo {
    text-align: left;
  }
}

/* Desktop */
@media (min-width: 1024px) {
  h1 { font-size: var(--texto-3xl); }
  h2 { font-size: var(--texto-2xl); }
  h3 { font-size: var(--texto-xl); }

  .single .entry-title {
    font-size: var(--texto-4xl) !important;
  }

  .entry-content {
    font-size: var(--texto-lg);
  }
}

/* ============================================================
   MOBILE — CORREÇÕES DEFINITIVAS (v4)
   Três problemas resolvidos:
   1. Largura espremida na home e posts
   2. Menu hambúrguer sumindo
   3. Cruz gigante sobrepondo conteúdo
   ============================================================ */

/* SEM HIFENIZAÇÃO em nenhum elemento */
*, *::before, *::after {
    hyphens: none !important;
    -webkit-hyphens: none !important;
}

/* Texto sempre à esquerda */
.entry-content p,
.entry-content li,
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 {
    text-align: left !important;
    word-break: normal !important;
    overflow-wrap: break-word;
}

/* ── VÍDEOS SEMPRE RESPONSIVOS (16:9) ─────────────────── */
.entry-content .wp-block-embed,
.entry-content figure.wp-block-embed {
    width: 100% !important;
    max-width: 100% !important;
    margin: 1.5rem 0 !important;
    overflow: hidden !important;
}
.wp-block-embed__wrapper {
    position: relative !important;
    padding-bottom: 56.25% !important;
    height: 0 !important;
    overflow: hidden !important;
    width: 100% !important;
}
.wp-block-embed__wrapper iframe {
    position: absolute !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important;
    height: 100% !important;
}

/* ── CORREÇÃO 3: CRUZ GIGANTE / ELEMENTO ABSOLUTO ─────
   O GenerateBlocks coloca ícones decorativos com
   position:absolute e z-index alto dentro de containers.
   Limitamos a altura e escondemos overflow para corrigir. */
.gb-container,
.wp-block-generateblocks-container {
    overflow: hidden;
}

/* Elemento absoluto decorativo — limita tamanho no mobile */
@media (max-width: 768px) {
    .gb-container [style*="position: absolute"],
    .gb-container [style*="position:absolute"],
    .wp-block-generateblocks-container [style*="position: absolute"],
    .wp-block-generateblocks-container [style*="position:absolute"] {
        max-width: 120px !important;
        max-height: 120px !important;
        opacity: 0.08 !important;
        pointer-events: none !important;
    }
}

/* ── CORREÇÃO 1: LARGURA DA HOME E POSTS ──────────────── */
@media (max-width: 768px) {

    /* PROBLEMA DO MENU: O GP Premium injeta o menu dentro
       de .main-navigation — NÃO tocamos no header nem nav */

    /* Containers internos do GeneratePress — sem padding lateral */
    .site-content .inside-site-content,
    .content-area,
    .site-main {
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* inside-article: padding 20px nas laterais — espaço de leitura */
    .inside-article {
        padding: 0 20px !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Conteúdo do post — sem padding extra (já está no inside-article) */
    .entry-content,
    .entry-header,
    .entry-footer {
        padding-left: 0 !important;
        padding-right: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Blocos GenerateBlocks na home — largura total */
    .gb-container .gb-inside-container,
    .wp-block-generateblocks-container .gb-inside-container {
        padding-left: 20px !important;
        padding-right: 20px !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Sidebar some */
    .widget-area { display: none !important; }

    /* Fonte legível */
    .entry-content p,
    .entry-content li {
        font-size: 1.05rem !important;
        line-height: 1.85 !important;
    }

    /* Imagens */
    .entry-content img,
    .post-image img {
        max-width: 100% !important;
        height: auto !important;
        display: block !important;
    }
}

/* ── CORREÇÃO 2: MENU HAMBÚRGUER ─────────────────────────
   Garante visibilidade do toggle e navegação no mobile */
@media (max-width: 768px) {
    .main-navigation {
        display: block !important;
        width: 100% !important;
    }

    .menu-toggle {
        display: flex !important;
        align-items: center !important;
        gap: .4rem !important;
        color: #fff !important;
        background: transparent !important;
        border: 1px solid rgba(255,255,255,.4) !important;
        border-radius: 4px !important;
        padding: .4rem .75rem !important;
        font-size: .9rem !important;
        cursor: pointer !important;
        margin: .5rem 1rem !important;
    }

    .main-navigation .menu-toggle:focus {
        outline: 2px solid rgba(255,255,255,.5) !important;
    }

    /* Menu aberto */
    .main-navigation ul.toggled-on,
    .main-navigation .menu-items.toggled-on {
        display: block !important;
        width: 100% !important;
        background: #5a0e0e !important;
    }

    .main-navigation ul ul {
        background: #5a0e0e !important;
    }
}

/* ============================================================
   FIX MENU DUPLICADO — GP Premium injeta segundo menu via hook
   Mantém apenas o primeiro .main-navigation na página
   ============================================================ */
.main-navigation ~ .main-navigation {
    display: none !important;
}

/* ============================================================
   FIX HEADER MOBILE — alinhamento busca + hambúrguer
   ============================================================ */
@media (max-width: 768px) {
    .site-header .inside-header,
    .site-header .header-widget,
    #site-navigation {
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
    }

    /* Coloca logo, busca e hambúrguer na mesma linha */
    .site-header .inside-header {
        flex-direction: row !important;
        justify-content: space-between !important;
        padding: .5rem 1rem !important;
        gap: .5rem !important;
    }

    /* Logo ocupa o espaço disponível */
    .site-branding {
        flex: 1 !important;
    }

    /* Busca e menu ficam lado a lado à direita */
    .header-widget,
    .main-navigation {
        flex-shrink: 0 !important;
    }

    /* Ícone de busca alinhado */
    .search-toggle,
    .header-search,
    .search-icon {
        display: flex !important;
        align-items: center !important;
        height: 44px !important;
        padding: 0 .5rem !important;
    }

    /* Hambúrguer alinhado */
    .menu-toggle {
        height: 36px !important;
        display: flex !important;
        align-items: center !important;
        margin: 0 !important;
    }

    /* Menu aberto cai abaixo do header normalmente */
    .main-navigation .main-nav {
        width: 100% !important;
    }
}
