/*
Theme Name:   Nexus
Theme URI:    https://nexus.example/
Description:  Tema-base único da rede Nexus. Child theme do GeneratePress, design clean mobile-first (CSS-only), com slots de conformidade embutidos: bloco de operador, disclosure de afiliados, consentimento + GTM único, E-E-A-T de autor e template de "Sobre" parametrizável. Cada site da rede ajusta marca, idioma e mercado pelo Customizer.
Author:       Nexus
Author URI:   https://nexus.example/
Template:     generatepress
Version:      1.0.0
Text Domain:  nexus
*/

/* ============================================================
   Design tokens
   ============================================================ */
:root {
  /* Paleta clara estilo "revista/news" (inspirada no Yuki). */
  --nx-bg:           #f7f8fa;
  --nx-surface:      #ffffff;
  --nx-bg-alt:       #f7f8fa;
  --nx-text:         #111827;
  --nx-text-muted:   #4b5563;
  --nx-text-soft:    #6b7280;
  --nx-border:       #e5e7eb;
  --nx-border-soft:  #eef0f3;
  --nx-shadow:       0 2px 8px rgba(0, 0, 0, 0.06);
  --nx-shadow-hover: 0 8px 24px rgba(0, 0, 0, 0.08);

  --nx-radius:       10px;
  --nx-radius-sm:    6px;
  --nx-radius-pill:  999px;

  /* Marca Nexus. header-a/b tingem a faixa superior do header; accent é a cor
     primária (links, tags, botões). Sobrescritos pelo Customizer. */
  --nx-header-a:     #4338ca;
  --nx-header-b:     #7c3aed;
  --nx-accent:       #4f46e5;
  --nx-accent-soft:  color-mix(in srgb, var(--nx-accent) 12%, white);
  --nx-accent-warm:  #f59e0b;   /* âmbar — tags/realces secundários */
  --nx-accent-hot:   #ef4444;   /* vermelho — tags de destaque       */
  --nx-footer-bg:    #ffffff;

  /* Footer agora é CLARO (estilo Yuki). */
  --nx-footer-text:        #4b5563;
  --nx-footer-text-strong: #111827;
  --nx-footer-hover-bg:    rgba(0, 0, 0, 0.06);

  --nx-container:    760px;
  --nx-container-wide: 1240px;

  --nx-font:         -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --nx-space-1: 4px;
  --nx-space-2: 8px;
  --nx-space-3: 12px;
  --nx-space-4: 16px;
  --nx-space-5: 20px;
  --nx-space-6: 24px;
  --nx-space-8: 32px;
  --nx-space-10: 40px;
}

/* ============================================================
   Reset mínimo
   ============================================================ */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--nx-font);
  font-size: 16px;
  line-height: 1.65;
  color: var(--nx-text);
  background: var(--nx-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
p, figure, blockquote, dl, dd { margin: 0; }

img, picture, video, canvas, svg { display: block; max-width: 100%; }

input, button, textarea, select { font: inherit; }

a { color: var(--nx-accent); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ============================================================
   Layout: container e main
   ============================================================ */
.nx-container {
  width: 100%;
  max-width: var(--nx-container);
  margin-inline: auto;
  /* Mobile: zero padding lateral — o card encosta nas bordas. */
  padding-inline: 0;
}

.nx-container--wide { max-width: var(--nx-container-wide); }

/* Páginas de listagem ficam com container largo (grid de cards). */
.home .nx-container,
.archive .nx-container,
.search .nx-container,
.blog .nx-container {
  max-width: var(--nx-container-wide);
}

.nx-main {
  /* Mobile: zero padding vertical — o card encosta no header. */
  padding-block: 0;
}

@media (min-width: 768px) {
  .nx-container { padding-inline: var(--nx-space-4); }
  .nx-main      { padding-block: var(--nx-space-5) var(--nx-space-10); }
}

/* ============================================================
   Header
   ============================================================ */
.nx-header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--nx-surface);
  color: var(--nx-text);
  border-top: 3px solid var(--nx-header-a);
  border-bottom: 1px solid var(--nx-border);
  transition: box-shadow 200ms ease;
}
/* Sombra ao rolar (toggle via JS — nexus_header_scroll). */
.nx-header.is-scrolled { box-shadow: var(--nx-shadow); }

.nx-header__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding-inline: var(--nx-space-4);
  min-height: 56px;
  row-gap: 0;
}

/*
 * .nx-header__brand é um <div> wrapper. Pode conter:
 *   (a) <a class="custom-logo-link"><img class="custom-logo"></a>  ← the_custom_logo()
 *   (b) <a class="nx-header__brand-text">site name</a>             ← fallback texto
 */
.nx-header__brand {
  display: inline-flex;
  align-items: center;
  line-height: 1;
}

.nx-header__brand .custom-logo-link,
.nx-header__brand .nx-header__brand-text {
  display: inline-flex;
  align-items: center;
  color: var(--nx-text);
  text-decoration: none;
  font-size: 1.375rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  white-space: nowrap;
  padding: 0;
}
.nx-header__brand .custom-logo-link:hover,
.nx-header__brand .nx-header__brand-text:hover {
  text-decoration: none;
  color: var(--nx-accent);
}

/* Imagem do Custom Logo: ajusta ao header sem deixar passar do limite. */
.nx-header__brand img,
.nx-header__brand .custom-logo {
  display: block;
  height: 32px;
  width: auto;
  max-width: 220px;
  object-fit: contain;
}

/* Toggle do menu mobile (checkbox hack — sem JS) */
.nx-menu-toggle__input { display: none; }

.nx-menu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--nx-radius);
  background: transparent;
  color: inherit;
  cursor: pointer;
  border: 0;
  padding: 0;
  transition: background-color 120ms ease;
}
.nx-menu-toggle { color: var(--nx-text); }
.nx-menu-toggle:hover { background: rgba(0, 0, 0, 0.05); }

.nx-menu-toggle__bar,
.nx-menu-toggle__bar::before,
.nx-menu-toggle__bar::after {
  content: "";
  display: block;
  width: 20px;
  height: 2px;
  background: currentColor;
  border-radius: 2px;
  transition: transform 180ms ease, opacity 180ms ease;
}
.nx-menu-toggle__bar { position: relative; }
.nx-menu-toggle__bar::before { position: absolute; top: -6px; left: 0; }
.nx-menu-toggle__bar::after  { position: absolute; top:  6px; left: 0; }

.nx-menu-toggle__input:checked ~ .nx-header__inner .nx-menu-toggle__bar { background: transparent; }
.nx-menu-toggle__input:checked ~ .nx-header__inner .nx-menu-toggle__bar::before { top: 0; transform: rotate(45deg); }
.nx-menu-toggle__input:checked ~ .nx-header__inner .nx-menu-toggle__bar::after  { top: 0; transform: rotate(-45deg); }

/*
 * Nav — mobile-first
 * É um filho da row do header: ocupa flex-basis 100% (segunda linha).
 * Colapsa via grid-template-rows. Por estar in-flow no <header sticky>,
 * abrir empurra o conteúdo para baixo naturalmente.
 */
