:root {
            --primary: #1e3a8a;
            --secondary: #0ea5e9;
            --accent: #f59e0b;
            --dark: #1f2937;
            --light: #f8fafc;
        }
        
        body {
            
            background-color: var(--light);
        }
        
        .gradient-bg {
            background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
        }
        
        .section-padding {
            padding: 5rem 0;
        }
        
        .card-hover {
            transition: all 0.4s ease;
        }
        
        .card-hover:hover {
            transform: translateY(-10px);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
        }
        
        .text-gradient {
            background: linear-gradient(to right, var(--primary), var(--secondary));
            /* -webkit-background-clip: text; */
            -webkit-text-fill-color: transparent;
        }
        
        .hero-image {
            border-radius: 20px;
            box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
        }
        
        .floating {
            animation: floating 3s ease-in-out infinite;
        }
        
        @keyframes floating {
            0% { transform: translate(0, 0px); }
            50% { transform: translate(0, -15px); }
            100% { transform: translate(0, 0px); }
        }
        
        .sticky-nav {
            backdrop-filter: blur(10px);
            background-color: rgba(255, 255, 255, 0.9);
        }

            .timeline {
            position: relative;
        }
        
        .timeline::before {
            content: '';
            position: absolute;
            right: 30px;
            top: 0;
            bottom: 0;
            width: 4px;
            background: linear-gradient(to bottom, var(--primary), var(--secondary));
        }

           .blog-card-image {
            height: 240px;
            object-fit: cover;
            transition: transform 0.5s ease;
        }
        
        .card-hover:hover .blog-card-image {
            transform: scale(1.05);
        }
        
        .category-active {
            background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
            color: white;
        }

          .contact-icon {
            transition: all 0.3s ease;
        }
        
        .card-hover:hover .contact-icon {
            transform: scale(1.1);
        }

           .service-icon {
            transition: all 0.3s ease;
        }
        
        .card-hover:hover .service-icon {
            transform: scale(1.1);
        }

           
        .solution-icon {
            transition: all 0.3s ease;
        }
        
        .card-hover:hover .solution-icon {
            transform: scale(1.1);
        }
        
        .tab-active {
            background: linear-gradient(135deg, var(--primary) 0%, var(--secondary) 100%);
            color: white;
        }