/* Escala tipográfica dos títulos, em teste no contato e na assistência técnica (pt, en e es usam o
   mesmo data-template de cada página). Mesma fonte, caixa alta, cores e alinhamento do legado; muda só o tamanho,
   que passa a ser fluido entre o celular e o desktop. Aprovada aqui, estende-se às outras páginas
   trocando o escopo. O :where() zera a especificidade do escopo: vale a ordem, esta folha vem depois
   da cascata legada. */

/* Título da página (h1.primarytitle). Legado: 70px no desktop, 52px até 991px, 32px até 479px, line-height 100%.
   Agora: 32px (até ~550px) a 52px (a partir de ~1400px). */
:where([data-template="contato"], [data-template="assistencia-tecnica"]) .internalheadertitlebox .primarytitle {
  font-size: clamp(2rem, 1.25rem + 2.2vw, 3.25rem);
  line-height: 1.08;
  text-wrap: balance;
}

/* A frase de apoio (.internalheadersubtitle) agora vem abaixo do título; o estilo dela é o de
   public/css/forms-v2.css, igual em todas as páginas internas. */

/* Título do bloco azul do formulário (.contactbox .footercontactnumber, mesma classe dos telefones).
   Legado: 30px fixo, line-height 130%. Agora: 20px a 26px, abaixo do h1 na hierarquia. */
:where([data-template="contato"]) .contactbox .footercontactnumber {
  font-size: clamp(1.25rem, 1rem + 0.75vw, 1.625rem);
  line-height: 1.15;
  text-wrap: balance;
}
