/* ==========================================================================
   uOS · TOKENS  (v0.42.0)
   Fonte única da identidade visual. Nenhum outro arquivo deve declarar cor
   da marca em hexadecimal: use as variáveis abaixo.
   Paleta oficial: #FE8724 · #B92C13 · #000000 · #F0EEE9 (e tons de cinza do preto).
   ========================================================================== */

:root {
  /* ---- Marca ---------------------------------------------------------- */
  --uos-orange: #FE8724;          /* preenchimentos, gráficos, destaques; texto preto sobre ele (8,7:1) */
  --uos-orange-hover: #F27711;
  --uos-red: #B92C13;             /* texto de destaque e links sobre fundo claro (6,1:1 no branco) */
  --uos-red-hover: #96220F;
  --uos-black: #000000;
  --uos-paper: #F0EEE9;           /* fundo claro principal */

  /* Tons da marca (mistura com branco: 75 / 55 / 35 / 15 %) */
  --uos-orange-75: #FEA55B;
  --uos-orange-55: #FEBD87;
  --uos-orange-35: #FED5B2;
  --uos-orange-15: #FEEDDE;
  --uos-red-75: #CB614E;
  --uos-red-55: #D98B7D;
  --uos-red-35: #E7B5AD;
  --uos-red-15: #F5E0DC;

  /* Cinzas do preto (da paleta) + apoio para linhas */
  --uos-gray-900: #1A1A1A;
  --uos-gray-800: #363636;        /* texto secundário forte */
  --uos-gray-600: #666666;        /* texto secundário (≥4,9:1 sobre o papel) */
  --uos-gray-400: #989898;        /* apenas decorativo / desabilitado */
  --uos-gray-200: #D9D7D2;        /* linhas sobre o papel */
  --uos-gray-100: #E6E4DF;
  --uos-paper-2: #F7F6F3;         /* variação mais clara do papel */
  --uos-white: #FFFFFF;

  /* ---- Papéis semânticos (use estes nos novos containers) -------------- */
  --uos-bg: var(--uos-paper);
  --uos-bg-alt: var(--uos-white);
  --uos-bg-inverse: var(--uos-black);
  --uos-text: var(--uos-black);
  --uos-text-muted: var(--uos-gray-600);
  --uos-text-on-inverse: var(--uos-white);
  --uos-accent: var(--uos-orange);          /* fundo de botão, marcadores, gráficos */
  --uos-accent-text: var(--uos-red);        /* texto/links de destaque em fundo claro */
  --uos-accent-on-inverse: var(--uos-orange);
  --uos-line: rgba(0, 0, 0, 0.12);
  --uos-line-inverse: rgba(255, 255, 255, 0.18);
  --uos-focus: var(--uos-red);

  /* ---- Tipografia ------------------------------------------------------ */
  --uos-font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;  /* mesma pilha da v0.41.1 */
  --uos-font-display: var(--uos-font);
  --uos-type-body: 16px;
  --uos-type-secondary: 14px;
  --uos-type-label: 12px;
  --uos-type-micro: 11.5px;
  --uos-type-display: clamp(3rem, 5vw, 5.15rem);
  --uos-type-heading: clamp(2.1rem, 3.05vw, 3.3rem);
  --uos-type-subheading: clamp(1.65rem, 2.25vw, 2.25rem);
  --uos-type-lead: clamp(1.05rem, 1.3vw, 1.32rem);

  /* ---- Layout, forma e movimento -------------------------------------- */
  --uos-shell: 1200px;
  --uos-shell-wide: 1440px;
  --uos-radius-sm: 8px;
  --uos-radius-md: 18px;
  --uos-radius-lg: 28px;
  --uos-pill: 999px;
  --uos-section-space: clamp(5rem, 9vw, 9rem);
  --uos-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06), 0 4px 14px rgba(0, 0, 0, 0.05);
  --uos-shadow-md: 0 10px 30px rgba(0, 0, 0, 0.1);
  --uos-shadow-lg: 0 30px 80px rgba(0, 0, 0, 0.16);
  --uos-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --uos-header-height: 80px;      /* altura do cabeçalho em estado sólido */
  --uos-header-overlay-height: clamp(96px, 8.55vw, 176px); /* sobre o Hero, no topo */
  --uos-z-header: 1000;

  /* ---- Aliases do tema anterior (v0.41) -------------------------------
     Mantêm as páginas ainda não refeitas funcionando na nova paleta.
     Remover quando o último container legado for substituído.            */
  --uos-ink: var(--uos-black);
  --uos-ink-soft: var(--uos-gray-800);
  --uos-muted: var(--uos-gray-600);
  --uos-canvas: var(--uos-white);
  --uos-parchment: var(--uos-paper);
  --uos-pearl: var(--uos-paper-2);
  --uos-dark: #1A1A1A;
  --uos-dark-soft: #242424;
  --uos-hairline: var(--uos-line);
  --uos-hairline-dark: var(--uos-line-inverse);
  --uos-navy: var(--uos-black);
  --uos-blue: var(--uos-red);
  --uos-blue-hover: var(--uos-red-hover);
  --uos-blue-on-dark: var(--uos-orange);
}

@media (max-width: 1024px) {
  :root {
    --uos-header-height: 64px;
    --uos-header-overlay-height: 72px;
  }
}