/*
Theme Name: Ione Blog Theme
Theme URI: https://ioneadvogados.com.br
Description: Tema personalizado para o blog do escritório Ione Advogados & Associados. Design integrado ao site institucional.
Author: Ione Advogados & Associados
Version: 1.0.0
Text Domain: ione-blog-theme
*/

/* ═══════════════════════════════════════
   VARIÁVEIS CSS — MODO ESCURO (PADRÃO)
   ═══════════════════════════════════════ */
:root {
  --cor-fundo-principal: #080C14;
  --cor-fundo-secundario: #0D1220;
  --cor-fundo-terciario: #111827;
  --cor-fundo-card: rgba(255,255,255,0.02);
  --cor-borda: rgba(201,169,78,0.08);
  --cor-borda-hover: rgba(201,169,78,0.18);
  --cor-texto-principal: #F5F0E8;
  --cor-texto-secundario: rgba(245,240,232,0.55);
  --cor-texto-terciario: rgba(245,240,232,0.35);
  --cor-dourado: #C9A94E;
  --cor-dourado-claro: #E8D5A3;
  --cor-dourado-escuro: #A68A3A;
  --cor-dourado-bg: rgba(201,169,78,0.06);
  --cor-dourado-bg-hover: rgba(201,169,78,0.12);
  --cor-azul-profundo: #142038;
  --font-titulo: 'Cormorant Garamond', Georgia, serif;
  --font-corpo: 'Raleway', 'Helvetica Neue', Arial, sans-serif;
  --transicao-rapida: 0.2s cubic-bezier(0.4,0,0.2,1);
  --transicao-media: 0.35s cubic-bezier(0.4,0,0.2,1);
  --transicao-lenta: 0.5s cubic-bezier(0.4,0,0.2,1);
  --largura-maxima: 1200px;
  --header-altura: 88px;
}

[data-theme="light"] {
  --cor-fundo-principal: #F5F0E8;
  --cor-fundo-secundario: #EDE8DF;
  --cor-fundo-terciario: #E0D9CE;
  --cor-fundo-card: rgba(20,32,56,0.05);
  --cor-borda: rgba(20,32,56,0.12);
  --cor-borda-hover: rgba(20,32,56,0.22);
  --cor-texto-principal: #0A1120;
  --cor-texto-secundario: rgba(10,17,32,0.72);
  --cor-texto-terciario: rgba(10,17,32,0.52);
  --cor-dourado: #7A5F1E;
  --cor-dourado-claro: #8B6F2E;
  --cor-dourado-escuro: #5C4816;
  --cor-dourado-bg: rgba(122,95,30,0.1);
  --cor-dourado-bg-hover: rgba(122,95,30,0.18);
}

/* ═══════════════════════════════════════
   RESET E BASE
   ═══════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: var(--font-corpo);
  background: var(--cor-fundo-principal);
  color: var(--cor-texto-principal);
  line-height: 1.6;
  overflow-x: hidden;
  transition: background-color var(--transicao-lenta), color var(--transicao-lenta);
  -webkit-font-smoothing: antialiased;
}

a { text-decoration: none; color: inherit; transition: color var(--transicao-rapida); }
img { max-width: 100%; height: auto; display: block; }

/* ═══════════════════════════════════════
   HEADER
   ═══════════════════════════════════════ */
