/* Sprout Insights design tokens (source: Sprout design system).
   The prototype pages use these values as inline styles. Refactor the
   site to consume these variables from one shared stylesheet. */
:root {
  /* Brand colour */
  --sp-green: #0F8C3B;        /* primary: headlines accents, buttons, rules */
  --sp-green-dark: #0B6B2C;   /* small green text and links (AA on white) */
  --sp-green-deep: #0B3D1E;   /* footer background */
  --sp-green-tint: #CFE8BD;   /* labels on dark green, map coverage */
  --sp-orange: #FF5A00;       /* accent, use sparingly */
  --sp-lime: #6DBC37;
  --sp-teal: #19BC88;
  --sp-cyan: #01A6C5;
  /* Neutrals */
  --sp-ink: #333333;          /* body text, never pure black */
  --sp-ink-muted: #4B514C;
  --sp-ink-subtle: #8A8A8A;
  --sp-line: #E4E4E4;
  --sp-tint: #F2F2F0;         /* section panels */
  --sp-white: #FFFFFF;
  /* Type */
  --sp-font: 'Aptos', 'Figtree', system-ui, sans-serif;
  --sp-display-xl: 80px;      /* home hero h1 */
  --sp-display-l: 56px;       /* inner page h1 */
  --sp-display-m: 42px;       /* section h2 */
  --sp-heading: 24px;
  --sp-body-l: 20px;
  --sp-body: 16px;
  --sp-body-s: 15px;
  --sp-eyebrow: 13px;         /* uppercase, 700, letter-spacing 0.14em */
  --sp-lh-display: 1.1;
  --sp-lh-body: 1.6;
  /* Layout */
  --sp-container: 1280px;
  --sp-gutter: 32px;
  --sp-section-y: 104px;
  --sp-radius: 14px;          /* cards and images */
  --sp-radius-lg: 20px;       /* large feature cards */
  --sp-ring-weight: 22px;     /* the thick orange ring: the logo's "o" */
  --sp-radius-pill: 999px;    /* buttons and tags */
  --sp-shadow-card: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);
  --sp-shadow-hover: 0 8px 24px rgba(0,0,0,.10);
  --sp-transition: 150ms ease;
  /* Extra tones */
  --sp-green-pale: #E6F6EA;   /* eyebrow on solid green */
  --sp-lime-pale: #B5DE9A;
  --sp-line-strong: #C9C9C6;  /* form field borders */
  /* Text and lines on dark green */
  --sp-on-dark-strong: rgba(255,255,255,0.88);
  --sp-on-dark: rgba(255,255,255,0.82);
  --sp-on-dark-muted: rgba(255,255,255,0.72);
  --sp-on-dark-line: rgba(255,255,255,0.14);
  --sp-on-dark-border: rgba(255,255,255,0.18);
  --sp-on-dark-fill: rgba(255,255,255,0.07);
  /* Decorative rings */
  --sp-focus-ring: rgba(15,140,59,0.18);
  --sp-ring-white: rgba(255,255,255,0.22);
  --sp-ring-green: rgba(15,140,59,0.10);
  --sp-ring-green-strong: rgba(15,140,59,0.35);
  --sp-ring-orange: rgba(255,90,0,0.10);
  --sp-ring-orange-mid: rgba(255,90,0,0.30);
  --sp-ring-orange-bold: rgba(255,90,0,0.35);
  --sp-ring-orange-strong: rgba(255,90,0,0.45);
  --sp-ring-lime: rgba(109,188,55,0.30);
}
