/* ============================================
   VARIABLES CSS - Sistema de Diseño
   ============================================ */

:root {
  /* Colores principales */
  --bg-cv: #f2f2f5;
  --text-main: #1c1c1e;
  --bg-alt: #050505;
  --text-alt: #e1e1e1;
  
  /* Accent (se modifica dinámicamente con JS) */
  --accent-red: #ff3b30;
  --accent-r: 255;
  --accent-g: 59;
  --accent-b: 48;
  
  /* Tipografía */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --mono: 'JetBrains Mono', 'SF Mono', Monaco, 'Cascadia Code', monospace;
  
  /* Parallax (actualizado por JS) */
  --px: 0px;
  --py: 0px;
  
  /* Espaciado */
  --spacing-xs: 8px;
  --spacing-sm: 12px;
  --spacing-md: 18px;
  --spacing-lg: 24px;
  --spacing-xl: 40px;
  
  /* Bordes */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  
  /* Sombras */
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 8px 20px rgba(0, 0, 0, 0.12);
  --shadow-lg: 0 30px 60px rgba(0, 0, 0, 0.12);
  
  /* Transiciones */
  --transition-fast: 0.2s ease;
  --transition-base: 0.3s ease;
  --transition-slow: 0.5s ease;
  --transition-smooth: 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Fuentes externas */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800&family=JetBrains+Mono:wght@300;400;500;600&display=swap');