/* GENERATED by scripts/build.mjs from client.config.json. Do not edit.
   One file, loaded by both the marketing site and the client portal, so the two
   are visibly the same firm. Every colour and every face in the build resolves
   to something here. If a hex appears anywhere else, the verify script says so.

   The --c-* names below are role slots, not descriptions of a colour. They were
   named after the first client's palette and are referenced by name in a great
   many files, so they keep their names and change their values. Read --c-accent
   for "the brand's primary", --c-data for "whatever carries figures".
*/
@font-face{font-family:"Archivo";font-style:normal;font-weight:300;font-display:swap;src:url("fonts/archivo-300.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/archivo-400.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/archivo-500.woff2") format("woff2")}
@font-face{font-family:"Archivo";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/archivo-700.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/plexmono-400.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/plexmono-500.woff2") format("woff2")}

:root{
  /* ---- raw palette, straight from client.config.json ---- */
  --c-chalk:#E9E4D8; --c-limestone:#EDE9DF; --c-surface:#F1EEE6; --c-white:#FFFFFF;
  --c-hairline:#B9C7BF;
  --c-pewter:#3C4642; --c-graphite:#1B211F;
  --c-aubergine:#0D3538; --c-aubergine-deep:#082224;
  --c-aubergine-tint:#CFCFC5; --c-aubergine-300:#2E6B66;
  --c-ink:#2E6B66; --c-ink-deep:#0D3538;
  --c-ink-300:#496867; --c-ink-tint:#CFD3C8;
  --c-brass:#B9C7BF; --c-brass-text:#626C67;
  --c-brass-light:#C7D0C7;
  --c-brass-deep:#828D87;
  --c-brass-tint:#D8DACF;

  /* functional. Portal interface only, never the marketing site. */
  --c-ui-positive:#2E6B66; --c-ui-negative:#7A2E2A;
  --c-ui-caution:#8A6A1F; --c-ui-info:#0D3538;

  /* ---- the names the platform and the site actually read ---- */
  --ground:#E9E4D8; --ink:#1B211F; --body:#1B211F; --muted:#3C4642;
  --primary:#0D3538; --primary-deep:#082224; --primary-night:#051516;
  --secondary:#2E6B66; --accent:#0D3538;
  --positive:#2E6B66; --negative:#7A2E2A;
  --gain:#2E6B66; --loss:#7A2E2A;

  --primary-rgb:13 53 56; --ink-rgb:27 33 31;
  --accent-rgb:73 104 103; --ground-rgb:233 228 216;
  --secondary-rgb:46 107 102;
  --negative-rgb:122 46 42; --positive-rgb:46 107 102;
  /* Signal: the brand's one accent colour, for rules, ticks, active states and
     the single figure or line that matters. Never a fill. A brand without a
     separate accent in its config gets its negative colour here, so nothing
     that reads --signal is ever left without a value. */
  --signal:#7A2E2A; --signal-rgb:122 46 42;
  --hair:rgb(var(--primary-rgb) / .16);
  --hair-strong:rgb(var(--primary-rgb) / .32);
  --surface-hover:rgb(var(--ink-rgb) / .04);
  --tint:rgb(var(--primary-rgb) / .08);
  --accent-tint:rgb(var(--accent-rgb) / .12);

  /* ---- roles. Components read these, never the raw values. ---- */
  --bg:var(--c-chalk); --bg-raised:var(--c-surface); --bg-accent-soft:var(--c-aubergine-tint);
  --text:var(--c-graphite); --text-muted:var(--c-pewter); --text-on-accent:var(--c-chalk);
  --line:var(--c-hairline); --accent-hover:var(--c-aubergine-deep);
  --focus-ring:var(--c-aubergine);
  --data:var(--c-ink); --data-soft:var(--c-ink-300); --data-tint:var(--c-ink-tint);
  --bg-data:var(--c-ink-deep); --data-on-dark:#82A199;
  --edit:var(--c-brass); --edit-text:var(--c-brass-text); --edit-on-dark:var(--c-brass-light);
  --edit-deep:var(--c-brass-deep); --edit-tint:var(--c-brass-tint);

  /* ---- type ---- */
  --font-sans:"Archivo", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-serif:"Archivo", Georgia, serif;
  --font-mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  --font-quote:"Archivo", Georgia, serif;
  --sans:var(--font-sans); --serif:var(--font-serif); --mono:var(--font-mono);

  --w-regular:400; --w-medium:500; --w-bold:700;

  --t-display-1:clamp(44px, 6vw, 84px); --t-display-1-lh:0.98; --t-display-1-ls:-0.04em;
  --t-display-2:clamp(32px, 4.2vw, 54px); --t-display-2-lh:1.04; --t-display-2-ls:-0.035em;
  --t-h1:34px; --t-h1-lh:1.10; --t-h1-ls:-0.03em;
  --t-h2:24px; --t-h2-lh:1.18; --t-h2-ls:-0.025em;
  --t-h3:19px; --t-h3-lh:1.30; --t-h3-ls:-0.015em;
  --t-body-lg:19px; --t-body-lg-lh:1.60;
  --t-body:17px; --t-body-lh:1.65;
  --t-body-sm:15px; --t-body-sm-lh:1.60;
  --t-label:11px; --t-label-ls:0.16em;
  --t-caption:13px; --t-caption-lh:1.50;
  --measure:65ch;

  /* ---- space. 4px base, nothing between steps. ---- */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px;
  --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px;
  --s-9:96px; --s-10:128px; --s-11:160px; --s-12:224px;
  --section-y:clamp(56px, 7vw, 124px);
  --gutter:clamp(20px, 5vw, 64px);
  --content-max:1200px; --prose-max:680px;

  /* ---- form ---- */
  --radius:0;
  --border:1px solid var(--line);
  --border-strong:1px solid var(--c-graphite);

  /* ---- motion ---- */
  --ease:cubic-bezier(0.2, 0.7, 0.3, 1);
  --dur-fast:140ms; --dur-base:240ms; --dur-slow:420ms; --dur-reveal:620ms;

  --aperture-w:1px; --aperture:var(--c-aubergine);
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast:0ms; --dur-base:0ms; --dur-slow:0ms; }
}

html { -webkit-text-size-adjust:100%; }
body {
  background:var(--bg); color:var(--text); font-family:var(--font-sans);
  font-size:var(--t-body); line-height:var(--t-body-lh); font-weight:var(--w-regular);
  -webkit-font-smoothing:antialiased;
}
table, .figure, .data, td, th, time, [data-numeric] { font-variant-numeric:tabular-nums; }
:focus-visible { outline:2px solid var(--focus-ring); outline-offset:3px; }
::selection { background:var(--c-aubergine-tint); color:var(--c-graphite); }

/* Section tints. Each section of the platform takes one accent so a client
   always knows where they are. Derived from the brand colours, never hand
   picked. */
body.sec-dashboard{--plum:var(--primary);--plum-deep:var(--primary-deep);--lilac:#0D3538;--accent-on:var(--primary)}
body.sec-portfolio,body.sec-performance{--plum:var(--secondary);--plum-deep:#2E6B66;--lilac:#2E6B66;--accent-on:var(--secondary)}
body.sec-modelling{--plum:var(--accent);--plum-deep:#496867;--lilac:#496867;--accent-on:var(--accent)}
body.sec-analysis,body.sec-account{--plum:var(--ink);--plum-deep:var(--primary-night);--lilac:var(--muted);--accent-on:var(--ink)}