/* =====================================================================
   SEU MAPA DE PROPÓSITO™ — TOKENS DA MARCA
   Conceito: papel de mapa (fundo claro e frio) + tinta (texto) +
   curvas de nível (padrão) + marca-texto amarelo (o que merece atenção).
   Para mudar a identidade inteira, altere apenas este arquivo.
   ===================================================================== */

/* Fontes auto-hospedadas (licença OFL — veja assets/fonts/OFL-*.txt) */
@font-face { font-family: "Fraunces"; src: url("../fonts/Fraunces-SemiBold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/InstrumentSans-Regular.woff") format("woff"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/InstrumentSans-Bold.woff") format("woff"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("../fonts/InstrumentSans-Italic.woff") format("woff"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "National Park"; src: url("../fonts/NationalPark-Bold.woff") format("woff"); font-weight: 700; font-style: normal; font-display: swap; }

:root {
  /* ---------- Cores base ---------- */
  --tinta: #18233A;            /* títulos, botões, blocos escuros */
  --tinta-2: #3A4560;          /* texto corrido */
  --tinta-3: #5B6579;          /* legendas, metadados */
  --tinta-acima: #26355A;      /* superfície sobre fundo tinta */
  --papel: #F5F6F2;            /* fundo das páginas */
  --superficie: #FFFFFF;       /* cartões e campos */
  --nevoa: #E9ECE5;            /* superfícies secundárias */
  --linha: #D6DBD0;            /* bordas e divisórias */
  --linha-forte: #B9C0B2;
  --curva: #9FA894;            /* curvas de nível decorativas */
  --marca-texto: #FFE15A;      /* o grifo: o que merece atenção */
  --marca-texto-forte: #F2C618;
  --sobre-tinta: #F5F6F2;      /* texto sobre fundo tinta */
  --sobre-tinta-2: #C3C9D6;

  /* ---------- Cores por perfil ---------- */
  --clareza: #0E7C8F;     --clareza-suave: #E1F1F3;     --clareza-tinta: #0A5866;
  --constancia: #2D7A4A;  --constancia-suave: #E3F1E8;  --constancia-tinta: #1F5835;
  --prioridades: #B5590F; --prioridades-suave: #FBEADB; --prioridades-tinta: #86410A;
  --direcao: #3E4FC0;     --direcao-suave: #E7E9FA;     --direcao-tinta: #2E3B91;
  --recomeco: #B4446E;    --recomeco-suave: #F8E4EC;    --recomeco-tinta: #883353;

  /* ---------- Semânticas ---------- */
  --sucesso: #2D7A4A;
  --erro: #B3261E;

  /* ---------- Botão principal (troque aqui para testes A/B) ---------- */
  --cta-bg: var(--tinta);
  --cta-bg-hover: #0F1829;
  --cta-fg: #FFFFFF;
  --cta-chip: var(--marca-texto);
  --cta-chip-fg: var(--tinta);

  /* ---------- Tipografia ---------- */
  --fonte-titulo: "Fraunces", Georgia, "Times New Roman", serif;
  --fonte-texto: "Instrument Sans", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --fonte-rotulo: "National Park", "Instrument Sans", "Segoe UI", system-ui, sans-serif;

  --t-xs: 0.8125rem;   /* 13px */
  --t-sm: 0.9375rem;   /* 15px */
  --t-base: 1.0625rem; /* 17px — corpo de texto */
  --t-lg: 1.1875rem;   /* 19px */
  --t-xl: clamp(1.375rem, 1.2rem + 0.8vw, 1.625rem);
  --t-2xl: clamp(1.625rem, 1.3rem + 1.6vw, 2.25rem);
  --t-3xl: clamp(2rem, 1.45rem + 2.6vw, 3.25rem);
  --t-4xl: clamp(2.25rem, 1.5rem + 3.8vw, 4rem);

  /* ---------- Espaço, forma, sombra ---------- */
  --e-1: 0.25rem; --e-2: 0.5rem; --e-3: 0.75rem; --e-4: 1rem; --e-5: 1.5rem;
  --e-6: 2rem; --e-7: 3rem; --e-8: 4rem; --e-9: 6rem;
  --raio-sm: 8px; --raio: 14px; --raio-lg: 22px; --raio-pilula: 999px;
  --sombra-1: 0 1px 2px rgba(24, 35, 58, 0.06), 0 2px 10px rgba(24, 35, 58, 0.05);
  --sombra-2: 0 14px 34px -14px rgba(24, 35, 58, 0.28);
  --largura-texto: 40rem;
  --largura-pagina: 70rem;
  --gutter: clamp(16px, 4.5vw, 32px);

  color-scheme: light;
}

/* Tema do perfil: aplique data-perfil="clareza" (etc.) em qualquer bloco */
[data-perfil="clareza"]     { --perfil: var(--clareza);     --perfil-suave: var(--clareza-suave);     --perfil-tinta: var(--clareza-tinta); }
[data-perfil="constancia"]  { --perfil: var(--constancia);  --perfil-suave: var(--constancia-suave);  --perfil-tinta: var(--constancia-tinta); }
[data-perfil="prioridades"] { --perfil: var(--prioridades); --perfil-suave: var(--prioridades-suave); --perfil-tinta: var(--prioridades-tinta); }
[data-perfil="direcao"]     { --perfil: var(--direcao);     --perfil-suave: var(--direcao-suave);     --perfil-tinta: var(--direcao-tinta); }
[data-perfil="recomeco"]    { --perfil: var(--recomeco);    --perfil-suave: var(--recomeco-suave);    --perfil-tinta: var(--recomeco-tinta); }
