/* CSS Variables */
:root {
    --primary: #6366f1;
    --primary-dark: #4f46e5;
    --secondary: #0f172a;
    --accent: #1e293b;
    --surface: #f8fafc;
    --text-primary: #0f172a;
    --text-secondary: #64748b;
    --text-inverse: #ffffff;
    --success: #10b981;
    --border: #e2e8f0;
    --shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    --gradient: linear-gradient(135deg, var(--primary) 0%, #8b5cf6 50%, #ec4899 100%);
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    line-height: 1.6;
    color: var(--text-primary);
    background: var(--surface);
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Smooth Scroll */
html {
    scroll-behavior: smooth;
}

/* Touch-friendly improvements */
.btn-primary, .btn-secondary, .service-card, .blog-card, .feature {
    -webkit-tap-highlight-color: transparent;
}

.btn-primary:active, .btn-secondary:active {
    transform: translateY(0) scale(0.98);
}

.service-card:active, .blog-card:active {
    transform: translateY(-2px) scale(0.98);
}