/* Awesome Cause — Civic Pop tokens. Compiled from design-system/tokens.json; edit the JSON, not this file. */
:root, [data-theme="light"] {
  --paper: #f7f3ea; /* Page ground */
  --paper-raised: #ffffff; /* Windows, cards, inputs and quote blocks on paper */
  --mint: #dcefe3; /* Cool tint ground for the trust strip (calm, steady) and tint blocks inside windows */
  --butter: #f3e9bd; /* Warm tint ground for the work section (energy, attention), derived from mustard */
  --space: #0f1336; /* Dark section ground: who-we-serve, crew, footer */
  --space-raised: #1c2150; /* Cards and windows that sit on space */
  --navy: #323a66; /* Heritage navy: the ink of the old illustrations and outline icons, blocks on mint, cards on space */
  --ink: #000000; /* Headings and body on paper, paper-raised and mint */
  --ink-muted: #5b5e66; /* Secondary text, captions and labels on paper, paper-raised and mint (5.9:1 on paper) */
  --ink-on-space: #f7f3ea; /* Headings and body on space, space-raised and navy */
  --ink-muted-on-space: #b9bccf; /* Secondary text on space, space-raised and navy (9.6:1 on space) */
  --link: #b80050; /* Inline text links on paper, paper-raised and mint, underlined */
  --pink: #ec0f68; /* The heart */
  --pink-deep: #b80050; /* The heart's stroke */
  --pink-tint: #fde3ee; /* Wash behind sticker badges and highlighted rows on paper; ink reads on it */
  --on-accent: #000000; /* Text and glyphs on pink and mustard fills in both themes (4.8:1 on pink, 11:1 on mustard) */
  --mustard: #e5c91f; /* Secondary button fill, highlight blocks, the CTA band, stat numerals on space (10.9:1), the offset shadow in Space */
  --mustard-deep: #cbb31c; /* Pressed mustard button and rules on mustard blocks */
  --white: #ffffff; /* Window title bars and the reverse logo */
  --line: #000000; /* The 2px keyline on every window, button, badge, input and image frame */
  --line-soft: #dbdcdd; /* Dividers, table rules and the border of disabled controls */
  --shadow-ink: #000000; /* Color of the hard offset shadow behind windows and buttons: black on paper, mustard on space */
  --focus: #323a66; /* Focus ring: 3px solid, 2px outside the control */
  --shadow-offset-sm: 3px 3px 0 0 #000000;
  --shadow-offset: 6px 6px 0 0 #000000;
  --shadow-offset-lg: 10px 10px 0 0 #000000;
  --shadow-none: none;
}
[data-theme="dark"] {
  --paper: #0f1336;
  --paper-raised: #1c2150;
  --mint: #323a66;
  --butter: #2c2915;
  --space: #000000;
  --space-raised: #1c2150;
  --navy: #323a66;
  --ink: #f7f3ea;
  --ink-muted: #b9bccf;
  --ink-on-space: #f7f3ea;
  --ink-muted-on-space: #b9bccf;
  --link: #f7a8c8;
  --pink: #ec0f68;
  --pink-deep: #b80050;
  --pink-tint: #4a1030;
  --on-accent: #000000;
  --mustard: #e5c91f;
  --mustard-deep: #cbb31c;
  --white: #ffffff;
  --line: #f7f3ea;
  --line-soft: #323a66;
  --shadow-ink: #e5c91f;
  --focus: #e5c91f;
  --shadow-offset-sm: 3px 3px 0 0 #e5c91f;
  --shadow-offset: 6px 6px 0 0 #e5c91f;
  --shadow-offset-lg: 10px 10px 0 0 #e5c91f;
  --shadow-none: none;
}
:root {
  --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;
  --container: 1200px;
  --measure: 640px;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --line-2: 2px;
  --line-3: 3px;
  --font-display: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --font-sans: "Public Sans", "Helvetica Neue", Arial, sans-serif;
}
/* Type styles */
.display-xl { font-family: var(--font-display); font-size: 72px; line-height: 1.0; font-weight: 800; letter-spacing: -0.025em; }
.display-lg { font-family: var(--font-display); font-size: 56px; line-height: 1.02; font-weight: 800; letter-spacing: -0.02em; }
.display-md { font-family: var(--font-display); font-size: 44px; line-height: 1.05; font-weight: 800; letter-spacing: -0.02em; }
.display-sm { font-family: var(--font-display); font-size: 32px; line-height: 1.1; font-weight: 800; letter-spacing: -0.015em; }
.heading-lg { font-family: var(--font-display); font-size: 26px; line-height: 32px; font-weight: 800; letter-spacing: -0.015em; }
.heading-md { font-family: var(--font-display); font-size: 21px; line-height: 27px; font-weight: 700; letter-spacing: -0.01em; }
.heading-sm { font-family: var(--font-display); font-size: 17px; line-height: 23px; font-weight: 700; letter-spacing: -0.005em; }
.eyebrow { font-family: var(--font-sans); font-size: 13px; line-height: 16px; font-weight: 700; letter-spacing: 0.14em; }
.body-lg { font-family: var(--font-sans); font-size: 19px; line-height: 30px; font-weight: 400; }
.body { font-family: var(--font-sans); font-size: 17px; line-height: 27px; font-weight: 400; }
.body-sm { font-family: var(--font-sans); font-size: 15px; line-height: 22px; font-weight: 400; }
.caption { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 500; }
.button { font-family: var(--font-sans); font-size: 16px; line-height: 20px; font-weight: 700; letter-spacing: 0.01em; }
.nav { font-family: var(--font-sans); font-size: 15px; line-height: 20px; font-weight: 600; }