/* ============================================================================
   report-amano.css — sistema editorial único dos reports amano
   Criado em 08/09/2026. Fonte única de tokens, navegação e componentes.

   Antes deste arquivo cada report carregava o próprio CSS inline: 244 KB
   somados, seis nomes diferentes para as mesmas seis cores da marca e quatro
   dialetos de navegação. Os nove `report-editorial-*.css` anteriores nunca
   foram carregados por nenhum report e ficam aposentados por este.

   COMO USAR
   Carregue antes do <style> inline do report:
     <link rel="stylesheet" href="/report-amano.css">
   O que sobrar de inline sobrescreve o sistema, por vir depois. A meta é que
   o inline guarde só o que é genuinamente específico daquele estudo.
   ========================================================================== */

/* --- 1. tokens ------------------------------------------------------------
   Paleta oficial do guideline de marca. Os nomes canônicos são em português,
   como no guideline; os apelidos em inglês existem porque sete reports foram
   escritos com eles, e apontam para o mesmo valor. Não crie um sétimo nome. */
:root{
  /* paleta oficial */
  --preto:#1A1A1A;      /* preto amano — base institucional */
  --creme:#F6F3E9;      /* fundo padrão claro */
  --areia:#E7E3DF;      /* superfícies secundárias */
  --bronze:#734F2F;     /* acento primário */
  --oliva:#5F6B4A;      /* acento secundário mineral */
  --dourado:#C4A67C;    /* acento raro, nunca mais de 5% da área */
  --cinza:#6E6A62;      /* texto secundário */
  --linha:rgba(26,26,26,.16);

  /* degraus intermediários, vindos da paleta oficial F · Terra Profunda.
     Os reports vinham improvisando estes tons: 135 dos 176 usos de cor solta
     medidos em 10/09/2026 caíam a menos de dE 8 de um deles. Agora existem. */
  --taupe2:#51463B;     /* texto forte secundário, borda escura */
  --stone:#61574D;      /* metadado sobre creme */
  --meta:#9A9083;       /* metadado sobre escuro — nunca texto sobre creme */
  --superficie:#E2DFD5; /* card claro, ausência de dado */
  --terracota:#7C3B2A;  /* divergência, mito, alerta — cor do território Architecture */

  /* apelidos em inglês — mesmo valor, para o CSS herdado */
  --ink:var(--preto);   --black:var(--preto);
  --paper:var(--creme); --cream:var(--creme);
  --sand:var(--areia);
  --gold:var(--dourado);
  --olive:var(--oliva);
  --mute:var(--cinza);  --grey:var(--cinza);  --muted:var(--cinza);
  --line:var(--linha);

  /* componentes rgb, para composição com alpha */
  --preto-rgb:26,26,26;   --ink-rgb:var(--preto-rgb);
  --creme-rgb:246,243,233;--paper-rgb:var(--creme-rgb);
  --bronze-rgb:115,79,47;

  /* tipografia */
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Work Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
  --display:var(--serif);
  --corpo:var(--sans);

  /* medidas do sistema */
  --h-site:64px;        --site-h:var(--h-site);
  --h-idx:48px;         --study-h:var(--h-idx);
  --largura:1560px;     --largura-editorial:760px;
  --recuo:24px;
}
@media(max-width:720px){ :root{ --h-site:56px; --h-idx:42px; } }

/* --- 1b. contraste medido em 10/09/2026 -----------------------------------
   Razão de cada token sobre o creme #F6F3E9 e sobre o preto #1A1A1A.
   O piso é 4.5:1 para texto normal e 3:1 para texto grande (24px, ou 18.7px
   em peso 700 ou mais).

     token         hex        sobre creme   sobre preto
     preto         #1A1A1A      15.68:1        1.00:1
     taupe2        #51463B       8.26:1        1.90:1
     terracota     #7C3B2A       7.52:1        2.09:1
     bronze        #734F2F       6.55:1        2.39:1
     stone         #61574D       6.35:1        2.47:1
     oliva         #5F6B4A       5.13:1        3.06:1
     cinza         #6E6A62       4.85:1        3.23:1
     meta          #9A9083       2.83:1        5.55:1   ← só sobre escuro
     dourado       #C4A67C       2.08:1        7.54:1   ← nunca em texto sobre claro
     superficie    #E2DFD5       1.20:1       13.05:1   ← superfície, não texto
     areia         #E7E3DF       1.15:1       13.63:1   ← superfície, não texto
     creme         #F6F3E9       1.00:1       15.68:1

   Três regras que saem daí, e valem sem exceção:
   1. Dourado nunca é texto sobre fundo claro. É preenchimento: botão ativo,
      estado `.on` da barra de idiomas, vértice de gráfico, fio sobre escuro.
   2. Meta e dourado só carregam texto sobre a escala escura.
   3. Bronze e cinza nunca carregam texto sobre o preto. Sobre escuro o
      metadado é `--meta`, e o acento é `--dourado`. */