.nx-nav {
  flex-basis: 100%;
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 220ms ease;
}
.nx-nav__inner { overflow: hidden; }

.nx-menu-toggle__input:checked ~ .nx-header__inner .nx-nav {
  grid-template-rows: 1fr;
}

.nx-nav ul,
.nx-nav .nx-menu {
  list-style: none;
  margin: 0;
  padding: var(--nx-space-2) 0 var(--nx-space-3);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.nx-nav a {
  display: block;
  padding: 10px 12px;
  border-radius: var(--nx-radius-sm);
  color: var(--nx-text-muted);
  font-weight: 600;
  transition: color 160ms ease, background-color 160ms ease;
}
.nx-nav a:hover { background: var(--nx-bg-alt); text-decoration: none; color: var(--nx-accent); }
.nx-nav .current-menu-item > a,
.nx-nav .current_page_item > a { color: var(--nx-accent); }

/* ----- Botão de busca (lupa) + drawer (CSS-only via checkbox hack) -----
   Mobile: o drawer abre JUNTO com o menu (mesmo #nx-menu-toggle), portanto
           o botão de lupa fica oculto e a busca aparece no fim do drawer.
   Desktop: a navegação fica sempre aberta; o drawer abre via #nx-search-toggle
            como segunda linha do header. */
.nx-search-toggle__input { display: none; }

.nx-search-toggle {
  display: none; /* mobile esconde — busca já vem dentro do menu drawer */
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: var(--nx-radius);
  background: transparent;
  color: inherit;
  cursor: pointer;
  border: 0;
  padding: 0;
  margin-left: var(--nx-space-1);
  color: var(--nx-text-muted);
  transition: background-color 120ms ease, color 120ms ease;
}
.nx-search-toggle:hover { background: rgba(0, 0, 0, 0.05); color: var(--nx-accent); }

.nx-search-toggle__input:checked ~ .nx-header__inner .nx-search-toggle {
  background: var(--nx-bg-alt);
  color: var(--nx-accent);
}

/* Drawer — colapsa via grid-template-rows (mesma técnica do .nx-nav) */
.nx-search-drawer {
  flex-basis: 100%;
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 220ms ease;
}
.nx-search-drawer__inner { overflow: hidden; }

/* Mobile: abre junto com o menu (drawer é irmão direto do input) */
.nx-menu-toggle__input:checked ~ .nx-search-drawer {
  grid-template-rows: 1fr;
}

/* Formulário em si */
.nx-search {
  display: flex;
  gap: var(--nx-space-2);
  padding: var(--nx-space-3) var(--nx-space-4) var(--nx-space-4);
}

.nx-search__input {
  flex: 1;
  min-width: 0;
  padding: 10px 14px;
  font-size: 0.9375rem;
  background: var(--nx-surface);
  color: var(--nx-text);
  border: 1px solid var(--nx-border);
  border-radius: var(--nx-radius-sm);
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}
.nx-search__input::placeholder { color: var(--nx-text-soft); }
.nx-search__input:focus { border-color: var(--nx-accent); box-shadow: 0 0 0 3px var(--nx-accent-soft); }
/* Remove o "x" nativo do input search no Chrome para um visual mais limpo */
.nx-search__input::-webkit-search-cancel-button { -webkit-appearance: none; }

.nx-search__submit {
  flex-shrink: 0;
  width: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--nx-accent);
  color: #ffffff;
  border: 0;
  border-radius: var(--nx-radius-sm);
  cursor: pointer;
  transition: filter 120ms ease;
}
.nx-search__submit:hover { filter: brightness(0.94); }

/* Utility para esconder texto mas manter acessível a leitores de tela.
   Necessário porque o tema desregistra o CSS do pai (que costuma fornecer). */
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Skip link (acessibilidade) */
.nx-skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.nx-skip-link:focus {
  position: fixed;
  left: 12px;
  top: 12px;
  width: auto;
  height: auto;
  padding: 8px 12px;
  background: var(--nx-surface);
  color: var(--nx-text);
  border-radius: var(--nx-radius);
  z-index: 1000;
}

/* Desktop */
@media (min-width: 768px) {
  .nx-menu-toggle { display: none; }
  .nx-header__inner { padding-inline: var(--nx-space-6); flex-wrap: nowrap; }
  .nx-nav {
    flex-basis: auto;
    grid-template-rows: 1fr;
    margin-left: auto;
  }
  .nx-nav ul,
  .nx-nav .nx-menu {
    flex-direction: row;
    padding: 0;
    gap: var(--nx-space-1);
  }
  .nx-nav a { padding: 8px 14px; }

  /* Botão de lupa aparece à direita do menu */
  .nx-search-toggle { display: inline-flex; }

  /* O drawer não é mais controlado pelo menu-toggle no desktop
     (a navegação fica sempre visível). Reseta para fechado. */
  .nx-menu-toggle__input:checked ~ .nx-search-drawer {
    grid-template-rows: 0fr;
  }
  /* Abre via search-toggle */
  .nx-search-toggle__input:checked ~ .nx-search-drawer {
    grid-template-rows: 1fr;
  }

  /* Layout do form no desktop: faixa clara com borda inferior */
  .nx-search-drawer {
    background: var(--nx-bg-alt);
    border-top: 1px solid var(--nx-border);
  }
  .nx-search {
    max-width: var(--nx-container-wide);
    margin-inline: auto;
    padding: var(--nx-space-4) var(--nx-space-6);
  }
}

/* ============================================================
   Barra de categorias (estilo Yuki — 2ª linha do header, desktop)
   ============================================================ */
.nx-catbar {
  display: none;
  border-top: 1px solid var(--nx-border);
  background: var(--nx-surface);
}
.nx-catbar__inner {
  width: 100%;
  max-width: var(--nx-container-wide);
  margin-inline: auto;
  padding-inline: var(--nx-space-6);
}
.nx-catbar__list {
  display: flex;
  gap: 0;
  align-items: center;
  height: 40px;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
}
.nx-catbar__list::-webkit-scrollbar { display: none; }
.nx-catbar__list li { margin: 0; }
.nx-catbar__list a {
  display: inline-flex;
  align-items: center;
  height: 100%;
  padding: 0 var(--nx-space-4);
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--nx-text-muted);
  white-space: nowrap;
  transition: color 160ms ease;
}
.nx-catbar__list a:hover,
.nx-catbar__list .current-menu-item > a { color: var(--nx-accent); text-decoration: none; }
@media (min-width: 768px) {
  .nx-catbar { display: block; }
}

/* ============================================================
   Cards (bloco padrão para conteúdo)
   ============================================================ */
.nx-card {
  background: var(--nx-surface);
  /* Mobile: sem borda lateral, sem radius, sem sombra — flush nas laterais. */
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: var(--nx-space-5);
}

/*
 * Cards empilhados no mobile: separador 1px no topo (sem fresta cinza).
 * Cobre tanto cards adjacentes quanto card-heading antes da .nx-list.
 */
