/* ==========================================================
   _base.css — Reset, tipografia e utilitários
   Compartilhado por todas as páginas da plataforma.
   ========================================================== */

/* --- Reset ------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

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

body {
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  font-size: 15px;
  line-height: 1.6;
  color: var(--text);
  background: var(--bg);
  min-height: 100dvh;
}

img, svg {display: block;}

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

ul, ol { list-style: none; }

/* --- Tipografia ------------------------------------------- */
h1, h2, h3, h4 { line-height: 1.3; font-weight: 700; color: var(--text); margin: 0 0 1em; }
h1 { font-size: clamp(1.375rem, 3vw, 1.625rem); }
h2 { font-size: 1.2rem; }
h3 {font-size: 1rem;font-weight: 600;text-align: left;}

/* --- Utilitários ------------------------------------------ */
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

.hidden { display: none !important; }

/* O atributo hidden sempre oculta, mesmo que um display de autor
   (flex/grid/inline-flex) tente sobrescrevê-lo. */
[hidden] { display: none !important; }

/* --- Estado de carregamento -------------------------------- */
.skeleton {
  background: linear-gradient(90deg, var(--bg) 25%, var(--line) 50%, var(--bg) 75%);
  background-size: 200% 100%;
  animation: skeleton-shine 1.4s infinite;
  border-radius: var(--radius-sm);
}

@keyframes skeleton-shine {
  to { background-position: -200% 0; }
}