/* Fundacao: tokens de cor e fonte, reset e utilitarios. Vem primeiro. */

:root{
  --breu:#0E0B08;
  --pedra:#2C2721;
  --ocre:#8A6742;
  --brasa:#C9A671;
  --luz:#E8D3A8;
  --osso:#F2EDE4;
  --carvao:#0a0705;   /* daqui pra baixo: seção portfólio */
  --ferro:#cdbaa0;
  --void:#05060A; --plate:#111218; --iron:#23252C;
  --ash:#D8D4C7; --dust:#8B8678;
  --ember:#E08536; --crimson:#7E0D0D; --crimson-lit:#A81512; --destaque:#D42A22;
  --pad-top:env(safe-area-inset-top,0px);
  --pad-bot:env(safe-area-inset-bottom,0px);
  --display:"Saira Condensed",sans-serif;
  --texto:"Saira",sans-serif;
  --nav:"Archivo","Arial Black",sans-serif;
  --fx:.5;          /* enquadramento horizontal da cena (0 = esquerda, 1 = direita) */
  --fy:.5;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-padding-top:var(--pad-top);-webkit-text-size-adjust:100%}
body{background:var(--breu);color:var(--osso);font-family:var(--texto);font-weight:300;-webkit-font-smoothing:antialiased}
img{display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--brasa);outline-offset:4px}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}