.nx-card + .nx-card,
.nx-card + .nx-list > .nx-card:first-child {
  margin-top: 0;
  border-top: 1px solid var(--nx-border);
}

@media (min-width: 768px) {
  .nx-card {
    border: 1px solid var(--nx-border);
    border-radius: var(--nx-radius);
    box-shadow: var(--nx-shadow);
    padding: var(--nx-space-8);
  }
  .nx-card + .nx-card,
  .nx-card + .nx-list > .nx-card:first-child {
    margin-top: var(--nx-space-4);
    /* No desktop o card já tem border completo, então não precisa do border-top extra. */
    border-top: 1px solid var(--nx-border);
  }
}

/* ============================================================
   Botões
   ============================================================ */
.nx-btn {
  display: inline-block;
  padding: 10px 18px;
  background: var(--nx-accent);
  color: #ffffff;
  border: 0;
  border-radius: var(--nx-radius);
  font-weight: 600;
  cursor: pointer;
  transition: filter 120ms ease, transform 120ms ease;
}
.nx-btn:hover { filter: brightness(0.94); text-decoration: none; color: #fff; }
.nx-btn:active { transform: translateY(1px); }

.nx-btn--ghost {
  background: var(--nx-surface);
  color: var(--nx-accent);
  border: 1px solid var(--nx-border);
}

/* ============================================================
   Post (single) — toques "assinatura" do Nexus
   ============================================================ */

/* Barra de progresso de leitura (fixa no topo, gradient da marca) */
.nx-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: transparent;
  z-index: 200;
  pointer-events: none;
}
.nx-progress__bar {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--nx-header-a), var(--nx-header-b));
  transition: width 80ms linear;
}

/* Cabeçalho do post: eyebrow de categoria + título + régua de acento */
.nx-post__header {
  margin-bottom: var(--nx-space-5);
  padding-bottom: var(--nx-space-5);
  border-bottom: 1px solid var(--nx-border-soft);
}

.nx-post__eyebrow {
  display: inline-block;
  margin-bottom: var(--nx-space-3);
  padding-left: var(--nx-space-3);
  position: relative;
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--nx-accent);
}
.nx-post__eyebrow::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 1em;
  border-radius: 2px;
  background: var(--nx-accent);
}
.nx-post__eyebrow:hover { text-decoration: none; filter: brightness(0.92); }

.nx-post__title {
  font-size: 1.75rem;
  line-height: 1.18;
  letter-spacing: -0.02em;
  font-weight: 800;
  margin-bottom: var(--nx-space-3);
  text-wrap: balance;
}

.nx-post__excerpt {
  font-size: 1.0625rem;
  color: var(--nx-text-muted);
  margin-bottom: var(--nx-space-4);
}

.nx-post__byline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--nx-space-2);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--nx-text-soft);
}

/* Categoria + tempo de leitura + data no FINAL do texto */
.nx-post__endmeta {
  margin-top: var(--nx-space-6);
  padding-top: var(--nx-space-5);
  border-top: 1px solid var(--nx-border-soft);
  display: flex;
  flex-direction: column;
  gap: var(--nx-space-2);
}
.nx-post__endmeta .nx-post__eyebrow { margin-bottom: 0; }

.nx-post__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px var(--nx-space-4);
  font-size: 0.8125rem;
  color: var(--nx-text-muted);
  margin-top: var(--nx-space-5);
}
.nx-post__meta a { color: inherit; }
.nx-post__meta a:hover { color: var(--nx-accent); text-decoration: none; }
.nx-post__meta-item { display: inline-flex; align-items: center; gap: 6px; }

.nx-post__feature {
  border-radius: var(--nx-radius);
  overflow: hidden;
  background: var(--nx-border-soft);
}
.nx-post__feature img { width: 100%; height: auto; }

/* ------------------------------------------------------------
   Corpo do post — tipografia editorial mobile-first.

   Princípios aplicados (UX Writing / Content Design):
   - Tamanhos confortáveis: 18px mobile, 19px desktop, line-height 1.7+.
   - Cor de destaque como âncora semântica (links, marca de h2, bullets,
     <mark>, capitular, blockquote, hr).
   - Lead paragraph (1º parágrafo) maior, para criar respiro e definir tom.
   - Hierarquia clara: h2 marca seção, h3 sub-tópico, h4 atua como eyebrow.
   - Componentes editoriais: pull quote, drop cap, mark, code, tabela.
   ------------------------------------------------------------ */
.nx-post__content {
  font-size: 1.125rem;
  line-height: 1.7;
  color: var(--nx-text);
  hyphens: auto;
  word-wrap: break-word;
}

@media (min-width: 768px) {
  .nx-post__content {
    font-size: 1.1875rem;
    line-height: 1.75;
  }
}

/* Ritmo vertical entre filhos diretos */
.nx-post__content > * + * { margin-top: 1.1em; }

/* Lead — 1º parágrafo serve de "intro" editorial */
.nx-post__content > p:first-of-type {
  font-size: 1.1875rem;
  line-height: 1.55;
  font-weight: 500;
  color: var(--nx-text);
  margin-bottom: 1.4em;
}
@media (min-width: 768px) {
  .nx-post__content > p:first-of-type {
    font-size: 1.3125rem;
    line-height: 1.5;
  }
}

/* Drop cap (Gutenberg .has-drop-cap) — capitular em cor de destaque */
.nx-post__content p.has-drop-cap::first-letter {
  font-size: 3.6em;
  font-weight: 700;
  float: left;
  line-height: 0.85;
  margin: 0.05em 0.12em 0 0;
  color: var(--nx-accent);
  font-family: Georgia, "Times New Roman", serif;
}

/* ----- Cabeçalhos -----
   h2 = marco de seção (barra accent à esquerda).
   h3 = sub-tópico (limpo, peso da própria tipografia).
   h4 = eyebrow / rótulo (uppercase, pequeno, muted).
*/
.nx-post__content h2,
.nx-post__content h3 {
  color: var(--nx-text);
  font-weight: 700;
  letter-spacing: -0.015em;
  text-wrap: balance;
}

.nx-post__content h2 {
  font-size: 1.5rem;
  line-height: 1.2;
  margin-top: 2em;
  margin-bottom: 0.5em;
  position: relative;
  padding-left: var(--nx-space-3);
}
.nx-post__content h2::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.18em;
  bottom: 0.18em;
  width: 4px;
  border-radius: 2px;
  background: var(--nx-accent);
}

.nx-post__content h3 {
  font-size: 1.25rem;
  line-height: 1.3;
  margin-top: 1.8em;
  margin-bottom: 0.4em;
}

.nx-post__content h4 {
  margin-top: 1.6em;
  margin-bottom: 0.3em;
  font-size: 0.8125rem;
  line-height: 1.35;
  text-transform: uppercase;
  letter-spacing: 0.10em;
  color: var(--nx-accent);
  font-weight: 700;
}

@media (min-width: 768px) {
  .nx-post__content h2 {
    font-size: 1.875rem;
    padding-left: var(--nx-space-4);
  }
  .nx-post__content h2::before { width: 5px; }
  .nx-post__content h3 { font-size: 1.4375rem; }
}

