/*
 * Autor.ia — blog.css (Fase 2)
 * Layout específico do índice/categoria/post do blog. Enqueue condicional:
 * is_home() (posts page) || is_category() || is_single().
 * Templates reais (home.php/category.php/single.php) chegam na Fase 8 — esta
 * folha só prepara as classes para não bloquear aquela fase.
 */

/* ── BREADCRUMB ────────────────────────────────────────────────────────── */
.au-breadcrumb { font: 500 12.5px var(--font-ui); color: var(--fg-muted); margin-bottom: 20px; }
.au-breadcrumb a { color: var(--fg-muted); }
.au-breadcrumb a:hover { color: var(--cyan-light); }
.au-breadcrumb__sep { margin: 0 8px; }
.au-breadcrumb__current { color: var(--fg-secondary); }

/* ── HEADER DE CATEGORIA (ícone + label) ──────────────────────────────── */
.au-cat-icon-row { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; }
.au-cat-icon { width: 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center; }
.au-cat-icon--cobre   { background: rgba(196,120,74,.12); color: var(--copper-400); }
.au-cat-icon--cyan    { background: rgba(6,182,212,.1);   color: var(--cyan-light); }
.au-cat-icon--lavanda { background: rgba(161,150,202,.15);color: var(--lavender-300); }
.au-cat-label { font: 700 11px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; }
.au-cat-label--cobre   { color: var(--copper-400); }
.au-cat-label--cyan    { color: var(--cyan-light); }
.au-cat-label--lavanda { color: var(--lavender-300); }

/* ── POST EM DESTAQUE (índice do blog) ────────────────────────────────── */
.au-post-destaque { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 24px; background: var(--bg-surface); border: 1px solid rgba(6,182,212,.3); border-radius: 18px; padding: 30px 32px; transition: all .25s cubic-bezier(.16,1,.3,1); text-decoration: none; color: inherit; }
.au-post-destaque:hover { border-color: rgba(6,182,212,.55); transform: translateY(-2px); box-shadow: 0 16px 34px rgba(0,0,0,.24); }
@media (max-width: 700px) { .au-post-destaque { grid-template-columns: 1fr; } }
.au-post-destaque__eyebrow { font: 700 9.5px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--copper-400); }
.au-post-destaque__title { font: 700 20px var(--font-display); color: var(--fg-primary); margin-top: 6px; }
.au-post-destaque__meta { margin-top: 8px; font: 500 11px var(--font-mono); letter-spacing: .04em; color: var(--fg-muted); }

/* ── FILTRO (pills de categoria) ───────────────────────────────────────── */
.au-filter-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 36px; }
.au-filter-pill { border: 1px solid rgba(8,145,178,.25); cursor: pointer; font: 600 12px var(--font-ui); padding: 9px 16px; border-radius: 999px; background: transparent; color: var(--fg-secondary); transition: all .15s; }
.au-filter-pill:hover { border-color: var(--cyan); color: var(--cyan-light); }
.au-filter-pill:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.au-filter-pill[aria-pressed="true"] { background: rgba(6,182,212,.15); color: var(--cyan-light); border-color: rgba(6,182,212,.5); }

/* ── GRID DE POSTS ─────────────────────────────────────────────────────── */
.au-posts-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap: 16px; }
.au-post-card__meta { margin-top: auto; font: 500 10.5px var(--font-mono); letter-spacing: .04em; color: var(--fg-muted); }
.au-post-card__meta--producao { font: 600 9.5px var(--font-mono); letter-spacing: .06em; text-transform: uppercase; }

/* ── NEWSLETTER ────────────────────────────────────────────────────────── */
.au-newsletter-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px; }
.au-newsletter-title { font: 700 15px var(--font-display); color: var(--fg-primary); margin-bottom: 4px; }
.au-newsletter-sub { font: 400 13px var(--font-ui); color: var(--fg-secondary); }
.au-newsletter-form { display: flex; gap: 10px; flex: none; }
.au-newsletter-input { width: 220px; padding: 11px 16px; border-radius: 10px; border: 1px solid var(--border-strong); background: var(--bg-code); color: var(--fg-primary); font: 400 13.5px var(--font-ui); }
.au-newsletter-success { display: flex; align-items: center; gap: 8px; font: 600 13.5px var(--font-ui); color: var(--success); }

/* ── CTA DISCRETO ──────────────────────────────────────────────────────── */
.au-discreet-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; padding: 18px 24px; background: rgba(6,182,212,.05); border: 1px solid rgba(6,182,212,.2); border-radius: 12px; }
.au-discreet-cta a { margin-left: auto; flex: none; font: 600 13px var(--font-ui); color: var(--cyan-light); }

/* ── "COMECE POR AQUI" (pilar fixado, categoria) ──────────────────────── */
.au-pilar-card { background: var(--bg-surface); border: 1px solid rgba(6,182,212,.3); border-radius: 18px; padding: 30px 32px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px; }

/* ── FICHA SEO (categoria — 160px + 1fr) ──────────────────────────────── */
.au-seo-ficha .au-table__row,
.au-seo-ficha .au-table__row--head { grid-template-columns: 160px 1fr; }
.au-seo-ficha .au-table__cell--label { font-size: 11px; }

