// Breakpoint variables
$mobile-breakpoint: 768px;
$desktop-breakpoint: 769px;

// Color variables
$color-primary: #9333ea;
$color-secondary: #2563eb;

// Shadow variables
$shadow-sm: 0 4px 12px;
$shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
$shadow-lg: 0 25px 50px -12px rgba(0, 0, 0, 0.25);

// Border radius variables
$border-radius-sm: 0.375rem;
$border-radius-md: 0.5rem;
$border-radius-lg: 1rem;
$border-radius-xl: 1.5rem;
$border-radius-full: 9999px;

// Spacing variables
$spacing-xs: 0.5rem;
$spacing-sm: 0.75rem;
$spacing-md: 1rem;
$spacing-lg: 1.5rem;
$spacing-xl: 2rem;
$spacing-2xl: 3rem;
$spacing-3xl: 4rem;

// Section variables
$section-padding-y: $spacing-2xl;

// Card variables
$card-border-radius: $border-radius-xl;
$card-border-radius-sm: $border-radius-md;
$card-border-radius-md: $border-radius-lg;
$card-border-radius-lg: $border-radius-xl;
$card-padding: $spacing-xl;
$card-padding-sm: $spacing-lg;
$card-padding-md: $spacing-md;
$card-padding-lg: $spacing-xl;
$card-gap: $spacing-xl;
$card-gap-sm: $spacing-md;

// Transition variables
$transition-base: all 0.3s ease;
$transition-default: all 0.3s ease;
$transition-fast: all 0.2s ease;
$transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

// Common shadow variables
$shadow-card: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
  0 2px 4px -1px rgba(0, 0, 0, 0.06);
$shadow-card-hover: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
  0 4px 6px -2px rgba(0, 0, 0, 0.05);
$shadow-card-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
  0 4px 6px -2px rgba(0, 0, 0, 0.05);
$shadow-button: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
  0 2px 4px -1px rgba(0, 0, 0, 0.06);

// Gradient variables
$gradient-primary: linear-gradient(
  90deg,
  $color-secondary 0%,
  $color-primary 100%
);
$gradient-text: linear-gradient(
  to right,
  $color-secondary,
  $color-primary,
  #0d9488
);

// Services Section Variables
$services-card-padding: 1.5rem;
$services-card-border-radius: 0.75rem;
$services-icon-size: 2.5rem;
$services-grid-gap: 1.5rem;
$services-grid-gap-mobile: 1rem;
$services-header-margin: 2rem;

// Skills Section Variables
$skills-header-margin: 3rem;
$skills-category-gap: 2rem;
$skills-category-gap-mobile: 1.5rem;
$skills-skill-gap: 1.5rem;
$skills-skill-gap-mobile: 1rem;
$skills-progress-height: 0.75rem;
$skills-progress-radius: 9999px;
$skills-category-padding: 2rem;
$skills-category-padding-mobile: 1.5rem;

// Add any other global variables here
