/* =========================================================
   Footer Base
    padding: var(--space-xl) 0;
========================================================= */
footer {
        font-family: var(--font-family-base);
    font-size: var(--font-size-sm);
    background: var(--footerbar-color);
    color: var(--text-light);
}

/* ================= Footer Columns ================= */
.footer-columns {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-lg);
}

.footer-column {
    flex: 1 1 200px;
}

    /* Footer Headings */
    .footer-column h4 {
        margin-bottom: var(--space-md);
    }

    /* Lists inside footer */
    .footer-column ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

        .footer-column ul li {
            margin-bottom: var(--space-xs);
        }

            .footer-column ul li a {
                text-decoration: none;
                transition: color 0.3s ease;
                color: var(--text-light);
            }

                .footer-column ul li a:hover {
                    color: var(--color-accent);
                }

/* ================= Social Icons ================= */
.footer-social a {
    display: inline-block;
    margin-right: var(--space-xs);
    font-size: 1.2rem;
    transition: color 0.3s ease, transform 0.3s ease;
    color: var(--text-light);
}

    .footer-social a:hover {
        color: var(--color-accent);
        transform: translateY(-2px);
    }

/* ================= 
    Footer Bottom
     padding-top: var(--space-md);
    ================= */
.footer-bottom {
    margin-top: var(--space-xl);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
   
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
}

/* ================= 
    Footer Bottom Bar
     padding: var(--space-md) 0;
    ================= */
.footer-bottom-bar {
    padding: var(--space-xs) 0;
    font-size: 0.85rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    background: var(--bottombar-color);
    color: var(--text-light);
}

    /* Text and links */
    .footer-bottom-bar p {
        margin: 0;
        color: var(--text-light);
    }

    .footer-bottom-bar a {
        color: var(--color-primary);
        text-decoration: none;
        margin-left: var(--space-sm);
        transition: color 0.3s ease;
    }

        .footer-bottom-bar a:hover {
            color: var(--color-accent);
        }

    /* Social Icons in Bottom Bar */
    .footer-bottom-bar .social-icons a {
        display: inline-block;
        margin-left: var(--space-xs);
        font-size: 1.2rem;
        transition: color 0.3s ease, transform 0.3s ease;
        color: var(--text-light);
    }

        .footer-bottom-bar .social-icons a:hover {
            color: var(--color-accent);
            transform: translateY(-2px);
        }

/* ================= Responsive ================= */
@media (max-width: 768px) {
    .footer-columns {
        flex-direction: column;
    }

    .footer-bottom,
    .footer-bottom-bar {
        flex-direction: column;
        gap: var(--space-sm);
        text-align: center;
    }
}