/* Growthline Digital design tokens. Every colour, font and spacing value lives here. */
:root {
  /* Colour */
  --paper: #f7f5f0;          /* page background */
  --paper-2: #efece4;        /* alternate section / card */
  --white: #ffffff;          /* form fields */
  --ink: #14161a;            /* text, dark sections (16.6:1 on paper) */
  --ink-2: #3a3d44;          /* secondary text (10:1) */
  --muted: #5b5e66;          /* captions, labels (5.9:1) */
  --rule: #d9d5cc;           /* hairlines, decorative only */
  --border: #7c7f86;         /* form and control borders (3.7:1) */
  --grid: rgba(20, 22, 26, 0.06); /* chart gridlines */

  --accent: #ff5a1f;         /* signal orange: fills, lines, the dot. Never small text on paper. */
  --accent-ink: #b53d0b;     /* orange text and links on paper (5.3:1) */
  --accent-soft: #ffe9dd;    /* tinted highlight */
  --on-accent: #14161a;      /* text on orange (5.8:1) */

  --ink-muted: #a9acb3;      /* secondary text on ink (8:1) */
  --error: #b42318;          /* form errors (6:1) */

  /* Partner reference (comparison only, not used on the site) */
  --partner-cyan: #03ffe7;

  /* Type */
  --font-head: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --fs-hero: clamp(2.75rem, 9vw, 6rem);
  --fs-h2: clamp(2rem, 5vw, 3.25rem);
  --fs-h3: clamp(1.25rem, 2.4vw, 1.5rem);
  --fs-lead: clamp(1.125rem, 2.2vw, 1.375rem);
  --fs-body: 1.0625rem;      /* 17px */
  --fs-small: 0.9375rem;     /* 15px */
  --fs-label: 0.8125rem;     /* 13px mono labels */
  --fs-stat: clamp(2.5rem, 7vw, 4.5rem);

  --lh-tight: 1.02;
  --lh-head: 1.12;
  --lh-body: 1.6;
  --track-head: -0.035em;
  --track-label: 0.14em;

  /* Spacing (4px base) */
  --s-1: 0.25rem;  --s-2: 0.5rem;  --s-3: 0.75rem; --s-4: 1rem;
  --s-5: 1.5rem;   --s-6: 2rem;    --s-7: 3rem;    --s-8: 4rem;
  --s-9: 6rem;     --s-10: 8rem;

  --gutter: 1rem;            /* phone side padding */
  --section: clamp(4rem, 10vw, 8rem);
  --max: 72rem;              /* content width */
  --max-text: 40rem;         /* reading width */

  /* Shape */
  --radius: 6px;
  --radius-lg: 14px;
  --stroke: 3px;             /* growth line weight */
  --tap: 48px;               /* minimum tap target */

  /* Motion */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

@media (min-width: 48rem) {
  :root { --gutter: 2rem; }
}