.header__filete { height: 2px; background: linear-gradient(90deg, transparent 0%, var(--cor-dourado-escuro) 20%, var(--cor-dourado) 50%, var(--cor-dourado-escuro) 80%, transparent 100%); opacity: 0.5; }
.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 1000; transition: all var(--transicao-media); }
.header__barra { height: var(--header-altura); display: flex; align-items: center; justify-content: space-between; padding: 0 48px; max-width: var(--largura-maxima); margin: 0 auto; }
.site-header.scrolled { background: rgba(8,12,20,0.92); backdrop-filter: blur(20px); border-bottom: 1px solid var(--cor-borda); }
[data-theme="light"] .site-header.scrolled { background: rgba(245,240,232,0.92); }
.header__logo { display: flex; align-items: center; gap: 12px; }
.header__logo-texto { font-family: var(--font-titulo); font-size: 28px; font-weight: 600; color: var(--cor-dourado); letter-spacing: 0.5px; line-height: 1.1; transition: color var(--transicao-rapida); }
.header__logo-subtexto { font-family: var(--font-corpo); font-size: 10px; font-weight: 400; letter-spacing: 4px; text-transform: uppercase; color: var(--cor-texto-terciario); margin-top: 3px; }
.header__logo:hover .header__logo-texto { color: var(--cor-dourado-claro); }
.header__logo-separador { width: 1px; height: 36px; background: linear-gradient(180deg, transparent, var(--cor-borda-hover), transparent); margin-left: 4px; }
.header__nav { display: flex; align-items: center; gap: 32px; }
.header__nav-link { font-size: 11px; font-weight: 400; letter-spacing: 2px; text-transform: uppercase; color: var(--cor-texto-secundario); padding: 8px 0; position: relative; transition: color var(--transicao-rapida); }
.header__nav-link::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background: linear-gradient(90deg, var(--cor-dourado), var(--cor-dourado-claro)); transition: width var(--transicao-media); }
.header__nav-link:hover, .header__nav-link--ativo { color: var(--cor-dourado); }
.header__nav-link:hover::after, .header__nav-link--ativo::after { width: 100%; }
.header__cta { font-size: 10px; font-weight: 500; letter-spacing: 2.5px; text-transform: uppercase; color: var(--cor-dourado); border: 1px solid rgba(201,169,78,0.3); padding: 10px 24px; transition: all var(--transicao-media); }
.header__cta:hover { background: var(--cor-dourado-bg); border-color: var(--cor-dourado); }
.header__theme-toggle { background: none; border: 1px solid var(--cor-borda); color: var(--cor-texto-secundario); width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 16px; transition: all var(--transicao-rapida); margin-left: 16px; }
.header__theme-toggle:hover { color: var(--cor-dourado); border-color: var(--cor-borda-hover); background: var(--cor-dourado-bg); }
.header__theme-toggle .icone-sol { display: none; }
.header__theme-toggle .icone-lua { display: block; }
[data-theme="light"] .header__theme-toggle .icone-sol { display: block; }
[data-theme="light"] .header__theme-toggle .icone-lua { display: none; }
.header__hamburguer { display: none; flex-direction: column; justify-content: center; align-items: center; width: 38px; height: 38px; z-index: 1001; gap: 6px; background: none; border: none; cursor: pointer; }
.header__hamburguer-linha { width: 22px; height: 1.5px; background: var(--cor-texto-principal); transition: all var(--transicao-media); transform-origin: center; }
.header__hamburguer--aberto .header__hamburguer-linha:nth-child(1) { transform: rotate(45deg) translate(5px,5px); background: var(--cor-dourado); }
.header__hamburguer--aberto .header__hamburguer-linha:nth-child(2) { opacity: 0; transform: scaleX(0); }
.header__hamburguer--aberto .header__hamburguer-linha:nth-child(3) { transform: rotate(-45deg) translate(5px,-5px); background: var(--cor-dourado); }

/* Menu Mobile */
.menu-mobile { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 999; background: var(--cor-fundo-principal); display: flex; flex-direction: column; justify-content: center; align-items: center; opacity: 0; visibility: hidden; transition: all var(--transicao-lenta); }
.menu-mobile--aberto { opacity: 1; visibility: visible; }
.menu-mobile__nav { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; padding-left: 72px; }
.menu-mobile__link { font-family: var(--font-titulo); font-size: 32px; font-weight: 400; color: var(--cor-texto-secundario); transition: all var(--transicao-media); }
.menu-mobile__link:hover { color: var(--cor-dourado); }

/* ═══════════════════════════════════════
   HERO DO BLOG
   ═══════════════════════════════════════ */
.blog-hero {
  padding: calc(var(--header-altura) + 80px) 0 60px;
  position: relative;
  overflow: hidden;
}
.blog-hero::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: radial-gradient(ellipse at 75% 25%, rgba(201,169,78,0.04) 0%, transparent 50%);
  pointer-events: none;
}
.blog-hero__conteudo {
  max-width: var(--largura-maxima);
  margin: 0 auto;
  padding: 0 48px 0 80px;
}
.blog-hero__badge {
  display: inline-block;
  font-size: 9px; font-weight: 500; letter-spacing: 4px; text-transform: uppercase;
  color: var(--cor-dourado);
  background: var(--cor-dourado-bg);
  border: 1px solid rgba(201,169,78,0.12);
  padding: 8px 20px; border-radius: 2px;
  margin-bottom: 20px;
}
.blog-hero__linha-dourada {
  width: 40px; height: 1px;
  background: linear-gradient(90deg, var(--cor-dourado), var(--cor-dourado-claro));
  margin-bottom: 20px;
}
.blog-hero__titulo {
  font-family: var(--font-titulo);
  font-size: clamp(36px, 4vw, 56px);
  font-weight: 400;
  line-height: 1.1;
  color: var(--cor-texto-principal);
  margin-bottom: 16px;
}
.blog-hero__titulo em { font-style: italic; color: var(--cor-dourado); }
.blog-hero__subtitulo {
  font-size: 15px; font-weight: 300;
  color: var(--cor-texto-secundario);
  line-height: 1.8; max-width: 520px;
}

