/* CredCast — tokens oficiais, 2026-11-12
   Cores medidas nos arquivos de Identidade. cream-muted e ink-muted
   são tokens de hierarquia de texto, não cores de marca.
   UI/texto: Anybody (OFL), no lugar da Eurostile. Display: Bebas Neue. */
@font-face {
  font-family: "Bebas Neue";
  src: url("../assets/fonts/BebasNeue-Regular.woff2") format("woff2"), url("../assets/fonts/BebasNeue-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Anybody";
  src: url("../assets/fonts/Anybody-variable.woff2") format("woff2");
  font-weight: 100 900;
  font-stretch: 50% 150%;
  font-style: normal;
  font-display: swap;
}

:root, [data-theme="dark"] {
  --ink: #1C1C1C;
  --ink-deep: #111111;
  --cream: #F3EFF0;
  --cream-soft: #F0ECEC;
  --accent: #F1C800;
  --hairline: #2A2A2A;
  --hairline-strong: #3A3A3A;
  --cream-muted: #A9A5A6;
  --ink-muted: #5A5657;
  --elev-0: none;
  --elev-1: 0 1px 0 0 #111111;
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 16px;
  --space-4: 24px;
  --space-5: 32px;
  --space-6: 48px;
  --space-7: 64px;
  --space-8: 96px;
  --radius-none: 0;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-full: 50%;
  --font-display: "Bebas Neue", sans-serif;
  --font-ui: "Anybody", sans-serif;
}
.display-xl { font-family: var(--font-display); font-size: 120px; line-height: 0.9; font-weight: 400; letter-spacing: 0.01em; text-transform: uppercase; }
.display-lg { font-family: var(--font-display); font-size: 88px; line-height: 0.92; font-weight: 400; letter-spacing: 0.01em; text-transform: uppercase; }
.h1 { font-family: var(--font-display); font-size: 64px; line-height: 0.95; font-weight: 400; letter-spacing: 0.01em; text-transform: uppercase; }
.h2 { font-family: var(--font-display); font-size: 48px; line-height: 1; font-weight: 400; letter-spacing: 0.01em; text-transform: uppercase; }
.h3 { font-family: var(--font-display); font-size: 32px; line-height: 1; font-weight: 400; letter-spacing: 0.02em; text-transform: uppercase; }
.body { font-family: var(--font-ui); font-size: 17px; line-height: 1.55; font-weight: 400; }
.body-sm { font-family: var(--font-ui); font-size: 15px; line-height: 1.5; font-weight: 400; }
.label { font-family: var(--font-ui); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; }
.button { font-family: var(--font-ui); font-size: 14px; line-height: 1; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; }
.caption { font-family: var(--font-ui); font-size: 13px; line-height: 18px; font-weight: 400; }

/* tokens de estrutura (v5): não alteram cor, tipo, raio nem a escala de espaço */
:root {
  --bp-sm: 640px; --bp-md: 768px; --bp-lg: 1024px; --bp-xl: 1280px;
  --container-sm: 640px; --container-md: 720px; --container-lg: 960px; --container-xl: 1120px; --container-max: 1280px;
  --gutter: var(--space-4); --gutter-lg: var(--space-6);
  --grid-columns: 12; --measure: 36rem; --header-height: 72px;
}
