/* Artigos editoriais do blog: componentes usados dentro do texto do post.
   Marca: azul-marinho, papel e vermelho só em detalhes; cantos retos; o dourado fica reservado ao Sistema Águia Dourada.

   PRINCÍPIOS DE DESIGN (15/10/2026)
   1. Hierarquia visual em três níveis:
        N1 (âncoras)  título, abertura (.adr-lead), subtítulos H2, "Em 30 segundos"  -> serifa, grande, com muito espaço ao redor;
        N2 (apoio)    figuras, gráficos, dados, caixas e teste rápido                 -> sem serifa ou serifa pequena, bordas finas;
        N3 (meta)     legendas, fontes, notas, rótulos                                -> 12 a 14 px, cinza, sempre abaixo do que explicam.
      O vermelho marca UMA coisa por bloco (o dado ou o rótulo); o escuro marca só duas coisas: a ação (.adr-caixa--pratica) e a EVIDÊNCIA (.adr-fig--recorte).
   5. Evidência com contraste (15/10/2026): o recorte de terceiros nunca fica solto no texto. Fica num painel escuro com filete vermelho e rótulo
      "Evidência N". Regra de leitura: o painel escuro é a moldura do blog; o claro (branco ou papel) DENTRO dele é conteúdo da fonte
      (o print e a tradução). Assim o leitor distingue na hora o que é a voz do autor e o que é prova de terceiros.
   2. Respiro: escala de 8 px (8, 16, 24, 32, 48, 64). Entre blocos de N1: 64; entre blocos de N2: 48; dentro de caixas: 24 a 32.
   3. Responsivo em três faixas: desktop >= 1040 (abertura e gráficos ampliados para 980 px), tablet 701-1039 (tudo na largura da coluna),
      celular <= 700 (gráficos compactos, recortes ajustados com toque para ampliar). Sem rolagem lateral.
   4. Texto nunca só em imagem: o dado de cada figura aparece também em HTML (legenda, texto ou tradução).
   Uso no HTML do post: .adr-lead, .adr-resumo, .adr-fig (--hero, --grafico, --recorte, --largo), .adr-citacao, .adr-caixa (--leitura,
   --cuidado, --pratica, --fala), .adr-dados/.adr-dado, .adr-quiz, .adr-duplo, .adr-tabela, .adr-fontes, .adr-traducao. */

.adriano-artigo__corpo{--adr-s1:8px;--adr-s2:16px;--adr-s3:24px;--adr-s4:32px;--adr-s6:48px;--adr-s8:64px}

/* ---------- N1: abertura, resumo e subtítulos */
.adriano-artigo__corpo .adr-lead{margin:0 0 var(--adr-s4);font:400 clamp(20px,2.4vw,24px)/1.6 var(--adr-serif);color:var(--adr-ink)}
.adriano-artigo__corpo h2{margin:var(--adr-s8) 0 var(--adr-s2);font-size:clamp(25px,3vw,32px);line-height:1.2}
.adriano-artigo__corpo .adr-rotulo{margin:0 0 var(--adr-s1);font:500 11px/1.4 var(--adr-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--adr-red-text)}

.adr-resumo{margin:0 0 var(--adr-s6);padding:var(--adr-s3) var(--adr-s4) var(--adr-s2);background:var(--adr-paper);border-top:2px solid var(--adr-red)}
.adr-resumo ul{list-style:none;margin:0;padding:0}
.adr-resumo li{position:relative;margin:0 0 var(--adr-s2);padding-left:var(--adr-s3);font-size:17px;line-height:1.6;color:var(--adr-ink)}
.adr-resumo li::before{content:"";position:absolute;left:0;top:.7em;width:7px;height:7px;background:var(--adr-red)}