/* ── POST: corpo + TOC ─────────────────────────────────────────────────── */
.au-post-layout { display: grid; grid-template-columns: 1fr 200px; gap: 56px; align-items: start; }
@media (max-width: 900px) { .au-post-layout { grid-template-columns: 1fr; } }
.au-post-article { min-width: 0; max-width: 680px; }
.au-post-toc { position: sticky; top: 88px; }
.au-post-toc__label { font: 700 10px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--fg-muted); margin-bottom: 14px; }
.au-post-toc__list { display: flex; flex-direction: column; gap: 11px; border-left: 1px solid var(--border-divider); margin: 0; padding: 0; list-style: none; }
.au-post-toc__list a { display: block; padding-left: 14px; font: 500 12.5px/1.4 var(--font-ui); color: var(--fg-secondary); text-decoration: none; }
.au-post-toc__list a:hover, .au-post-toc__list a.active { color: var(--cyan-light); }

/* ── Tabela de normas (140px + 1fr) ───────────────────────────────────── */
.au-normas-table .au-table__row,
.au-normas-table .au-table__row--head { grid-template-columns: 140px 1fr; }
.au-normas-table .au-table__row:not(.au-table__row--head) .au-table__cell { padding: 16px 18px; }
.au-normas-table .au-table__cell--label { font: 700 13px var(--font-mono); }

/* ── Listas "pode" / "não pode" ────────────────────────────────────────── */
.au-lista-pode, .au-lista-naopode { background: var(--bg-surface); border-radius: 14px; padding: 22px 24px; display: flex; flex-direction: column; gap: 12px; }
.au-lista-pode { border: 1px solid var(--border); }
.au-lista-naopode { border: 1px solid rgba(239,68,68,.22); }
.au-lista-pode__item, .au-lista-naopode__item { display: flex; gap: 10px; font: 400 14px/1.6 var(--font-ui); }
.au-lista-pode__item { color: var(--fg-secondary); }
.au-lista-pode__item svg { flex: none; margin-top: 2px; stroke: var(--cyan-light); }
.au-lista-naopode__item { color: var(--fg-secondary); }
.au-lista-naopode__item svg { flex: none; margin-top: 2px; stroke: var(--danger); }

/* ── Box "Na prática" antes/depois ─────────────────────────────────────── */
.au-antes-depois { background: var(--bg-code); border: 1px solid var(--border-divider); border-radius: 14px; padding: 22px 24px; }
.au-antes-depois__label { font: 700 10px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--fg-muted); margin-bottom: 14px; }
.au-antes-depois__row { display: flex; gap: 10px; align-items: baseline; margin-bottom: 10px; }
.au-antes-depois__row:last-child { margin-bottom: 0; }
.au-antes-depois__tag { flex: none; font: 700 10.5px var(--font-mono); }
.au-antes-depois__tag--antes { color: var(--danger); }
.au-antes-depois__tag--depois { color: var(--success); }
.au-antes-depois__text { font: 400 14px/1.6 var(--font-ui); font-style: italic; }
.au-antes-depois__text--antes { color: var(--fg-secondary); }
.au-antes-depois__text--depois { color: var(--fg-primary); }

/* ── Box da autora (E-E-A-T) ───────────────────────────────────────────── */
.au-autora { display: flex; gap: 16px; align-items: flex-start; }
.au-autora__avatar { flex: none; width: 52px; height: 52px; border-radius: 50%; background: linear-gradient(135deg, var(--copper-500), var(--cyan)); display: flex; align-items: center; justify-content: center; font: 700 17px var(--font-display); color: #0A0A10; }
.au-autora__label { margin: 0 0 6px; font: 700 10px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--fg-muted); }
.au-autora__nome { font: 700 16px var(--font-display); color: var(--fg-primary); margin-bottom: 6px; }
.au-autora__bio { margin: 0; max-width: 520px; font: 400 13.5px/1.7 var(--font-ui); color: var(--fg-secondary); }

/* ── Relacionados (pilar + irmãos) ─────────────────────────────────────── */
.au-relacionados__label { margin: 0 0 16px; font: 700 10.5px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--fg-muted); }
.au-relacionados__list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.au-relacionado-card { background: var(--bg-surface); border: 1px solid rgba(6,182,212,.25); border-radius: 12px; padding: 18px 20px; }
.au-relacionado-card--producao { border: 1px dashed rgba(122,160,176,.3); padding: 16px 20px; }
.au-relacionado-card__title { font: 700 14.5px var(--font-display); color: var(--fg-primary); margin-top: 9px; }
.au-relacionado-card--producao .au-relacionado-card__title { font-weight: 600; font-size: 13.5px; color: var(--fg-secondary); margin-top: 8px; }

/* ── Avatar do autor no header do post (SS gradiente) ─────────────────── */
.au-post-author-avatar { flex: none; width: 38px; height: 38px; border-radius: 50%; background: linear-gradient(135deg, var(--copper-500), var(--cyan)); display: flex; align-items: center; justify-content: center; font: 700 13px var(--font-display); color: #0A0A10; }

/* ── Paginação (home.php/category.php via paginate_links, type=list) ──── */
.au-pagination .page-numbers { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.au-pagination .page-numbers li { display: flex; }
.au-pagination a.page-numbers,
.au-pagination span.page-numbers { display: flex; align-items: center; justify-content: center; min-width: 38px; height: 38px; padding: 0 12px; border-radius: 10px; border: 1px solid rgba(8,145,178,.25); color: var(--fg-secondary); font: 600 13px var(--font-ui); text-decoration: none; transition: all .15s; }
.au-pagination a.page-numbers:hover { border-color: var(--cyan); color: var(--cyan-light); }
.au-pagination a.page-numbers:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.au-pagination span.page-numbers.current { background: rgba(6,182,212,.15); color: var(--cyan-light); border-color: rgba(6,182,212,.5); }
.au-pagination .page-numbers.dots { border-color: transparent; }
