/* Páginas institucionais e de conteúdo: guias (SEO), termos, privacidade,
   denúncia, contato, erro, mensagens e painel de uso. O fórum carrega este
   arquivo e o forum.css. */

/* ---------- guias (/converter-enc-para-pdf etc.) ---------- */
.article{max-width:860px;margin:0 auto;padding:var(--space-12) 0 var(--space-16)}
.article-hero{text-align:center;margin-bottom:var(--space-8)}
.article-hero h1{font-size:clamp(var(--text-3xl),5vw,52px);line-height:1.08;letter-spacing:-.025em;
  margin:var(--space-4) 0 0;text-wrap:balance}
.article-hero p{max-width:660px;margin:var(--space-4) auto 0;color:var(--color-text-muted);font-size:var(--text-lg)}
.article-cta{display:flex;justify-content:center;gap:var(--space-3);flex-wrap:wrap;margin-top:var(--space-6)}
.article-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}
.article-section{padding:var(--space-5)}
.article-section h2{font-size:var(--text-lg);margin:0 0 var(--space-2)}
.article-section p{font-size:var(--text-md);color:var(--color-text-muted);margin:0}
.article-faq{margin-top:var(--space-10)}
.article-faq h2,.article-related h2{text-align:center;font-size:var(--text-2xl);margin:0 0 var(--space-5)}
.article-related{margin-top:var(--space-10);padding-top:var(--space-8);border-top:1px solid var(--color-border)}
.article-related .guide-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.article-related .guide-card p{color:var(--color-text-muted);font-size:var(--text-sm);margin:var(--space-2) 0 0}

/* ---------- texto legal / páginas em painel ---------- */
/* O painel fica dentro de .wrap: no celular a calha do .wrap o afasta da borda. */
.legal-page{max-width:820px;margin:var(--space-8) auto var(--space-12);padding:var(--space-8) var(--space-10)}
.legal-page h1{font-size:var(--text-3xl);line-height:var(--leading-tight);letter-spacing:-.02em;
  margin:var(--space-3) 0 0;text-wrap:balance}
.legal-page h2{font-size:var(--text-lg);line-height:1.3;margin:var(--space-8) 0 var(--space-2)}
.legal-page p,.legal-page li{color:var(--color-text);line-height:1.65}
.legal-page p{margin:var(--space-3) 0}
.legal-page ul{margin:var(--space-2) 0;padding-left:var(--space-5)}
.legal-page li{margin:var(--space-1) 0}
.legal-page li::marker{color:var(--color-text-muted)}
.legal-page .lead{font-size:var(--text-lg);color:var(--color-text-muted);margin-top:var(--space-4)}
.legal-page .legal-meta{margin:var(--space-2) 0 0;font-size:var(--text-sm);color:var(--color-text-muted)}
.legal-page .small{color:var(--color-text-muted);line-height:var(--leading-normal)}
.legal-page .notice{margin:var(--space-5) 0}
.legal-page .actions{margin-top:var(--space-6)}
.legal-page .contact-form .actions{margin-top:var(--space-1)}
/* nome e e-mail não precisam de 740px: o formulário fica na medida dos campos */
.contact-page .contact-form{max-width:560px}
.legal-page>.small:last-child{margin-top:var(--space-8);padding-top:var(--space-4);border-top:1px solid var(--color-border)}

/* ---------- caixa de entrada (/mensagens) ---------- */
.msg-list{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-4)}
.msg-item{border:1px solid var(--color-border);border-radius:var(--radius-sm);
  padding:var(--space-4);background:var(--color-surface)}
.msg-head{display:flex;justify-content:space-between;align-items:baseline;
  gap:var(--space-3);flex-wrap:wrap}
.msg-subject{font-size:var(--text-xs);font-weight:var(--weight-bold);color:var(--color-primary-text)}
.msg-head time{font-size:var(--text-xs);color:var(--color-text-muted)}
.msg-from{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-1)}
.msg-from a{color:var(--color-primary);font-weight:var(--weight-semibold)}
.legal-page .msg-body{margin:var(--space-2) 0 0;font-size:var(--text-md);line-height:1.55;white-space:pre-wrap}

/* ---------- painel de uso (/stats) ---------- */
.stat-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-3);margin:var(--space-5) 0}
.stat-card{border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:var(--space-4);
  text-align:center;background:var(--color-surface-muted)}
.stat-card-real{background:var(--color-primary-soft);border-color:var(--color-info-border)}
.stat-num{font-size:var(--text-3xl);font-weight:var(--weight-heavy);letter-spacing:-.02em;color:var(--color-text)}
.stat-lbl{font-size:var(--text-xs);color:var(--color-text-muted);margin-top:var(--space-1)}
.stat-scroll{overflow-x:auto;margin:var(--space-2) 0 var(--space-1)}
.stat-table{width:100%;border-collapse:collapse;font-size:var(--text-sm);min-width:520px}
.stat-table th,.stat-table td{padding:var(--space-2) var(--space-3);border-bottom:1px solid var(--color-border);text-align:right}
.stat-table thead th{color:var(--color-text-muted);font-weight:var(--weight-semibold);font-size:var(--text-xs);
  text-transform:uppercase;letter-spacing:.03em}
.stat-table tbody th{text-align:left;font-weight:var(--weight-semibold);white-space:nowrap}
.stat-table td:nth-child(2){color:var(--color-primary-text);font-weight:var(--weight-bold)}
.stat-empty{text-align:center;color:var(--color-text-muted);padding:var(--space-5)}

/* ---------- erro ---------- */
.error-page{max-width:560px;margin:var(--space-12) auto;padding:var(--space-10) var(--space-8);text-align:center}
.error-ico{display:inline-grid;place-items:center;width:var(--control-lg);height:var(--control-lg);
  border-radius:50%;background:var(--color-danger-bg);color:var(--color-danger)}
.error-page h1{font-size:var(--text-2xl);line-height:var(--leading-tight);margin:var(--space-4) 0 var(--space-2);
  text-wrap:balance}
.error-page p{color:var(--color-text-muted);margin:0 auto;max-width:44ch}
.error-page .actions{justify-content:center;margin-top:var(--space-6)}

@media(max-width:820px){
  .article-grid,.article-related .guide-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .article{padding-top:var(--space-8)}
  .article-hero p{font-size:var(--text-base)}
  .legal-page{margin:var(--space-5) auto var(--space-8);padding:var(--space-6) var(--space-5)}
  .legal-page h1{font-size:var(--text-2xl)}
  .legal-page h2{margin-top:var(--space-6)}
  .legal-page .lead{font-size:var(--text-base)}
  .error-page{margin:var(--space-8) auto;padding:var(--space-8) var(--space-5)}
  .stat-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* botões do formulário um embaixo do outro, cada um na largura toda */
  .legal-page .actions .btn{flex:1 1 100%}
}