/* ==========================================================================
   Design tokens — change colours, fonts and spacing here to re-theme the site
   ========================================================================== */
:root {
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;

  --bg: #fbf8f3;
  --surface: #ffffff;
  --surface-2: #f4efe7;
  --surface-3: #ece5d8;
  --text: #17222b;
  --muted: #5d6974;
  --border: #e6dfd2;
  --border-strong: #d3c9b8;

  --primary: #0e7c6b;
  --primary-600: #0b6a5b;
  --primary-700: #095446;
  --primary-soft: #d9f1ec;
  --accent: #e8890c;
  --accent-600: #c9740a;
  --accent-soft: #fdeccd;
  --rose: #e11d48;
  --success: #16a34a;
  --warning: #d97706;
  --danger: #dc2626;
  --info: #0369a1;

  --ink: #0a2328;
  --ink-2: #123a40;
  --on-ink: #f6f2ea;

  --gradient-brand: linear-gradient(135deg, #0e7c6b 0%, #0b5d6b 55%, #14456b 100%);
  --gradient-warm: linear-gradient(135deg, #f59e0b 0%, #e8890c 45%, #dc4f1d 100%);

  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  --shadow-xs: 0 1px 2px rgba(15, 30, 40, .06);
  --shadow-sm: 0 2px 8px rgba(15, 30, 40, .07);
  --shadow: 0 8px 24px rgba(15, 30, 40, .10);
  --shadow-lg: 0 20px 50px rgba(15, 30, 40, .16);
  --ring: 0 0 0 3px rgba(14, 124, 107, .28);

  --container: 1240px;
  --header-h: 76px;
  --ease: cubic-bezier(.22, .8, .24, 1);
  --t-fast: .18s;
  --t: .3s;
  --t-slow: .6s;

  --z-header: 50;
  --z-float: 60;
  --z-modal: 100;
  --z-toast: 120;

  color-scheme: light;
}

:root[data-theme="dark"] {
  --bg: #0c1519;
  --surface: #131e23;
  --surface-2: #19272d;
  --surface-3: #22333a;
  --text: #e9eff1;
  --muted: #9aaab2;
  --border: #25353c;
  --border-strong: #35484f;
  --primary: #2cc7b0;
  --primary-600: #25b29d;
  --primary-700: #1e9a87;
  --primary-soft: rgba(44, 199, 176, .14);
  --accent: #f5a524;
  --accent-600: #ea9610;
  --accent-soft: rgba(245, 165, 36, .14);
  --ink: #061014;
  --ink-2: #0c1d22;
  --shadow-xs: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, .4);
  --shadow: 0 8px 24px rgba(0, 0, 0, .45);
  --shadow-lg: 0 20px 50px rgba(0, 0, 0, .55);
  --ring: 0 0 0 3px rgba(44, 199, 176, .35);
  color-scheme: dark;
}