:root {
  /* Colors */
  --color-primary: 223 84% 58%;
  --color-primary-foreground: 0 0% 100%;
  --color-secondary: 47 94% 58%;
  --color-background: 0 0% 100%;
  --color-foreground: 222 47% 11%;
  --color-muted: 210 40% 96%;
  --color-muted-foreground: 215 16% 47%;
  --color-border: 214 32% 91%;
  
  /* Tag Colors */
  --color-blue-100: 219 91% 91%;
  --color-blue-800: 217 91% 35%;
  --color-orange-100: 34 100% 92%;
  --color-orange-800: 25 95% 40%;
  --color-green-100: 141 84% 93%;
  --color-green-800: 142 72% 29%;
  --color-purple-100: 269 100% 95%;
  --color-purple-800: 273 80% 40%;
  --color-pink-100: 326 100% 94%;
  --color-pink-800: 335 78% 42%;
  
  /* Gradients */
  --gradient-primary: linear-gradient(135deg, #fbbf24, #f59e0b);
  --gradient-hero: linear-gradient(180deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.6) 100%);
  
  /* Category-specific gradients */
  --gradient-planning: linear-gradient(135deg, #dbeafe, #bfdbfe);
  --gradient-adventures: linear-gradient(135deg, #fed7aa, #fdba74);
  --gradient-shoestring: linear-gradient(135deg, #bbf7d0, #86efac);
  --gradient-cruise: linear-gradient(135deg, #bae6fd, #7dd3fc);
  --gradient-stories: linear-gradient(135deg, #e9d5ff, #d8b4fe);
  
  /* Shadows */
  --shadow-elegant: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-soft: 0 2px 4px rgba(0, 0, 0, 0.05);
  --shadow-card: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  
  /* Spacing */
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
  --spacing-2xl: 3rem;
  --spacing-3xl: 4rem;
  
  /* Typography */
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;
  --font-size-4xl: 2.25rem;
  --font-size-5xl: 3rem;
  --font-size-6xl: 3.75rem;
  
  /* Borders */
  --radius-sm: 0.25rem;
  --radius-md: 0.375rem;
  --radius-lg: 0.5rem;
  --radius-xl: 0.75rem;
  --radius-full: 9999px;
  
  /* Container */
  --container-width: 1200px;
  --container-padding: 1rem;
  
  /* Breakpoints */
  --screen-sm: 640px;
  --screen-md: 768px;
  --screen-lg: 1024px;
  --screen-xl: 1280px;
  --screen-2xl: 1536px;
}