/* ==========================================================================
   Manto Alpha — Design tokens
   Responsabilidade única: variáveis globais do design system consumidas pelo
   resto do CSS. Nenhum estilo de componente aqui.

   A fonte da verdade da marca é brand.css (tokens --ma-*, do brand kit
   oficial), carregado ANTES deste arquivo. Aqui os nomes antigos do app viram
   apelidos desses papéis — assim nada que ainda os use fica sem cor.
   Estética: marca plana — Preto Manto, Off-white e Amarelo Alpha como
   destaque (60/30/10). Sem gradiente, sem metal.
   ========================================================================== */

:root {
  /* ---- Apelidos de cor (legado → papéis da marca) ---- */
  --preto: var(--ma-preto-manto);
  --grafite: var(--ma-surface-raised);
  --creme: var(--ma-ink);           /* era o texto claro sobre o preto */
  --dourado: var(--ma-accent);
  --dourado-in: var(--ma-accent-text);
  --dourado-dp: var(--ma-accent-text);
  --prata: var(--ma-ink-muted);
  --prata-in: var(--ma-surface);
  --prata-dp: var(--ma-line-strong);
  --wpp: #25A65A;                   /* semântico: WhatsApp (exceção fora da paleta) */
  --txt-escuro: var(--ma-on-accent);
  --txt-suave: var(--ma-ink-muted);

  /* ---- Cores semânticas de apoio ---- */
  --erro: var(--ma-danger);
  --sucesso: var(--ma-success);
  --aviso: var(--ma-amarelo-profundo);
  --borda: var(--ma-line);

  /* ---- A marca é plana: os "gradientes" antigos viram cor chapada ---- */
  --grad-dourado: var(--ma-accent);
  --grad-dourado-suave: var(--ma-accent);
  --grad-prata: var(--ma-ink-muted);
  --grad-preto: var(--ma-surface);

  /* ---- Tipografia ---- */
  --fonte-corpo: var(--ma-font-sans);
  --fonte-titulo: var(--ma-font-display);

  --peso-normal: 400;
  --peso-medio: 600;
  --peso-forte: 800;

  /* Labels/slogan em uppercase espaçado (referência à assinatura do logo) */
  --tracking-label: 0.18em;

  /* ---- Escala tipográfica (mobile-first) ---- */
  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-lg: 1.25rem;
  --fs-xl: 1.75rem;
  --fs-2xl: 2.5rem;

  /* ---- Espaçamento ---- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-8: 3rem;

  /* ---- Raios e sombras (sombra só em hover e sobreposições) ---- */
  --raio-sm: var(--ma-radius-sm);
  --raio-md: var(--ma-radius-md);
  --raio-lg: var(--ma-radius-lg);
  --raio-full: var(--ma-radius-pill);

  --sombra-sm: var(--ma-shadow-card);
  --sombra-md: var(--ma-shadow-overlay);
  --sombra-dourada: none;

  /* ---- Layout ---- */
  --largura-max: 1120px;
  --altura-header: var(--ma-header-h);

  /* ---- Cor de tema PWA ---- */
  --tema-cor: var(--ma-preto-manto);
}
