/* ==========================================================================
   Ajustes da conversão para WordPress
   O CSS original define `display` nas classes .case-modal, .case-lightbox e
   .manifesto__rhs, o que anula o `display:none` que o atributo [hidden]
   herda da folha do navegador. No React esses elementos simplesmente não
   existiam no DOM; aqui eles existem e precisam ser realmente escondidos.
   ========================================================================== */
[hidden] { display: none !important; }

/* ==========================================================================
   Templates nativos do WordPress (index, page, single, search, 404)
   Usam os mesmos tokens de colors_and_type.css — nenhuma cor nova.
   ========================================================================== */
.wp-hero {
  background: var(--bg-dark-1, #12213a);
  color: var(--fg-on-dark, #f5f1ea);
  padding: 140px 0 64px;
}
.wp-hero .eyebrow { color: var(--fg-accent, #c8a04a); }
/* colors_and_type.css define `h1 { color: var(--fg-1) }` — cor escura — e isso
   vence a herança do bloco escuro. A cor precisa ser declarada explicitamente. */
.wp-hero h1.wp-hero__title {
  font-family: var(--font-display);
  font-size: clamp(30px, 4.4vw, 52px);
  line-height: 1.08;
  margin: 12px 0 0;
  max-width: 24ch;
  text-transform: uppercase;
  color: var(--fg-on-dark, #f5f1ea);
}
.wp-hero h2, .wp-hero h3, .wp-hero p { color: var(--fg-on-dark, #f5f1ea); }
.wp-hero__sub { max-width: 60ch; margin-top: 16px; color: var(--fg-on-dark-2, #cfc7ba); }
.wp-hero__meta {
  display: flex; gap: 10px; align-items: center; margin-top: 18px;
  font-family: var(--font-mono); font-size: 13px; letter-spacing: .06em;
  text-transform: uppercase; color: var(--fg-on-dark-3, #a49c90);
}

.wp-conteudo, .wp-lista { padding: 72px 0 96px; background: var(--bg-1, #f5f1ea); }
.wp-conteudo__capa { margin: 0 0 40px; }
.wp-conteudo__capa img { width: 100%; height: auto; display: block; }

.wp-prosa { max-width: 72ch; font-size: 18px; line-height: 1.7; color: var(--fg-1, #1c2433); }
.wp-prosa > * + * { margin-top: 1.15em; }
.wp-prosa h2 { font-family: var(--font-display); font-size: 30px; line-height: 1.2; margin-top: 1.9em; }
.wp-prosa h3 { font-family: var(--font-display); font-size: 23px; line-height: 1.25; margin-top: 1.6em; }
.wp-prosa a  { color: var(--fg-accent, #a8801f); text-underline-offset: 3px; }
.wp-prosa img, .wp-prosa iframe { max-width: 100%; height: auto; }
.wp-prosa blockquote {
  border-left: 3px solid var(--fg-accent, #c8a04a);
  padding-left: 22px; font-size: 21px; font-style: italic;
}
.wp-prosa ul, .wp-prosa ol { padding-left: 1.3em; }
.wp-prosa li + li { margin-top: .4em; }
.wp-prosa table { width: 100%; border-collapse: collapse; }
.wp-prosa th, .wp-prosa td { border: 1px solid var(--border-1, #ddd6ca); padding: 10px 12px; text-align: left; }
.wp-prosa code { font-family: var(--font-mono); font-size: .9em; background: var(--bg-2, #ece6dc); padding: 2px 6px; }

.wp-lista__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 44px 32px; }
.wp-card__foto img { width: 100%; height: 220px; object-fit: cover; display: block; }
.wp-card__data {
  display: block; margin-top: 16px; font-family: var(--font-mono);
  font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: var(--fg-3, #7b7466);
}
.wp-card__titulo { font-family: var(--font-display); font-size: 22px; line-height: 1.25; margin: 8px 0 10px; }
.wp-card__titulo a { color: inherit; text-decoration: none; }
.wp-card__titulo a:hover { color: var(--fg-accent, #a8801f); }
.wp-card__resumo { color: var(--fg-2, #4a5261); margin-bottom: 14px; }

.wp-navpost { display: flex; justify-content: space-between; gap: 24px; margin-top: 64px; padding-top: 28px; border-top: 1px solid var(--border-1, #ddd6ca); }
.wp-paginacao { margin-top: 56px; font-family: var(--font-mono); font-size: 14px; }
.wp-paginacao .page-numbers { padding: 8px 13px; border: 1px solid var(--border-1, #ddd6ca); text-decoration: none; margin-right: 6px; display: inline-block; }
.wp-paginacao .page-numbers.current { background: var(--grifo-navy, #12213a); color: #fff; border-color: var(--grifo-navy, #12213a); }
.wp-vazio { font-size: 19px; color: var(--fg-2, #4a5261); }

.wp-404__links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.wp-404__links a {
  border: 1px solid var(--border-on-dark, rgba(245,241,234,.28));
  padding: 11px 18px; font-family: var(--font-mono); font-size: 13px;
  letter-spacing: .06em; text-transform: uppercase; text-decoration: none;
  color: var(--fg-on-dark, #f5f1ea);
}
.wp-404__links a:hover { border-color: var(--fg-accent, #c8a04a); color: var(--fg-accent, #c8a04a); }
.wp-busca { margin-top: 28px; max-width: 420px; }
.wp-busca input[type="search"] { width: 100%; padding: 12px 14px; border: 1px solid var(--border-1, #ddd6ca); font-family: var(--font-body); }

@media (max-width: 760px) {
  .wp-hero { padding: 108px 0 48px; }
  .wp-conteudo, .wp-lista { padding: 48px 0 64px; }
  .wp-prosa { font-size: 17px; }
}

/* Mesma armadilha em fundo claro: garantir contraste correto */
.wp-prosa h2, .wp-prosa h3, .wp-card__titulo { color: var(--fg-1, #1c2433); }
.wp-prosa h2 { text-transform: none; letter-spacing: 0; }
