/* Ferramentas: resultado com gráfico, leitura da conta, compartilhar, inflação por ano em barras e o hub com cartões vivos.
   Arquivo próprio (carregado só em /ferramentas) para não mexer no site.css. */

/* resultado em duas colunas quando há gráfico */
.fr-duo{display:grid;grid-template-columns:minmax(0,330px) minmax(0,1fr);gap:28px;align-items:start}
@media (max-width:820px){.fr-duo{grid-template-columns:1fr;gap:18px}}
.fr-graf{margin:0}
.fr-graf figcaption strong{display:block;font:700 16px/1.3 var(--cond);color:var(--tinta)}
.fr-graf figcaption span{display:block;font:14px/1.35 var(--cond);color:var(--sec);margin:2px 0 6px}
.fr-graf svg{width:100%;height:auto;display:block;overflow:visible}
.fr-graf .fg-gr{stroke:var(--fio);stroke-dasharray:2 3}
.fr-graf .fg-ax{font:11px var(--cond);fill:var(--sec)}
.fr-graf .fg-ln{fill:none;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}
.fr-graf .fg-ln.p{stroke:var(--tinta);stroke-width:3.4}
.fr-graf .fg-ln.a{stroke:var(--dado-2)}
.fr-graf .fg-ln.b{stroke:var(--dado-4)}
.fr-graf .fg-ln.c{stroke:var(--dado-contexto);stroke-dasharray:4 3}
.fr-graf .fg-pt.p{fill:var(--marca)}.fr-graf .fg-pt.a{fill:var(--dado-2)}.fr-graf .fg-pt.b{fill:var(--dado-4)}.fr-graf .fg-pt.c{fill:var(--dado-contexto)}
.fr-graf .fg-lb{font:700 12px var(--cond);fill:var(--tinta)}
.fr-graf .fg-lb.a{fill:var(--dado-2)}.fr-graf .fg-lb.b{fill:var(--dado-4)}.fr-graf .fg-lb.c{fill:var(--dado-contexto)}
@media (max-width:560px){.fr-graf .fg-ax{font-size:17px}.fr-graf .fg-lb{font-size:19px}.fr-graf .fg-lv{display:none}}
.fr-graf-f{margin:4px 0 0;font:12px/1.4 var(--cond);color:var(--sec)}
.fr-graf-f span{font-weight:700;color:var(--tinta);white-space:nowrap}

/* o que dá para dizer com a conta */
.fr-leit{margin-top:22px}
.fr-leit-t{display:block;font:700 13px var(--cond);letter-spacing:.03em;text-transform:uppercase;color:var(--sec);margin-bottom:8px}
.fr-leit-g{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 22px}
.fr-leit-g>div{border-top:2px solid var(--fio-forte);padding:8px 0 4px}
.fr-leit b{display:block;font:700 24px/1.15 var(--cond);color:var(--tinta);font-variant-numeric:tabular-nums}
.fr-leit p{margin:4px 0 0;font-size:16px;line-height:1.45;color:var(--texto)}

