/* Tonic theme — applies the client's design language to all variants.
   Content changes between A/B/C. This chrome stays constant. */
:root {
  --tonic-primary: #852066;
  --tonic-purple: #860b63;
  --tonic-navy: #282f44;
  --tonic-gray: #4a5568;
  --tonic-gray-light: #9da1ab;
  --tonic-light: #f8f8f8;
  --tonic-success: #e0efbf;
  --tonic-info: #d9f1fc;
  --tonic-warning: #fde9bf;
  --tonic-danger: #f2c9bf;
}

body.tonic {
  font-family: 'Libre Franklin', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  color: var(--tonic-navy);
}

body.tonic h1, body.tonic h2, body.tonic h3 {
  font-family: 'museo-slab', Georgia, 'Times New Roman', serif;
  color: var(--tonic-navy);
}

/* Brand-purple accents */
body.tonic .tag { background: #efdfea; color: var(--tonic-primary); }
body.tonic .block { background: var(--tonic-light); border-left: 3px solid var(--tonic-primary); }
body.tonic .block h3 { color: var(--tonic-primary); }
body.tonic .lede { color: var(--tonic-gray); }
body.tonic a { color: var(--tonic-primary); }

/* The "bold keyword within sentence" pattern Tonic uses */
body.tonic .lede strong,
body.tonic h1 strong { color: var(--tonic-primary); }