/*
  CAZARO Projetos e Engenharia — Design System (tokens)
  Origem: identidade CRIADA a partir da LOGO (casa isométrica em blueprint técnico navy +
  wordmark serifado "CAZARO" em vermelho carmim) + conteúdo (aprofundamento.md: projetos de
  engenharia/arquitetura + acompanhamento técnico de obra, exclusivo aos condomínios de alto
  padrão administrados pela Momentum; essência = experiência, otimização, segurança técnica).
  Não havia manual de marca. Hex medidos por amostragem de pixel em _raw/logo/Original.png e
  _raw/logo/Original on Transparent.png (Python/PIL, contagem de cor dominante):
    navy do símbolo   → #0C1248 (fill dominante, 846.953 px na versão transparente)
    vermelho do wordmark → #D03737 (fill dominante, 786.737 px na versão transparente)
  Direção de cor aprovada pelo cliente: COR DA MARCA (navy + vermelho carmim) — não monocromático.
  Arquétipo: bold-contraste (blocos de cor chapada, tipografia gigante, poucas seções densas).
  Narrativa: prova (números de autoridade — +100/+60/+50/+40/+40 — carregam a página).
  Ver design-system.md para as regras de uso (do/don't) de cada token.
*/

:root{
  /* ===== Cor — papel (ver design-system.md §2) ===== */
  --c-bg: #F5F3EE;              /* fundo geral — off-white quente (papel de prancha), nunca branco clínico */
  --c-surface: #FFFFFF;         /* cards, painéis, blocos elevados sobre --c-bg */
  --c-text: #23252B;            /* grafite — texto principal (instrução da marca: "grafite para texto") */
  --c-muted: #6C6F7E;           /* texto secundário/legendas — cinza-azulado frio, nunca cinza neutro puro */
  --c-white: #FFFFFF;           /* texto/ícone sobre superfícies escuras (--c-dark, --c-primary) */
  --c-dark: #0C1248;            /* NAVY medido da logo — base/estrutura: hero, footer, faixas escuras, linework de blueprint */
  --c-primary: #D03737;         /* CARMIM medido da logo — cor de assinatura: CTA (fundo sólido), números de prova, realces */
  --c-primary-dark: #A82A2A;    /* carmim escurecido — hover/active do CTA, nunca cor nova inventada */
  --c-accent: #D03737;          /* MESMO carmim do --c-primary — usado em DOSE (fios, sublinhados, badges, 1 palavra de destaque), nunca em bloco grande. É de propósito: UMA cor de assinatura, dois papéis (preenchimento vs. detalhe) */
  --c-n200: #E4E1D9;            /* neutro claro — hairline/divisor sobre --c-bg */
  --c-n400: #9C9C9E;            /* neutro médio — placeholder, ícone inativo, borda de input */
  --c-n500: #6C6F7E;            /* neutro escuro — mesmo valor de --c-muted, texto de apoio sobre superfícies claras */

  /* ===== Tipografia (ver design-system.md §3) ===== */
  /* Display: Bitter (slab serif robusta, peso 900) — rastreável ao wordmark serifado "CAZARO" da
     logo, mas em peso PESADO e caixa alta para casar com o arquétipo bold-contraste (o wordmark
     original é um serif clássico fino; a slab de peso 900 pega a MESMA família de traço com peso
     de bloco). Também reforça "segurança técnica": traço de slab lembra tipografia de régua/prancheta. */
  --font-display: 'Bitter', 'Georgia', 'Iowan Old Style', serif;
  /* Corpo: IBM Plex Sans — humanista, herança técnica (desenhada para uma engenharia real), ótimos
     algarismos tabulares para os números de prova (+100, +60, +50, +40, +40) da narrativa "prova". */
  --font-body: 'IBM Plex Sans', -apple-system, 'Segoe UI', Roboto, sans-serif;

  /* Escala tipográfica (clamp fluido — expressiva/gigante, "atitude" do bold-contraste) */
  --fs-display: clamp(3.25rem, 2.2rem + 5.4vw, 7.5rem);   /* H1 do hero — GIGANTE, poucas seções densas */
  --fs-h1: clamp(2.4rem, 1.9rem + 2.4vw, 4rem);
  --fs-h2: clamp(1.9rem, 1.6rem + 1.4vw, 2.75rem);
  --fs-h3: clamp(1.375rem, 1.2rem + 0.7vw, 1.75rem);
  --fs-eyebrow: clamp(0.75rem, 0.7rem + 0.1vw, 0.8125rem);
  --fs-lead: clamp(1.125rem, 1rem + 0.5vw, 1.4rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-stat: clamp(2.5rem, 2rem + 2.2vw, 4.25rem);        /* números de prova — quase do tamanho do display */
  --lh-display: 0.98;                                      /* apertado — bold-contraste não "respira" no headline */
  --lh-heading: 1.08;
  --lh-body: 1.6;
  --tracking-eyebrow: 0.16em;
  --tracking-display: -0.01em;
  --tracking-caps: 0.02em;                                 /* caixa alta do display não fecha demais */

  /* ===== Espaço, grid, raio, sombra (ver design-system.md §4) ===== */
  --container: 1240px;
  --px: clamp(20px, 5vw, 64px);
  --space-section: clamp(64px, 8vw, 140px);                /* denso p/ bold-contraste — menos ar que editorial */
  --r-sm: 2px;                                              /* quase reto — "blocos de cor chapada" não arredonda */
  --r-md: 6px;                                              /* cards/botões — leve, nunca pill grande */
  --r-pill: 999px;                                          /* só eyebrow/badge pequeno */
  --shadow-sm: 0 1px 2px rgba(12,18,72,.07), 0 2px 6px rgba(12,18,72,.05);
  --shadow-md: 0 18px 44px rgba(12,18,72,.16), 0 4px 12px rgba(12,18,72,.08);
  --ease: cubic-bezier(.22,.61,.36,1);
  --header-h: 84px;
}