/* Groundwork Consulting design tokens (from the Groundwork design system). */

:root{
  /* Brand core — sourced from "Colour Pallette.pdf" */
  --gw-ink:#2A2829;      /* near-black, the wordmark colour */
  --gw-lime:#D8F90A;     /* signal accent */
  --gw-navy:#253551;     /* primary action / depth */
  --gw-grey:#F5F5F5;     /* cool page tint */
  --gw-cream:#F4F1EC;    /* warm paper */
  --gw-white:#FFFFFF;

  /* Ink ramp — tints of --gw-ink, no new hues */
  --ink-900:#2A2829;
  --ink-800:#3D3B3C;
  --ink-700:#555253;
  --ink-600:#6E6A6B;
  --ink-500:#8B8788;
  --ink-400:#A9A5A6;
  --ink-300:#C7C4C4;
  --ink-200:#E0DEDD;
  --ink-100:#EDEBE9;

  /* Navy ramp */
  --navy-900:#151E2F;
  --navy-700:#1D2A41;
  --navy-600:#253551;
  --navy-400:#4A5872;
  --navy-200:#B6BDC9;
  --navy-100:#E5E8ED;

  /* Lime ramp — lime is a signal, never a surface for body text */
  --lime-600:#A8C300;
  --lime-500:#D8F90A;
  --lime-200:#EEFC8A;
  --lime-100:#F7FDCB;

  /* Semantic — text */
  --text-strong:var(--ink-900);
  --text-body:var(--ink-800);
  --text-muted:var(--ink-600);
  --text-faint:var(--ink-500);
  --text-inverse:var(--gw-cream);
  --text-inverse-muted:rgba(244,241,236,.68);
  --text-link:var(--navy-600);
  --text-link-hover:var(--ink-900);
  --text-on-lime:var(--ink-900);

  /* Semantic — surfaces */
  --surface-page:var(--gw-cream);
  --surface-page-cool:var(--gw-grey);
  --surface-card:var(--gw-white);
  --surface-raised:var(--gw-white);
  --surface-sunken:var(--ink-100);
  --surface-inverse:var(--ink-900);
  --surface-inverse-alt:var(--navy-900);
  --surface-accent:var(--lime-500);
  --surface-hover:rgba(42,40,41,.04);
  --surface-pressed:rgba(42,40,41,.08);

  /* Semantic — lines */
  --line-hairline:var(--ink-200);
  --line-strong:var(--ink-900);
  --line-inverse:rgba(244,241,236,.22);
  --line-focus:var(--navy-600);

  /* Semantic — actions */
  --action-primary-bg:var(--navy-600);
  --action-primary-bg-hover:var(--navy-700);
  --action-primary-bg-pressed:var(--navy-900);
  --action-primary-fg:var(--gw-cream);
  --action-secondary-bg:transparent;
  --action-secondary-fg:var(--ink-900);
  --action-secondary-border:var(--ink-900);
  --action-accent-bg:var(--lime-500);
  --action-accent-bg-hover:var(--lime-600);
  --action-accent-fg:var(--ink-900);
  --action-disabled-bg:var(--ink-200);
  --action-disabled-fg:var(--ink-400);

  /* Status — derived to sit beside the brand, muted not neon */
  --status-positive:#3F7D53;
  --status-positive-soft:#E4EFE7;
  --status-caution:#A8760C;
  --status-caution-soft:#F7EEDC;
  --status-critical:#A33A2E;
  --status-critical-soft:#F5E5E2;
  --status-info:var(--navy-600);
  --status-info-soft:var(--navy-100);
}