/* ----- Links inline ----- */
.nx-post__content a {
  color: var(--nx-accent);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  text-decoration-color: color-mix(in srgb, var(--nx-accent) 40%, transparent);
  transition: text-decoration-color 160ms ease, text-decoration-thickness 160ms ease;
  font-weight: 500;
}
.nx-post__content a:hover {
  text-decoration-color: var(--nx-accent);
  text-decoration-thickness: 2px;
}

/* ----- Emphasis / inline marcas ----- */
.nx-post__content strong,
.nx-post__content b {
  font-weight: 700;
  color: var(--nx-text);
}
.nx-post__content em,
.nx-post__content i { font-style: italic; }

.nx-post__content mark {
  background: color-mix(in srgb, var(--nx-accent) 18%, transparent);
  color: var(--nx-text);
  padding: 0 4px;
  border-radius: 3px;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

/* ----- Código ----- */
.nx-post__content code,
.nx-post__content kbd,
.nx-post__content samp {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
  font-size: 0.875em;
  padding: 2px 6px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--nx-accent) 8%, var(--nx-bg));
  color: var(--nx-text);
}
.nx-post__content pre {
  margin: 1.4em 0;
  padding: var(--nx-space-4);
  background: var(--nx-bg);
  border: 1px solid var(--nx-border);
  border-radius: var(--nx-radius);
  overflow-x: auto;
  font-size: 0.875rem;
  line-height: 1.5;
}
.nx-post__content pre code {
  background: transparent;
  padding: 0;
  font-size: inherit;
  border-radius: 0;
}

/* ----- Citação (blockquote padrão) ----- */
.nx-post__content blockquote {
  margin: 1.8em 0;
  padding: var(--nx-space-4) var(--nx-space-5);
  border-left: 4px solid var(--nx-accent);
  background: color-mix(in srgb, var(--nx-accent) 5%, var(--nx-bg));
  border-radius: 0 var(--nx-radius) var(--nx-radius) 0;
  color: var(--nx-text);
  font-size: 1.0625rem;
  font-style: italic;
  line-height: 1.6;
}
.nx-post__content blockquote > * + * { margin-top: 0.6em; }
.nx-post__content blockquote cite {
  display: block;
  font-style: normal;
  font-weight: 600;
  font-size: 0.8125rem;
  color: var(--nx-text-muted);
}
.nx-post__content blockquote cite::before { content: "— "; }

/* ----- Pull quote (destaque grande de frase-chave) -----
   Use a classe nx-pullquote em um <blockquote> ou parágrafo.
   Também atende ao bloco pullquote do Gutenberg.
*/
.nx-post__content .nx-pullquote,
.nx-post__content .wp-block-pullquote {
  margin: 2em 0;
  padding: var(--nx-space-6) 0;
  background: transparent;
  border-left: 0;
  border-radius: 0;
  border-top: 2px solid var(--nx-accent);
  border-bottom: 2px solid var(--nx-accent);
  text-align: center;
  font-size: 1.375rem;
  line-height: 1.4;
  font-weight: 500;
  font-style: normal;
  color: var(--nx-text);
  letter-spacing: -0.01em;
}
.nx-post__content .wp-block-pullquote blockquote {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}
.nx-post__content .nx-pullquote cite,
.nx-post__content .wp-block-pullquote cite {
  display: block;
  margin-top: var(--nx-space-3);
  font-style: normal;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--nx-accent);
}
.nx-post__content .nx-pullquote cite::before,
.nx-post__content .wp-block-pullquote cite::before { content: none; }
@media (min-width: 768px) {
  .nx-post__content .nx-pullquote,
  .nx-post__content .wp-block-pullquote { font-size: 1.625rem; }
}

/* ----- Listas (bullets / numeração em cor de destaque) ----- */
.nx-post__content ul,
.nx-post__content ol {
  padding-left: 1.6em;
  list-style: none;
}
.nx-post__content ul > li,
.nx-post__content ol > li {
  position: relative;
  margin-top: 0.4em;
}
.nx-post__content ul > li::before {
  content: "";
  position: absolute;
  left: -1.2em;
  top: 0.65em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--nx-accent);
}
.nx-post__content ol { counter-reset: nx-ol; }
.nx-post__content ol > li { counter-increment: nx-ol; }
.nx-post__content ol > li::before {
  content: counter(nx-ol) ".";
  position: absolute;
  left: -1.6em;
  top: 0;
  width: 1.4em;
  text-align: right;
  padding-right: 6px;
  color: var(--nx-accent);
  font-weight: 700;
}
/* Sublistas — bullets menores, sem cor de destaque (hierarquia visual) */
.nx-post__content li ul > li::before {
  background: var(--nx-text-muted);
  width: 5px;
  height: 5px;
  top: 0.7em;
}

/* ----- HR — divisor curto em cor de destaque, centralizado ----- */
.nx-post__content hr {
  border: 0;
  margin: var(--nx-space-8) auto;
  width: 60px;
  height: 3px;
  background: var(--nx-accent);
  border-radius: 2px;
  opacity: 0.75;
}

/* ----- Imagens e figuras ----- */
.nx-post__content img { border-radius: var(--nx-radius); }
.nx-post__content figure { margin: 1.5em 0; }
.nx-post__content figure img,
.nx-post__content .wp-block-image img {
  width: 100%;
  height: auto;
  border-radius: var(--nx-radius);
}
.nx-post__content figcaption,
.nx-post__content .wp-block-image figcaption {
  margin-top: var(--nx-space-2);
  text-align: center;
  font-size: 0.8125rem;
  color: var(--nx-text-muted);
  font-style: italic;
}

