/* São Paulo Empreendimentos — color tokens
   Source: Manual de Marca (brand manual PDF), page 14 "As cores".
   5 institutional colors specified in PANTONE / CMYK / RGB / HEX. */

:root {
  /* ---- Brand base colors (from manual, exact hex) ---- */
  --sp-indigo: #4D49BE;    /* PANTONE 2368 C — primary, used in wordmark */
  --sp-orange: #FF7F32;    /* PANTONE 1575 C — primary, used in mark */
  --sp-blue: #1E22AA;      /* PANTONE 2736 C — secondary, deep application blue */
  --sp-yellow: #FFC72C;    /* PANTONE 123 C — accent */
  --sp-green: #48D597;     /* PANTONE 2412 C — accent */

  /* ---- Neutrals (not specified in manual; derived to pair with a cool-indigo brand) ---- */
  --sp-ink: #14152B;       /* near-black, cool-indigo undertone for headings on light bg */
  --sp-gray-900: #23243F;
  --sp-gray-700: #4B4C6B;
  --sp-gray-500: #7A7B9A;
  --sp-gray-300: #C2C3D6;
  --sp-gray-100: #EDEEF5;
  --sp-white: #FFFFFF;

  /* ---- Semantic aliases ---- */
  --text-heading: var(--sp-ink);
  --text-body: var(--sp-gray-700);
  --text-muted: var(--sp-gray-500);
  --text-on-brand: var(--sp-white);
  --text-link: var(--sp-indigo);
  --text-link-hover: var(--sp-blue);

  --surface-page: var(--sp-white);
  --surface-subtle: var(--sp-gray-100);
  --surface-card: var(--sp-white);
  --surface-brand: var(--sp-blue);
  --surface-brand-alt: var(--sp-indigo);
  --surface-inverse: var(--sp-ink);

  --border-subtle: var(--sp-gray-300);
  --border-strong: var(--sp-gray-700);

  --action-primary: var(--sp-orange);
  --action-primary-hover: #E86F22;
  --action-primary-active: #D2631A;
  --action-secondary: var(--sp-indigo);
  --action-secondary-hover: var(--sp-blue);

  --state-success: var(--sp-green);
  --state-warning: var(--sp-yellow);
  --state-info: var(--sp-indigo);
  --state-danger: #E0483C;

  --focus-ring: var(--sp-orange);

  --shadow-color: 234 30% 20%;
}