@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500&display=swap');
:root{
  --ts-green: #2f5d50;
  --ts-gold: #c2974e;
  --ts-cream: #f8f5ee;
  --ts-ink: #23291f;
  --ts-white: #ffffff;
  --ts-green-dark: color-mix(in srgb, #2f5d50 80%, #000);
  --ts-gold-dark: color-mix(in srgb, #c2974e 78%, #000);
  --ts-green-soft: color-mix(in srgb, #2f5d50 12%, #fff);
  --ts-sand: color-mix(in srgb, #f8f5ee 84%, #c2974e);
  --ts-line: color-mix(in srgb, #23291f 14%, #fff);
  --ts-muted: color-mix(in srgb, #23291f 55%, #fff);
  --ts-radius: 18px;
  --ts-radius-sm: 12px;
  --ts-btn-radius: 999px;
  --ts-hero-min-height: 580px;
  --ts-container-width: 1200px;
  --ts-logo-height: 80px;
  --ts-footer-bg: #23291f;
  --ts-banner-bg: #244a40;
  --ts-banner-fg: #f4efe4;
  --ts-serif: 'Playfair Display', Georgia, serif;
  --ts-sans: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
  --ts-font-size: 16px;
  --ts-grid-cols: 4;
  --ts-hero-overlay-a: color-mix(in srgb, color-mix(in srgb, #2f5d50 80%, #000) 82%, transparent);
  --ts-hero-overlay-b: color-mix(in srgb, #2f5d50 55%, transparent);
  --ts-shadow: 0 18px 45px -22px color-mix(in srgb, #23291f 45%, transparent);
  --ts-shadow-soft: 0 10px 30px -18px color-mix(in srgb, #23291f 35%, transparent);
  --ts-noimg-a: #2f5d50;
  --ts-noimg-b: #1d3a32;
}
[data-theme="dark"]{
  --ts-cream: color-mix(in srgb, #23291f 90%, #000);
  --ts-white: color-mix(in srgb, #23291f 82%, #000);
  --ts-ink: #f8f5ee;
  --ts-line: color-mix(in srgb, #f8f5ee 16%, transparent);
  --ts-muted: color-mix(in srgb, #f8f5ee 65%, transparent);
  --ts-sand: color-mix(in srgb, #23291f 80%, #000);
}