{
  "name": "Clayservice",
  "version": 1,
  "color": {
    "themes": [
      {"id": "light", "name": "Claro"},
      {"id": "dark", "name": "Escuro"}
    ],
    "tokens": [
      {"name": "azul-clay", "value": "#0152A3", "usage": "Cor principal da marca: engrenagem e letreiro do logotipo. Fundo de botões primários e de blocos de destaque. Como texto, só sobre `nevoa` (6,8:1) ou `cinza-200` (5,5:1). Sobre `grafite` dá 2,2:1: nunca como texto no escuro."},
      {"name": "azul-gelo", "value": "#08A1DB", "usage": "Cor de apoio: floco de neve do logotipo. Ícones, detalhes e realces sobre `grafite` (5,6:1) e texto de link no tema escuro. Sobre `nevoa` dá 2,6:1: no claro, só decorativo, nunca texto nem ícone que carrega sentido (par da fonte, mantido exato)."},
      {"name": "grafite", "value": "#1F1F1F", "usage": "Preto da marca. Texto sobre `nevoa` (14,6:1) e fundo do tema escuro."},
      {"name": "nevoa", "value": "#F1F1F1", "usage": "Branco da marca. Fundo do tema claro, cartões sobre `cinza-200`, texto sobre `azul-clay` (6,8:1) e sobre `grafite`."},
      {"name": "cinza-200", "value": "#DBDBDB", "usage": "Fundo de página atrás de cartões `nevoa`, como na folha de apresentação da logo. Só no tema claro."},
      {"name": "cinza-300", "value": "#C1C1C1", "usage": "Painéis e divisórias suaves no claro; texto secundário no escuro (9,2:1 sobre `grafite`)."},
      {"name": "cinza-500", "value": "#878E94", "usage": "Fios divisórios (a linha vertical da folha de apresentação). Decorativo no claro (2,9:1 sobre `nevoa`); texto secundário possível no escuro (5:1 sobre `grafite`)."},
      {"name": "cinza-700", "value": "#575D63", "usage": "ADIÇÃO, não está nos arquivos: `cinza-500` escurecido para virar texto secundário legível no claro (5,9:1 sobre `nevoa`, 4,8:1 sobre `cinza-200`)."},

      {"name": "surface", "value": {"light": "{nevoa}", "dark": "{grafite}"}, "usage": "Fundo padrão de página e cartão."},
      {"name": "surface-sunken", "value": {"light": "{cinza-200}", "dark": "#000000"}, "usage": "Fundo atrás de cartões `surface`. No escuro, preto puro para separar dos cartões `grafite` (ADIÇÃO no escuro)."},
      {"name": "ink", "value": {"light": "{grafite}", "dark": "{nevoa}"}, "usage": "Texto principal sobre `surface` e `surface-sunken`."},
      {"name": "ink-muted", "value": {"light": "{cinza-700}", "dark": "{cinza-300}"}, "usage": "Texto secundário, legendas e metadados sobre `surface` e `surface-sunken` (≥4,5:1 nos dois temas)."},
      {"name": "brand", "value": {"light": "{azul-clay}", "dark": "{azul-clay}"}, "usage": "Preenchimento de botão primário e blocos de marca. Texto sobre ele: `on-brand`."},
      {"name": "on-brand", "value": {"light": "{nevoa}", "dark": "{nevoa}"}, "usage": "Texto e ícone sobre `brand` (6,8:1)."},
      {"name": "accent", "value": {"light": "{azul-gelo}", "dark": "{azul-gelo}"}, "usage": "Realces, selos, fundo de destaque secundário. Texto sobre ele: `on-accent`."},
      {"name": "on-accent", "value": {"light": "{grafite}", "dark": "{grafite}"}, "usage": "Texto sobre `accent` (5,6:1). Nunca `nevoa` sobre `azul-gelo` (2,6:1)."},
      {"name": "link", "value": {"light": "{azul-clay}", "dark": "{azul-gelo}"}, "usage": "Links e texto de destaque sobre `surface` (6,8:1 no claro, 5,6:1 no escuro)."},
      {"name": "line", "value": {"light": "{cinza-300}", "dark": "{cinza-500}"}, "usage": "Fios e divisórias decorativos sobre `surface`."},
      {"name": "line-strong", "value": {"light": "{cinza-700}", "dark": "{cinza-500}"}, "usage": "Borda de campos e controles (≥3:1 sobre `surface` nos dois temas)."},
      {"name": "focus", "value": {"light": "{azul-clay}", "dark": "{azul-gelo}"}, "usage": "Anel de foco sólido de 2px com 2px de afastamento (≥3:1 sobre `surface` nos dois temas)."}
    ]
  },
  "type": {
    "fonts": [],
    "families": {
      "mono": "\"Iosevka Charon Mono\", ui-monospace, \"SFMono-Regular\", Menlo, monospace",
      "serif": "\"Noto Serif\", Georgia, \"Times New Roman\", serif"
    },
    "groups": [
      {"name": "Títulos", "family": "mono", "styles": [
        {"name": "display", "fontSize": "48px", "lineHeight": "52px", "fontWeight": 500, "letterSpacing": "-0.5px", "sample": "Ar condicionado em dia", "usage": "Título de capa e hero. Uma por página."},
        {"name": "h1", "fontSize": "36px", "lineHeight": "42px", "fontWeight": 500, "sample": "Conserto, instalação e manutenção", "usage": "Título de página."},
        {"name": "h2", "fontSize": "28px", "lineHeight": "34px", "fontWeight": 500, "sample": "Nossos serviços", "usage": "Título de seção."},
        {"name": "h3", "fontSize": "20px", "lineHeight": "26px", "fontWeight": 500, "sample": "Manutenção preventiva", "usage": "Título de cartão e de item."},
        {"name": "label", "fontSize": "13px", "lineHeight": "16px", "fontWeight": 500, "letterSpacing": "0.5px", "sample": "SOLICITAR ORÇAMENTO", "usage": "Botões, rótulos, selos e menus, em caixa alta."}
      ]},
      {"name": "Texto", "family": "serif", "styles": [
        {"name": "body-lg", "fontSize": "18px", "lineHeight": "28px", "fontWeight": 400, "sample": "Atendemos Brasília e entorno, das 8h às 20h.", "usage": "Texto de abertura logo abaixo de títulos."},
        {"name": "body", "fontSize": "16px", "lineHeight": "26px", "fontWeight": 400, "sample": "Limpeza, instalação e conserto de ar condicionado e aquecimento.", "usage": "Texto corrido padrão."},
        {"name": "small", "fontSize": "14px", "lineHeight": "22px", "fontWeight": 400, "sample": "Aceitamos cartão, boleto e parcelamento.", "usage": "Legendas, notas e rodapé, em `ink-muted`."}
      ]}
    ]
  },
  "spacing": {
    "note": "Base de 16px, tirada da folha de apresentação (módulo de 50 unidades: vãos de 1 módulo, margens de 2).",
    "tokens": [
      {"name": "space-1", "value": "4px", "usage": "Entre ícone e texto."},
      {"name": "space-2", "value": "8px", "usage": "Padding vertical de botão; espaço entre rótulo e campo."},
      {"name": "space-4", "value": "16px", "usage": "Vão entre cartões (1 módulo); padding horizontal de botão."},
      {"name": "space-6", "value": "24px", "usage": "Padding interno de cartão."},
      {"name": "space-8", "value": "32px", "usage": "Margem de página no celular (2 módulos)."},
      {"name": "space-12", "value": "48px", "usage": "Espaço entre seções."}
    ]
  },
  "radius": {
    "note": "Cantos concêntricos: raio interno = raio externo − padding. Ex.: cartão `radius-lg` com padding `space-2` leva dentro `radius-md`.",
    "tokens": [
      {"name": "radius-sm", "value": "4px", "usage": "Selos e campos pequenos."},
      {"name": "radius-md", "value": "8px", "usage": "Botões e campos."},
      {"name": "radius-lg", "value": "16px", "usage": "Cartões e blocos: o mesmo raio de 1 módulo de todos os cartões da folha de apresentação."}
    ]
  }
}