/* ---------- N2: figuras (abertura, gráficos, recortes) */
.adr-fig{margin:var(--adr-s6) 0}
.adr-fig svg,.adr-fig img{display:block;width:100%;height:auto}
.adr-fig--hero{margin-top:0}
.adr-fig--hero svg{border-radius:2px}
.adr-fig--grafico svg{border:1px solid var(--adr-line-light);background:#fff}
.adr-fig svg.adr-svg--compacto{display:none}
.adr-fig--recorte{padding:var(--adr-s3);background:var(--adr-navy-900);border-top:3px solid var(--adr-red)}
.adr-fig--recorte>.adr-rotulo{display:flex;align-items:center;gap:var(--adr-s1);margin:0 0 var(--adr-s2);color:var(--adr-on-dark)}
.adr-fig--recorte>.adr-rotulo::before{content:"";flex:none;width:8px;height:8px;background:var(--adr-red)}
.adr-fig--recorte a.adr-fig__img{display:block;position:relative}
.adr-fig--recorte img{border:0;box-shadow:0 0 0 1px var(--adr-line-dark)}
.adr-fig--recorte a.adr-fig__img:hover img,.adr-fig--recorte a.adr-fig__img:focus-visible img{box-shadow:0 0 0 2px var(--adr-red)}
.adr-fig--recorte a.adr-fig__img:focus-visible{outline:none}
.adr-fig--recorte .adr-traducao{margin-top:var(--adr-s1);border:0;border-left:3px solid var(--adr-red)}

/* ---------- N3: legendas e notas (sempre abaixo do que explicam) */
.adr-fig figcaption{margin:var(--adr-s2) 0 0;padding-left:var(--adr-s2);border-left:2px solid var(--adr-line-light);font:400 13px/1.6 var(--adr-sans);color:var(--adr-muted)}
.adr-fig figcaption strong{color:var(--adr-ink);font-weight:500}
.adr-fig figcaption a{color:var(--adr-red-text)}
.adr-fig__dica{display:none}
.adr-nota{font-size:14px;line-height:1.6;color:var(--adr-muted)}
/* legendas dentro do painel de evidência (depois das regras gerais, para vencer pela ordem) */
.adr-fig--recorte figcaption{border-left-color:var(--adr-line-dark);color:var(--adr-on-dark-muted)}
.adr-fig--recorte figcaption strong{color:var(--adr-on-dark)}
.adr-fig--recorte figcaption a{color:var(--adr-red)}
.adr-fig--recorte .adr-fig__dica{color:var(--adr-on-dark-muted)}

/* ---------- Citação de destaque (N1 secundária) */
.adr-citacao{margin:var(--adr-s6) 0;padding:var(--adr-s1) 0 var(--adr-s1) var(--adr-s4);border-left:3px solid var(--adr-red);font:italic 500 clamp(22px,2.6vw,28px)/1.4 var(--adr-serif);color:var(--adr-ink)}
.adr-citacao p{margin:0}
.adr-citacao cite{display:block;margin-top:var(--adr-s2);font:400 13px/1.5 var(--adr-sans);font-style:normal;letter-spacing:.04em;color:var(--adr-muted)}

/* ---------- N2: caixas (um propósito por tipo) */
.adr-caixa{margin:var(--adr-s6) 0;padding:var(--adr-s3) var(--adr-s4) var(--adr-s1);border:1px solid var(--adr-line-light);background:#fff}
.adr-caixa p{font-size:16.5px;line-height:1.7}
.adr-caixa--leitura{background:var(--adr-paper);border:0;border-left:3px solid var(--adr-navy-700)}
.adr-caixa--cuidado{border-left:3px solid var(--adr-red)}
.adr-caixa--fala{background:var(--adr-paper);border:0;border-left:3px solid var(--adr-red)}
.adr-caixa--fala .adr-fala{margin:0 0 var(--adr-s1);font:italic 500 clamp(20px,2.3vw,24px)/1.45 var(--adr-serif);color:var(--adr-ink)}
.adr-caixa--pratica{background:var(--adr-navy-900);border:0;color:var(--adr-on-dark)}
.adr-caixa--pratica .adr-rotulo{color:var(--adr-red)}
.adr-caixa--pratica p,.adr-caixa--pratica li{color:var(--adr-on-dark)}
.adr-caixa--pratica ul{margin:0 0 var(--adr-s2);padding-left:var(--adr-s3)}

/* ---------- Cartões de dados */
.adr-dados{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--adr-s2);margin:var(--adr-s6) 0}
.adr-dado{padding:var(--adr-s3);border:1px solid var(--adr-line-light);background:#fff}
.adr-dado__n{display:block;font:600 clamp(34px,4.4vw,46px)/1 var(--adr-serif);color:var(--adr-ink)}
.adr-dado__n--alerta{color:var(--adr-red-text)}
.adr-dado__t{display:block;margin-top:var(--adr-s2);font-size:15.5px;line-height:1.55;color:var(--adr-ink-2)}
.adr-dado__f{display:block;margin-top:var(--adr-s2);font-size:12.5px;line-height:1.5;color:var(--adr-muted)}
.adr-dado__tag{display:inline-block;margin-left:var(--adr-s1);padding:2px 8px;font:500 11px/1.5 var(--adr-sans);letter-spacing:.08em;text-transform:uppercase;vertical-align:middle;color:var(--adr-red-text);border:1px solid var(--adr-red-text)}

/* ---------- Duas colunas (ex.: as duas regras) */
.adr-duplo{display:grid;grid-template-columns:1fr 1fr;gap:var(--adr-s2);margin:var(--adr-s6) 0}
.adr-duplo>div{padding:var(--adr-s3) var(--adr-s3) var(--adr-s1);border:1px solid var(--adr-line-light);background:#fff}
.adr-duplo h3{margin:var(--adr-s1) 0 var(--adr-s1);font-size:20px}
.adr-duplo__n{display:block;font:600 36px/1 var(--adr-serif);color:var(--adr-red-text)}

/* ---------- Teste rápido (details: funciona sem JavaScript) */
.adr-quiz{margin:var(--adr-s6) 0;border:1px solid var(--adr-line-light);background:#fff}
.adr-quiz summary{position:relative;display:block;min-height:48px;padding:var(--adr-s2) 56px var(--adr-s2) var(--adr-s3);cursor:pointer;list-style:none;font:500 12px/1.6 var(--adr-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--adr-red-text)}
.adr-quiz summary::-webkit-details-marker{display:none}
.adr-quiz summary::after{content:"+";position:absolute;right:var(--adr-s3);top:50%;transform:translateY(-50%);font:400 26px/1 var(--adr-sans);color:var(--adr-ink)}
.adr-quiz[open] summary::after{content:"\2212"}
.adr-quiz summary:focus-visible{outline:2px solid var(--adr-red-text);outline-offset:-2px}
.adr-quiz__corpo{padding:var(--adr-s1) var(--adr-s3) var(--adr-s3);border-top:1px solid var(--adr-line-light)}
.adr-quiz__pergunta{margin:var(--adr-s2) 0 var(--adr-s2);font:500 clamp(19px,2.2vw,22px)/1.4 var(--adr-serif);color:var(--adr-ink)}
.adr-quiz ul{margin:0 0 var(--adr-s2);padding:0;list-style:none}
.adr-quiz li{margin:0 0 var(--adr-s1);padding:var(--adr-s1) var(--adr-s2);border:1px solid var(--adr-line-light);font-size:16px;line-height:1.55;color:var(--adr-ink)}
.adr-quiz__leitura{margin:0;padding:var(--adr-s2);background:var(--adr-paper);font-size:16px;line-height:1.65}

/* ---------- Tabela comparativa */
.adr-tabela{margin:var(--adr-s6) 0;overflow-x:auto}
.adr-tabela table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.55}
.adr-tabela th,.adr-tabela td{padding:var(--adr-s2);text-align:left;border-bottom:1px solid var(--adr-line-light);vertical-align:top;overflow-wrap:break-word;hyphens:auto}
.adr-tabela thead th{background:var(--adr-navy-900);color:#fff;font:500 12px/1.4 var(--adr-sans);letter-spacing:.14em;text-transform:uppercase;border-bottom:0}
.adr-tabela tbody th{width:22%;font:500 13px/1.5 var(--adr-sans);color:var(--adr-muted)}
.adr-tabela td:last-child{color:var(--adr-ink)}

/* ---------- Tradução livre abaixo de recortes em inglês (N2, ligada à imagem acima) */
.adr-traducao{margin:0;padding:var(--adr-s3) var(--adr-s3) var(--adr-s1);background:var(--adr-paper);border:1px solid var(--adr-line-light);border-top:0;border-left:3px solid var(--adr-navy-700)}
.adr-traducao .adr-rotulo{margin:0 0 var(--adr-s1);color:var(--adr-muted)}
.adr-traducao p{margin:0 0 var(--adr-s2);font-size:15.5px;line-height:1.65;color:var(--adr-ink)}
.adr-traducao .adr-trad-titulo{font:600 17px/1.4 var(--adr-serif);color:var(--adr-ink)}

/* ---------- Fontes */
.adr-fontes{margin:var(--adr-s8) 0 0;border-top:1px solid var(--adr-line-light)}
.adr-fontes summary{min-height:48px;padding:var(--adr-s2) 0;cursor:pointer;font:500 12px/1.6 var(--adr-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--adr-ink)}
.adr-fontes summary:focus-visible{outline:2px solid var(--adr-red-text);outline-offset:2px}
.adr-fontes ul{margin:0 0 var(--adr-s1);padding-left:var(--adr-s3);font-size:15px;line-height:1.65;color:var(--adr-ink-2)}
.adr-fontes li{margin-bottom:var(--adr-s1)}

/* ================= DESKTOP (>= 1040): abertura e gráficos ampliados para 980 px; recortes e textos na coluna de 760 px */
@media (min-width:1040px){
  .adr-fig--hero,.adr-fig--grafico{margin-left:-110px;margin-right:-110px}
  .adr-fig--recorte{margin-left:-32px;margin-right:-32px;padding:var(--adr-s4)}
}

/* ================= TABLET (701 a 1039): tudo na largura da coluna, com respiro lateral do tema */
@media (max-width:1039px) and (min-width:701px){
  .adr-fig,.adr-caixa,.adr-quiz,.adr-dados,.adr-citacao{margin-top:var(--adr-s6);margin-bottom:var(--adr-s6)}
}

/* ================= CELULAR (<= 700): gráficos compactos, espaços reduzidos, alvos de toque confortáveis */
@media (max-width:700px){
  .adriano-artigo__corpo h2{margin-top:var(--adr-s6)}
  .adr-fig svg.adr-svg--amplo{display:none}
  .adr-fig svg.adr-svg--compacto{display:block}
  .adr-fig{margin:var(--adr-s4) 0}
  .adr-fig--recorte{margin-left:calc(var(--adr-s2) * -1);margin-right:calc(var(--adr-s2) * -1);padding:var(--adr-s2)}
  .adr-fig figcaption{font-size:13px}
  .adr-fig__dica{display:block;margin-top:var(--adr-s1);font:400 12.5px/1.4 var(--adr-sans);color:var(--adr-muted)}
  .adr-resumo{padding:var(--adr-s3) var(--adr-s3) var(--adr-s1)}
  .adr-caixa{margin:var(--adr-s4) 0;padding:var(--adr-s3) var(--adr-s3) var(--adr-s1)}
  .adr-dados,.adr-quiz,.adr-citacao,.adr-tabela{margin:var(--adr-s4) 0}
  .adr-tabela table{font-size:15px}
  .adr-tabela th,.adr-tabela td{padding:12px}
  .adr-tabela tbody th{width:20%;font-size:12.5px}
  .adr-citacao{padding-left:var(--adr-s3)}
  .adr-duplo{grid-template-columns:1fr}
  .adr-traducao{padding:var(--adr-s2) var(--adr-s2) var(--adr-s1)}
  .adr-quiz summary{padding-left:var(--adr-s2)}
  .adr-quiz__corpo{padding:var(--adr-s1) var(--adr-s2) var(--adr-s2)}
  .adr-fontes{margin-top:var(--adr-s6)}
}

/* ================= NAVEGAÇÃO E ORIENTAÇÃO (dobras): primeira dobra, sumário, progresso, voltar ao topo ================= */
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
.adriano-artigo__corpo h2[id]{scroll-margin-top:24px}
.adriano-artigo__corpo .adr-conferido{margin:calc(var(--adr-s2) * -1) 0 var(--adr-s4);font:400 13px/1.5 var(--adr-sans);color:var(--adr-muted)}
.adr-conferido a{color:var(--adr-red-text)}

/* Sumário "Neste artigo": em linha (recolhível) e, em telas largas com JavaScript, uma coluna fixa na margem */
.adr-indice{margin:0 0 var(--adr-s6);border:1px solid var(--adr-line-light);background:#fff}
.adr-indice summary{position:relative;display:block;min-height:48px;padding:var(--adr-s2) 56px var(--adr-s2) var(--adr-s3);cursor:pointer;list-style:none;font:500 12px/1.6 var(--adr-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--adr-ink)}
.adr-indice summary::-webkit-details-marker{display:none}
.adr-indice summary::after{content:"+";position:absolute;right:var(--adr-s3);top:50%;transform:translateY(-50%);font:400 24px/1 var(--adr-sans)}
.adr-indice details[open] summary::after{content:"\2212"}
.adr-indice summary:focus-visible{outline:2px solid var(--adr-red-text);outline-offset:-2px}
.adr-indice ol{margin:0;padding:0 var(--adr-s3) var(--adr-s3) 52px;font-size:16px;line-height:1.5}
.adr-indice li{margin:0 0 var(--adr-s1)}
.adr-indice a{color:var(--adr-ink-2);text-decoration:none;border-bottom:1px solid transparent}
.adr-indice a:hover,.adr-indice a:focus-visible{color:var(--adr-red-text);border-bottom-color:currentColor}
.adr-indice a[aria-current="true"]{color:var(--adr-red-text);font-weight:500}
@media (min-width:1360px){
  .adr-js .adr-indice{position:fixed;top:128px;left:max(16px,calc((100vw - 980px) / 2 - 192px));z-index:20;width:168px;margin:0;border:0;background:transparent;opacity:0;pointer-events:none;transition:opacity .3s ease}
  .adr-js .adr-indice.is-visivel{opacity:1;pointer-events:auto}
  .adr-js .adr-indice summary{pointer-events:none;min-height:0;padding:0 0 var(--adr-s2);font-size:11px;color:var(--adr-muted)}
  .adr-js .adr-indice summary::after{display:none}
  .adr-js .adr-indice ol{padding:0 0 0 18px;font-size:13px;line-height:1.45}
}

/* Barra de progresso de leitura e botão de voltar ao topo (criados pelo artigo.js) */
.adr-progresso{position:fixed;top:0;left:0;right:0;z-index:100;height:3px;pointer-events:none}
.adr-progresso span{display:block;width:0;height:100%;background:var(--adr-red)}
.adr-topo{position:fixed;left:16px;bottom:16px;z-index:90;width:44px;height:44px;border:1px solid var(--adr-line-light);border-radius:50%;background:#fff;color:var(--adr-ink);font:500 18px/1 var(--adr-sans);cursor:pointer;opacity:0;pointer-events:none;transition:opacity .25s ease;box-shadow:0 6px 18px -10px rgba(17,19,32,.5)}
.adr-topo.is-visivel{opacity:1;pointer-events:auto}
.adr-topo:focus-visible{outline:2px solid var(--adr-red-text);outline-offset:2px}

@media print{.adr-fig--recorte{background:#fff;border:1px solid #999}.adr-fig--recorte>.adr-rotulo,.adr-fig--recorte figcaption,.adr-fig--recorte figcaption strong,.adr-fig--recorte .adr-fig__dica{color:#111}.adr-progresso,.adr-topo,.adr-indice{display:none!important}.adr-quiz:not([open]) .adr-quiz__corpo{display:block}}
