/* =========================================================
   HEADER / NAV (menu único — desktop e mobile compartilham o mesmo DOM)
   ========================================================= */
.site-header {
  border-bottom: 1px solid var(--color-border);
  position: sticky;
  top: 0;
  background: var(--color-bg);
  z-index: 50;
}
.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: var(--space-2);
  gap: var(--space-3);
}
.menu-toggle {
  display: flex;
  flex-direction: column;
  gap: 4px;
  background: none;
  border: none;
  min-width: var(--touch-target);
  min-height: var(--touch-target);
}
.menu-toggle__bar { width: 22px; height: 2px; background: var(--color-text); }

.primary-nav {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--color-bg);
  border-bottom: 1px solid var(--color-border);
}
body.nav-open .primary-nav { display: block; }
.primary-nav__list { list-style: none; margin: 0; padding: var(--space-3); }
.primary-nav__list li { border-bottom: 1px solid var(--color-border); }
.primary-nav__list a {
  display: block;
  padding: var(--space-3) 0;
  color: var(--color-text);
  min-height: var(--touch-target);
}

@media (min-width: 1024px) {
  .menu-toggle { display: none; }
  .primary-nav { display: block; position: static; border: none; }
  .primary-nav__list { display: flex; gap: var(--space-4); padding: 0; }
  .primary-nav__list li { border: none; }
  .primary-nav__list a { padding: 0; min-height: auto; }
}

/* =========================================================
   BREADCRUMBS
   ========================================================= */
.breadcrumbs {
  font-size: var(--fs-small);
  color: var(--color-text-muted);
  padding-block: var(--space-3);
}
.breadcrumbs a { color: var(--color-text-muted); }

/* =========================================================
   CARDS
   ========================================================= */
.archive-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
  padding-block: var(--space-4);
}
@media (min-width: 768px) {
  .archive-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 1024px) {
  .archive-grid { grid-template-columns: repeat(3, 1fr); }
}
.post-card__link { color: inherit; }
.post-card__link:hover { text-decoration: none; }
.post-card__thumb { aspect-ratio: 3 / 2; overflow: hidden; border-radius: var(--radius); }
.post-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.post-card__eyebrow {
  font-size: var(--fs-small);
  color: var(--color-primary-dark);
  text-transform: uppercase;
  font-weight: 600;
}
.post-card__title { font-size: 1.05rem; margin: var(--space-1) 0; }
.post-card__excerpt { font-size: var(--fs-small); color: var(--color-text-muted); }
.post-card__meta { font-size: var(--fs-small); color: var(--color-text-muted); }

/* =========================================================
   HERO (destaque da home)
   ========================================================= */
.hero-post { margin-block: var(--space-4); }
.hero-post__link { color: inherit; }
.hero-post img { border-radius: var(--radius); aspect-ratio: 16/9; object-fit: cover; }
.hero-post__body { padding-block: var(--space-3); }

/* =========================================================
   EDITORIA (seções da home)
   ========================================================= */
.editorial-section { margin-block: var(--space-6); }
.editorial-section__header { display: flex; align-items: baseline; justify-content: space-between; }
.editorial-section__veja-mais { font-size: var(--fs-small); white-space: nowrap; }

/* =========================================================
   ARTIGO
   ========================================================= */
.entry-header { padding-block: var(--space-3); }
.entry-eyebrow {
  display: inline-block;
  font-size: var(--fs-small);
  font-weight: 600;
  color: var(--color-primary-dark);
  text-transform: uppercase;
  margin-bottom: var(--space-2);
}
.entry-meta { font-size: var(--fs-small); color: var(--color-text-muted); display: flex; flex-wrap: wrap; gap: var(--space-1); }
.entry-thumbnail { margin-block: var(--space-4); }
.entry-thumbnail img { border-radius: var(--radius); width: 100%; aspect-ratio: 16/9; object-fit: cover; }

/* =========================================================
   ENTREVISTA — box "Quem é / Por que importa" + citações
   ========================================================= */
.box-entrevistado {
  max-width: var(--content-max-width);
  margin: var(--space-4) auto;
  padding: var(--space-4);
  background: var(--color-bg-alt);
  border-left: 4px solid var(--color-primary);
  border-radius: var(--radius);
}
.box-entrevistado__label {
  font-size: var(--fs-small);
  text-transform: uppercase;
  font-weight: 700;
  color: var(--color-primary-dark);
  margin: 0 0 var(--space-1);
}
.box-entrevistado__nome { font-size: 1.1rem; font-weight: 700; margin: 0 0 var(--space-2); }
.box-entrevistado__cargo { font-weight: 400; color: var(--color-text-muted); }
.box-entrevistado__contexto { margin: 0; color: var(--color-text-muted); }

