/**
 * Camada 2 — base.
 * Reset, tipografia e o contêiner. Nada com nome de componente entra aqui.
 */
*{margin:0;padding:0;box-sizing:border-box;font-family:var(--font-text);}
html{scroll-behavior:smooth;}
body{background:var(--page);color:var(--ink);-webkit-font-smoothing:antialiased;}
h1,h2,h3,h4{font-family:var(--font-display);}
img,svg{display:block;}
img{max-width:100%;height:auto;}
a{color:inherit;text-decoration:none;}
button{font-family:var(--font-text);cursor:pointer;}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--wrap-pad);}

/* Acessibilidade: o texto que só o leitor de tela vê. */
.screen-reader-text{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.skip-link:focus{
  position:fixed;top:12px;left:12px;z-index:100;width:auto;height:auto;
  clip:auto;background:var(--ink);color:#fff;padding:12px 18px;border-radius:var(--radius-sm);
}

:focus-visible{outline:2px solid var(--rb);outline-offset:2px;}

@media (max-width:880px){
  :root{--wrap-pad:18px;}
  /* Rede de segurança: nada que vaze para o lado vira rolagem horizontal. */
  html,body{overflow-x:clip;}
}