/* 01-tokens: Cores, fontes, tamanhos, espaçamentos, camadas e texturas. Mude aqui para mudar o site inteiro. */

/* =========================================================
   TOKENS
   ========================================================= */
:root{
  --ink:#111111;
  --ink-2:#1a1a1a;
  --red:#CC0000;
  --red-deep:#a30000;
  --white:#ffffff;
  --concrete:#8f9190;
  --concrete-mid:#b9bab8;
  --concrete-light:#d3d4d2;
  --muted-on-dark:#a6a6a6;
  --muted-on-light:#4f4f4f;
  --line-on-dark:rgb(255 255 255 / .16);
  --line-on-light:rgb(17 17 17 / .16);

  --font:"Archivo", Arial, "Helvetica Neue", sans-serif;

  --t-display:clamp(2.6rem, 1.4rem + 5vw, 6rem);
  --t-h2:clamp(2rem, 1.2rem + 3.4vw, 4.25rem);
  --t-h3:clamp(1.25rem, 1.05rem + .8vw, 1.75rem);
  --t-number:clamp(3rem, 1.4rem + 6.4vw, 6rem);
  --t-lede:clamp(1.125rem, 1rem + .45vw, 1.375rem);
  --t-body:1.0625rem;
  --t-small:.9375rem;
  --t-micro:.8125rem;

  --gutter:clamp(16px, 4vw, 48px);
  --wrap:1320px;
  --nav-h:68px;
  --section-y:clamp(96px, 12vw, 176px);

  --ease-out:cubic-bezier(.25,1,.5,1);
  --ease-inout:cubic-bezier(.76,0,.24,1);

  --z-content:1;
  --z-nav:20;
  --z-menu:19;
  --z-prompt:40;
  --z-modal:50;

  /* Texturas de concreto: arquivos em ../assets/img/. Se ainda não existirem,
     a camada some e fica só o grão procedural abaixo. */
  --tex-noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --tex-dark:url("../assets/img/concreto-escuro.webp");
  --tex-light:url("../assets/img/concreto-claro.webp");
  --tex-panel:url("../assets/img/painel.webp");
}
