:root {
  /* Color */
  --color-bg:        #f5f3f0;
  --color-surface:   #ffffff;
  --color-text:      #1a1a1a;
  --color-muted:     #737373;
  --color-rule:      #e0ddd6;
  --color-rule-soft: #ebe8e1;
  --color-accent:    #a23f1e; /* terracotta — body-link hover ONLY */

  /* Type */
  --font-heading: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
  --font-body:    'Source Serif 4', 'Source Serif Pro', Georgia, serif;

  /* Body defaults */
  --body-size:   18px;
  --body-line:   1.7;
  --body-weight: 400; /* do not revert to 300 */

  /* Layout */
  --content-max:        680px;
  --page-pad-x:         64px;
  --page-pad-x-mid:     40px;
  --page-pad-x-mobile:  24px;

  /* Interaction */
  --hover-bg:   rgba(20, 12, 4, 0.035);
  --focus-bg:   rgba(162, 63, 30, 0.06);
  --transition: 160ms ease;
}