/* Reset, tipografia e regras de base. Nenhuma tela escreve <style> proprio. */

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

html, body { height: 100%; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--texto);
  font-family: var(--font);
  font-size: var(--fs-base);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  transition: background-color .15s ease, color .15s ease;
}

/* Critico: sem isso, form cai pra Arial/-apple-system */
button, input, select, textarea { font-family: inherit; }

h1, h2, h3, h4, h5 {
  font-family: var(--font-titulo);
  font-weight: 700;
  letter-spacing: -.02em;
  color: var(--texto);
  line-height: 1.2;
  margin: 0 0 var(--sp-3);
}

a { color: var(--accent-texto); text-decoration: none; }
a:hover { text-decoration: underline; }

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

::selection { background: var(--accent-soft); }

[hidden] { display: none !important; }
:focus-visible { outline: 3px solid var(--accent-texto); outline-offset: 3px; }
button { cursor: pointer; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
.pular-conteudo { position: fixed; top: -100px; left: 16px; z-index: 100; padding: 12px 20px; background: var(--surface); border: 2px solid var(--accent); border-radius: var(--radius-sm); }
.pular-conteudo:focus { top: 12px; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: var(--radius-pill); }
::-webkit-scrollbar-thumb:hover { background: var(--texto-fraco); }