/* --- 2. base -------------------------------------------------------------- */
.rpt *,.rpt *::before,.rpt *::after{box-sizing:border-box}
body{
  margin:0;
  background:var(--creme);
  color:var(--preto);
  font-family:var(--corpo);
  font-weight:300;
  padding-top:calc(var(--h-site) + var(--h-idx));
}
body.sem-indice{padding-top:var(--h-site)}
h1,h2,h3{font-family:var(--display);font-weight:400;text-wrap:balance}
img{max-width:100%;height:auto}
html{scroll-padding-top:calc(var(--h-site) + var(--h-idx) + 18px)}
section[id]{scroll-margin-top:calc(var(--h-site) + var(--h-idx) + 18px)}

/* --- 3. navegação --------------------------------------------------------
   Duas barras empilhadas: a do site diz de quem é o documento, a do estudo
   diz o que tem dentro.

   Dois cuidados de especificidade, ambos aprendidos em produção:
   1. `.rpt-nav nav{padding:0}` (0,1,1) anulava `.rn-in{padding:0 24px}` (0,1,0)
      e deixava o logo colado na borda. Por isso o recuo é declarado em
      `.rpt-nav .rn-in`, que é (0,2,0) e vence.
   2. A coleção usa três marcações para a mesma barra — `<div>`, `<nav>` e
      `<header>` com a classe. O sistema é agnóstico de tag: o reset defensivo
      cobre o `<nav>` filho e o `<nav>` que carrega a própria classe, porque o
      `amano.css` estiliza `<nav>` por tag. */
.rpt-nav{position:fixed;top:0;left:0;right:0;z-index:1100;background:var(--preto)}
/* o <nav> FILHO da barra é neutralizado; o <nav> que É a barra mantém o
   position:fixed que .rpt-nav/.rpt-idx dão — zerar aqui quebraria os três
   reports em que a própria tag carrega a classe. */
.rpt-nav nav,.rpt-idx nav{position:static;margin:0;padding:0}
nav.rpt-nav,nav.rpt-idx{margin:0;padding:0}
.rpt-nav a::after,nav.rpt-nav a::after,nav.rpt-idx a::after{content:none}
.rpt-nav .rn-in{
  max-width:var(--largura);margin:0 auto;height:var(--h-site);
  display:flex;align-items:center;gap:26px;padding:0 var(--recuo);
}
.rn-marca{display:flex;align-items:center}
.rn-logo{width:74px;height:auto;fill:var(--creme);display:block}
.rn-site{display:flex;gap:22px;align-items:center}
.rn-site a{color:var(--creme);opacity:.92;text-decoration:none;font-size:12.5px;letter-spacing:.02em}
.rn-site a:hover{opacity:1}
.rn-cta{
  margin-left:auto;border:1px solid #6E6A62;color:var(--creme);text-decoration:none;
  font-size:12px;letter-spacing:.08em;text-transform:lowercase;padding:9px 18px;
  transition:background .25s,color .25s,border-color .25s;
}
.rn-cta:hover{background:var(--dourado);color:var(--preto);border-color:var(--dourado)}

.rpt-idx{
  position:fixed;top:var(--h-site);left:0;right:0;z-index:1050;
  background:rgba(var(--creme-rgb),.94);backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(var(--preto-rgb),.12);
}
.rpt-idx.travado{display:none}
.rpt-idx a::after{content:none}
.rpt-idx .ri-in{
  max-width:var(--largura);margin:0 auto;height:var(--h-idx);
  display:flex;align-items:center;gap:22px;padding:0 var(--recuo);
  overflow-x:auto;scrollbar-width:none;
}
.ri-in::-webkit-scrollbar{display:none}
.ri-in a{
  white-space:nowrap;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cinza);text-decoration:none;transition:color .2s;
}
.ri-in a:hover{color:var(--preto)}
.ri-in a.aqui{color:var(--bronze)}
@media(max-width:560px){ .rn-site .so-desk{display:none} }

/* assinatura do autor — vai logo abaixo do deck, na capa de todo report */
.rpt-autor{
  font-family:var(--corpo);font-size:12.5px;line-height:1.5;letter-spacing:.03em;
  color:var(--cinza);margin:20px 0 0;
}
.rpt-autor b{font-weight:500;color:var(--preto)}
.rpt-autor .amano{font-family:var(--display)}
@media(max-width:640px){ .rpt-autor{font-size:11.5px} }