/* ═══════════════════════════════════════
   FILTROS DE CATEGORIA
   ═══════════════════════════════════════ */
.blog-filtros {
  background: var(--cor-fundo-secundario);
  border-top: 1px solid var(--cor-borda);
  border-bottom: 1px solid var(--cor-borda);
  padding: 0;
  position: sticky;
  top: var(--header-altura);
  z-index: 100;
}
.blog-filtros__inner {
  max-width: var(--largura-maxima);
  margin: 0 auto;
  padding: 0 80px;
  display: flex;
  gap: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.blog-filtros__inner::-webkit-scrollbar { display: none; }
.blog-filtros__btn {
  font-family: var(--font-corpo);
  font-size: 10px; font-weight: 500; letter-spacing: 2px; text-transform: uppercase;
  color: var(--cor-texto-terciario);
  background: none; border: none;
  padding: 18px 20px;
  cursor: pointer;
  transition: all var(--transicao-rapida);
  white-space: nowrap;
  border-bottom: 2px solid transparent;
  position: relative;
}
.blog-filtros__btn:hover { color: var(--cor-dourado); }
.blog-filtros__btn--ativo { color: var(--cor-dourado); border-bottom-color: var(--cor-dourado); }

/* ═══════════════════════════════════════
   GRID DE ARTIGOS
   ═══════════════════════════════════════ */
.blog-conteudo {
  max-width: var(--largura-maxima);
  margin: 0 auto;
  padding: 64px 80px;
}
.blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}
.blog-card {
  background: var(--cor-fundo-card);
  border: 1px solid var(--cor-borda);
  transition: all var(--transicao-media);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.blog-card:hover {
  border-color: var(--cor-borda-hover);
  transform: translateY(-4px);
  box-shadow: 0 20px 40px rgba(0,0,0,0.3);
}
.blog-card__imagem {
  width: 100%; height: 200px;
  overflow: hidden;
  background: var(--cor-fundo-terciario);
  position: relative;
}
.blog-card__imagem img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform var(--transicao-lenta);
}
.blog-card:hover .blog-card__imagem img { transform: scale(1.05); }
.blog-card__imagem-placeholder {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--cor-fundo-terciario), var(--cor-azul-profundo));
}
.blog-card__imagem-placeholder svg { opacity: 0.3; }
.blog-card__categoria {
  font-size: 9px; font-weight: 500; letter-spacing: 3px; text-transform: uppercase;
  color: var(--cor-dourado);
  padding: 20px 24px 0;
}
.blog-card__corpo { padding: 12px 24px 24px; flex: 1; display: flex; flex-direction: column; }
.blog-card__titulo {
  font-family: var(--font-titulo);
  font-size: 22px; font-weight: 400; line-height: 1.3;
  color: var(--cor-texto-principal);
  margin-bottom: 12px;
  transition: color var(--transicao-rapida);
}
.blog-card:hover .blog-card__titulo { color: var(--cor-dourado); }
.blog-card__resumo {
  font-size: 13px; font-weight: 300;
  color: var(--cor-texto-secundario);
  line-height: 1.7;
  flex: 1;
  margin-bottom: 20px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.blog-card__rodape {
  display: flex; align-items: center; justify-content: space-between;
  padding-top: 16px;
  border-top: 1px solid var(--cor-borda);
}
.blog-card__meta {
  font-size: 10px; letter-spacing: 1px;
  color: var(--cor-texto-terciario);
}
.blog-card__ler {
  font-size: 10px; font-weight: 500; letter-spacing: 2px; text-transform: uppercase;
  color: var(--cor-dourado);
  display: flex; align-items: center; gap: 6px;
  transition: gap var(--transicao-rapida);
}
.blog-card:hover .blog-card__ler { gap: 10px; }

/* Card destaque (primeiro artigo) */
.blog-card--destaque {
  grid-column: span 2;
}
.blog-card--destaque .blog-card__imagem { height: 280px; }
.blog-card--destaque .blog-card__titulo { font-size: 28px; }

/* Artigo sem artigos */
.blog-vazio {
  grid-column: span 3;
  text-align: center;
  padding: 80px 0;
}
.blog-vazio__titulo {
  font-family: var(--font-titulo);
  font-size: 32px; font-weight: 400;
  color: var(--cor-texto-secundario);
  margin-bottom: 16px;
}
.blog-vazio__texto {
  font-size: 14px; color: var(--cor-texto-terciario);
}

/* Paginação */
.blog-paginacao {
  display: flex; justify-content: center; align-items: center; gap: 8px;
  margin-top: 48px;
}
.blog-paginacao a, .blog-paginacao span {
  font-size: 11px; font-weight: 500; letter-spacing: 1px;
  color: var(--cor-texto-secundario);
  border: 1px solid var(--cor-borda);
  padding: 10px 16px;
  transition: all var(--transicao-rapida);
}
.blog-paginacao a:hover { color: var(--cor-dourado); border-color: var(--cor-borda-hover); }
.blog-paginacao .current { color: var(--cor-dourado); border-color: var(--cor-dourado); background: var(--cor-dourado-bg); }

/* ═══════════════════════════════════════
   PÁGINA DO ARTIGO (SINGLE)
   ═══════════════════════════════════════ */
.artigo-hero {
  padding: calc(var(--header-altura) + 60px) 0 40px;
  border-bottom: 1px solid var(--cor-borda);
}
.artigo-hero__inner {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 48px;
}
.artigo-hero__categoria {
  font-size: 9px; font-weight: 500; letter-spacing: 3px; text-transform: uppercase;
  color: var(--cor-dourado);
  margin-bottom: 16px;
  display: flex; align-items: center; gap: 12px;
}
.artigo-hero__categoria::before {
  content: '';
  width: 24px; height: 1px;
  background: var(--cor-dourado);
}
.artigo-hero__titulo {
  font-family: var(--font-titulo);
  font-size: clamp(32px, 4vw, 52px);
  font-weight: 400; line-height: 1.15;
  color: var(--cor-texto-principal);
  margin-bottom: 24px;
}
.artigo-hero__meta {
  font-size: 11px; letter-spacing: 1px;
  color: var(--cor-texto-terciario);
  display: flex; gap: 24px;
}
.artigo-hero__meta span { display: flex; align-items: center; gap: 6px; }

.artigo-imagem {
  max-width: 800px;
  margin: 40px auto;
  padding: 0 48px;
}
.artigo-imagem img { width: 100%; border: 1px solid var(--cor-borda); }

.artigo-corpo {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 48px 80px;
}
.artigo-corpo .entry-content {
  font-size: 16px; line-height: 1.9;
  color: var(--cor-texto-secundario);
}
.artigo-corpo .entry-content h2 {
  font-family: var(--font-titulo);
  font-size: 28px; font-weight: 400;
  color: var(--cor-texto-principal);
  margin: 40px 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--cor-borda);
}
.artigo-corpo .entry-content h3 {
  font-family: var(--font-titulo);
  font-size: 22px; font-weight: 400;
  color: var(--cor-texto-principal);
  margin: 32px 0 12px;
}
.artigo-corpo .entry-content p { margin-bottom: 20px; }
.artigo-corpo .entry-content strong { color: var(--cor-texto-principal); font-weight: 600; }
.artigo-corpo .entry-content em { color: var(--cor-dourado); font-style: italic; }
.artigo-corpo .entry-content a { color: var(--cor-dourado); border-bottom: 1px solid rgba(201,169,78,0.3); }
.artigo-corpo .entry-content a:hover { border-bottom-color: var(--cor-dourado); }
.artigo-corpo .entry-content blockquote {
  border-left: 2px solid var(--cor-dourado);
  padding: 16px 24px;
  margin: 32px 0;
  background: var(--cor-dourado-bg);
  font-family: var(--font-titulo);
  font-size: 20px; font-style: italic;
  color: var(--cor-texto-principal);
}
.artigo-corpo .entry-content ul, .artigo-corpo .entry-content ol {
  padding-left: 24px;
  margin-bottom: 20px;
}
.artigo-corpo .entry-content li { margin-bottom: 8px; }

