/* Design tokens — the whole visual identity lives here.
   Language: GoCompare's (chunky uppercase display type, cream sections, thick
   outlines, hard offset shadows, sticker badges) translated to navy + green.
   The CTA green is lime-leaning on purpose: a mid-green fails contrast on navy;
   lime is exactly why GoCompare's buttons pop on their dark sections. */

:root {
  /* colour */
  --ink: #071228;          /* darkest navy: text, outlines, hard shadows */
  --navy: #0a1b3d;         /* primary dark ground (hero, feature bands) */
  --navy-raised: #13295c;  /* cards/pills sitting on navy */
  --cream: #faf6ee;        /* section background between navy bands */
  --cream-dark: #f0e9da;   /* alt cream, table stripes, wells */
  --white: #ffffff;
  --lime: #a3f548;         /* the CTA colour */
  --lime-hover: #b5ff5e;
  --green: #16a45f;        /* support green: success, ticks, deltas */
  --star: #ffb800;         /* review stars, always */
  --red: #e5484d;
  --text-on-dark: #f5f8ff;
  --text-muted-dark: #a8b6d4;   /* secondary text on navy */
  --text-muted-light: #5a6478;  /* secondary text on cream/white */

  /* type — Anton for the big uppercase statements, Inter for everything else */
  --font-display: 'Anton', 'Arial Narrow', sans-serif;
  --font-body: 'Inter', -apple-system, 'Segoe UI', sans-serif;
  --text-hero: clamp(2.6rem, 6.5vw, 4.6rem);
  --text-h2: clamp(1.9rem, 4vw, 3rem);
  --text-h3: 1.35rem;
  --text-body: 1.0625rem;
  --text-small: 0.875rem;

  /* space — 8pt grid */
  --s1: 0.25rem; --s2: 0.5rem; --s3: 0.75rem; --s4: 1rem;
  --s5: 1.5rem;  --s6: 2rem;   --s7: 3rem;    --s8: 4rem; --s9: 6rem;

  /* shape */
  --radius: 16px;          /* cards */
  --radius-lg: 24px;       /* big feature cards */
  --radius-pill: 999px;    /* buttons, badges */
  --outline: 2px solid var(--ink);

  /* the hard offset shadow that makes cards feel like stickers */
  --shadow-card: 4px 4px 0 var(--ink);
  --shadow-card-lg: 6px 6px 0 var(--ink);
  --shadow-lift: 6px 6px 0 var(--ink);     /* hover state pairs with translate(-2px,-2px) */

  /* motion */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --fast: 150ms;
  --med: 250ms;
}
