/* Capability Actual — design tokens.
   Warm neutrals, near-black, burnished orange. Nothing new gets added here
   without a reason; the palette is the brand. */

:root {
  --bg: #f2ebdd;
  --surface: #faf7f0;
  --fg: #171717;
  --fg-dim: #4a4842;
  --muted: #6c6961;
  --border: #d5cdbf;
  --accent: #c9652d;
  --accent-hover: #a94d22;

  --hero-bg: #171717;
  --hero-bg-2: #1d1b17;
  --hero-fg: #f2ebdd;
  --hero-dim: #a8a291;
  --hero-border: #33322c;

  --shadow: 0 1px 2px rgba(21, 21, 19, 0.05), 0 8px 24px rgba(21, 21, 19, 0.06);

  --sans: "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --head: "Archivo", "Inter", ui-sans-serif, -apple-system, "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* Strong ease-out for press feedback. The built-in `ease` is too weak for
     motion the user is looking straight at. Not theme-dependent. */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #171717;
    --surface: #20201d;
    --fg: #f2ebdd;
    --fg-dim: #d3ccbc;
    --muted: #928c7d;
    --border: #33322d;
    --accent: #e07a44;
    --accent-hover: #ec8c57;

    --hero-bg: #0f0e0c;
    --hero-bg-2: #17150f;
    --hero-fg: #f2ebdd;
    --hero-dim: #8f897a;
    --hero-border: #2b2a24;

    --shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 10px 30px rgba(0, 0, 0, 0.35);
  }
}

:root[data-theme="dark"] {
  --bg: #171717;
  --surface: #20201d;
  --fg: #f2ebdd;
  --fg-dim: #d3ccbc;
  --muted: #928c7d;
  --border: #33322d;
  --accent: #e07a44;
  --accent-hover: #ec8c57;

  --hero-bg: #0f0e0c;
  --hero-bg-2: #17150f;
  --hero-fg: #f2ebdd;
  --hero-dim: #8f897a;
  --hero-border: #2b2a24;

  --shadow: 0 1px 2px rgba(0, 0, 0, 0.4), 0 10px 30px rgba(0, 0, 0, 0.35);
}

/* ---------------------------------------------------------------
   Shared palette, carried over from the first pass on this branch.
   The product apps import or copy these names; the page itself uses
   the semantic tokens above. Keep the two in step.
   --------------------------------------------------------------- */
:root {
  --ca-cream: #f2ebdd;
  --ca-cream-2: #faf7f0;
  --ca-black: #171717;
  --ca-black-2: #0f0e0c;
  --ca-ink: #171717;
  --ca-ink-dim: #4a4842;
  --ca-muted: #6c6961;
  --ca-border: #d5cdbf;
  --ca-accent: #c9652d;
  --ca-accent-hover: #a94d22;
  --ca-sans: "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ca-head: "Archivo", "Inter", ui-sans-serif, -apple-system, "Segoe UI", sans-serif;
  --ca-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --ca-radius: 12px;
}