/* Brinkworks — brand tokens (minimal variant only)
   Self-hosted Manrope + Source Serif, and the approved warm-neutral
   palette from BW Style Guide / BW Font Guide. This file is not loaded
   by the full variant, so none of this affects site-variants/full or
   public/assets/css/site.css — it only overrides tokens.css's
   Fraunces/Inter/enterprise-blue values for pages that load this file.

   Only the weights actually shipped as files are declared: Manrope
   Regular + SemiBold, Source Serif 4 Regular.

   The Style Guide/concept define a single light palette and show no
   switcher UI, so there's deliberately no visible/prominent theme
   control — but a small, low-key dark-mode toggle was added at the
   user's explicit request (footer, not header). The dark values below
   are a from-scratch extrapolation, not part of the approved brand
   kit — same warm hue family as the light palette, no unrelated
   accent colour introduced. Applied the same way as the full variant's
   tokens.css: automatically via prefers-color-scheme, and explicitly
   via [data-theme="dark"] (set by theme-init.js/site.js, the same
   shared scripts the full variant uses — no new JS was written). */

@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/manrope/Manrope-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Manrope";
  src: url("/assets/fonts/manrope/Manrope-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Source Serif";
  src: url("/assets/fonts/source-serif/SourceSerif4-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-sans: "Manrope", Arial, sans-serif;
  --font-statement: "Source Serif", Georgia, serif;

  /* A wider max-width than the shared --content-max (tokens.css, used
     by the full variant), matching this design's proportions. Local to
     this file/variant only. */
  --content-max-brand: 78rem;
  --radius-panel: 28px;

  /* Brand tokens, exactly as specified in BW Style Guide */
  --bw-canvas: #f4f2ef;
  --bw-surface: #f1ede8;
  --bw-border: #d4d2d0;

  /* BW Style Guide gives #737373 for muted/secondary copy. At normal
     text sizes that is ~4.24:1 against #f4f2ef — just under the 4.5:1
     WCAG AA minimum. Darkened slightly to #6b6b6b (~4.8:1) so no text
     on the page falls below AA; visually indistinguishable at a glance. */
  --bw-muted: #6b6b6b;
  --bw-ink: #473c30;

  /* Semantic roles, built from the tokens above (see "Colour system":
     canvas = page bg, surface = panels, muted = secondary/eyebrow,
     ink = primary copy + controls) */
  --color-bg: var(--bw-canvas);
  --color-surface: var(--bw-surface);
  --color-text: var(--bw-ink);
  --color-text-muted: var(--bw-muted);
  --color-border: var(--bw-border);
  --color-border-strong: #b8b4ae;

  /* Solid (hero) button: dark ink fill, light text */
  --color-button-bg: var(--bw-ink);
  --color-button-bg-hover: #362c22;
  --color-button-text: var(--bw-canvas);

  --color-theme-browser: #f4f2ef;
}

/* tokens.css (shared, loaded first) also has a :root[data-theme="dark"]
   block, at the same (0,2,0) specificity as the explicit block below —
   its enterprise-blue --color-bg/-text/-surface/-border would otherwise
   win over this file's on ties are broken by source order, but only for
   properties actually redeclared here. --color-bg etc. were originally
   left as a static `var(--bw-canvas)` reference set only in the plain
   :root{} above (0,1,0) — lower specificity than tokens.css's own dark
   block, so tokens.css's dark values leaked through. Every semantic
   alias touched by dark mode is redeclared explicitly below to fix that. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bw-canvas: #211c17;
    --bw-surface: #29221a;
    --bw-border: #3a3128;
    --bw-muted: #b9b2a6;
    --bw-ink: #f1ede8;

    --color-bg: var(--bw-canvas);
    --color-surface: var(--bw-surface);
    --color-text: var(--bw-ink);
    --color-text-muted: var(--bw-muted);
    --color-border: var(--bw-border);
    --color-border-strong: #4d4234;

    --color-button-bg: #f1ede8;
    --color-button-bg-hover: #e2dcd0;
    --color-button-text: #211c17;

    --color-theme-browser: #211c17;
  }
}

:root[data-theme="dark"] {
  --bw-canvas: #211c17;
  --bw-surface: #29221a;
  --bw-border: #3a3128;
  --bw-muted: #b9b2a6;
  --bw-ink: #f1ede8;

  --color-bg: var(--bw-canvas);
  --color-surface: var(--bw-surface);
  --color-text: var(--bw-ink);
  --color-text-muted: var(--bw-muted);
  --color-border: var(--bw-border);
  --color-border-strong: #4d4234;

  --color-button-bg: #f1ede8;
  --color-button-bg-hover: #e2dcd0;
  --color-button-text: #211c17;

  --color-theme-browser: #211c17;
}