/* ---- self-hosted fonts (no third-party requests) ---- */
@font-face{ font-family:'Archivo'; font-style:normal; font-weight:400 900; font-stretch:62% 125%; font-display:swap; src:url('/fonts/archivo-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face{ font-family:'Archivo'; font-style:normal; font-weight:400 900; font-stretch:62% 125%; font-display:swap; src:url('/fonts/archivo-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face{ font-family:'Instrument Serif'; font-style:italic; font-weight:400; font-display:swap; src:url('/fonts/instrument-serif-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face{ font-family:'Instrument Serif'; font-style:italic; font-weight:400; font-display:swap; src:url('/fonts/instrument-serif-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face{ font-family:'JetBrains Mono'; font-style:normal; font-weight:400 500; font-display:swap; src:url('/fonts/jetbrains-mono-latin.woff2') format('woff2'); unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face{ font-family:'JetBrains Mono'; font-style:normal; font-weight:400 500; font-display:swap; src:url('/fonts/jetbrains-mono-latin-ext.woff2') format('woff2'); unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF }
/* ==========================================================================
   RABZI tokens — RASTER. Light on :root, dark under [data-theme="dark"].
   Only tokens live here; no selectors other than :root, [data-theme], body.accent-*.
   ========================================================================== */
:root{
  color-scheme: light;

  /* ---- ground & ink ---- */
  --paper:#F6F4EE; --paper-2:#EEEBE3; --paper-3:#E5E1D6;
  --ink:#121215;   --ink-2:#4A4A50;   --muted:#6B6B72;
  --line:rgba(18,18,21,.14); --line-strong:rgba(18,18,21,.36); --line-hair:rgba(18,18,21,.09);

  /* ---- brand ---- */
  --signal:#F0391B;       /* blocks, marks, display ≥ 24px bold only */
  --signal-text:#C2270B;  /* red allowed for small text on paper (5.6:1) */
  --signal-fg:#121215;    /* text ON a signal block */
  --cobalt:#1D3BFF; --cobalt-text:#1D3BFF; --cobalt-fg:#F6F4EE;

  /* ---- six block colours = the six content themes (bg / fg / deep / soft) ---- */
  --block-violet:#5B3DF5; --block-violet-fg:#F6F4EE; --block-violet-deep:#3F27C9; --block-violet-soft:#E8E3FC;
  --block-ocean:#1D3BFF;  --block-ocean-fg:#F6F4EE;  --block-ocean-deep:#0E27C7;  --block-ocean-soft:#E1E6FF;
  --block-ember:#F0391B;  --block-ember-fg:#121215;  --block-ember-deep:#C2270B;  --block-ember-soft:#FCE3DC;
  --block-mint:#00C27C;   --block-mint-fg:#121215;   --block-mint-deep:#009A62;   --block-mint-soft:#DCF5EA;
  --block-sun:#FFC400;    --block-sun-fg:#121215;    --block-sun-deep:#E0A800;    --block-sun-soft:#FFF2C2;
  --block-rose:#FF4F8B;   --block-rose-fg:#121215;   --block-rose-deep:#D93470;   --block-rose-soft:#FFE0EA;

  /* ---- semantic aliases used by components ---- */
  --bg:var(--paper); --bg-2:var(--paper-2); --bg-3:var(--paper-3);
  --fg:var(--ink); --fg-2:var(--ink-2); --fg-muted:var(--muted);
  --surface:var(--paper); --surface-2:var(--paper-2);
  --surface-inverse:var(--ink); --fg-inverse:var(--paper);
  --accent:var(--signal); --accent-text:var(--signal-text); --accent-fg:var(--signal-fg);
  --accent-deep:var(--signal-text); --accent-soft:var(--block-ember-soft);
  --link:var(--ink); --link-hover:var(--cobalt-text);
  --ok:#008F5D; --warn:#B98600; --err:#C2270B;
  --focus:var(--ink);

  /* ---- the only gradients: hard-stop splits (print folds) + a halftone screen ---- */
  --grad-split:     linear-gradient(135deg, var(--signal) 0 50%, var(--cobalt) 50% 100%);
  --grad-split-ink: linear-gradient(135deg, var(--ink) 0 50%, var(--signal) 50% 100%);
  --grad-violet: linear-gradient(135deg, var(--block-violet) 0 62%, var(--block-violet-deep) 62% 100%);
  --grad-ocean:  linear-gradient(135deg, var(--block-ocean) 0 62%,  var(--block-ocean-deep) 62% 100%);
  --grad-ember:  linear-gradient(135deg, var(--block-ember) 0 62%,  var(--block-ember-deep) 62% 100%);
  --grad-mint:   linear-gradient(135deg, var(--block-mint) 0 62%,   var(--block-mint-deep) 62% 100%);
  --grad-sun:    linear-gradient(135deg, var(--block-sun) 0 62%,    var(--block-sun-deep) 62% 100%);
  --grad-rose:   linear-gradient(135deg, var(--block-rose) 0 62%,   var(--block-rose-deep) 62% 100%);
  --halftone: radial-gradient(circle, currentColor 1px, transparent 1.4px) 0 0/6px 6px;
  --raster-12: repeating-linear-gradient(90deg, var(--line-hair) 0 1px, transparent 1px calc(100%/12));

  /* ---- type ---- */
  --font-display:'Archivo','Archivo Fallback',Arial,'Helvetica Neue',Helvetica,sans-serif;
  --font-body:var(--font-display);
  --font-serif:'Instrument Serif','Instrument Serif Fallback',Georgia,'Times New Roman',serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --fs-xl:clamp(2.5rem, 1.1rem + 4.2vw, 5.75rem);
  --fs-l:clamp(2.125rem, 1.1rem + 3.2vw, 4.5rem);
  --fs-m:clamp(1.625rem, 1rem + 1.8vw, 2.75rem);
  --fs-h3:clamp(1.25rem, 1.05rem + .8vw, 1.625rem);
  --fs-h4:1.125rem;
  --fs-lead:clamp(1.125rem, 1rem + .45vw, 1.375rem);
  --fs-body:1.0625rem; --fs-small:.9375rem;
  --fs-mono:.8125rem; --fs-eyebrow:.75rem;
  --fs-stat:clamp(2.75rem, 1.25rem + 5vw, 6.5rem);
  --fs-wordmark:clamp(4rem, 19.5vw, 30rem);
  --lh-tight:.92; --lh-snug:1.05; --lh-body:1.55;
  --ls-display:-.03em; --ls-mono:.12em;
  --measure:64ch;
  --wdth-display:112; --wdth-text:100; --wdth-narrow:80;
  --wdth:112;   /* live value read by h1/.display-1; registered below so GSAP can tween it (§5.6) */

  /* ---- layout ---- */
  --cols:12;
  --gutter:clamp(12px, 1.5vw, 24px);
  --margin:clamp(16px, 3vw, 48px);
  --container:1440px; --container-wide:1760px;
  --header-h:64px; --header-h-mobile:56px;
  --section:clamp(80px, 4rem + 5vw, 152px);
  --section-s:clamp(64px, 4rem + 3vw, 112px);

  /* ---- spacing (4px base) ---- */
  --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:192px;

  /* ---- radii (zero everywhere except devices and the cursor badge) ---- */
  --r-0:0; --r-device:28px; --r-pill:999px;

  /* ---- shadows: none by design; tokens exist so agents never invent one ---- */
  --shadow-none:none; --shadow-s:none; --shadow-m:none; --shadow-l:none;

  /* ---- z-index ---- */
  --z-below:-1; --z-base:0; --z-raised:10; --z-sticky:50; --z-dock:90; --z-header:100; --z-mega:150; --z-menu:200; --z-curtain:300; --z-preloader:400; --z-cursor:500;

  /* ---- motion ---- */
  --ease-out:cubic-bezier(.16,1,.3,1);     /* arrivals: rise, cut */
  --ease-inout:cubic-bezier(.83,0,.17,1);  /* wipes, swaps, curtains */
  --ease-in:cubic-bezier(.7,0,.84,0);      /* departures only */
  --ease-flip:steps(6, end);               /* split-flap; any mechanical change */
  --ease-linear:linear;
  --d-xs:.12s; --d-s:.24s; --d-m:.48s; --d-l:.8s; --d-xl:1.2s;
  --stagger:.08s;
}

@property --wdth { syntax:'<number>'; inherits:true; initial-value:112; }

/* Explicit light (toggle) = same as :root; present so [data-theme] is always valid */
[data-theme="light"]{ color-scheme: light; }

/* Night print: same hues, inverted ground; blocks and their -fg do not change */
[data-theme="dark"]{
  color-scheme: dark;
  --paper:#101013; --paper-2:#17171B; --paper-3:#1F1F24;
  --ink:#F2F1EC;   --ink-2:#B8B7B2;   --muted:#8E8E95;
  --line:rgba(242,241,236,.14); --line-strong:rgba(242,241,236,.36); --line-hair:rgba(242,241,236,.09);
  --signal:#FF4D33; --signal-text:#FF6A52; --signal-fg:#101013;
  --cobalt:#2F4BFF; --cobalt-text:#7C8CFF; --cobalt-fg:#F2F1EC;
  --block-violet-soft:#221C45; --block-ocean-soft:#171E4A; --block-ember-soft:#3A1A14;
  --block-mint-soft:#0F2E24;  --block-sun-soft:#332B0A;   --block-rose-soft:#3A1624;
  --ok:#2FD08F; --warn:#FFC400; --err:#FF6A52;
  --focus:var(--ink);
}

/* Page accents: set by head.bodyClass = "accent-<theme>" on service/sector/case pages */
body.accent-violet{ --accent:var(--block-violet); --accent-fg:var(--block-violet-fg); --accent-deep:var(--block-violet-deep); --accent-soft:var(--block-violet-soft); --accent-text:var(--block-violet-deep) }
body.accent-ocean { --accent:var(--block-ocean);  --accent-fg:var(--block-ocean-fg);  --accent-deep:var(--block-ocean-deep);  --accent-soft:var(--block-ocean-soft);  --accent-text:var(--block-ocean-deep) }
body.accent-ember { --accent:var(--block-ember);  --accent-fg:var(--block-ember-fg);  --accent-deep:var(--block-ember-deep);  --accent-soft:var(--block-ember-soft);  --accent-text:var(--signal-text) }
body.accent-mint  { --accent:var(--block-mint);   --accent-fg:var(--block-mint-fg);   --accent-deep:var(--block-mint-deep);   --accent-soft:var(--block-mint-soft);   --accent-text:#007A4E }
body.accent-sun   { --accent:var(--block-sun);    --accent-fg:var(--block-sun-fg);    --accent-deep:var(--block-sun-deep);    --accent-soft:var(--block-sun-soft);    --accent-text:#8A6500 }
body.accent-rose  { --accent:var(--block-rose);   --accent-fg:var(--block-rose-fg);   --accent-deep:var(--block-rose-deep);   --accent-soft:var(--block-rose-soft);   --accent-text:#B8285E }

/* Materials: every section declares one; the header mirrors the one under it */
[data-material="paper"]  { --bg:var(--paper);   --fg:var(--ink) }     /* --line inherits from :root / [data-theme] — never hard-code a light value here */
[data-material="paper-2"]{ --bg:var(--paper-2); --fg:var(--ink) }
[data-material="ink"]    { --bg:var(--ink); --bg-2:#1B1B20; --bg-3:#26262C; --fg:var(--paper); --fg-2:var(--paper-2); --fg-muted:#A9A8A2; --line:rgba(246,244,238,.16); --line-strong:rgba(246,244,238,.4); --link:var(--paper); --link-hover:var(--paper-2); --focus:var(--paper); --surface:var(--ink); --surface-2:#1B1B20 }
[data-material="block"]  { --bg:var(--accent);  --fg:var(--accent-fg); --fg-2:var(--accent-fg); --fg-muted:var(--accent-fg); --line:color-mix(in srgb, var(--accent-fg) 24%, transparent); --link:var(--accent-fg); --focus:var(--accent-fg); --ink:#121215; --paper:#F6F4EE }
[data-theme="dark"] [data-material="ink"]{ --bg:#000; --fg:var(--ink); --fg-2:var(--ink-2); --surface:#000; --surface-2:#1B1B20; --link:var(--ink); --link-hover:var(--ink-2); --focus:var(--ink) }   /* on night print, "ink" sections go true black; every scoped token has to invert with it */

@media (max-width:639px){ :root{ --raster-12:repeating-linear-gradient(90deg, var(--line-hair) 0 1px, transparent 1px calc(100%/4)) } }