/* Respostas do entrevistado — usar blockquote no editor para cada resposta */
.entry-content blockquote {
  margin: var(--space-4) 0;
  padding: var(--space-2) var(--space-4);
  border-left: 3px solid var(--color-accent);
  font-size: var(--fs-body-lg);
  font-style: italic;
  color: var(--color-text);
}
.entry-content blockquote p:last-child { margin-bottom: 0; }

/* =========================================================
   CANNATECA — biblioteca multimídia
   ========================================================= */
.cannateca-subnav {
  position: sticky;
  top: 57px; /* logo abaixo do header sticky */
  background: var(--color-bg);
  border-bottom: 1px solid var(--color-border);
  z-index: 40;
  overflow-x: auto;
}
.cannateca-subnav__inner {
  display: flex;
  gap: var(--space-4);
  padding-block: var(--space-2);
  white-space: nowrap;
}
.cannateca-subnav a {
  color: var(--color-text);
  font-weight: 600;
  font-size: var(--fs-small);
  padding: var(--space-1) 0;
}
.cannateca-content { padding-top: var(--space-4); }

/* CTA "Siga a Cannalize" */
.social-follow-cta {
  background: var(--color-bg-alt);
  padding-block: var(--space-3);
  margin-bottom: var(--space-4);
}
.social-follow-cta__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
}
.social-follow-cta__label { font-weight: 700; margin: 0; white-space: nowrap; }
.social-follow-cta__links { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.social-follow-cta__link {
  background: var(--color-primary);
  color: #fff;
  padding: var(--space-1) var(--space-3);
  border-radius: 999px;
  font-size: var(--fs-small);
  font-weight: 600;
  min-height: var(--touch-target);
  display: inline-flex;
  align-items: center;
}
.social-follow-cta__link:hover { background: var(--color-primary-dark); text-decoration: none; }
/* Trava qualquer bloco "largura larga/total" dentro da Cannateca —
   mesmo que o alinhamento seja esquecido no editor, nada estoura a coluna. */
.cannateca-content .alignwide,
.cannateca-content .alignfull {
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
}
/* O primeiro título logo abaixo da nav não precisa do respiro extra de 48px */
.cannateca-content > h2:first-child,
.cannateca-content > *:first-child h2 {
  margin-top: 0;
}
/* Sub-rótulos de playlist/agrupamento (se usados como H2 seguidos, sem
   parágrafo entre eles) ficam mais compactos — reduz o espaçamento padrão
   de título só quando um H2 vem logo depois de outro H2. */
.cannateca-content h2 + h2 {
  margin-top: var(--space-2);
}

/* Vídeos e redes sociais — cada embed vira um card centralizado.
   YouTube/TikTok (vídeo, 16:9 ou 9:16) usam o wrapper responsivo nativo
   do WP (theme support 'responsive-embeds'). Instagram/TikTok/LinkedIn
   têm largura intrínseca própria — apenas centralizamos e limitamos. */
.cannateca-content .wp-block-embed {
  margin-bottom: var(--space-4);
}
.cannateca-content .wp-block-embed iframe,
.cannateca-content .wp-block-embed__wrapper {
  border-radius: var(--radius);
  overflow: hidden;
}
.cannateca-content .wp-block-embed-instagram .wp-block-embed__wrapper,
.cannateca-content .wp-block-embed-tiktok .wp-block-embed__wrapper {
  max-width: 400px;
  margin-inline: auto;
}
/* LinkedIn via bloco HTML personalizado — mesmo tratamento visual */
.cannateca-content .wp-block-html iframe {
  border-radius: var(--radius);
  margin-inline: auto;
}

/* Podcasts (Spotify) — altura fixa do player, só centraliza e limita largura */
.cannateca-content .wp-block-embed-spotify {
  margin-bottom: var(--space-3);
}
.cannateca-content .wp-block-embed-spotify iframe {
  width: 100%;
  max-width: 500px;
  margin-inline: auto;
}

/* E-books com captação de lead */
.ebooks-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-4);
  margin-block: var(--space-4);
}
@media (min-width: 768px) {
  .ebooks-grid { grid-template-columns: repeat(2, 1fr); }
}
.ebooks-grid > * {
  background: var(--color-bg-alt);
  border-radius: var(--radius);
  padding: var(--space-3);
}
.ebooks-grid img {
  border-radius: var(--radius);
  margin-bottom: var(--space-2);
  aspect-ratio: 3/4;
  object-fit: cover;
}
.ebooks-grid h3 { margin-top: 0; }
/* Formulário do plugin (Fluent Forms/WPForms) herda a tipografia do tema */
.ebooks-grid form input,
.ebooks-grid form button {
  width: 100%;
  margin-top: var(--space-2);
}