/* ----- Tabelas ----- */
.nx-post__content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5em 0;
  font-size: 0.9375rem;
}
.nx-post__content th,
.nx-post__content td {
  text-align: left;
  padding: var(--nx-space-2) var(--nx-space-3);
  border-bottom: 1px solid var(--nx-border-soft);
  vertical-align: top;
}
.nx-post__content thead th {
  border-bottom: 2px solid var(--nx-accent);
  color: var(--nx-text);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.nx-post__content tbody tr:hover {
  background: color-mix(in srgb, var(--nx-accent) 4%, transparent);
}

/* Scroll suave para âncoras dentro do post */
.nx-post__content :target { scroll-margin-top: var(--nx-space-6); }

@media (min-width: 768px) {
  .nx-post__title { font-size: 2.375rem; }
}

/* Breadcrumb */
.nx-breadcrumb {
  margin-top: var(--nx-space-6);
  padding-top: var(--nx-space-4);
  border-top: 1px solid var(--nx-border-soft);
  font-size: 0.8125rem;
  color: var(--nx-text-muted);
}
.nx-breadcrumb__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
}
.nx-breadcrumb__item {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.nx-breadcrumb__item + .nx-breadcrumb__item::before {
  content: "›";
  color: var(--nx-border);
  font-size: 1rem;
  line-height: 1;
}
.nx-breadcrumb__item a {
  color: var(--nx-text-muted);
}
.nx-breadcrumb__item a:hover {
  color: var(--nx-accent);
  text-decoration: none;
}
.nx-breadcrumb__item span[aria-current="page"] {
  color: var(--nx-text);
  font-weight: 500;
  /* Trunca títulos longos em uma linha no mobile */
  max-width: 60vw;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Featured image quando aparece após o conteúdo (variante --bottom) */
.nx-post__feature--bottom {
  margin-top: var(--nx-space-5);
  margin-bottom: 0;
}

/* Caixa de recomendações injetada após o 8º parágrafo */
.nx-recommendations {
  margin: 1.5em 0;
  padding: var(--nx-space-4) var(--nx-space-5);
  background: var(--nx-bg);
  border: 1px solid var(--nx-border-soft);
  border-radius: var(--nx-radius);
  list-style: none;
}
.nx-recommendations__title {
  display: block;
  font-weight: 700;
  font-size: 0.9375rem;
  color: var(--nx-text);
  margin-bottom: var(--nx-space-2);
}
.nx-recommendations ul {
  list-style: none;
  margin: 0;
  padding-left: 0;
}
/*
 * Sobrescreve o estilo de lista do .nx-post__content (bullets accent
 * com position absolute left:-1.2em) — esses bullets cairiam fora da
 * caixa porque o ul aqui tem padding-left:0. A caixa de recomendações
 * já tem identidade visual própria (background + separadores), bullets
 * duplicariam o trabalho.
 */
.nx-recommendations ul > li {
  margin-top: 0;
  padding: 8px 0;
  border-bottom: 1px solid var(--nx-border-soft);
  position: static;
}
.nx-recommendations ul > li::before {
  content: none;
  display: none;
}
.nx-recommendations ul > li:last-child { border-bottom: 0; }

.nx-recommendations a {
  color: var(--nx-accent);
  font-weight: 500;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: color-mix(in srgb, var(--nx-accent) 35%, transparent);
  transition: text-decoration-color 160ms ease;
}
.nx-recommendations a:hover {
  text-decoration-color: var(--nx-accent);
}

/* Tags */
.nx-post__tags {
  margin-top: var(--nx-space-6);
  padding-top: var(--nx-space-5);
  border-top: 1px solid var(--nx-border);
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.nx-post__tags-label {
  width: 100%;
  font-size: 0.8125rem;
  color: var(--nx-text-muted);
  margin-bottom: var(--nx-space-1);
}
.nx-tag {
  display: inline-block;
  padding: 4px 12px;
  background: var(--nx-bg);
  border: 1px solid var(--nx-border-soft);
  border-radius: var(--nx-radius-pill);
  font-size: 0.8125rem;
  color: var(--nx-text);
  transition: background-color 120ms ease, border-color 120ms ease;
}
.nx-tag:hover {
  background: var(--nx-border-soft);
  border-color: var(--nx-border);
  text-decoration: none;
}

/* ============================================================
   Posts relacionados (fim do single)
   ============================================================ */
.nx-related {
  margin-top: var(--nx-space-8);
}

/*
 * Variante de grid para a seção de relacionados.
 * Trava em 2 colunas em qualquer largura ≥640px (sem ir para 3/4
 * como o .nx-grid base faz nas listagens). Usa especificidade dupla
 * (.nx-grid.nx-grid--related) para vencer .nx-grid sem depender da
 * ordem de declaração das regras no arquivo.
 */
.nx-grid.nx-grid--related {
  grid-template-columns: 1fr;
}
@media (min-width: 640px) {
  .nx-grid.nx-grid--related { grid-template-columns: repeat(2, 1fr); }
}

/* No mobile o container do single tem padding 0 — alinhamos a section heading
   e adicionamos um respiro lateral só nesta seção, pra ficar consistente. */
@media (max-width: 767px) {
  .nx-related .nx-section-heading {
    padding-left: var(--nx-space-5);
    padding-right: var(--nx-space-5);
  }
}

/* ============================================================
   Navegação entre posts (anterior / próximo)
   ============================================================ */
.nx-post-nav {
  margin-top: var(--nx-space-6);
  padding-top: var(--nx-space-5);
  border-top: 1px solid var(--nx-border);
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--nx-space-3);
}

.nx-post-nav__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: var(--nx-space-3) var(--nx-space-4);
  background: var(--nx-surface);
  border: 1px solid var(--nx-border-soft);
  border-radius: var(--nx-radius);
  color: var(--nx-text);
  transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}
.nx-post-nav__item:hover {
  border-color: var(--nx-border);
  background: var(--nx-bg);
  text-decoration: none;
  color: var(--nx-text);
}

.nx-post-nav__item--empty {
  display: none;
}

.nx-post-nav__direction {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--nx-text-muted);
}

.nx-post-nav__arrow {
  font-size: 0.9rem;
  line-height: 1;
  transition: transform 160ms ease;
}

.nx-post-nav__item--prev:hover .nx-post-nav__arrow { transform: translateX(-3px); }
.nx-post-nav__item--next:hover .nx-post-nav__arrow { transform: translateX(3px); }

.nx-post-nav__title {
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--nx-text);
  /* Trunca em 2 linhas */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (min-width: 640px) {
  .nx-post-nav {
    grid-template-columns: 1fr 1fr;
    gap: var(--nx-space-4);
  }
  .nx-post-nav__item--empty {
    display: block;
    background: transparent;
    border-color: transparent;
  }
  .nx-post-nav__item--next {
    text-align: right;
    align-items: flex-end;
  }
}

/* ============================================================
   Bloco do autor (fim do post)
   ============================================================ */
.nx-author {
  margin-top: var(--nx-space-6);
  padding-top: var(--nx-space-5);
  border-top: 1px solid var(--nx-border);
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: var(--nx-space-4);
}

.nx-author__avatar {
  display: block;
  flex-shrink: 0;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--nx-border-soft);
  /* Anel de acento (assinatura Nexus) */
  box-shadow: 0 0 0 2px var(--nx-surface), 0 0 0 4px var(--nx-accent);
}
.nx-author__avatar:hover { text-decoration: none; }

.nx-author__img,
.nx-author__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nx-author__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.nx-author__eyebrow {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--nx-text-muted);
}

.nx-author__name {
  font-size: 1.0625rem;
  line-height: 1.3;
  margin: 0;
  font-weight: 700;
}
.nx-author__name a { color: var(--nx-text); }
.nx-author__name a:hover { color: var(--nx-accent); text-decoration: none; }

.nx-author__bio {
  margin: 4px 0 0;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--nx-text-muted);
}

.nx-author__link {
  margin-top: var(--nx-space-2);
  align-self: flex-start;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--nx-accent);
}
.nx-author__link::after {
  content: " →";
  transition: transform 160ms ease;
  display: inline-block;
}
.nx-author__link:hover {
  text-decoration: none;
}
.nx-author__link:hover::after {
  transform: translateX(3px);
}