/* Navegação entre artigos */
.artigo-navegacao {
  max-width: 800px;
  margin: 0 auto;
  padding: 40px 48px;
  border-top: 1px solid var(--cor-borda);
  display: flex; justify-content: space-between; gap: 24px;
}
.artigo-navegacao__link {
  font-size: 10px; font-weight: 500; letter-spacing: 2px; text-transform: uppercase;
  color: var(--cor-texto-terciario);
  transition: color var(--transicao-rapida);
  max-width: 45%;
}
.artigo-navegacao__link:hover { color: var(--cor-dourado); }
.artigo-navegacao__label { display: block; margin-bottom: 4px; }
.artigo-navegacao__titulo {
  font-family: var(--font-titulo);
  font-size: 16px; font-weight: 400;
  color: var(--cor-texto-principal);
  margin-top: 4px;
}

/* Voltar ao blog */
.artigo-voltar {
  max-width: 800px;
  margin: 0 auto 40px;
  padding: 0 48px;
}
.artigo-voltar__link {
  font-size: 10px; font-weight: 500; letter-spacing: 2px; text-transform: uppercase;
  color: var(--cor-texto-terciario);
  display: flex; align-items: center; gap: 8px;
  transition: color var(--transicao-rapida);
}
.artigo-voltar__link:hover { color: var(--cor-dourado); }

