:root {
  /* NEW LOGO COLOR SCHEME - Based on Yin-Yang Logo */
  
  /* Primary Purple Palette (Monochromatic) */
  --logo-purple-900: #4a1a5c;     /* Deepest purple (background) */
  --logo-purple-800: #6b2c7a;     /* Dark purple */
  --logo-purple-700: #8b3d98;     /* Medium purple */
  --logo-purple-600: #a855c7;     /* Purple */
  --logo-purple-500: #c084fc;     /* Light purple */
  --logo-purple-400: #d8b4fe;     /* Lighter purple */
  --logo-purple-300: #e9d5ff;     /* Very light purple */
  --logo-purple-200: #f3e8ff;     /* Pale purple */
  --logo-purple-100: #faf5ff;     /* Lightest purple */
  
  /* Gold Palette (Complementary to Purple) */
  --logo-gold-900: #92400e;       /* Dark gold */
  --logo-gold-800: #b45309;       /* Gold */
  --logo-gold-700: #d97706;       /* Medium gold */
  --logo-gold-600: #ea580c;       /* Bright gold */
  --logo-gold-500: #f59e0b;       /* Primary gold */
  --logo-gold-400: #fbbf24;       /* Light gold */
  --logo-gold-300: #fcd34d;       /* Lighter gold */
  --logo-gold-200: #fde68a;       /* Very light gold */
  --logo-gold-100: #fef3c7;       /* Pale gold */
  
  /* Dark Blue Palette (Analogous to Purple) */
  --logo-blue-900: #1e3a8a;       /* Darkest blue */
  --logo-blue-800: #1e40af;       /* Dark blue */
  --logo-blue-700: #1d4ed8;       /* Medium blue */
  --logo-blue-600: #2563eb;       /* Blue */
  --logo-blue-500: #3b82f6;       /* Light blue */
  --logo-blue-400: #60a5fa;       /* Lighter blue */
  --logo-blue-300: #93c5fd;       /* Very light blue */
  --logo-blue-200: #bfdbfe;       /* Pale blue */
  --logo-blue-100: #dbeafe;       /* Lightest blue */
  
  /* Accent Colors from Logo */
  --logo-red: #ef4444;            /* Red sparkles */
  --logo-green: #22c55e;          /* Green sparkles */
  --logo-cyan: #06b6d4;           /* Cyan sparkles */
  
  /* Semantic Colors */
  --primary: var(--logo-purple-700);
  --primary-dark: var(--logo-purple-800);
  --primary-light: var(--logo-purple-500);
  --secondary: var(--logo-gold-500);
  --secondary-dark: var(--logo-gold-600);
  --secondary-light: var(--logo-gold-400);
  --accent: var(--logo-blue-600);
  --accent-dark: var(--logo-blue-700);
  --accent-light: var(--logo-blue-500);
  
  /* Background Gradients */
  --bg-primary: linear-gradient(135deg, var(--logo-purple-900) 0%, var(--logo-purple-800) 50%, var(--logo-purple-700) 100%);
  --bg-secondary: linear-gradient(135deg, var(--logo-gold-500) 0%, var(--logo-gold-400) 100%);
  --bg-accent: linear-gradient(135deg, var(--logo-blue-700) 0%, var(--logo-blue-600) 100%);
  
  /* Text Colors */
  --text-primary: var(--logo-purple-900);
  --text-secondary: var(--logo-gold-800);
  --text-accent: var(--logo-blue-800);
  --text-light: var(--logo-purple-300);
  --text-dark: #1f2937;
  --text-white: #ffffff;
  
  /* Border Colors */
  --border-primary: var(--logo-purple-500);
  --border-secondary: var(--logo-gold-400);
  --border-accent: var(--logo-blue-500);
  
  /* Shadow Colors */
  --shadow-primary: 0 4px 6px -1px rgba(139, 61, 152, 0.1), 0 2px 4px -1px rgba(139, 61, 152, 0.06);
  --shadow-secondary: 0 4px 6px -1px rgba(245, 158, 11, 0.1), 0 2px 4px -1px rgba(245, 158, 11, 0.06);
  --shadow-glow: 0 0 20px rgba(168, 85, 199, 0.3);
  
  /* Legacy Support */
  --color-1: var(--logo-purple-800);
  --color-2: var(--logo-purple-700);
  --color-3: var(--logo-gold-500);
  --color-4: var(--logo-purple-100);
  
  /* CSS Classes for Easy Use */
}

/* Header Background with Logo-inspired Gradient */
.header-logo-bg {
  background: linear-gradient(135deg, #4a1a5c 0%, #6b2c7a 50%, #8b3d98 100%) !important;
  box-shadow: 0 4px 6px -1px rgba(139, 61, 152, 0.1), 0 2px 4px -1px rgba(139, 61, 152, 0.06) !important;
}

/* Footer Background */
.footer-logo-bg {
  background: linear-gradient(180deg, #6b2c7a 0%, #4a1a5c 100%) !important;
}

/* Gold Accent Elements */
.gold-accent {
  color: var(--logo-gold-500);
  text-shadow: 0 0 10px rgba(245, 158, 11, 0.3);
}

/* Purple Text with Glow */
.purple-glow {
  color: var(--logo-purple-500);
  text-shadow: 0 0 8px rgba(168, 85, 199, 0.4);
}

/* Button Styles */
.btn-primary {
  background: var(--bg-primary);
  color: var(--text-white);
  border: 1px solid var(--border-primary);
  box-shadow: var(--shadow-primary);
}

.btn-secondary {
  background: var(--bg-secondary);
  color: var(--logo-gold-900);
  border: 1px solid var(--border-secondary);
  box-shadow: var(--shadow-secondary);
}

/* Icon Colors */
.icon-primary {
  color: var(--logo-purple-600);
}

.icon-secondary {
  color: var(--logo-gold-500);
}

.icon-accent {
  color: var(--logo-blue-600);
}

/* Hover Effects */
.hover-glow:hover {
  box-shadow: var(--shadow-glow);
  transform: translateY(-2px);
  transition: all 0.3s ease;
}