:root {
  /* Channel-inspired palette: parchment, burgundy, gold, Adriatic blue */
  --bg: #ecd5a8;
  --bg-soft: #f7e7c2;
  --surface: #fff8e8;
  --surface-2: #f2dfb5;

  /* Text */
  --text: #24180f;
  --text-soft: #57432c;
  --muted: #7b684d;

  /* Brand palette */
  --primary: #8d251d;
  --primary-dark: #5f1712;
  --primary-soft: #f4d8cc;

  --accent: #c49a44;
  --accent-dark: #7b511c;
  --accent-soft: #f0dfbc;

  --sea: #2f7181;
  --sea-dark: #214f5b;
  --map-red: #a52a22;
  --map-ink: #4b321a;
  --gold: #d7a544;
  --sand: #d8b874;
  --stone: #b99b6d;
  --olive: #66754e;
  --sun: #f1c46a;

  /* Borders / shadows */
  --border: rgba(122, 84, 36, 0.28);
  --border-strong: rgba(122, 84, 36, 0.46);
  --shadow-sm: 0 8px 20px rgba(54, 32, 14, 0.08);
  --shadow-md: 0 18px 42px rgba(54, 32, 14, 0.14);
  --shadow: var(--shadow-md);

  /* Radius */
  --radius-sm: 12px;
  --radius: 20px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  /* Layout */
  --max-width: 1140px;
  --header-height: 76px;

  /* Typography */
  --font-main: Inter, Arial, sans-serif;
  --font-heading: Georgia, "Times New Roman", serif;

  /* Spacing */
  --space-1: 8px;
  --space-2: 12px;
  --space-3: 16px;
  --space-4: 20px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 40px;
  --space-8: 56px;

  /* Focus */
  --focus-ring: 0 0 0 3px rgba(141, 37, 29, 0.24);
}