/* ============================================================
   BILHART'S — Design tokens globais
   Cores, tipografia, forma e movimento da marca.
   Carregue este arquivo ANTES de qualquer outro CSS:
     <link rel="stylesheet" href="/css/tokens.css">
     <link rel="stylesheet" href="/css/style.css">
   ============================================================ */
:root{
  /* ---------- Superfícies ---------- */
  --bg:#0A0908;            /* fundo base (off-black)        */
  --bg-rgb:10,9,8;         /* p/ rgba(var(--bg-rgb),.5)     */
  --bg2:#100E0C;           /* cards e blocos elevados       */
  --bg3:#161311;           /* hover / placeholder de mídia  */

  /* ---------- Texto ---------- */
  --cream:#F4EFE9;         /* títulos em destaque           */
  --txt:#EDE7E0;           /* texto padrão                  */
  --mut:#948D85;           /* texto de apoio                */
  --dim:#6E6862;           /* labels e legendas             */
  --faint:#5E5852;         /* rodapé legal                  */

  /* ---------- Acento (único) ---------- */
  --tan:#C89A63;
  --tan-rgb:200,154,99;    /* para rgba(var(--tan-rgb),.10) */

  /* ---------- Linhas ---------- */
  --line:rgba(244,239,233,.10);
  --line2:rgba(244,239,233,.19);

  /* ---------- Tipografia ---------- */
  --font-sans:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --fw-extralight:200;
  --fw-light:300;          /* corpo de texto                */
  --fw-regular:400;
  --fw-medium:500;         /* títulos e botões              */
  --fw-semibold:600;
  --fw-bold:700;

  --fs-xl:clamp(38px,5.2vw,72px);
  --fs-lg:clamp(28px,3.6vw,50px);
  --fs-md:clamp(22px,2.2vw,32px);
  --fs-body:clamp(14.5px,1.1vw,16px);
  --fs-label:10.5px;

  --track-tight:-.035em;
  --track-wide:.24em;

  /* ---------- Forma e ritmo ---------- */
  --r:4px;                             /* raio único         */
  --pad:clamp(20px,4vw,40px);          /* respiro lateral    */
  --wrap:1200px;                       /* largura de leitura */
  --wrap-nav:1500px;                   /* barra de navegação */
  --sec-y:clamp(78px,10vw,140px);      /* respiro vertical   */

  /* ---------- Movimento ---------- */
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}