/* CSS Design System Tokens - Leonardo Campins Personal Brand */

:root {
  /* Color Palette (HSL Tailored) */
  --primary-hue: 222;
  --primary-sat: 65%;
  --primary-light: 13%; /* Deep Corporate Navy */
  --primary: hsl(var(--primary-hue), var(--primary-sat), var(--primary-light));
  --primary-light-color: hsl(var(--primary-hue), var(--primary-sat), 20%);
  --primary-dark: hsl(var(--primary-hue), var(--primary-sat), 8%);
  
  /* Accent: Warm Gold / Champagne (representing closeness, prestige, and family/legacy) */
  --accent-hue: 40;
  --accent-sat: 62%;
  --accent-light: 55%;
  --accent: hsl(var(--accent-hue), var(--accent-sat), var(--accent-light));
  --accent-hover: hsl(var(--accent-hue), var(--accent-sat), 45%);
  --accent-pale: hsl(var(--accent-hue), var(--accent-sat), 96%);

  /* Neutrals */
  --slate-dark: hsl(210, 24%, 16%);     /* Dark Slate Text */
  --slate-medium: hsl(210, 16%, 38%);   /* Subtext / Muted */
  --slate-light: hsl(210, 20%, 75%);    /* Borders / Dividers */
  --bg-pure: #ffffff;
  --bg-light: hsl(210, 30%, 98%);       /* Very light cool grey */
  --bg-dark-section: hsl(var(--primary-hue), var(--primary-sat), 10%); /* For dark themed sections */
  
  /* Semantic Colors */
  --error: #E63946;
  --success: #2A9D8F;
  --warning: #F4A261;

  /* Typography */
  --font-display: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-body: 'Inter', system-ui, -apple-system, sans-serif;

  /* Shadows (Premium Depth) */
  --shadow-sm: 0 2px 4px rgba(11, 27, 61, 0.04);
  --shadow-md: 0 8px 24px rgba(11, 27, 61, 0.06);
  --shadow-lg: 0 16px 40px rgba(11, 27, 61, 0.08);
  --shadow-glass: 0 8px 32px 0 rgba(11, 27, 61, 0.08);
  
  /* Glassmorphism Border */
  --glass-border: rgba(255, 255, 255, 0.2);
  --glass-bg: rgba(255, 255, 255, 0.75);
  --glass-bg-dark: rgba(11, 27, 61, 0.85);

  /* Border Radii */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 32px;
  --radius-full: 9999px;

  /* Transitions (Micro-animations) */
  --transition-fast: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-normal: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  
  /* Layout constraints */
  --max-width: 1200px;
  --header-height: 80px;
}