/* I-4 Beyond site footer */

.i4b-footer {
    --i4b-footer-bg: #414141;
    --i4b-footer-text: #fff;
    --i4b-footer-focus: #ffd54a;

    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 0;
    color: var(--i4b-footer-text);
    background: var(--i4b-footer-bg);
}

.i4b-footer *,
.i4b-footer *::before,
.i4b-footer *::after {
    box-sizing: inherit;
}

.i4b-footer__inner {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: clamp(2rem, 4vw, 4rem);
    width: min(100%, 102rem);
    min-height: 440px;
    margin-inline: auto;
    padding: 3rem clamp(2rem, 5.1vw, 5.25rem) 3rem;
}

.i4b-footer a {
    color: inherit;
    text-decoration-color: transparent;
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.18em;
    transition: text-decoration-color 160ms ease, background-color 160ms ease, color 160ms ease;
}

.i4b-footer a:hover {
    text-decoration-color: currentColor;
}

.i4b-footer a:focus-visible {
    outline: 3px solid var(--i4b-footer-focus);
    outline-offset: 5px;
}

.i4b-footer .screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    border: 0;
    white-space: nowrap;
}

.i4b-footer__community {
    display: flex;
    flex: 0 1 26.5rem;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
}

.i4b-footer__heading {
    margin: 1.55rem 0 1.35rem;
    color: inherit;
    font-size: clamp(1.55rem, 1.85vw, 1.9rem);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.i4b-footer__social-list,
.i4b-footer__menu {
    margin: 0;
    padding: 0;
    list-style: none;
}

.i4b-footer__social-list {
    display: flex;
    align-items: center;
    gap: 2.25rem;
}

.i4b-footer__social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    overflow: hidden;
    border-radius: 0.38rem;
}

.i4b-footer__social-link img {
    display: block;
    width: 1.75rem;
    height: 2rem;
    object-fit: contain;
}

.i4b-footer__social-link:hover {
    background: #ededed;
}

.i4b-footer__alerts-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3.55rem;
    margin-top: 2.15rem;
    padding: 0.55rem 1.9rem;
    border: 2px solid currentColor;
    border-radius: 999px;
    font-size: 15px;
    font-weight: 500;
}

.i4b-footer__alerts-button:hover {
    color: var(--i4b-footer-bg);
    background: var(--i4b-footer-text);
    text-decoration: none;
}

.i4b-footer__legal {
    margin-top: 3rem;
}

.i4b-footer__legal p {
    margin: 0;
}

.i4b-footer__contact {
    margin-bottom: 2.15rem !important;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
}

.i4b-footer__contact a,
.i4b-footer__policies a {
    text-decoration-line: underline;
    text-decoration-color: currentColor;
}

.i4b-footer__copyright {
    font-size: 11px;
    font-weight: 400;
    line-height: 1.45;
}

.i4b-footer__policies {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.45;
}

.i4b-footer__project,
.i4b-footer__agency {
    min-width: 0;
}

.i4b-footer__project {
    flex: 0 1 15.7rem;
}

.i4b-footer__agency {
    flex: 0 1 15.25rem;
}

.i4b-footer__project-logo-link,
.i4b-footer__fdot-logo-link {
    display: inline-block;
    line-height: 0;
}

.i4b-footer__project-logo {
    display: block;
    width: min(100%, 15.7rem);
    height: auto;
    margin-inline: auto;
    max-width: 144px;
}

.i4b-footer__fdot-logo-link {
    margin-top: 2.4rem;
}

.i4b-footer__fdot-logo {
    display: block;
    width: min(100%, 15.25rem);
    height: auto;
}

.i4b-footer__project-nav {
    margin-top: 2.65rem;
}

.i4b-footer__fdot-nav {
    margin-top: 2.55rem;
}

.i4b-footer__menu {
    display: flex;
    flex-direction: column;
    gap: 0.42rem;
}

.i4b-footer__menu li {
    margin: 0;
    padding: 0;
}

.i4b-footer__menu a {
    display: inline-block;
    padding-block: 0.08rem;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.42;
}

@media (max-width: 68rem) {
    .i4b-footer__inner {
        gap: 3rem;
        padding-inline: 2rem;
    }
}

@media (max-width: 60rem) {
    .i4b-footer__inner {
        flex-wrap: wrap;
        min-height: 0;
        padding-block: 3.5rem 4rem;
    }

    .i4b-footer__community {
        flex: 1 1 calc(55% - 1.5rem);
    }

    .i4b-footer__project {
        flex: 1 1 calc(45% - 1.5rem);
    }

    .i4b-footer__agency {
        display: flex;
        flex: 1 1 100%;
        align-items: flex-start;
        justify-content: space-between;
        gap: 3rem;
    }

    .i4b-footer__fdot-logo-link {
        margin-top: 0;
    }

    .i4b-footer__fdot-nav {
        margin-top: 0;
    }

    .i4b-footer__legal {
        margin-top: 4rem;
        padding-top: 0;
    }
}

@media (max-width: 40rem) {
    .i4b-footer__inner {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 3.75rem;
        padding: 3rem 1.5rem 3.5rem;
        text-align: center;
    }

    .i4b-footer__community,
    .i4b-footer__project,
    .i4b-footer__agency {
        flex: 1 1 auto;
        width: 100%;
    }

    .i4b-footer__project {
        order: -1;
    }

    .i4b-footer__community {
        align-items: center;
    }

    .i4b-footer__agency {
        flex-direction: column;
        align-items: center;
        gap: 0;
    }

    .i4b-footer__heading {
        margin-top: 0;
    }

    .i4b-footer__social-list {
        justify-content: center;
    }

    .i4b-footer__alerts-button {
        width: min(100%, 27rem);
    }

    .i4b-footer__legal {
        margin-top: 3.75rem;
    }

    .i4b-footer__project-logo,
    .i4b-footer__fdot-logo {
        margin-inline: auto;
    }

    .i4b-footer__project-nav,
    .i4b-footer__fdot-nav {
        margin-top: 2rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .i4b-footer a {
        transition: none;
    }
}