@media (min-width: 768px) {
  .nx-author {
    margin-top: var(--nx-space-8);
    padding: var(--nx-space-5) var(--nx-space-6);
    background: var(--nx-bg-alt);
    border: 1px solid var(--nx-border-soft);
    border-left: 4px solid var(--nx-accent);
    border-radius: var(--nx-radius);
    gap: var(--nx-space-5);
  }
  .nx-author__avatar {
    width: 80px;
    height: 80px;
  }
  .nx-author__name { font-size: 1.125rem; }
}

/* ============================================================
   Listagem (home / archive)
   ============================================================ */

/* Badge — pílula da categoria */
.nx-badge {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  padding: 0.2em 0.6em;
  border-radius: 3px;
  background: var(--nx-accent);
  color: #ffffff;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.4;
}
.nx-badge:hover {
  filter: brightness(0.94);
  text-decoration: none;
  color: #ffffff;
}

/* Cabeçalho de archive (categoria, tag, busca, etc.) */
.nx-archive-heading {
  background: var(--nx-surface);
  padding: var(--nx-space-5);
}
.nx-archive-heading__eyebrow {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--nx-accent);
  margin-bottom: var(--nx-space-2);
}
.nx-archive-heading__title {
  font-size: 1.5rem;
  line-height: 1.2;
  letter-spacing: -0.015em;
  margin: 0;
  color: var(--nx-text);
}
.nx-archive-heading__title em { font-style: normal; color: var(--nx-accent); }
.nx-archive-heading__desc {
  margin-top: var(--nx-space-2);
  color: var(--nx-text-muted);
  font-size: 0.9375rem;
}
@media (min-width: 768px) {
  .nx-archive-heading {
    background: transparent;
    padding: var(--nx-space-6) 0 var(--nx-space-5);
  }
  .nx-archive-heading__title { font-size: 2rem; }
}

/* ----- Seções de categoria na home -----
   Header com título à esquerda e botão "Ver todos" à direita.
   No mobile o header fica em card branco (igual ao archive-heading);
   no desktop fica em transparente. */
.nx-cat-section {
  margin-top: var(--nx-space-8);
}

.nx-cat-section__header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--nx-space-3);
  padding: var(--nx-space-5) var(--nx-space-5) var(--nx-space-3);
  background: var(--nx-surface);
}

.nx-cat-section__title {
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.015em;
  color: var(--nx-text);
  margin: 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  /* Barra accent à esquerda (estilo Yuki section-head) */
  position: relative;
  padding-left: var(--nx-space-3);
}
.nx-cat-section__title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.1em;
  bottom: 0.1em;
  width: 4px;
  border-radius: 2px;
  background: var(--nx-accent);
}

.nx-cat-section__see-all {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--nx-accent);
  white-space: nowrap;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.nx-cat-section__see-all::after {
  content: "→";
  font-size: 1em;
  line-height: 1;
  transition: transform 160ms ease;
}
.nx-cat-section__see-all:hover { text-decoration: none; }
.nx-cat-section__see-all:hover::after { transform: translateX(3px); }

@media (min-width: 768px) {
  .nx-cat-section { margin-top: var(--nx-space-10); }
  .nx-cat-section__header {
    background: transparent;
    padding: 0;
    margin-bottom: var(--nx-space-5);
  }
  .nx-cat-section__title { font-size: 1.5rem; }
  .nx-cat-section__see-all { font-size: 0.875rem; }
}

/* Section heading — título forte com barra accent à esquerda (estilo Yuki) */
.nx-section-heading {
  display: block;
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--nx-text);
  margin: 0;
  padding: var(--nx-space-5) var(--nx-space-5) var(--nx-space-3);
  background: var(--nx-surface);
}
.nx-section-heading > span {
  display: inline-block;
  padding-left: var(--nx-space-3);
  border-left: 4px solid var(--nx-accent);
  line-height: 1.1;
}

@media (min-width: 768px) {
  .nx-section-heading {
    font-size: 1.5rem;
    background: transparent;
    padding: 0;
    margin: var(--nx-space-8) 0 var(--nx-space-5);
  }
}

/* Hero (post em destaque) */
.nx-hero {
  display: grid;
  grid-template-columns: 1fr;
  background: var(--nx-surface);
}

.nx-hero__media {
  display: block;
  aspect-ratio: 16 / 11;
  background: var(--nx-border-soft);
  overflow: hidden;
}
.nx-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.nx-hero__body {
  padding: var(--nx-space-5);
  display: flex;
  flex-direction: column;
  gap: var(--nx-space-3);
}

.nx-hero__title {
  font-size: 1.5rem;
  line-height: 1.15;
  letter-spacing: -0.01em;
  margin: 0;
}
.nx-hero__title a { color: var(--nx-text); }
.nx-hero__title a:hover { color: var(--nx-accent); text-decoration: none; }

.nx-hero__excerpt {
  margin: 0;
  color: var(--nx-text-muted);
  font-size: 0.9375rem;
  line-height: 1.5;
}

.nx-hero__cta { margin: 0; }

.nx-hero__meta {
  margin-top: var(--nx-space-3);
  padding-top: var(--nx-space-3);
  border-top: 1px solid var(--nx-border-soft);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px var(--nx-space-2);
  font-size: 0.8125rem;
  color: var(--nx-text-muted);
}
.nx-hero__meta a { color: var(--nx-text-muted); }
.nx-hero__meta a:hover { color: var(--nx-accent); text-decoration: none; }
.nx-hero__author { color: var(--nx-text) !important; font-weight: 600; }

@media (min-width: 768px) {
  .nx-hero {
    grid-template-columns: 1.6fr 1fr;
    border: 1px solid var(--nx-border);
    border-radius: var(--nx-radius);
    overflow: hidden;
    box-shadow: var(--nx-shadow);
    align-items: stretch;
  }
  .nx-hero__media { aspect-ratio: auto; height: 100%; }
  .nx-hero__body  { padding: var(--nx-space-8); justify-content: center; gap: var(--nx-space-4); }
  .nx-hero__title { font-size: 2rem; }
  .nx-hero__excerpt { font-size: 1rem; }
}

/* ============================================================
   Bloco "featured" (home magazine): hero grande + rail de manchetes
   ============================================================ */
.nx-featured {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--nx-space-5);
}
@media (min-width: 1024px) {
  .nx-featured {
    grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
    gap: var(--nx-space-6);
    align-items: start;
  }
  /* Dentro do featured o hero vira card vertical (imagem em cima). */
  .nx-featured .nx-hero { grid-template-columns: 1fr; }
  .nx-featured .nx-hero__media { aspect-ratio: 16 / 8; height: auto; }
  .nx-featured .nx-hero__body { padding: var(--nx-space-6); }
  .nx-featured .nx-hero__title { font-size: 1.875rem; }
}

/* Rail de manchetes — lista vertical de itens horizontais (thumb + título) */
.nx-headlines {
  background: var(--nx-surface);
  display: flex;
  flex-direction: column;
}
.nx-headlines__title {
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--nx-text-muted);
  margin: 0;
  padding: var(--nx-space-5) var(--nx-space-5) var(--nx-space-3);
}
@media (min-width: 1024px) {
  .nx-headlines {
    border: 1px solid var(--nx-border);
    border-radius: var(--nx-radius);
    box-shadow: var(--nx-shadow);
    overflow: hidden;
  }
  .nx-headlines__title {
    border-bottom: 1px solid var(--nx-border-soft);
  }
}

