/* tokens.css · Tracktor Leads · landing (02/10/2026)
   Estrutura herdada da referência linear: escala tipográfica por frequência
   (16 corpo, 13/14 interface, 12 rótulo, 48 seção, 64 a 72 manchete), base 4px,
   raio 6 (botão) e 12 (cartão), fio fino no lugar de sombra, seção a cada 96px.
   Cor remapeada para a marca: ../tokens-cliente.css saiu do tokens_cliente.py --remap.
   Nenhum hex da referência fica aqui. */

:root {
  color-scheme: dark;

  /* superfícies · tinta da Tracktor */
  --bg: #0E1116;
  --surface-1: #141920;
  --surface-2: #1b212a;
  --surface-3: #232a34;
  --surface-deep: #0a0d11;          /* moldura do celular e fundo da conversa */
  --line: rgba(255, 255, 255, .08);  /* fio padrão */
  --line-strong: rgba(255, 255, 255, .14);

  /* texto */
  --text: #f3f5f7;
  --text-2: #c9d0d8;
  --text-muted: #9aa3ad;
  --text-faint: #858f9a;

  /* acento único · verde do Tracktor Leads */
  --accent: #047857;                 /* preenchimento: botão, etiqueta */
  --accent-hover: #059669;           /* anel do hover (texto branco sobre ele não passa 4.5:1) */
  --accent-hover-fill: color-mix(in srgb, #047857 72%, #059669 28%);
  --accent-text: #10b981;            /* texto verde sobre fundo escuro */
  --accent-wash: rgba(16, 185, 129, .10);
  --accent-line: rgba(16, 185, 129, .32);
  --bubble-out: #0a3a30;             /* balão enviado: verde do acento afundado na tinta */
  --on-accent: #ffffff;

  /* marca-mãe · só no rodapé */
  --tracktor-red: #D14840;

  /* tipografia · papéis da identidade Tracktor */
  --font-display: 'Archivo', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;  /* afirmação */
  --font-body: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;        /* explicação */
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;               /* estrutura */

  /* escala fixa (linear, por frequência de uso) */
  --text-label: 12px;
  --text-caption: 13px;
  --text-ui: 14px;
  --text-body-sm: 15px;
  --text-body: 16px;
  --text-body-lg: 19px;
  --text-sub: 24px;

  /* escala fluida: o teto só chega em 1440px (regra do MacBook 13) */
  --fs-hero: clamp(2.375rem, 1.679rem + 2.857vw, 4.25rem);       /* 38px em 390 · 68px em 1440 */
  --fs-h2: clamp(2rem, 1.443rem + 2.286vw, 3.5rem);              /* 32px em 390 · 56px em 1440 */
  --fs-pain: clamp(1.5rem, 1.129rem + 1.524vw, 2.5rem);          /* 24px em 390 · 40px em 1440 */
  --fs-manifesto: clamp(2.125rem, 1.057rem + 4.381vw, 5rem);     /* 34px em 390 · 80px em 1440 */
  --fs-price: clamp(2.5rem, 2.036rem + 1.905vw, 3.75rem);        /* 40px em 390 · 60px em 1440 */

  --tracking-display: -0.025em;
  --tracking-heading: -0.022em;
  --tracking-sub: -0.012em;
  --tracking-label: 0.08em;

  /* espaço · base 4px */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 20px; --s-6: 24px;
  --s-8: 32px; --s-10: 40px; --s-12: 48px; --s-14: 56px; --s-16: 64px;
  --s-20: 80px; --s-24: 96px; --s-32: 128px;

  --page-max: 1200px;
  --gutter: 16px;
  --section-gap: 64px;
  --nav-h: 60px;

  /* raio · três valores e o círculo */
  --r-small: 2px;
  --r-badge: 4px;
  --r-button: 6px;
  --r-card: 12px;
  --r-pill: 9999px;

  /* elevação · fio, não sombra */
  --ring: 0 0 0 1px var(--line) inset;
  --ring-strong: 0 0 0 1px var(--line-strong) inset;
  --shadow-float: 0 4px 32px rgba(14, 17, 22, .6);

  /* movimento (movimento.css, valores DERIVADO/MEDIDO mantidos) */
  --ease-revela: cubic-bezier(0.215, 0.61, 0.355, 1);
  --ease-ui: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-traco: cubic-bezier(0.645, 0.045, 0.355, 1);
  --dur-micro: 160ms;
  --dur-ui: 250ms;
  --dur-body: 400ms;
  --dur-head: 500ms;
  --dur-display: 900ms;
  --stagger-linha: 90ms;
  --stagger-label: 50ms;
  --stagger-grade: 60ms;
  --shift-display: 24px;
  --shift-body: 12px;
}

@media (min-width: 640px) {
  :root { --gutter: 24px; }
}
@media (min-width: 1024px) {
  :root { --gutter: 32px; --section-gap: 96px; }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-micro: 1ms; --dur-ui: 1ms; --dur-body: 1ms; --dur-head: 1ms; --dur-display: 1ms;
    --stagger-linha: 0ms; --stagger-label: 0ms; --stagger-grade: 0ms;
    --shift-display: 0px; --shift-body: 0px;
  }
}