:root{
  --font-display:"Teko","Arial Narrow",Impact,sans-serif;
  --font-sans:"Source Sans 3","Source Sans Pro","Helvetica Neue",Arial,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,monospace;

  /* Display — condensed caps, tight. Always uppercase. */
  --type-display-1:normal 500 104px/0.88 var(--font-display);
  --type-display-2:normal 500 76px/0.9 var(--font-display);
  --type-display-3:normal 500 52px/0.94 var(--font-display);
  --type-heading-1:normal 700 30px/1.2 var(--font-sans);
  --type-heading-2:normal 700 22px/1.25 var(--font-sans);
  --type-heading-3:normal 700 17px/1.35 var(--font-sans);
  --type-body-lg:normal 400 19px/1.6 var(--font-sans);
  --type-body:normal 400 16px/1.65 var(--font-sans);
  --type-body-sm:normal 400 14px/1.6 var(--font-sans);
  --type-caption:normal 400 13px/1.45 var(--font-sans);
  --type-label:normal 600 12px/1.2 var(--font-sans);
  --type-mono:normal 400 13px/1.5 var(--font-mono);

  --tracking-display:0.005em;
  --tracking-heading:0.04em;   /* headings are uppercase — they need air */
  --tracking-tight:-0.01em;
  --tracking-normal:0;
  --tracking-label:0.14em;   /* eyebrow / label caps */
  --tracking-wordmark:0.02em;

  --measure-narrow:46ch;
  --measure-text:66ch;
  --measure-wide:78ch;
}

:root{
  /* 4px base, doubling through the middle of the scale */
  --space-0:0px;
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:24px;
  --space-6:32px;
  --space-7:48px;
  --space-8:64px;
  --space-9:96px;
  --space-10:128px;

  --gutter:24px;
  --page-pad-x:32px;
  --page-pad-x-wide:64px;
  --section-y:96px;
  --section-y-tight:64px;
  --container-max:1240px;
  --container-narrow:760px;
  --control-h-sm:32px;
  --control-h-md:40px;
  --control-h-lg:48px;
}

:root{
  /* Surfaces are square. Controls are pills. That contrast is the system. */
  --radius-none:0px;
  --radius-xs:2px;
  --radius-sm:3px;
  --radius-pill:999px;
  --radius-card:var(--radius-none);
  --radius-input:var(--radius-xs);
  --radius-control:var(--radius-pill);
  --radius-tag:var(--radius-pill);

  --border-hairline:1px solid var(--line-hairline);
  --border-strong:1px solid var(--line-strong);
  --border-heavy:2px solid var(--line-strong);
  --border-rule-accent:3px solid var(--lime-500);
  --focus-ring:0 0 0 2px var(--gw-cream),0 0 0 4px var(--line-focus);
}

:root{
  /* Restrained. Most cards are lines, not shadows. */
  --shadow-none:none;
  --shadow-1:0 1px 2px rgba(42,40,41,.06);
  --shadow-2:0 2px 8px rgba(42,40,41,.08);
  --shadow-3:0 12px 32px rgba(42,40,41,.12);
  --shadow-inset-hairline:inset 0 -1px 0 var(--line-hairline);
  --overlay-scrim:rgba(21,30,47,.62);
  --overlay-protect-bottom:linear-gradient(to top,rgba(21,30,47,.78) 0%,rgba(21,30,47,.28) 46%,rgba(21,30,47,0) 100%); /* @kind other */
  --overlay-protect-left:linear-gradient(to right,rgba(21,30,47,.82) 0%,rgba(21,30,47,.3) 52%,rgba(21,30,47,0) 100%); /* @kind other */
  --blur-panel:saturate(140%) blur(14px); /* @kind other */
}

:root{
  --ease-standard:cubic-bezier(.2,.6,.2,1); /* @kind other */
  --ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
  --ease-in:cubic-bezier(.4,0,1,1); /* @kind other */
  --dur-instant:80ms; /* @kind other */
  --dur-fast:140ms; /* @kind other */
  --dur-base:220ms; /* @kind other */
  --dur-slow:420ms; /* @kind other */
  --transition-control:background-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),transform var(--dur-instant) var(--ease-standard); /* @kind other */
  --press-scale:0.985; /* @kind other */
}
