/* Reset e tipografia base. Nenhuma tela escreve CSS proprio. */

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* O atributo hidden sempre ganha: sem isto, um display: de classe (ex .vz)
   sobrepoe o [hidden] do UA e o elemento "escondido" continua na tela. */
[hidden] {
  display: none !important;
}

html,
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
li,
figure,
blockquote,
dl,
dd {
  margin: 0;
  padding: 0;
}

ul[class],
ol[class] {
  list-style: none;
}

img,
picture,
svg {
  max-width: 100%;
  display: block;
}

body {
  font-family: var(--font);
  font-size: var(--fs-base);
  line-height: 1.55;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* CRITICO: sem isso o form vai pra Arial ou -apple-system. */
button,
input,
select,
textarea {
  font-family: inherit;
}

h1,
h2,
h3,
h4,
h5 {
  font-family: var(--font-titulo);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--text);
  line-height: 1.2;
}

a {
  color: var(--accent-texto);
}