/*
 * AEOMaps Core — Folha de estilo da casca visual (Atlas Editorial)
 * ---------------------------------------------------------------
 * Origem: tokens e componentes extraídos FIELMENTE do HTML aprovado
 * (aeomaps-core2-real.html). Nenhum valor visual foi alterado; este
 * arquivo apenas reorganiza o bloco <style> aprovado numa folha externa
 * (critério canônico: "sem CSS inline").
 *
 * As fontes (Fraunces, Inter, IBM Plex Mono) são carregadas pelo módulo
 * de assets via Google Fonts, exatamente como no HTML aprovado.
 *
 * @package AEOMaps_Core
 * @since   0.12.0
 */

/* ============================================================
 * 1 · TOKENS (:root) — paleta, tipografia, medidas
 * ============================================================ */
:root{
  --bg:#FCFCFB;
  --ink:#15201B;
  --muted:#6A766F;
  --faint:#9AA49E;
  --line:#EAEDE9;
  --green:#16B07A;
  --green-deep:#0E8C60;
  --green-soft:#E9F7F0;
  --night:#0E1613;
  --serif:"Fraunces",Georgia,serif;
  --sans:"Inter",system-ui,sans-serif;
  --mono:"IBM Plex Mono",monospace;
  --max:1080px;
}

/* ============================================================
 * 2 · BASE
 * ============================================================ */
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
.wrap{max-width:var(--max);margin:0 auto;padding:0 32px}

/* ============================================================
 * 3 · CHROME — status bar, ticker, header, footer
 * ============================================================ */
.status{background:var(--night);color:rgba(255,255,255,.86);font-size:13px;text-align:center;padding:11px 16px}
.status .dot{color:var(--green);margin-right:7px}
.status .sep{color:rgba(255,255,255,.28);margin:0 16px}

