/* ==========================================================================
   Base — reset enxuto, elementos nativos e utilitários de acessibilidade
   ========================================================================== */

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

html {
  scroll-behavior: smooth;
  /* Compensa a altura do cabeçalho fixo ao pular para uma âncora */
  scroll-padding-top: 96px;
}

body {
  margin: 0;
  background: var(--superficie-pagina);
  color: var(--texto-corpo);
  font-family: var(--fonte-sans);
  font-size: var(--texto-lead);
  line-height: var(--entrelinha-corpo);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1,
h2,
h3 {
  font-family: var(--fonte-display);
  font-weight: var(--peso-display);
  color: var(--texto-titulo);
  margin: 0;
  text-wrap: pretty;
}

p {
  margin: 0;
  text-wrap: pretty;
}

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

strong {
  font-weight: var(--peso-forte);
  color: var(--texto-titulo);
}

em {
  font-style: italic;
}

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

a {
  color: var(--nc-terracota);
  text-decoration: none;
  transition: var(--transicao-cor);
}

a:hover {
  color: var(--nc-mostarda);
}

button {
  font: inherit;
  color: inherit;
}

input,
select,
textarea {
  font-family: var(--fonte-sans);
  font-size: var(--texto-corpo-sm);
}

code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.92em;
}

:focus-visible {
  outline: 2px solid var(--nc-mostarda);
  outline-offset: 3px;
}

/* Atalho de teclado para saltar a navegação -------------------------- */
.pular-para-conteudo {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  padding: var(--espaco-3) var(--espaco-6);
  background: var(--nc-espresso);
  color: var(--nc-marfim);
  border-radius: 0 0 var(--raio-md) 0;
  font-size: var(--texto-fino);
}

.pular-para-conteudo:focus {
  left: 0;
  color: var(--nc-marfim);
}