/**
 * Housecall Chiropractic — original brand palette on modern layout.
 * Dark luxury background, warm gold accents, cream typography.
 * (Housecall Chiropractic brand — dark gold concierge theme)
 */
:root {
  /* Brand gold — from original site */
  --color-gold: #d49824;
  --color-gold-light: #f5c66d;
  --color-gold-dark: #b6770b;
  --color-gold-deep: #a96b00;
  --color-warm: #dfa11a;

  /* Dark surfaces — original site */
  --color-background: #070604;
  --color-surface: #0f0d09;
  --color-surface-elevated: #181611;
  --color-accent-soft: #251803;

  /* Mapped legacy tokens (used throughout main.css) */
  --color-teal: #070604;
  --color-teal-light: #181611;
  --color-sage: #d49824;
  --color-sage-light: #251803;
  --color-cream: #0f0d09;
  --color-cream-dark: #181611;
  --color-white: #181611;

  /* Typography colors */
  --color-text: #f6f1e7;
  --color-text-muted: #c9c0b0;
  --color-text-light: #8a8275;
  --color-border: #2e281e;
  --color-border-light: #1e1a13;

  /* Primary CTA — gold gradient like original site */
  --color-cta: #d49824;
  --color-cta-hover: #b6770b;
  --color-cta-text: #040302;
  --color-cta-shadow: rgba(212, 152, 36, 0.45);
  --gradient-gold: linear-gradient(135deg, #f1c961 0%, #d79700 50%, #a96b00 100%);
  --gradient-hero:
    radial-gradient(1200px 600px at 20% -10%, rgba(80, 53, 0, 0.35), transparent 60%),
    radial-gradient(900px 500px at 110% 110%, rgba(66, 39, 0, 0.3), transparent 55%),
    linear-gradient(180deg, #040302 0%, #0b0906 100%);

  /* Secondary actions */
  --color-secondary: transparent;
  --color-secondary-border: rgba(212, 152, 36, 0.55);
  --color-secondary-text: #f5c66d;

  /* Typography — original site fonts, dentistry layout */
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;

  /* Spacing scale */
  --space-xs: 0.5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --space-xl: 4rem;
  --space-2xl: 6rem;

  /* Layout */
  --max-width: 1200px;
  --header-height: 84px;

  /* Radius & shadows */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4), 0 8px 24px -8px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 18px 50px -18px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(212, 152, 36, 0.15);
  --shadow-lg: 0 10px 40px -12px rgba(212, 152, 36, 0.35);

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
}