.ticker{background:#0A110E;border-bottom:1px solid rgba(255,255,255,.06);overflow:hidden;white-space:nowrap}
.ticker .track{display:inline-flex;gap:40px;padding:10px 0;font-family:var(--mono);font-size:11.5px;color:rgba(255,255,255,.5);animation:tick 28s linear infinite}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ticker .it{display:inline-flex;align-items:center;gap:8px}
.ticker .it .d{width:6px;height:6px;border-radius:50%;background:var(--green)}
.ticker .it.warn .d{background:#E0A33A}

header{border-bottom:1px solid var(--line);background:var(--bg);position:sticky;top:0;z-index:50}
.hbar{display:flex;align-items:center;height:72px;max-width:var(--max);margin:0 auto;padding:0 32px;gap:30px}
.logo{font-weight:800;font-size:23px;letter-spacing:-.02em;cursor:pointer}
.logo .a{color:var(--ink)}
.logo .m{color:var(--green)}
nav{display:flex;gap:24px;font-size:14.5px;font-weight:500;color:var(--muted);margin-left:18px;flex-wrap:wrap}
nav span{cursor:pointer}
nav span:hover{color:var(--ink)}
nav span.on{color:var(--ink);font-weight:600}
.hs{flex:1}

footer{background:var(--night);color:rgba(255,255,255,.62);padding:60px 0 0;margin-top:80px}
.fg{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:40px;max-width:var(--max);margin:0 auto;padding:0 32px 28px}
.flogo{font-weight:800;font-size:22px;margin-bottom:14px}
.flogo .m{color:var(--green)}
.fnote{font-size:14px;line-height:1.6;color:rgba(255,255,255,.5);max-width:300px}
.fprep{font-family:var(--mono);font-size:12px;color:rgba(255,255,255,.45);margin-top:16px}
.fprep b{color:var(--green);font-weight:500;display:block;letter-spacing:.1em;margin-bottom:4px;font-size:10px}
.fc h4{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--green);margin-bottom:14px}
.fc a{display:block;font-size:14px;padding:5px 0;color:rgba(255,255,255,.62);cursor:pointer}
.fb{border-top:1px solid rgba(255,255,255,.08);max-width:var(--max);margin:0 auto;padding:20px 32px;font-family:var(--mono);font-size:11.5px;color:rgba(255,255,255,.38);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}

/* ============================================================
 * 4 · BOTÕES
 * ============================================================ */
.btn{font-weight:600;font-size:14px;border-radius:10px;padding:11px 18px;display:inline-flex;align-items:center;gap:8px;cursor:pointer;border:0}
.btn-green{background:var(--green);color:#fff;box-shadow:0 6px 16px -8px rgba(22,176,122,.5)}
.btn-ghost{border:1px solid var(--line);color:var(--ink);background:#fff}

/* ============================================================
 * 5 · BREADCRUMB
 * ============================================================ */
.crumb{font-family:var(--sans);font-size:13px;color:var(--muted);padding:26px 0 0;display:flex;gap:8px;flex-wrap:wrap}
.crumb a{cursor:pointer}
.crumb a:hover{color:var(--green-deep)}
.crumb .sep{color:var(--faint)}
.crumb .here{color:var(--ink);font-weight:500}

/* ============================================================
 * 6 · TIPOGRAFIA E SEÇÕES
 * ============================================================ */
.eyebrow{font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--green-deep)}
h1{font-family:var(--serif);font-weight:600;line-height:1.08;letter-spacing:-.015em}
.sec{padding:72px 0}
.sec.tight{padding:48px 0}
h2.sec-t{font-family:var(--serif);font-weight:600;font-size:34px;line-height:1.18;letter-spacing:-.01em;margin:14px 0 0}
.center{text-align:center}
.sub{font-size:18px;line-height:1.65;color:var(--muted)}

/* ============================================================
 * 7 · CARDS, CHIPS, BADGES, LINKS
 * ============================================================ */
.card{background:#fff;border:1px solid var(--line);border-radius:16px}
.shadow{box-shadow:0 24px 60px -36px rgba(15,32,27,.28),0 8px 20px -16px rgba(15,32,27,.16)}
.chip{font-family:var(--sans);font-size:12px;color:var(--muted);background:#fff;border:1px solid var(--line);border-radius:40px;padding:5px 12px;display:inline-block}
.chip.sem{border-style:dashed}
.chip.on{background:var(--green-soft);border-color:rgba(22,176,122,.3);color:var(--green-deep);font-weight:600}
.badge{display:inline-flex;align-items:center;gap:9px;background:var(--green-soft);color:var(--green-deep);font-weight:600;font-size:13.5px;padding:8px 17px;border-radius:40px;border:1px solid rgba(22,176,122,.2)}
.badge .d{width:7px;height:7px;border-radius:50%;background:var(--green)}
.lk{font-size:14px;font-weight:600;color:var(--green-deep);cursor:pointer}

/* ============================================================
 * 8 · FAIXAS E RÓTULOS
 * ============================================================ */
.tag{background:var(--green-deep);color:#fff;font-size:12px;text-align:center;padding:7px}
.pagelabel{background:#fff;border:1px solid var(--line);border-bottom:0;font-family:var(--mono);font-size:11px;color:var(--green-deep);text-align:center;padding:6px;letter-spacing:.06em}

/* ============================================================
 * 9 · GRIDS E STATBAR
 * ============================================================ */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.statbar{display:grid;grid-template-columns:repeat(3,1fr)}
.statbar .s{padding:28px 26px;border-right:1px solid var(--line)}
.statbar .s:last-child{border-right:0}
.statn{font-family:var(--serif);font-size:46px;font-weight:600;line-height:1}
.statl{font-size:14px;color:var(--muted);margin-top:10px}

/* ============================================================
 * 10 · FAQ (accordion <details>)
 * ============================================================ */
details.faq{border-bottom:1px solid var(--line);padding:0}
details.faq summary{list-style:none;cursor:pointer;padding:18px 0;font-family:var(--serif);font-size:18px;font-weight:600;display:flex;justify-content:space-between;gap:16px}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";color:var(--green-deep);font-family:var(--sans);font-weight:400}
details.faq[open] summary::after{content:"\2013"}
details.faq p{padding:0 0 18px;color:var(--muted);font-size:15px;line-height:1.6}

/* ============================================================
 * 11 · PROSE (corpo de artigo)
 * ============================================================ */
.prose p{font-size:17px;line-height:1.75;margin-bottom:18px;color:var(--ink)}
.prose h2{font-family:var(--serif);font-size:24px;font-weight:600;margin:32px 0 12px}
.prose h3{font-family:var(--serif);font-size:19px;font-weight:600;margin:22px 0 8px}

/* Ritmo de leitura — SOMENTE artigo (single-conteudo, .prose-artigo). Aditivo; não altera .prose global (Tema/Especialista/Sobre intactos). */
.prose-artigo p{margin-bottom:22px}
.prose-artigo h2{font-weight:700;margin:48px 0 16px}
.prose-artigo h3{font-weight:700;margin:36px 0 12px}
.prose-artigo ul,.prose-artigo ol{margin:0 0 22px;padding-left:24px}
.prose-artigo li{font-size:17px;line-height:1.7;margin-bottom:8px}
.prose-artigo a{color:var(--green-deep);text-decoration:underline;text-underline-offset:2px}
.prose-artigo table{width:100%;border-collapse:collapse;font-size:15px;margin:0 0 22px}
.prose-artigo th,.prose-artigo td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--line);vertical-align:top}
.prose-artigo th{font-weight:700}
.prose-artigo h2:first-child,.prose-artigo h3:first-child,.prose-artigo p:first-child{margin-top:0}
@media(max-width:820px){
  .prose-artigo table{display:block;overflow-x:auto;white-space:nowrap}
}

/* ============================================================
 * 12 · TABELA
 * ============================================================ */
.tbl{width:100%;border-collapse:collapse;font-size:14px;margin-top:8px}
.tbl th,.tbl td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line)}
.tbl th{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:var(--muted);text-transform:uppercase}

/* ============================================================
 * 13 · RESPONSIVO (mobile-first breakpoint do HTML aprovado)
 * ============================================================ */
@media(max-width:820px){
  .grid3,.grid2,.statbar{grid-template-columns:1fr}
  .fg{grid-template-columns:1fr 1fr}
  nav{display:none}
}