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

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  background: var(--pagina);
  color: var(--texto-1);
  font: 400 14px / 1.5 var(--f-texto);
  -webkit-font-smoothing: antialiased;
  min-height: 100dvh;
}

h1,
h2,
h3,
h4,
p,
ul,
ol,
dl,
dd,
figure {
  margin: 0;
}

ul,
ol {
  padding: 0;
  list-style: none;
}

button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}

button {
  cursor: pointer;
}

a {
  color: inherit;
}

:focus-visible {
  outline: var(--foco);
  outline-offset: 2px;
  border-radius: var(--raio-sm);
}

::selection {
  background: var(--laranja-veu);
}

* {
  scrollbar-color: var(--linha) transparent;
  scrollbar-width: thin;
}

.oculto-visual {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

[hidden] {
  display: none !important;
}

/* tipografia: estilos "App/…" do Figma */
.t-display {
  font: 700 60px / 1.04 var(--f-titulo);
  letter-spacing: -0.03em;
}

.t-folha {
  font: 700 40px / 1.04 var(--f-titulo);
  letter-spacing: -0.025em;
}

.t-secao {
  font: 700 24px / 1.12 var(--f-titulo);
  letter-spacing: -0.02em;
}

.t-mobile {
  font: 700 30px / 1.08 var(--f-titulo);
  letter-spacing: -0.025em;
}

.t-numero-g {
  font: 700 30px / 1.12 var(--f-titulo);
  letter-spacing: -0.02em;
}

.t-numero-xg {
  font: 700 56px / 1 var(--f-titulo);
  letter-spacing: -0.03em;
}

.t-bloco {
  font: 600 17px / 1.3 var(--f-texto);
  letter-spacing: -0.01em;
}

.t-corpo-g {
  font: 400 17px / 1.5 var(--f-texto);
}

.t-corpo {
  font: 400 14px / 1.5 var(--f-texto);
}

.t-forte {
  font: 500 14px / 1.5 var(--f-texto);
}

.t-pequeno {
  font: 400 12px / 1.4 var(--f-texto);
}

.t-rotulo {
  font: 400 12px / 1.4 var(--f-mono);
}

.t-rotulo-m {
  font: 400 13px / 1.4 var(--f-mono);
}

.t-numero {
  font: 500 15px / 1.35 var(--f-mono);
  letter-spacing: -0.01em;
}

.t-numero-p {
  font: 400 12px / 1.35 var(--f-mono);
}

.t-ref {
  font: 500 12px / 1.3 var(--f-mono);
}

.t-carimbo {
  font: 400 11px / 1.2 var(--f-mono);
}

.mudo {
  color: var(--texto-3);
}

.suave {
  color: var(--texto-2);
}

.erro-texto {
  color: var(--erro);
}

.laranja-texto {
  color: var(--laranja-texto);
}

.tabular {
  font-variant-numeric: tabular-nums;
}