/* Footer */

footer {
    padding-block: 1px;
}

footer .payoff {
    translate: -.075em 0;
    margin-top: .5em;
}

footer .larger {
    font-size: calc(var(--larger) * .9);
}

@media(max-width: 520px) {
    footer .payoff br {
        display: none;
    }

    footer .large {
        font-size: calc(var(--large) * .85);
    }
}

@media(max-width: 768px) {
    footer .payoff {
        margin-top: 0;
    }

    footer .larger {
        font-size: var(--larger);
    }
}


@media(min-width: 1560px) {
    footer .large {
        font-size: calc(var(--large) * 1.2);
    }

    footer .larger {
        font-size: calc(var(--larger) * 1.1);
    }
}

footer.bg-green-dark a {
    color: var(--white);
    text-decoration: none;
    display: inline-block;
}

footer.bg-green-dark a:hover {
    color: var(--white);
    text-decoration: underline;
}

footer.bg-green-dark a:active {
    color: var(--yellow);
    transform: translateY(1px);
}

footer .info {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    align-items: flex-start;
    justify-content: space-between;
    gap: 2.25em 3em;
    margin-top: 2em;
}

footer .info>* {
    flex-grow: 1;
    flex-basis: 280px;
}

footer .info .contact {
    max-width: 24em;
}

footer .info nav {
    max-width: min(40em, 36rem);
}


/* Col 1 */

footer .contact {
    display: flex;
    flex-direction: column;
    row-gap: 2em;
}

footer address {
    font-style: normal;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1em 2em;
    line-height: 1.5em;
    margin-block: .25em;
}

footer address>* {
    margin-bottom: 0;
}

footer address .links {
    display: flex;
    flex-direction: column;
    line-height: 1.25em;
    row-gap: .25em;
}

footer .newsletter h4 {
    font-size: 1.125em;
}

footer .newsletter input:not([type="submit"]):not([type="radio"]):not([type="checkbox"]), footer .newsletter select {
    height: 2.125rem;
    max-width: 20em;
}

footer .newsletter input[type="submit"] {
    width: auto !important;
}

footer .newsletter input[type="submit"], footer .newsletter button {
    margin-top: .75em;
}


/* Col 2 */

footer nav {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5em 2em;
}

[class*="footer-nav"] {
    list-style: none;
    padding: 0;
    margin: 0;
    min-width: 120px;
}

[class*="footer-nav"] a {
    padding-block: .25em;
    margin-block: .125em;
    line-height: 1.25em;
    text-underline-offset: .2em;
}

[class*="footer-nav"] .current-menu-item>a, [class*="footer-nav"] .current-menu-parent>a {
    text-decoration: underline;
    text-decoration-style: dotted;
}

footer nav>*:last-child {
    display: flex;
    flex-direction: column;
    row-gap: 2em;
}

@media (min-width: 1200px) {
    [class*="footer-nav"] a {
        margin-block: .25em;
    }

    footer nav>*:last-child {
        /* If we want to have the socials at the top of the column use this column-reverse */
        flex-direction: column-reverse;
        row-gap: .25rem;
        text-align: right;
    }

    footer .socials {
        margin-top: -.0625em;
        justify-content: flex-end;
    }

    footer .socials svg {
        width: 2em;
    }
}


/* Socials */

.socials {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5em;
}

.socials svg {
    width: 2.5em;
    height: auto;
}

.socials a:active svg {
    transform: translateY(1px);
    opacity: .9;
}

@media (hover: hover) {
    .socials a:hover svg {
        transform: scale(1.1);
    }

    .socials a:active svg {
        transform: scale(1.1) translateY(1px);
    }
}