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

:root {
  /* Colors */
  --bg-primary: #0a0e17;
  --bg-secondary: #131a26;
  --bg-card: rgba(22, 30, 46, 0.7);
  --bg-card-hover: rgba(30, 41, 61, 0.8);
  --border-color: rgba(255, 255, 255, 0.08);
  --border-color-glow: rgba(255, 255, 255, 0.15);
  
  --text-main: #f1f5f9;
  --text-muted: #94a3b8;
  --text-light: #cbd5e1;
  --text-dark: #0f172a;
  
  /* Brand Accents */
  --color-laptop: #00f2fe;        /* Neon Cyan */
  --color-laptop-dark: #00c6ff;   /* Neon Blue */
  --color-influencer: #ec008c;    /* Neon Pink */
  --color-influencer-dark: #fc67fa; /* Light Neon Pink */
  --color-warning: #f59e0b;       /* Warm Gold */
  --color-success: #10b981;       /* Emerald Green */
  
  /* Gradients */
  --grad-laptop: linear-gradient(135deg, var(--color-laptop), var(--color-laptop-dark));
  --grad-influencer: linear-gradient(135deg, var(--color-influencer), var(--color-influencer-dark));
  --grad-mix: linear-gradient(135deg, var(--color-laptop) 0%, #7000ff 50%, var(--color-influencer) 100%);
  --grad-dark: linear-gradient(180deg, var(--bg-primary) 0%, var(--bg-secondary) 100%);
  --grad-card-border: linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0.02));
  
  /* Shadows & Glows */
  --glow-laptop: 0 0 20px rgba(0, 242, 254, 0.35);
  --glow-influencer: 0 0 20px rgba(236, 0, 140, 0.35);
  --glow-mix: 0 0 25px rgba(112, 0, 255, 0.4);
  --shadow-main: 0 10px 30px -10px rgba(0, 0, 0, 0.5);
  --shadow-card-hover: 0 20px 40px -15px rgba(0, 0, 0, 0.7);

  /* Typography */
  --font-title: 'Outfit', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  
  /* Layout & Spacing */
  --max-width: 1200px;
  --header-height: 80px;
  --border-radius-lg: 20px;
  --border-radius-md: 12px;
  --border-radius-sm: 8px;
  
  /* Transitions */
  --trans-smooth: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  --trans-fast: all 0.15s ease-out;
}
