/* Alinhar Engenharia · base comum das três versões da landing (13/11/2026)
   Tokens de brand/tokens/tokens.css (v0.1), com as fontes locais no lugar do Google Fonts.
   Cada versão põe o próprio CSS por cima; aqui só entra o que é da marca. */

@font-face {
  font-family: "Archivo";
  src: url("fonts/Archivo-VF.ttf") format("truetype");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Archivo";
  src: url("fonts/Archivo-Italic-VF.ttf") format("truetype");
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("fonts/IBMPlexSans-VF.ttf") format("truetype");
  font-weight: 100 700;
  font-stretch: 75% 100%;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Paleta principal (decidida) */
  --alinhar-navy: #172B49;        /* marca, títulos, texto, botão principal */
  --alinhar-blue: #3159D8;        /* só sinal: até 10% da área */
  --alinhar-terracota: #B84F25;   /* acento quente: até 10% da área */
  --alinhar-light: #F2F4F6;       /* fundo de telas */
  --alinhar-gray: #77818D;        /* bordas e elementos gráficos; nunca texto pequeno */

  /* Complementares */
  --alinhar-text-secondary: #5B6470;
  --alinhar-blue-on-dark: #5E8AFF;       /* azul sobre o azul-marinho */
  --alinhar-terracota-on-dark: #E07A4F;  /* terracota sobre o azul-marinho */
  --alinhar-surface: #E3EBFD;
  --alinhar-line: #D2D8DF;
  --alinhar-line-subtle: #E4E8ED;
  --alinhar-navy-hover: #0E213E;
  --alinhar-navy-active: #071A36;
  --alinhar-white: #FFFFFF;

  /* Tipografia */
  --alinhar-font-display: "Archivo", Arial, sans-serif;
  --alinhar-font-text: "IBM Plex Sans", Arial, sans-serif;
  --alinhar-width-display: 112%;   /* Archivo semiexpandida */
  --alinhar-width-table: 85%;      /* IBM Plex Sans condensada */

  /* Medida da página (regra do Marcony): conteúdo em ~1280px, com respiro lateral */
  --pagina-max: 1280px;
  --pagina-respiro: clamp(16px, 5vw, 96px);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--alinhar-light);
  color: var(--alinhar-navy);
  font-family: var(--alinhar-font-text);
  font-size: 16px;
  line-height: 1.55;
  font-variant-numeric: tabular-nums;
}
img, svg, video, canvas { max-width: 100%; }