/* =============================================================
   Tipografia do site. Três fontes, e só três:
     título   Source Serif 4   (serifa editorial)
     texto    Hanken Grotesk   (texto, botão, menu, formulário, número)
     citação  Caveat           (manuscrita, só em citação e destaque curto)
   Carregar este arquivo por ÚLTIMO em toda página: ele vale por cima do
   design system (src/css/ds/) e do Tailwind das páginas /para/.
   Rótulo acima do título é frase normal: sem caixa alta espaçada e sem traço.
   ============================================================= */

:root {
  --titulo: "Source Serif 4", Georgia, "Times New Roman", serif;
  --texto:  "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mao:    "Caveat", "Segoe Print", cursive;

  /* O design system chamava a fonte de --fonte e a de código de --mono.
     As duas passam a ser o texto, então a fonte de código sai do site. */
  --fonte: var(--texto);
  --mono:  var(--texto);

  /* Escala: cinco tamanhos */
  --t-pagina:  clamp(2.35rem, 5.6vw, 3.75rem);  /* título da página */
  --t-secao:   clamp(1.85rem, 3.9vw, 2.7rem);   /* título de seção */
  --t-cartao:  1.3rem;                           /* título de cartão */
  --t-texto:   1.0625rem;                        /* texto (17px) */
  --t-pequeno: .875rem;                          /* legenda, rótulo, nota */
}

/* ---------- Texto ---------- */
body { font-family: var(--texto); font-size: var(--t-texto); }
button, input, select, textarea, .btn, .menu a, .menu-movel a { font-family: var(--texto); }
.font-sans { font-family: var(--texto); }
/* Título é sempre serifa, mesmo quando o Tailwind marcou font-sans nele */
h1.font-sans, h2.font-sans, h3.font-sans, h4.font-sans { font-family: var(--titulo) !important; font-weight: 600 !important; }

/* ---------- Títulos ---------- */
h1, h2, h3, h4, .h-secao, .h-section, .logo__nome {
  font-family: var(--titulo);
  font-weight: 600;
  letter-spacing: -.012em;
  font-optical-sizing: auto;
}
h1 { font-size: var(--t-pagina); line-height: 1.06; }
.h-secao, .h-section, h2 { line-height: 1.1; }
.h-secao, .h-section { font-size: var(--t-secao); }
h3, h4 { letter-spacing: -.005em; line-height: 1.25; }
.logo__nome { font-size: 1.05rem; letter-spacing: -.005em; }
.hero h1 { font-weight: 600; letter-spacing: -.018em; }

/* ---------- Números: a fonte do texto, com algarismos alinhados ---------- */
.mono, .font-mono, .hero__numero strong, .dif__n, .passo__n, .treino__dia b, .stat-num,
.dia__data, .pix__valor, .barra__n {
  font-family: var(--texto);
  font-variant-numeric: tabular-nums lining-nums;
}
.hero__numero strong, .stat-num, .dia__data { font-family: var(--titulo); font-weight: 600; letter-spacing: -.01em; }

/* ---------- Rótulos: frase normal, sem risquinho, sem caixa alta ---------- */
.eyebrow {
  font-family: var(--texto);
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
}
.eyebrow::before { content: none; display: none; }

.logo__tag, .selo, .hero__numero span, .servico__para, .citacao cite, .projeto__tipo, .projeto__pe,
.orcamento__passo, .ficha__s, .pref summary, .lista-chave small, .rodape__titulo, .tecnologias__t,
.modelo__quando small, .treino__vivo, .treino__leva h3, .treino__dia h3 span, .passo__recebe small,
.projeto__barra span, .treino__dia em,
.stat-label, .quote-band cite, .info-k,
.dia__longo, .pessoa__dados, .resumo h3 {
  font-family: var(--texto);
  text-transform: none;
  letter-spacing: 0;
}
.logo__tag { font-size: .8rem; font-weight: 600; }
.orcamento__passo, .pref summary, .rodape__titulo, .treino__leva h3, .resumo h3 { font-size: var(--t-pequeno); font-weight: 700; }
.hero__numero span, .servico__para, .projeto__tipo, .projeto__pe, .ficha__s, .lista-chave small, .modelo__quando small,
.treino__dia h3 span, .passo__recebe small, .stat-label, .info-k, .dia__longo, .pessoa__dados, .selo {
  font-size: .82rem; font-weight: 600;
}
.treino__vivo { font-size: .88rem; font-weight: 600; }

/* Utilitários do Tailwind nas páginas /para/ */
.uppercase { text-transform: none !important; }
[class*="tracking-["]:not(h1):not(h2):not(h3) { letter-spacing: normal !important; }

/* ---------- Citação: a manuscrita ---------- */
blockquote, .citacao blockquote, .quote-band blockquote {
  font-family: var(--mao);
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.12;
}
.citacao blockquote { font-size: clamp(2rem, 4.4vw, 3rem); }
.quote-band blockquote { font-size: clamp(1.9rem, 4.2vw, 2.8rem); }

/* Estilos que as páginas trazem dentro delas */
.politica h2 { font-weight: 600; letter-spacing: -.008em; }

/* Rótulo pequeno das listas de tecnologia e setores */
.tecnologias__t { font-size: .88rem; font-weight: 600; color: var(--subtle); }

/* O Tailwind aperta as letras dos títulos (tracking-tight); na serifa isso espreme */
h1[class*="tracking"], h2[class*="tracking"], h3[class*="tracking"] { letter-spacing: -.015em !important; }
