/* Your Charisma · Concept A · Refresh — design tokens (from Figma frames 7:3 desktop, 7:474 mobile) */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700;800&family=Inter:wght@400;500;600;700&display=swap');
:root {
  /* Colour */
  --bg: #FAF7F2;            /* cream sections, header */
  --surface: #FFFFFF;       /* white sections and cards */
  --ink: #1F2A33;           /* headings, dark sections (case study, footer, desk band) */
  --slate: #4B5B67;         /* brand slate: logo, stats, prices */
  --body: #4B5866;          /* body copy */
  --muted: #5E6A75;         /* captions, labels */
  --border: #E7E1D6;        /* card and divider strokes */
  --brand-yellow: #FFBE4C;  /* primary buttons, highlights */
  --yellow-soft: #FFF1D6;   /* icon tiles, price pills */
  --card-hover-border: #F1D9A6;
  --amber: #A86A00;         /* line icons on light */
  --amber-text: #8A5600;    /* eyebrow/accent text on light (AA on cream) */
  --cta-bg: #FBC560;        /* final CTA band */
  --ok: #2FB47C; --ok-text: #1F7A52; --ok-bg: #E7F6EF; /* agent console "live" pill */
  --on-dark: #C9D1D8;       /* body on ink */
  --on-dark-muted: #B9C2CA; /* footer links */
  --logo-gold: #EEBB5F;
  /* Type */
  --font-display: 'Montserrat', sans-serif;  /* 700, 800 */
  --font-body: 'Inter', sans-serif;          /* 400, 500, 600, 700 */
  /* Layout */
  --container: 1280px; --gutter: 80px; --gutter-mobile: 20px;
  --section-y: 98px; --section-y-mobile: 64px;
  --radius-sm: 8px; --radius: 12px; --radius-md: 16px; --radius-lg: 18px; --radius-xl: 24px; --radius-pill: 999px;
}