/* Ferramenta primeiro no celular (27/10/2026): base compartilhada das páginas de ferramenta (Raio-X de Site agora, as demais na onda 2).
   O layout só muda dentro de @media (max-width:640px). Fora do celular só há dois ajustes pontuais: o botão do Raio-X de Site nunca nasce apagado
   em qualquer largura e os logos da Home têm tamanho óptico também no desktop. A marcação usa data-fp:
   grade (o grid do hero), txt (a coluna de texto, que vira display:contents para misturar com a coluna da ferramenta), selo, h1, col (a coluna
   que leva o campo), campo (o input), botao, sub, prova e extra. Ordem no celular: selo, título, campo e botão, subtítulo, prova, extra.
   Ordem de Tab segue o DOM. No Raio-X de Site a pílula da Inovia e o selo de créditos (links) vêm antes do campo no código (não dá para movê-los
   sem mudar o desktop), então o Tab passa por eles primeiro. No CNPJ a ordem do código já é a da tela. */
@media (max-width:640px){
  :root{--fp-topo:56px;--fp-s1:8px;--fp-s2:12px;--fp-s3:16px;--fp-toque:44px;--fp-campo-h:52px}
  body [data-fp=hero]{padding-top:calc(var(--fp-topo) + var(--fp-s2));padding-bottom:var(--fp-s3)}
  body [data-fp=grade]{display:flex;flex-direction:column;align-items:stretch;gap:var(--fp-s2)}
  body [data-fp=txt]{display:contents}
  /* Selo igual em todas as ferramentas: texto simples, sem pílula nem ícone, com respiro abaixo do logo. */
  body [data-fp=selo][data-fp=selo]{order:1;align-self:flex-start;margin-top:12px;padding:0;background:none;box-shadow:none;border-radius:0;gap:0;font-size:11px;font-weight:500;letter-spacing:.12em;color:#6E6E74}
  body [data-fp=selo][data-fp=selo]>span{display:none}
  body [data-fp=h1]{order:2;margin:var(--fp-s1) 0 var(--fp-s2);font-size:clamp(30px,8.6vw,36px);line-height:1.04;letter-spacing:-0.05em}
  body [data-fp=col]{order:3}
  body [data-fp=sub]{order:4;margin:0;max-width:none;font-size:15px;line-height:1.4}
  body [data-fp=prova]{order:5;gap:var(--fp-s2);padding-top:0}
  body [data-fp=extra]{order:6;align-self:flex-start}
  /* Campo: 16 px ou mais (o iPhone não dá zoom) e toque de 44 px */
  body [data-fp=campo]{font-size:16px;min-height:calc(var(--fp-campo-h) - 12px)}
  body [data-fp=botao]{height:var(--fp-toque);min-width:var(--fp-toque)}
  body [data-fp=col] .rx-card{padding:var(--fp-s2);gap:var(--fp-s2);border-radius:26px}
}
