/* ==========================================
   BASE — RESET, TIPOGRAFIA-BASE E ACESSIBILIDADE GLOBAL
   Depende de: tokens.css
========================================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    background:var(--color-bg-soft);
    font-family:var(--font-base);
    color:var(--color-text);
    line-height:var(--leading-normal);
    font-size:var(--text-base);
}

/* ==========================================
   ACESSIBILIDADE — LINK "PULAR PARA O CONTEÚDO"
========================================== */

.skip-link{
    position:absolute;
    left:-9999px;
    top:0;
    z-index:var(--z-skip-link);
    background:var(--color-primary);
    color:#fff;
    padding:14px 22px;
    font-weight:700;
    text-decoration:none;
    border-radius:0 0 var(--radius-sm) 0;
}

.skip-link:focus{
    left:0;
}

/* !important necessário aqui: esta é uma classe utilitária pensada
   para forçar centralização em qualquer contexto — inclusive dentro
   de .conteudo, cujo ".conteudo p" (classe + elemento) tem
   especificidade maior que uma classe sozinha e, sem isso, vencia
   silenciosamente mantendo o texto à esquerda apesar do nome da
   classe. Mesmo padrão já usado em ".endereco-instituicao". */
.paragrafo-centralizado{
    text-align:center !important;
}

/* ==========================================
   ACESSIBILIDADE — FOCO VISÍVEL POR TECLADO
========================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible{
    outline:3px solid var(--color-focus-ring);
    outline-offset:2px;
    border-radius:4px;
}