/* =====================================================================
   16. AJUSTES DE MOBILE
   16.0 Ritmo de espaçamento pensado a partir de 360px. 16.1 em diante: auditoria M1 a M16.
   ===================================================================== */
.tres-canais{ margin-top: 16px; }
@media (max-width: 767px){
  :root{ --secao: 40px; }
  .capa{ padding-bottom: 30px; }
  .cab-secao{ margin-bottom: 14px; gap: 8px 14px; }
  .intro{ margin-bottom: .8em; }
  .cartaz{ padding: 22px 18px 18px; }
  .cartaz h2{ margin: 16px 0 14px; }
  .cartaz-assina{ margin-top: 12px; }
  .como-cab{ margin-bottom: 8px; }
  .posicoes{ padding-top: 24px; gap: 12px; }
  .posicao{ padding: 28px 16px 14px; }
  .pos-texto{ font-size: 1.06rem; margin-bottom: 10px; }
  .pos-diagrama{ margin-bottom: 10px; }
  /* Posição II em duas colunas: a carta fica perto da altura das outras */
  .tracos{ display: grid; grid-template-columns: 1fr 1fr; column-gap: 12px; }
  .traco{ grid-template-columns: 1fr; gap: 3px; padding: 9px 2px 8px; align-content: start; }
  .traco .amostra{ grid-row: auto; }
  .traco-def{ grid-column: 1; font-size: .84rem; line-height: 1.3; }
  .como-fim{ margin-top: 10px; gap: 4px 20px; }
  .rel-cab{ padding: 11px 0 10px; }
  .sub-cab{ margin-bottom: 0; }
  .indice a{ padding: 12px 0; }
  .crono-curta{ margin-top: 12px; }
  .crono-curta li{ padding-bottom: 12px; }
  .manifesto-grid{ gap: 20px; }
  .grito-2{ margin-top: 20px; padding-top: 16px; }
  .citacoes li{ padding: 13px 0; }
  .toga-grid{ gap: 14px; }
  .toga-titulo{ margin-bottom: 10px; }
  .ficha-token{ padding: 16px 16px 12px; }
  .ficha-token .linha{ padding: 9px 0; grid-template-columns: 96px minmax(0,1fr); }
  .tres-canais{ margin-bottom: 10px; }
  .razao{ margin-bottom: 10px; }
  .razao li{ padding: 10px 0; }
  .metodo-grid{ gap: 24px; }
  .imprensa-box{ padding: 18px 16px 14px; }
  .rodape{ padding-top: 34px; }
  .rodape-grid{ gap: 18px; margin-top: 18px; }
  .rodape-base{ margin-top: 24px; }
  .vista-in{ padding-top: 16px; }
  .vista-cab{ margin-bottom: 14px; padding-bottom: 12px; }
  .regra{ margin: 14px 0 16px; padding: 14px 16px; }
}

/* 16.1 M1 · A marca não quebra a 320px e a barra mantém a altura */
@media (max-width: 419px){
  .marca{ font-size: clamp(.9rem, 4.3vw, 1.08rem); white-space: nowrap; gap: 8px; }
  .menu-btn{ padding: 0 12px; }
}
/* 16.4 M4 · Rótulos em mono com tracking menor em telas estreitas */
@media (max-width: 419px){ .mono, .rotulo{ letter-spacing: .09em; } }

/* 16.2 M2 · Sublinhado do link com seta colado ao texto, não à caixa de 44px */
.link-seta{ border-bottom: 0; background: linear-gradient(currentColor, currentColor) no-repeat 0 calc(50% + .95em) / 100% 1.5px; }
.link-seta::after{ display: inline-block; }
.acoes:has(> .link-seta + .link-seta){ gap: 0 24px; }

/* 16.3 M3 · A seta da pista fica colada em "segundos" */
@media (max-width: 419px){ .pista{ display: inline-block; padding: 12px 0; letter-spacing: .08em; line-height: 1.5; } }

/* 16.5 M5 · Legenda centralizada ao lado da carta, sem vão em cima */
@media (max-width: 767px){ .capa-carta{ align-items: center; } .capa-legenda{ padding-bottom: 0; } }
/* 16.6 M6 · Data e tipo da relação não quebram */
.rel-meta .data, .rel-meta .tipo{ white-space: nowrap; }
/* 16.8 M8 · A cedilha de JUSTIÇA não encosta na linha de baixo */
.cartaz h2{ line-height: .94; }

/* 16.7 M7 · Relação em tela estreita: respiro embaixo do cabeçalho */
@media (max-width: 419px){ .rel-cab{ padding-bottom: 14px; } }

/* 16.9 M9 · Título e contador do sub-cabeçalho: quando não cabe, o contador desce inteiro */
.sub-cab{ flex-wrap: wrap; gap: 2px 12px; }
.sub-cab h3, .sub-cab .rotulo{ white-space: nowrap; }
.sub-cab .sub-nota{ white-space: normal; }   /* nota longa (ex.: "Sem ranking") quebra em vez de vazar */

/* 16.10 M10 · Índice de dossiês: a linha de números quebra inteira, sem cortar palavra */
.ind-meta{ overflow-wrap: anywhere; }

/* 16.11 M11 · Ficha do token e dados de imprensa: rótulo em cima, valor embaixo */
@media (max-width: 419px){
  .ficha-token .linha{ grid-template-columns: minmax(0,1fr); gap: 2px; padding: 9px 0; }
  .caixa dl{ grid-template-columns: minmax(0,1fr); gap: 2px; }
  .caixa dd{ margin-bottom: 8px; }
}

/* 16.12 M12 · Filtros de status: a borda esmaecida mostra que dá para rolar */
@media (max-width: 767px){
  .chips{ -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent); padding-right: 28px; }
}
/* 16.13 M13 · Botão "Limpar" da cronologia no tamanho do conteúdo */
@media (max-width: 767px){ #c-limpar{ justify-self: start; min-height: 44px; padding: .45rem .9rem; font-size: .68rem; } }
/* 16.14 M14 · Kit de imprensa: selo e botão sempre na mesma linha do item */
.kit li{ display: grid; grid-template-columns: minmax(0,1fr) auto; }
.kit .em-prep, .kit .btn{ white-space: nowrap; }

/* 16.15 M15 · Links do rodapé em grade de duas colunas no celular */
.rodape-links{ display: flex; flex-wrap: wrap; gap: 0 18px; margin: 0; }
@media (max-width: 767px){
  .rodape-base{ flex-direction: column; gap: 10px; }
  .rodape-base > p{ align-self: flex-start; }
  .rodape-links{ display: grid; grid-template-columns: repeat(2, max-content); gap: 0 22px; }
}
/* 16.16 M16 · Rótulos do rodapé no mesmo corpo do resto */
.rodape p.mono, .rodape p.rotulo{ font-size: .72rem; }
.rodape-sub{ letter-spacing: .12em; }