.nx-headline {
  display: flex;
  gap: var(--nx-space-3);
  align-items: flex-start;
  padding: var(--nx-space-4) var(--nx-space-5);
}
.nx-headline + .nx-headline { border-top: 1px solid var(--nx-border-soft); }

.nx-headline__thumb {
  flex-shrink: 0;
  width: 76px;
  height: 76px;
  border-radius: var(--nx-radius-sm);
  overflow: hidden;
  background: var(--nx-border-soft);
}
.nx-headline__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 280ms ease;
}
.nx-headline:hover .nx-headline__thumb img { transform: scale(1.05); }
.nx-headline__thumb .nx-thumb-placeholder { width: 100%; height: 100%; }

.nx-headline__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--nx-space-1);
}
.nx-headline__title {
  font-size: 0.9375rem;
  line-height: 1.3;
  font-weight: 700;
  margin: 0;
  letter-spacing: -0.01em;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.nx-headline__title a { color: var(--nx-text); }
.nx-headline__title a:hover { color: var(--nx-accent); text-decoration: none; }
.nx-headline__meta {
  font-size: 0.6875rem;
  color: var(--nx-text-soft);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

/* Grid de cards */
.nx-grid {
  display: grid;
  grid-template-columns: 1fr;
  background: var(--nx-surface);
}

@media (min-width: 640px) {
  .nx-grid { background: transparent; gap: var(--nx-space-4); }
}
@media (min-width: 768px)  { .nx-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .nx-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1280px) { .nx-grid { grid-template-columns: repeat(4, 1fr); } }

/* Post card (home) */
.nx-post-card {
  background: var(--nx-surface);
  display: flex;
  flex-direction: column;
}

/* Mobile: separador entre cards (sem fresta cinza) */
.nx-grid > .nx-post-card + .nx-post-card {
  border-top: 1px solid var(--nx-border);
}

.nx-post-card__media {
  display: block;
  aspect-ratio: 16 / 10;
  background: var(--nx-border-soft);
  overflow: hidden;
}
.nx-post-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 280ms ease;
}
.nx-post-card:hover .nx-post-card__media img,
.nx-post-card__media:hover img { transform: scale(1.04); }

.nx-post-card__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: var(--nx-space-3);
  padding: var(--nx-space-4);
}

.nx-post-card__title {
  font-size: 1rem;
  line-height: 1.3;
  margin: 0;
  letter-spacing: -0.005em;
}
.nx-post-card__title a { color: var(--nx-text); }
.nx-post-card__title a:hover { color: var(--nx-accent); text-decoration: none; }

.nx-post-card__excerpt {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--nx-text-muted);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.nx-post-card__meta {
  margin-top: auto;
  padding-top: var(--nx-space-3);
  border-top: 1px solid var(--nx-border-soft);
  font-size: 0.75rem;
  color: var(--nx-text-muted);
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

@media (min-width: 640px) {
  .nx-post-card {
    border: 1px solid var(--nx-border);
    border-radius: var(--nx-radius);
    overflow: hidden;
    box-shadow: var(--nx-shadow);
    transition: box-shadow 200ms ease, transform 200ms ease;
  }
  .nx-post-card:hover { transform: translateY(-3px); box-shadow: var(--nx-shadow-hover); }
  .nx-grid > .nx-post-card + .nx-post-card { border-top: 1px solid var(--nx-border); }
}

/* Placeholder para posts sem featured image */
.nx-thumb-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--nx-header-a), var(--nx-header-b));
  opacity: 0.85;
}

/* Botão com seta */
.nx-btn--arrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.nx-btn--arrow::after {
  content: "→";
  font-size: 1.05em;
  line-height: 1;
  transition: transform 160ms ease;
}
.nx-btn--arrow:hover::after { transform: translateX(3px); }

/* ============================================================
   Footer
   ============================================================ */
.nx-footer {
  margin-top: var(--nx-space-10);
  padding-block: var(--nx-space-8);
  background: var(--nx-footer-bg);
  color: var(--nx-footer-text);
  border-top: 1px solid var(--nx-border);
  font-size: 0.8125rem;
}

.nx-footer__inner {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--nx-space-6);
  text-align: left;
  padding-inline: var(--nx-space-5);
}

@media (min-width: 768px) {
  .nx-footer__inner { padding-inline: var(--nx-space-4); }
}

/* Logotipo (col. Sobre) */
.nx-footer__brand {
  display: inline-flex;
  align-items: center;
}
.nx-footer__brand .custom-logo-link,
.nx-footer__brand .nx-footer__brand-text {
  display: inline-flex;
  align-items: center;
  color: var(--nx-footer-text-strong);
  text-decoration: none;
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: -0.03em;
}
.nx-footer__brand img,
.nx-footer__brand .custom-logo {
  display: block;
  height: 36px;
  width: auto;
  max-width: 220px;
  object-fit: contain;
}

/* Texto "Sobre" */
.nx-footer__about {
  margin: 0;
  max-width: 360px;
  font-size: 0.8125rem;
  line-height: 1.6;
  color: var(--nx-footer-text);
}

/* Colunas: empilhadas no mobile; 4 colunas com proporção tipo "magazine" no desktop */
.nx-footer__cols {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--nx-space-8) var(--nx-space-6);
  text-align: left;
}

@media (min-width: 640px) {
  .nx-footer__cols { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .nx-footer__cols {
    grid-template-columns: 1.4fr 1fr 0.9fr 1.2fr;
    align-items: start;
  }
}

.nx-footer__col {
  display: flex;
  flex-direction: column;
  gap: var(--nx-space-3);
  min-width: 0;
}

.nx-footer__col-title {
  font-size: 0.9375rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--nx-footer-text-strong);
  margin: 0;
}

/* Lista de links (institucional / categorias) — vertical */
.nx-footer__menu-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.nx-footer__menu-list li { margin: 0; }
.nx-footer__menu-list a {
  display: inline-block;
  padding: 4px 0;
  color: var(--nx-footer-text);
  font-weight: 500;
  line-height: 1.4;
  transition: color 120ms ease;
}
.nx-footer__menu-list a:hover {
  color: var(--nx-accent);
  text-decoration: none;
}
.nx-footer__menu-list .current-menu-item > a,
.nx-footer__menu-list .current_page_item > a {
  color: var(--nx-accent);
}

/* Posts recentes — links em cor de destaque, 2 linhas */
.nx-footer__posts {
  display: flex;
  flex-direction: column;
  gap: var(--nx-space-3);
}
.nx-footer__post-link {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  color: var(--nx-accent);
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.45;
  transition: color 120ms ease;
}
.nx-footer__post-link:hover { color: var(--nx-text); text-decoration: none; }

