/* OCA MEDIA — paleta. Valores 500 de terracota, grafite e areia extraídos pixel a pixel
   do logotipo original (assets/source/logo-source-a.png). Ocre é derivado, não amostrado. */
:root{
  /* TERRACOTA — cor de marca. Uso escasso: o A do logotipo, um destaque, um CTA por peça. */
  --terracota-100:#f7e4dd;--terracota-300:#de8a72;--terracota-500:#bd3d21;--terracota-700:#8b2a14;--terracota-900:#48150a;
  /* GRAFITE — texto e fundos escuros. Cor dominante em volume. */
  --grafite-100:#d6d5d1;--grafite-300:#8b8a84;--grafite-500:#4e4d48;--grafite-700:#292928;--grafite-900:#171716;
  /* AREIA — fundo claro padrão. Nunca branco puro. */
  --areia-100:#fdfbf8;--areia-300:#f8f4ef;--areia-500:#efe7dc;--areia-700:#dfd3c3;--areia-900:#c3b5a2;
  /* OCRE — acento secundário, restrito a dado: coluna de gráfico, número, realce de tabela. */
  --ocre-100:#f8edd8;--ocre-300:#e2b665;--ocre-500:#c68b2f;--ocre-700:#8f631f;--ocre-900:#4c340f;
  /* NEUTROS — derivados do grafite, levemente quentes. Bordas, divisórias, texto secundário. */
  --neutro-50:#f3f0eb;--neutro-100:#e7e2da;--neutro-200:#d4cec4;--neutro-300:#b7b0a5;--neutro-400:#918a7f;
  --neutro-500:#6e685e;--neutro-600:#55504a;--neutro-700:#3e3a36;--neutro-800:#2e2b29;--neutro-900:#1d1c1a;

  /* SUPERFÍCIES */
  --surface-page:var(--areia-300);
  --surface-card:var(--areia-100);
  --surface-subtle:var(--areia-500);
  --surface-sunken:var(--areia-700);
  --surface-inverse:var(--grafite-700);
  --surface-inverse-deep:var(--grafite-900);
  --surface-brand:var(--terracota-500);
  --surface-data:var(--ocre-500);

  /* TEXTO */
  --text-primary:var(--grafite-700);
  --text-secondary:var(--neutro-500);
  --text-muted:var(--neutro-400);
  --text-brand:var(--terracota-500);
  --text-data:var(--ocre-700);
  --text-on-brand:var(--areia-100);
  --text-on-dark:var(--areia-300);
  --text-on-dark-secondary:var(--neutro-300);
  --text-on-dark-accent:var(--ocre-300);

  /* BORDAS E LINHAS */
  --border-hairline:var(--neutro-200);
  --border-strong:var(--neutro-300);
  --border-brand:var(--terracota-500);
  --border-inverse:rgba(247,244,239,.16);
  --border-inverse-strong:rgba(247,244,239,.34);

  /* ESTADOS */
  --state-hover-dark:rgba(41,41,40,.06);
  --state-hover-light:rgba(247,244,239,.10);
  --state-press-dark:rgba(41,41,40,.12);
  --focus-ring:var(--terracota-500);

  /* LINK — obrigatório: o editor insere links sem estilo definido. */
  --link:var(--terracota-500);
  --link-hover:var(--terracota-700);
  --link-on-dark:var(--ocre-300);
  --link-on-dark-hover:var(--ocre-100);
}