/* ═══════════════════════════════════════
   RODAPÉ
   ═══════════════════════════════════════ */
.site-footer {
  background: var(--cor-fundo-secundario);
  border-top: 1px solid var(--cor-borda);
  padding: 60px 0 32px;
}
.footer__inner {
  max-width: var(--largura-maxima);
  margin: 0 auto;
  padding: 0 80px;
}
.footer__topo {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 48px;
  padding-bottom: 48px;
  border-bottom: 1px solid var(--cor-borda);
  margin-bottom: 32px;
}
.footer__logo-texto { font-family: var(--font-titulo); font-size: 24px; font-weight: 600; color: var(--cor-dourado); }
.footer__logo-subtexto { font-size: 9px; letter-spacing: 3px; text-transform: uppercase; color: var(--cor-texto-terciario); margin-top: 2px; }
.footer__descricao { font-size: 12px; color: var(--cor-texto-terciario); line-height: 1.8; margin-top: 16px; max-width: 240px; }
.footer__redes { display: flex; gap: 12px; margin-top: 20px; }
.footer__rede-link { width: 36px; height: 36px; border: 1px solid var(--cor-borda); display: flex; align-items: center; justify-content: center; color: var(--cor-texto-terciario); font-size: 14px; transition: all var(--transicao-rapida); }
.footer__rede-link:hover { color: var(--cor-dourado); border-color: var(--cor-borda-hover); background: var(--cor-dourado-bg); }
.footer__coluna-titulo { font-size: 9px; font-weight: 500; letter-spacing: 3px; text-transform: uppercase; color: var(--cor-dourado); margin-bottom: 20px; }
.footer__coluna-link { display: block; font-size: 12px; color: var(--cor-texto-terciario); margin-bottom: 10px; transition: color var(--transicao-rapida); }
.footer__coluna-link:hover { color: var(--cor-dourado); }
.footer__rodape { display: flex; justify-content: space-between; align-items: center; }
.footer__copyright { font-size: 11px; color: var(--cor-texto-terciario); letter-spacing: 0.5px; }
.footer__links-legais { display: flex; gap: 24px; }
.footer__link-legal { font-size: 11px; color: var(--cor-texto-terciario); transition: color var(--transicao-rapida); }
.footer__link-legal:hover { color: var(--cor-dourado); }

/* ═══════════════════════════════════════
   RESPONSIVO
   ═══════════════════════════════════════ */
@media (max-width: 1024px) {
  .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .blog-card--destaque { grid-column: span 2; }
  .blog-vazio { grid-column: span 2; }
  .footer__topo { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 768px) {
  .header__nav { display: none; }
  .header__hamburguer { display: flex; }
  .header__barra { padding: 0 24px; }
  .blog-hero__conteudo, .blog-conteudo { padding: 0 24px; }
  .blog-conteudo { padding: 40px 24px; }
  .blog-filtros__inner { padding: 0 24px; }
  .blog-grid { grid-template-columns: 1fr; }
  .blog-card--destaque { grid-column: span 1; }
  .blog-vazio { grid-column: span 1; }
  .artigo-hero__inner, .artigo-imagem, .artigo-corpo, .artigo-navegacao, .artigo-voltar { padding-left: 24px; padding-right: 24px; }
  .footer__inner { padding: 0 24px; }
  .footer__topo { grid-template-columns: 1fr; gap: 32px; }
  .footer__rodape { flex-direction: column; gap: 16px; text-align: center; }
}
