.footer {
    background-color: var(--footer);
    color: var(--footer-font);
}

.footer-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding: 40px 0;
    gap: 48px;
}

.footer-grid h4 {
    color: var(--footer-font);
}

.footer-grid p,
.footer-grid ul {
    margin: 10px 0;
}

.footer-grid ul {
    list-style: none;
    padding: 0;
}

.footer-grid ul li a {
    color: var(--footer-font);
    text-decoration: none;
}

.footer-grid ul li a:hover {
    text-decoration: underline;
}

.footer-grid .sub-menu {
    display: none;
}

@media screen and (max-width: 768px) {
    .footer-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }
}