/* barra de idiomas — ordem invariável PT · EN · ES · 中文 · FR · IT */
.langbar{position:fixed;right:18px;bottom:18px;z-index:60;background:var(--preto);display:flex;padding:4px}
.langbar button{
  background:none;border:0;color:var(--creme);font-family:inherit;font-size:11px;
  letter-spacing:.06em;padding:6px 9px;cursor:pointer;opacity:.75;
}
.langbar button:hover{opacity:1}
.langbar button.on{background:var(--dourado);color:var(--preto);opacity:1}
.langbar.carregando{opacity:.6;pointer-events:none}
@media(max-width:640px){ .langbar{right:10px;bottom:10px} }

/* --- 3b. escala tipográfica fixa -----------------------------------------
   Medida em 10/09/2026: o corpo variava entre 16px e 17px, o parágrafo entre
   18px e 42px, o h1 entre 32px e 216px, e o peso do h1 entre 200 e 500.
   Daqui em diante a escala é esta, e o report não a redeclara no inline. */
.rpt-h1,.cover h1{
  font-family:var(--display);font-weight:300;
  font-size:clamp(56px,7vw,104px);line-height:1.04;letter-spacing:-.02em;
  text-transform:lowercase;margin:0;
}
.rpt-h2,.cover h2,section > h2{
  font-family:var(--display);font-weight:300;
  font-size:clamp(34px,4vw,52px);line-height:1.12;letter-spacing:-.01em;
}
.rpt-h3,section h3{
  font-family:var(--display);font-weight:400;
  font-size:clamp(22px,2.4vw,28px);line-height:1.25;
}
.rpt-corpo,.corpo p,.corpo li{
  font-family:var(--corpo);font-weight:300;font-size:19px;line-height:1.68;
  max-width:var(--largura-editorial);
}
.rpt-apoio{font-size:16px;line-height:1.6}
.rpt-legenda{font-size:13px;line-height:1.5;color:var(--stone)}
.rpt-util{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--stone)}

/* --- 4. estrutura editorial ---------------------------------------------- */
.eyebrow{
  font-family:var(--corpo);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cinza);
}
.deck,.section-lead{color:var(--cinza);font-size:1.05rem;line-height:1.6;max-width:62ch}
.pull{font-family:var(--display);font-size:1.6rem;line-height:1.35;color:var(--bronze);max-width:22ch}
.caption{font-size:11.5px;letter-spacing:.04em;color:var(--cinza);line-height:1.5}

/* --- 5. componentes ------------------------------------------------------- */
/* fonte no corpo do texto: fonte, ano e nível T ao lado do número (regra 1) */
.fonte-inline{
  font-size:11px;letter-spacing:.05em;color:var(--cinza);text-transform:uppercase;
  display:block;margin-top:6px;
}
.fonte-inline .nivel{color:var(--bronze)}

/* tabela: rola sozinha, o corpo da página nunca rola de lado */
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:22px 0}
.tbl-wrap table{border-collapse:collapse;width:100%;font-size:14px}
.tbl-wrap th{
  text-align:left;font-weight:400;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cinza);border-bottom:1px solid var(--linha);padding:0 12px 8px;
}
.tbl-wrap td{padding:11px 12px;border-bottom:1px solid rgba(var(--preto-rgb),.07);
  font-variant-numeric:tabular-nums}

/* abas de leitura complementar */
.tabs{display:flex;gap:18px;border-bottom:1px solid var(--linha);margin-bottom:20px;flex-wrap:wrap}
.tab{
  background:none;border:0;padding:10px 0;cursor:pointer;font-family:inherit;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--cinza);
  border-bottom:1px solid transparent;margin-bottom:-1px;
}
.tab:hover{color:var(--preto)}
.tab.on{color:var(--bronze);border-bottom-color:var(--bronze)}
.painel-aba{display:none} .painel-aba.on{display:block}

/* mito e veredito — o que o mercado acredita contra o que a evidência mostra */
.mito{border-left:2px solid var(--linha);padding:4px 0 4px 18px;margin:18px 0}
.veredito{
  font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--bronze);
  display:inline-block;margin-bottom:6px;
}

/* cenários */
.scenario-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}

/* portão de cadastro */
.gate{border:1px solid var(--linha);background:var(--areia);padding:32px;margin:40px 0}
.gate.gate-fechado{text-align:center}

/* fechamento */
.closing{border-top:1px solid var(--linha);margin-top:56px;padding-top:32px}

/* --- 6. acessibilidade ---------------------------------------------------- */
a:focus-visible,button:focus-visible{outline:2px solid var(--bronze);outline-offset:2px}
@media(prefers-reduced-motion:reduce){ *{transition:none!important;scroll-behavior:auto!important} }