/* General Styles */
 @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap');
    
    :root {
        --primary: #1e40af;
        --primary-light: #3b82f6;
        --secondary: #0ea5e9;
        --accent: #10b981;
        --purple-accent: #7c3aed;
        --red-accent: #dc2626;
        --text-dark: #1e293b;
        --text-light: #64748b;
    }
    
    html {
        scroll-behavior: smooth;
    }
    
    body {
        font-family: 'Inter', sans-serif;
        color: var(--text-dark);
    }
    
    h1, h2, h3, h4, h5, h6 {
        font-family: 'Poppins', sans-serif;
    }
    
    .hero-gradient {
        background: linear-gradient(135deg, rgba(30, 64, 175, 0.92) 0%, rgba(124, 58, 237, 0.85) 50%, rgba(14, 165, 233, 0.9) 100%), url('https://images.unsplash.com/photo-1631549916768-4119b2e5f926?q=80&w=2070') center/cover;
    }
    
    .service-card {
        transition: all 0.3s ease;
    }
    
    .service-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 20px 25px -5px rgb(0 0 / 0.1), 0 8px 10px -6px rgb(0 0 / 0.1);
    }
    
    .nav-link {
        position: relative;
    }
    
    .nav-link::after {
        content: '';
        position: absolute;
        width: 0;
        height: 2px;
        bottom: -4px;
        left: 0;
        background: linear-gradient(90deg, var(--secondary), var(--purple-accent));
        transition: width 0.3s ease;
    }
    
    .nav-link:hover::after {
        width: 100%;
    }
    
    .btn-primary {
        transition: all 0.3s ease;
    }
    
    .btn-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 10px 15px -3px rgb(59 130 246 / 0.3);
    }
    
    .logo-ring {
        background: linear-gradient(135deg, var(--primary), var(--purple-accent), var(--red-accent));
        padding: 2px;
    }
    
    @keyframes fadeInUp {
        from {
            opacity: 0;
            transform: translateY(30px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
    
    .animate-fade-in-up {
        animation: fadeInUp 0.6s ease-out forwards;
    }
    
    .contact-input:focus {
        border-color: var(--purple-accent);
        box-shadow: 0 0 3px rgba(124, 58, 237, 0.1);
    }
    
    .accent-gradient {
        background: linear-gradient(135deg, var(--primary), var(--purple-accent));
    }
    
    .accent-gradient-red {
        background: linear-gradient(135deg, var(--red-accent), var(--purple-accent));
    }

   