/* === FOOTER CONTAINER === */
footer {
    padding: 21px 0 0;
    margin-top: 50px;
    color: var(--txt);
    transition: all 0.3s ease;
}

/* === FOOTER LINKS (Quick Links) === */
.footerLinks {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 14px 0;
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.footerLinks::-webkit-scrollbar {
    display: none;
}

.footerLinks li a {
    display: flex;
    align-items: center;
    gap: 5px;

    height: 42px;
    padding: 7px 21px;

    font-size: 14px;
    font-weight: 500;
    text-decoration: none;

    color: var(--txt);
    border: var(--border);
    border-radius: 30px;

    transition: all 0.3s ease;
}

.footerLinks li a:hover {
    background-color: var(--bg-hovr);
    color: var(--txt-hovr);
    transform: translateY(-2.5px);
}

.footerLinks li a span {
    font-size: 21px;
}

/* === SOCIAL ICONS === */
.footerSocial {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 14px 0;
}

.footerSocial a {
    display: flex;
    align-items: center;
    justify-content: center;

    height: 42px;
    aspect-ratio: 1/1;

    color: var(--txt);
    border: var(--border);
    border-radius: 50%;

    text-decoration: none;
    transition: all 0.3s ease;
}

.footerSocial a:hover {
    background-color: var(--bg-hovr);
    color: var(--txt-hovr);
    transform: translateY(-5px);
}

.footerSocial a i {
    font-size: 21px;
}

/* === FOOTER BOTTOM === */
.footerBottom {
    text-align: center;
    font-size: 14px;
    margin-top: 20px;
    padding: 14px 0;
    border-top: var(--border);
}

.footerBottom span {
    font-weight: bold;
    cursor: pointer;
}

.footerBottom span a {
    text-decoration: none;
    color: var(--txt);
}

/* === RESPONSIVE ADJUSTMENTS === */
@media (max-width: 768px) {
    .footerBottom {
        font-size: 12px;
    }
}