:root {
    --footer-bg-color: #4f4f4f;
    --footer-text-color: #ffffff; 
}


footer {
    background-color: var(--footer-bg-color);
    color: var(--footer-text-color);
    padding: 3rem 0rem 2rem 0rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}


.footer__links {
    display: flex;
    justify-content: space-around;
    gap: 1rem;
}


footer a {
    text-decoration: none;
    color: var(--footer-text-color);
}


.footer__page_nav {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}


.footer__page_nav nav {
    display: flex;
    flex-direction: column;
    gap: 8px;
}


.footer__socials {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}


.footer__socials nav {
    display: flex;
    gap: 0.5rem;
}


.socials__logo {
    width: 2.5rem;
    height: 2.5rem;
}


.footer__contacts {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}


.footer__contacts h1 {
    text-align: center;
}


.footer__contacts ul {
    list-style: none;
}


.footer__name p {
    text-align: center;
}


.highlighted_link {
    color: #ffb3b7;
    text-decoration: underline;
}


@media only screen and (max-width: 767px) {
    .footer__links {
        display: flex;
        flex-direction: column;
        gap: 1rem;
        align-items: center;
    }

    .footer__links div{
        align-items: center;
    }

    .footer__contacts ul {
        text-align: center;
    }
}