#footer {
    background-color: var(--bg-clr-card);
    border-top: 2px solid var(--border-clr);
    padding: 20px 10px;
    display: flex;
    flex-direction: column;
    row-gap: 8px;

    *:not(.links, figure img, figure figcaption, figure) {
        margin: auto;
    }
    figure {
        margin-left: 50%;
        transform: translateX(-50%);
        width: fit-content;
    }

    p {
        max-width: 500px;
    }

    figure {
        display: flex;
        align-items: center;
        gap: 10px;

        /* Logo */
        img {
            border-radius: 8px;
            background-color: var(--title-clr);
            width: 40px;
            height: 40px;
        }
        /* Text */
        figcaption { color: var(--title-clr); }
    }

    ul {
        display: flex;
        max-width: 500px;
        li a {
            color: var(--title-clr);
            &:hover {
                color: var(--secondary-clr);
                text-decoration: underline;
            }
        }
    }
    .socials ul {
        gap: 4px;
        svg {
            fill: var(--title-clr);
        }
    }
    .links ul {
        justify-content: space-between;  
    }
}