/* compartilhar */
.fr-acoes{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.fr-acoes[hidden]{display:none}
.fr-bt{display:inline-flex;align-items:center;min-height:40px;font:700 14px var(--cond);border:1.5px solid var(--tinta);border-radius:20px;padding:6px 14px;color:var(--tinta);background:transparent;cursor:pointer;text-decoration:none}
.fr-bt:hover{text-decoration:none;border-color:var(--marca);color:var(--marca)}
.fr-bt-p{background:var(--tinta);color:var(--fundo)}
.fr-bt-p:hover{background:var(--marca);color:var(--sobre-marca)}

/* inflação de cada ano em barras */
.fi-anos{margin-top:10px;max-width:820px}
.fi-ano{display:grid;grid-template-columns:96px minmax(0,1fr) 64px 110px;align-items:center;gap:10px;font:14px var(--cond);padding:4px 0;border-bottom:1px solid var(--fio)}
.fi-a{color:var(--tinta);font-weight:600;font-variant-numeric:tabular-nums}
.fi-b{height:12px;background:var(--fio);position:relative}
.fi-b i{position:absolute;inset:0 auto 0 0;background:var(--marca)}
.fi-b b{position:absolute;top:-3px;bottom:-3px;width:2px;background:var(--tinta);margin-left:-1px}
.fi-acima .fi-b i{background:var(--dado-2)}
.fi-acima .fi-v{color:var(--dado-2)}
.fi-v{text-align:right;font-weight:700;color:var(--tinta);font-variant-numeric:tabular-nums}
.fi-ano a{text-align:right;font-size:13px;white-space:nowrap;color:var(--marca)}
.fi-tab{margin-top:10px}
.fi-tab summary{cursor:pointer;font:700 14px var(--cond);color:var(--marca)}
@media (max-width:560px){.fi-ano{grid-template-columns:76px minmax(0,1fr) 56px}.fi-ano>:nth-child(4){display:none}}

/* hub: busca, cartões vivos e lista com ícones */
.fh-busca{display:flex;gap:10px;align-items:center;border:2px solid var(--tinta);background:var(--cartao);padding:0 14px;margin-top:18px;max-width:640px;color:var(--sec)}
.fh-busca input{flex:1;min-width:0;border:0;background:transparent;font:17px var(--cond);color:var(--tinta);padding:13px 0;outline:0}
.fh-busca:focus-within{border-color:var(--marca)}
.fh-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 20px;margin-top:22px}
.fh-grade[hidden]{display:none}
@media (max-width:900px){.fh-grade{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.fh-grade{grid-template-columns:1fr}}
.fh-c{display:flex;flex-direction:column;gap:4px;border-top:2px solid var(--fio-forte);padding-top:10px;color:var(--texto);text-decoration:none}
.fh-c:hover{text-decoration:none}
.fh-c:hover .fh-l{text-decoration:underline}
.fh-rot{font:700 12px var(--cond);letter-spacing:.03em;text-transform:uppercase;color:var(--sec)}
.fh-t{font:600 21px/1.2 var(--serif);color:var(--tinta)}
.fh-ex{font:14px/1.4 var(--cond);color:var(--sec);margin-top:4px}
.fh-r{font:700 30px/1.05 var(--cond);color:var(--marca);font-variant-numeric:tabular-nums}
.fh-l{font:700 13px var(--cond);color:var(--marca);margin-top:4px}
.fh-g{grid-column:span 2;background:var(--faixa);border-top-color:var(--marca);padding:16px 18px 18px}
.fh-g .fh-t{color:var(--faixa-tinta);font-size:24px}
.fh-g .fh-rot,.fh-g .fh-ex{color:var(--faixa-sec)}
.fh-g .fh-r{font-size:clamp(36px,6vw,48px);color:var(--marca)}
@media (max-width:560px){.fh-g{grid-column:auto}}
.fh-lista{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:0 22px}
.fh-lista li{border-top:0;padding:0;margin:0}
.fh-lista li[hidden]{display:none}
.fh-lista a{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--fio);color:var(--tinta);text-decoration:none}
.fh-lista a:hover strong{text-decoration:underline}
.fh-lista .ico{flex:none;margin-top:2px;color:var(--tinta)}
.fh-lista strong{display:block;font:600 17px/1.25 var(--serif)}
.fh-lista small{display:block;font:14px/1.35 var(--cond);color:var(--sec);margin-top:2px}
.fh-nada{margin-top:10px;color:var(--sec)}

/* cartões que fazem a conta ali mesmo (inflação, medidas, salário mínimo) */
.fh-campos{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0 6px}
.fh-in{display:flex;flex-direction:column;gap:4px;flex:1 1 120px;min-width:0}
.fh-in span{font:600 12px var(--cond);letter-spacing:.06em;text-transform:uppercase;color:var(--sec)}
.fh-in input,.fh-in select{width:100%;font:inherit;font-size:18px;line-height:1.2;color:var(--tinta);background:var(--fundo);border:1px solid var(--fio-forte);border-radius:var(--raio);padding:9px 10px;min-height:44px}
.fh-in input{font-family:var(--mono)}
.fh-in input:focus,.fh-in select:focus{outline:2px solid var(--destaque);outline-offset:1px}
.fh-g .fh-in span{color:var(--faixa-sec)}
/* sugestões ao focar a busca */
.fh-sug{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px;max-width:640px;font:14px var(--cond);color:var(--sec)}
.fh-sug[hidden]{display:none}
.fh-sug button{font:600 14px var(--cond);color:var(--tinta);background:var(--cartao);border:1px solid var(--fio-forte);border-radius:var(--raio-pill);padding:6px 12px;min-height:36px;cursor:pointer}
.fh-sug button:hover,.fh-sug button:focus{border-color:var(--marca);outline:0}
/* salário mínimo: perguntas mais buscadas (pergunta em negrito, resposta abaixo) */
.sm-perg{margin:8px 0 0;max-width:720px}
.sm-perg dt{font:600 16px/1.35 var(--cond);color:var(--tinta);margin-top:14px}
.sm-perg dd{margin:2px 0 0;color:var(--texto)}
