/* ==========================================================
   BASE · reset, tipografia e utilidades globais
   ========================================================== */

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; }

body {
  min-height: 100dvh;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: var(--fs-14);
  line-height: 1.5;
  letter-spacing: -0.005em;
  font-feature-settings: "cv11", "ss01";   /* "a" e "l" mais limpos */
  font-variant-numeric: tabular-nums;      /* números alinhados coluna a coluna */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

button, input, select, textarea { font: inherit; color: inherit; letter-spacing: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
a { color: inherit; text-decoration: none; }
a, button, label, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }
ul, ol { list-style: none; padding: 0; }
img, svg, video { display: block; max-width: 100%; }
svg { flex-shrink: 0; }
h1, h2, h3, h4 { font-weight: var(--peso-titulo); text-wrap: balance; }
p { text-wrap: pretty; }
[hidden] { display: none !important; }
::selection { background: var(--accent-wash); color: var(--ink); }

:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: var(--r-pequeno); }

/* ---------- Escala tipográfica ---------- */
.t-saudacao { font-size: var(--fs-48); font-weight: var(--peso-titulo); letter-spacing: var(--tr-titulo); line-height: 1.02; }
.t-pagina { font-size: var(--fs-32); font-weight: var(--peso-titulo); letter-spacing: var(--tr-titulo); line-height: 1.1; }
.t-painel { font-size: var(--fs-18); font-weight: var(--peso-titulo); letter-spacing: -0.015em; line-height: 1.25; }
.t-cartao { font-size: var(--fs-16); font-weight: var(--peso-titulo); letter-spacing: -0.01em; line-height: 1.3; }
.t-corpo { font-size: var(--fs-14); }
.t-apoio { font-size: var(--fs-13); color: var(--ink-3); }
.t-meta { font-size: var(--fs-12); color: var(--ink-3); }
.t-rotulo { font-size: var(--fs-11); font-weight: var(--peso-titulo); letter-spacing: var(--tr-caixa-alta); text-transform: uppercase; color: var(--ink-3); }
.t-numero { font-size: var(--fs-40); font-weight: var(--peso-titulo); letter-spacing: var(--tr-numero); line-height: 1; }
.t-numero small { font-size: 0.5em; color: var(--ink-4); letter-spacing: -0.02em; }
.t-destaque { color: var(--accent-ink); }

/* ---------- Ícones (traço 1.75, grade 24) ---------- */
.icone { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.icone-sm { width: 14px; height: 14px; }
.icone-lg { width: 22px; height: 22px; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* ---------- Utilidades ---------- */
.visualmente-oculto { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }

@keyframes entrar { from { opacity: 0; transform: translateY(4px); } }
@keyframes girar { to { transform: rotate(360deg); } }
@keyframes brilho { from { background-position: 150% 0; } to { background-position: -50% 0; } }

/* Troca de tema: cruzamento suave de cores */
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 280ms; animation-timing-function: var(--ease); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 1ms !important; animation-iteration-count: 1 !important; transition-duration: 1ms !important; scroll-behavior: auto !important; }
}