.footer-section {
    background: #000; /* Gradient background */
    color: white; /* Text color for better contrast */
    padding: 40px 0; /* More padding for spacious look */
}

.footer-logo img {
    max-width: 120px; /* Limit logo size */
    margin-bottom: 20px; /* Space below logo */
}

.footer-widget-heading h3 {
    border-bottom: 2px solid #fff; /* Underline for headings */
    padding-bottom: 10px; /* Padding below the heading */
    margin-bottom: 20px; /* Margin below heading */
}

.single-cta {
    display: flex; /* Flexbox for icons and text */
    align-items: center; /* Center items vertically */
    margin-bottom: 20px; /* Space between CTA items */
}

.single-cta i {
    font-size: 24px; /* Icon size */
    color: #ffc107; /* Icon color */
    margin-right: 15px; /* Space between icon and text */
}

.footer-social-icon {
    margin-top: 20px; /* Space above social icons */
}

.footer-social-icon a {
    margin: 0 10px; /* Space between social icons */
    color: #fff; /* Social icon color */
    transition: color 0.3s; /* Smooth transition for hover */
}

.footer-social-icon a:hover {
    color: #ffc107; /* Color change on hover */
}

.subscribe-form {
    display: flex; /* Flexbox for input and button */
    margin-top: 20px; /* Space above the form */
}

.subscribe-form input {
    flex: 1; /* Make input take available space */
    padding: 10px; /* Padding for input */
    border: none; /* Remove border */
    border-radius: 5px; /* Rounded corners */
    margin-right: 10px; /* Space between input and button */
}

.subscribe-form button {
    background-color: #ffc107; /* Button color */
    color: #000; /* Button text color */
    border: none; /* Remove border */
    padding: 10px 15px; /* Padding for button */
    border-radius: 5px; /* Rounded corners */
    cursor: pointer; /* Pointer on hover */
    transition: background-color 0.3s; /* Smooth transition */
}

.subscribe-form button:hover {
    background-color: #fff; /* Change button color on hover */
    color: #007bff; /* Change text color on hover */
}

.copyright-area {
    background: #000000; /* Darker background for copyright area */
    color: #fff; /* Text color */
    padding: 15px 0; /* Padding for copyright */
}

.copyright-area p {
    margin: 0; /* Remove default margin */
}

.footer-menu ul {
    list-style: none; /* Remove default list styling */
    padding: 0; /* Remove padding */
    display: flex; /* Use flexbox for horizontal layout */
    justify-content: flex-end; /* Align links to the right */
    margin: 0; /* Remove default margin */
}

.footer-menu li {
    margin: 0 15px; /* Space between each link */
}

.footer-menu a {
    text-decoration: none; /* Remove underline from links */
    color: #007bff; /* Link color */
    font-weight: bold; /* Bold text for better visibility */
    transition: color 0.3s; /* Smooth color transition */
}

.footer-menu a:hover {
    color: #db994e;  /* Darker color on hover */
}


.footer-links-container {
    display: flex; /* Use flexbox for layout */
    justify-content: space-between; /* Space out the two lists evenly */
    flex-wrap: wrap; /* Allow wrapping if needed */
}

.footer-links {
    list-style: none; /* Remove default list styling */
    padding: 0; /* Remove padding */
    margin: 0; /* Remove default margin */
    width: 48%; /* Adjust width to fit two columns */
}

.footer-links li {
    margin: 0 0 10px; /* Space between each link */
}

.footer-links a {
    text-decoration: none; /* Remove underline from links */
    color: #007bff; /* Link color */
    transition: color 0.3s; /* Smooth color transition */
}

.footer-links a:hover {
    color: #db994e; /* Darker color on hover */
}


.footer-cta {
    padding: 0; /* Remove padding from the footer CTA */
    margin-bottom: 0; /* Ensure there's no margin at the bottom */
}

.footer-content {
    padding: 0; /* Remove padding from the footer content */
    margin-top: -20px; /* Pull up the footer content if needed */
}

.single-cta {
    margin-bottom: 0; /* Remove bottom margin from CTA items */
}

.footer-widget {
    margin-bottom: 0; /* Remove bottom margin from footer widgets */
}

@media (max-width: 1200px) {
    .footer-cta {
        padding: 20px 0; /* Adjust padding for medium screens */
    }
    
    .footer-logo img {
        max-width: 100px; /* Reduce logo size */
    }

    .footer-widget-heading h3 {
        margin-bottom: 15px; /* Reduce space below heading */
    }

    .single-cta {
        margin-bottom: 15px; /* Adjust space between CTA items */
    }
}


@media (max-width: 768px) {
    .footer-section {
        padding: 20px 0; /* Reduce padding for mobile */
    }

    .subscribe-form {
        flex-direction: column; /* Stack input and button */
    }

    .subscribe-form input {
        margin-right: 0; /* Remove right margin */
        margin-bottom: 10px; /* Space below input */
    }

    .footer-social-icon {
        margin-top: 10px; /* Reduce space above social icons */
    }
}

@media (max-width: 576px) {
    .footer-cta {
        text-align: center; /* Center-align text for smaller devices */
    }

    .single-cta {
        flex-direction: column; /* Stack icon and text vertically */
        align-items: center; /* Center items */
    }

    .single-cta i {
        margin-bottom: 10px; /* Space below icons */
    }

    .footer-widget {
        text-align: center; /* Center-align text in widgets */
    }

    .footer-widget-heading h3 {
        font-size: 18px; /* Adjust heading size */
    }
}

@media (max-width: 768px) {
    .footer-menu {
        text-align: center; /* Center-align for mobile */
        margin-top: 20px; /* Add some space above */
    }
}


/***************Footer Menu*******************/
.content-section {
    display: none; /* Keep this as is for initial state */
    text-align: center; /* Center align text */
    margin: 20px auto; /* Optional: add some margin for spacing */
    max-width: 600px; /* Optional: limit width for better readability */
}

.content-section h3 {
    margin-bottom: 15px; /* Add some spacing below the heading */
}

.content-section p {
    margin: 0; /* Remove default margins */
}