/* Glossário — layout de dicionário em 2 colunas no desktop */
.glossario-grid {
  margin-block: var(--space-4);
}
.glossario-grid h3 {
  color: var(--color-primary-dark);
  margin-top: var(--space-4);
  margin-bottom: var(--space-1);
  font-size: 1.05rem;
}
.glossario-grid p { color: var(--color-text-muted); margin-bottom: 0; }
@media (min-width: 768px) {
  .glossario-grid { column-count: 2; column-gap: var(--space-5); }
  .glossario-grid > * { break-inside: avoid; }
}

/* Downloads (infográficos, PDFs, guias) — cards em grade */
.downloads-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
  margin-block: var(--space-4);
}
@media (min-width: 768px) {
  .downloads-grid { grid-template-columns: repeat(2, 1fr); }
}
.downloads-grid .wp-block-file {
  background: var(--color-bg-alt);
  border-radius: var(--radius);
  padding: var(--space-3);
  margin: 0;
}
.downloads-grid .wp-block-file a.wp-block-file__button {
  background: var(--color-primary);
  color: #fff;
  border-radius: var(--radius);
  padding: var(--space-1) var(--space-3);
  min-height: var(--touch-target);
  display: inline-flex;
  align-items: center;
}

.box-fontes, .box-autor, .related-posts, .box-faq {
  max-width: var(--content-max-width);
  margin: var(--space-6) auto;
  padding: var(--space-4);
  background: var(--color-bg-alt);
  border-radius: var(--radius);
}
/* Zera a margem-topo global de h2/h3 dentro dos boxes — eles já têm padding próprio */
.box-fontes h2, .box-autor h2, .related-posts h2, .box-faq h2 {
  margin-top: 0;
}
.box-autor { display: flex; gap: var(--space-3); align-items: flex-start; }
.box-autor img { border-radius: 50%; }
.box-autor__nome { font-weight: 700; margin: 0 0 var(--space-1); }
.box-autor__credenciais { font-weight: 400; color: var(--color-text-muted); }
.entry-verificado { max-width: var(--content-max-width); margin: var(--space-3) auto; font-size: var(--fs-small); color: var(--color-text-muted); }

/* =========================================================
   DISCLOSURE DE PUBLIEDITORIAL
   ========================================================= */
.sponsored-disclosure {
  font-size: var(--fs-small);
  color: var(--color-text-muted);
  background: var(--color-bg-alt);
  border-left: 3px solid var(--color-accent);
  padding: var(--space-2) var(--space-3);
  margin-top: var(--space-2);
  max-width: var(--content-max-width);
}

/* =========================================================
   FAQ (accordion nativo via <details>/<summary>)
   ========================================================= */
.box-faq__item {
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  padding: var(--space-3);
  margin-bottom: var(--space-2);
}
.box-faq__item summary {
  cursor: pointer;
  font-weight: 700;
  min-height: var(--touch-target);
  display: flex;
  align-items: center;
}
.box-faq__item p { margin-top: var(--space-2); margin-bottom: 0; color: var(--color-text-muted); }

.related-posts__grid { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-3); }
.related-posts__grid a { color: inherit; display: block; }
.related-posts__grid img { border-radius: var(--radius); aspect-ratio: 3/2; object-fit: cover; margin-bottom: var(--space-1); }

/* =========================================================
   CTA — regra de negócio: no máximo 1 acima da dobra
   ========================================================= */
.cta-box {
  background: var(--color-primary);
  color: #fff;
  border-radius: var(--radius);
  padding: var(--space-3) var(--space-4);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  margin-block: var(--space-4);
}
.cta-box a.button { background: #fff; color: var(--color-primary-dark); font-weight: 700; }

/* =========================================================
   ARCHIVE / CATEGORY HEADER
   ========================================================= */
.archive-header { padding-block: var(--space-4); }
.archive-intro { color: var(--color-text-muted); max-width: 68ch; }

/* =========================================================
   TABELAS (ex: tabela de detecção do THC) — responsivas
   ========================================================= */
.entry-content table { width: 100%; border-collapse: collapse; overflow-x: auto; display: block; }
.entry-content th, .entry-content td { border: 1px solid var(--color-border); padding: var(--space-2); text-align: left; }

.sr-only {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap;
}