/* Compliance — texto pequeno legível */
.nx-footer__compliance {
  margin: 0;
  padding-top: var(--nx-space-5);
  border-top: 1px solid var(--nx-border);
  width: 100%;
  font-size: 0.75rem;
  line-height: 1.6;
  color: var(--nx-footer-text);
}

/* Barra inferior — copyright */
.nx-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--nx-space-3);
  padding-top: var(--nx-space-5);
  border-top: 1px solid var(--nx-border);
}
.nx-footer__copy {
  margin: 0;
  font-size: 0.75rem;
  color: var(--nx-footer-text);
}

/* ============================================================
   Bloco do operador (conformidade) — footer legal
   Resolve "operador não identificado": razão social, CNPJ e
   endereço da entidade responsável, exibidos no rodapé legal.
   ============================================================ */
.nx-footer__operator {
  width: 100%;
  max-width: 720px;
  margin: 0;
  padding-top: var(--nx-space-5);
  border-top: 1px solid var(--nx-footer-hover-bg);
  font-size: 0.75rem;
  line-height: 1.6;
  color: var(--nx-footer-text);
}
.nx-footer__operator-name {
  display: block;
  font-weight: 700;
  color: var(--nx-footer-text-strong);
  letter-spacing: 0.01em;
}
.nx-footer__operator-line { display: block; }
.nx-footer__operator-line + .nx-footer__operator-line { margin-top: 2px; }

/* ============================================================
   Disclosure de afiliados (conformidade)
   Aviso reutilizável: shortcode [nexus_affiliate_disclosure] e
   slot automático no topo do single (controlado pelo Customizer).
   ============================================================ */
.nx-affiliate {
  display: flex;
  align-items: flex-start;
  gap: var(--nx-space-3);
  margin: 0 0 var(--nx-space-5);
  padding: var(--nx-space-3) var(--nx-space-4);
  background: color-mix(in srgb, var(--nx-accent) 7%, var(--nx-bg));
  border: 1px solid color-mix(in srgb, var(--nx-accent) 22%, transparent);
  border-radius: var(--nx-radius);
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--nx-text);
}
.nx-affiliate__icon {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  color: var(--nx-accent);
}
.nx-affiliate__icon svg { width: 100%; height: 100%; display: block; }
.nx-affiliate__text { margin: 0; }
.nx-affiliate__text strong { font-weight: 700; }
/* Variante inline dentro do corpo do post (via shortcode) */
.nx-post__content .nx-affiliate { margin-top: 1.4em; margin-bottom: 1.4em; }

/* ============================================================
   E-E-A-T — credenciais do autor
   Estende o bloco .nx-author com cargo/credencial e links.
   ============================================================ */
.nx-author__role {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--nx-accent);
  margin: 0;
}
.nx-author__socials {
  display: flex;
  flex-wrap: wrap;
  gap: var(--nx-space-2);
  margin-top: var(--nx-space-2);
}
.nx-author__social {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px;
  border-radius: var(--nx-radius-pill);
  background: var(--nx-bg);
  border: 1px solid var(--nx-border-soft);
  font-size: 0.75rem;
  color: var(--nx-text-muted);
  transition: border-color 120ms ease, color 120ms ease;
}
.nx-author__social:hover {
  border-color: var(--nx-border);
  color: var(--nx-accent);
  text-decoration: none;
}

/* Cabeçalho do arquivo de autor (author.php) */
.nx-author-hero {
  display: flex;
  align-items: center;
  gap: var(--nx-space-4);
  background: var(--nx-surface);
  padding: var(--nx-space-5);
}
.nx-author-hero__avatar {
  flex-shrink: 0;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--nx-border-soft);
}
.nx-author-hero__avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.nx-author-hero__name { font-size: 1.375rem; line-height: 1.2; margin: 0; letter-spacing: -0.015em; }
.nx-author-hero__role { font-size: 0.8125rem; font-weight: 600; color: var(--nx-accent); margin: 2px 0 0; }
.nx-author-hero__bio { margin: var(--nx-space-2) 0 0; font-size: 0.9375rem; color: var(--nx-text-muted); line-height: 1.5; }
@media (min-width: 768px) {
  .nx-author-hero {
    background: transparent;
    padding: var(--nx-space-6) 0 var(--nx-space-5);
  }
  .nx-author-hero__avatar { width: 88px; height: 88px; }
  .nx-author-hero__name { font-size: 1.75rem; }
}

/* ============================================================
   Banner de consentimento (LGPD/GDPR) — gateia o GTM
   JS mínimo (functions.php) grava a escolha em localStorage e
   só então injeta o GTM. Markup no header.php.
   ============================================================ */
.nx-consent {
  position: fixed;
  left: 50%;
  bottom: 16px;
  transform: translateX(-50%);
  z-index: 1000;
  width: calc(100% - 24px);
  max-width: 680px;
  display: none;            /* exibido via JS quando não há escolha salva */
  flex-direction: column;
  gap: var(--nx-space-3);
  padding: var(--nx-space-4) var(--nx-space-5);
  background: var(--nx-surface);
  color: var(--nx-text);
  border: 1px solid var(--nx-border);
  border-radius: var(--nx-radius);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.08);
}
.nx-consent.is-visible { display: flex; }
.nx-consent__text { margin: 0; font-size: 0.8125rem; line-height: 1.55; color: var(--nx-text-muted); }
.nx-consent__text a { font-weight: 600; }
.nx-consent__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--nx-space-2);
  justify-content: flex-end;
}
.nx-consent__btn {
  padding: 8px 16px;
  border-radius: var(--nx-radius);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid var(--nx-border);
  background: var(--nx-surface);
  color: var(--nx-text);
  transition: filter 120ms ease, background-color 120ms ease;
}
.nx-consent__btn--accept {
  background: var(--nx-accent);
  border-color: var(--nx-accent);
  color: #fff;
}
.nx-consent__btn--accept:hover { filter: brightness(0.94); }
.nx-consent__btn--reject:hover { background: var(--nx-bg); }
@media (min-width: 560px) {
  .nx-consent { flex-direction: row; align-items: center; }
  .nx-consent__text { flex: 1; }
  .nx-consent__actions { flex-shrink: 0; }
}

/* ============================================================
   "Sobre" parametrizável (template-sobre.php)
   ============================================================ */
.nx-about__lead {
  font-size: 1.1875rem;
  line-height: 1.55;
  font-weight: 500;
  color: var(--nx-text);
  margin: 0 0 1.4em;
}
@media (min-width: 768px) {
  .nx-about__lead { font-size: 1.3125rem; }
}
.nx-about__facts {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--nx-space-3);
  margin: var(--nx-space-6) 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 640px) {
  .nx-about__facts { grid-template-columns: repeat(2, 1fr); }
}
.nx-about__fact {
  padding: var(--nx-space-4);
  background: var(--nx-bg);
  border: 1px solid var(--nx-border-soft);
  border-radius: var(--nx-radius);
}
.nx-about__fact-label {
  display: block;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--nx-accent);
  margin-bottom: 4px;
}
.nx-about__fact-value { font-size: 0.9375rem; color: var(--nx-text); }