        :root {
            /*--primary-color: #527DF3;
            --secondary-color: #0c0e7f;
           */
            --primary-color: #5d5fef;
            --secondary-color: #365add;
            --text-light: #F4F4F4;
            --text-dark: #333333;
            --background-light:  #f4f6f9;
            --accent-color: #5d5fef;
            --white: #ffffff;
        
        }
  
        
        
        /* Footer Styles */

        .footer-links {
          list-style: none;
          padding: 0;
        }
        
        .footer-links li {
          margin-bottom: 0.5rem;
        }
        
        .footer-links a {
          color: var(--white);
          text-decoration: none;
          opacity: 0.9;
          transition: opacity 0.3s ease;
          font-weight: 600;
        }
        
        .footer-links a:hover {
          opacity: 1;
          text-decoration: underline;
        }
        
        .footer-socials {
          display: flex;
          gap: 1rem;
          margin-bottom: 1rem;
        }
        
        .footer-socials a {
          display: inline-block;
          width: 40px;
          height: 40px;
          background-color: rgba(255, 255, 255, 0.1);
          border-radius: 50%;
          display: flex;
          align-items: center;
          justify-content: center;
          transition: background-color 0.3s ease;
        }
        
        .footer-socials a:hover {
          background-color: rgba(255, 255, 255, 0.2);
        }
        
        .footer-socials img {
          width: 24px;
          height: 24px;
        }
                /* Footer Styles */
                .footer {
                    background-color: var(--secondary-color);
                    color: var(--white);
                    padding: 4rem 0 2rem;
                }
                
                .footer-container {
                    display: grid;
                    grid-template-columns: repeat(4, 1fr);
                    gap: 2rem;
                }
                
                .footer-col h4 {
                    font-size: 1.2rem;
                    margin-bottom: 1.5rem;
                    position: relative;
                    padding-bottom: 0.5rem;
                }
                
                .footer-col h4::after {
                    content: '';
                    position: absolute;
                    left: 0;
                    bottom: 0;
                    width: 50px;
                    height: 2px;
                    background-color: var(--primary-color);
                }
                
                .footer-links {
                    display: flex;
                    flex-direction: column;
                    gap: 0.8rem;
                    color: var(--white);
                }
                
                .footer-link {
                    transition: var(--transition);
                    color: var(--white);
                    
                }
                
                .footer-link:hover {
                    color: var(--white);
                    padding-left: 5px;
                }
                
                .footer-bottom {
                    margin-top: 3rem;
                    text-align: center;
                    padding-top: 2rem;
                    border-top: 1px solid rgba(255, 255, 255, 0.1);
                }
                
                /* Mobile Navigation when active */
                /*
                .mobile-nav.active {
                    display: block;
                    position: fixed;
                    top: 0;
                    right: 0;
                    width: 80%;
                    max-width: 300px;
                    height: 100vh;
                    background-color: var(--white);
                    z-index: 200;
                    box-shadow: -5px 0 15px rgba(0, 0, 0, 0.1);
                    padding: 2rem;
                    overflow-y: auto;
                }
                
                .mobile-nav-close {
                    background: none;
                    border: none;
                    font-size: 1.5rem;
                    cursor: pointer;
                    color: var(--text-color);
                    position: absolute;
                    top: 1rem;
                    right: 1rem;
                }
                
                .mobile-nav-links {
                    display: flex;
                    flex-direction: column;
                    gap: 1.5rem;
                    margin-top: 3rem;
                }
                
                .mobile-nav-links a {
                    font-size: 1.1rem;
                    font-weight: 500;
                    transition: var(--transition);
                }
                
                .mobile-nav-links a:hover {
                    color: var(--primary-color);
                }
                */
                /* Responsive Styles */
                @media screen and (max-width: 1024px) {
                    .services-grid {
                        grid-template-columns: 1fr;
                    }
                    
                    .advice-grid {
                        grid-template-columns: repeat(2, 1fr);
                    }
                    
                    .footer-container {
                        grid-template-columns: repeat(2, 1fr);
                        place-content: center;
                    }
                }
                
                @media screen and (max-width: 768px) {
                    .desktop-nav {
                        display: none;
                    }
                    
                    .mobile-nav-toggle {
                        display: block;
                    }
                    
                    .hero-content h1 {
                        font-size: 2.5rem;
                    }
                    
                    .advice-grid {
                        grid-template-columns: 1fr;
                    }
                    
                    .cta-buttons {
                        flex-direction: column;
                        align-items: center;
                    }
                }
                
                @media screen and (max-width: 576px) {
                    .section-title {
                        font-size: 2rem;
                    }
                    
                    .footer-container {
                        grid-template-columns: 1fr;
                        gap: 2rem;
                        text-align: center;
                    }
                    
                    .service-card {
                        height: 350px;
                    }
        
                    .footer-socials {
                        display: flex;
                        gap: 1rem;
                        margin-bottom: 1rem;
                        place-content: center;
                    }
        
                    .footer-col h4::after {
                    font-size: 1.2rem;
                    margin-bottom: 1.5rem;
                    position: relative;
                    padding-bottom: 0.5rem;
                    text-decoration: underline var(--primary-color);
                    background-color: var(--primary-color);
                    
                  }
        
                 
                }