/* Footer block */

/* Wrapper — carries the block's alignment, the footer sits inside it */
.block-footer-wrap {
    position: relative;
    overflow: hidden;
}

.block-footer {
    --footer-bg: var(--wp--preset--color--warm-grijs-05);
    --footer-link: var(--wp--preset--color--helder-blauw-licht);
    --footer-title: var(--wp--preset--color--warm-grijs-03);
    --footer-rule: color-mix(in srgb, var(--footer-title) 40%, transparent);
    --footer-gap: 50px;
    --footer-transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);

    background-color: var(--footer-bg);
    color: var(--footer-link);
}

.block-footer__inner {
    display: flex;
    flex-direction: column;
    /* Matches the 10rem the theme puts between top level blocks */
    gap: 10rem;
    box-sizing: content-box;
    padding: var(--wp--preset--spacing--70) var(--wp--preset--spacing--50) var(--wp--preset--spacing--50);
}

/* Shared */

.block-footer__title {
    margin: 0 0 20px;
    color: var(--footer-title);
    font-size: var(--wp--preset--font-size--normal);
    font-weight: 400;
    font-family: var(--wp--preset--font-family--inter);
}

.block-footer__link {
    color: var(--footer-link);
    text-decoration: none;
    transition: opacity var(--footer-transition);
}

.block-footer__link:hover,
.block-footer__link:focus-visible {
    opacity: 0.6;
}

.block-footer__list,
.block-footer__links,
.block-footer__logos {
    margin: 0;
    padding: 0;
    list-style: none;
}

.block-footer__list {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

/* The menu links depart from the theme's body type on purpose: Owners, bold,
   at the normal size, so they read as navigation rather than running text. */
.block-footer__list a {
    font-family: var(--wp--preset--font-family--owners);
    font-size: var(--wp--preset--font-size--normal);
    font-weight: bold;
    /* 2.5% of the font size — letter-spacing takes no percentages */
    letter-spacing: 0.025em;
}

/* Top: menu columns + part of */

.block-footer__top {
    display: flex;
    flex-direction: column;
    gap: var(--footer-gap);
}

.block-footer__menus {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px;
    max-width: 40rem;
}

/* Part of */

.block-footer__logos {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 30px;
}

.block-footer__logo {
    display: flex;
    align-items: center;
}

/* Divider between logos only — never before the first or after the last. */
.block-footer__logo + .block-footer__logo {
    padding-left: 30px;
    border-left: var(--border-01) solid var(--footer-rule);
}

.block-footer__logo img {
    display: block;
    width: auto;
    max-width: 140px;
    height: 32px;
    object-fit: contain;
}

.block-footer__logo a {
    display: block;
    transition: opacity var(--footer-transition);
}

.block-footer__logo a:hover,
.block-footer__logo a:focus-visible {
    opacity: 0.6;
}

/* Bottom: social + footer links */

.block-footer__bottom {
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding-top: var(--footer-gap);
}

.block-footer__links {
    display: flex;
    flex-direction: column;
}

/* Desktop */

@media (min-width: 782px) {
    .block-footer__top,
    .block-footer__bottom {
        display: grid;
        grid-template-columns: 3fr 1fr;
        gap: 0;
    }

    .block-footer__bottom {
        align-items: end;
    }
}