/* Structural additions for the Tailor-managed page sequence. */

.mission-topics,
.users-overview {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin-top: clamp(54px, 7vw, 92px);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.mission-topics article,
.users-overview article {
    min-height: 246px;
    padding: 31px 28px 38px 0;
}

.mission-topics article + article,
.users-overview article + article {
    padding-left: 28px;
    border-left: 1px solid var(--line);
}

.mission-topics article > span,
.users-overview article > span {
    color: var(--blue-bright);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.14em;
}

.mission-topics h3,
.users-overview h3 {
    margin: 54px 0 13px;
    font-size: 18px;
    font-weight: 600;
}

.mission-topics p,
.users-overview p {
    margin: 0;
    color: #60727e;
    font-size: 13px;
}

.section--users {
    border-top: 1px solid var(--line);
    background: var(--white);
}

.users-needs {
    margin-top: 54px;
}

.system-steps {
    grid-template-columns: repeat(5, 1fr);
}

.system-outputs {
    display: grid;
    grid-template-columns: minmax(180px, 0.28fr) 1fr;
    align-items: center;
    gap: 34px;
    margin-top: 50px;
    padding: 24px 0;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.system-outputs > span {
    color: #60727e;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.system-outputs ul {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    margin: 0;
    padding: 0;
    list-style: none;
}

.system-outputs li {
    padding: 4px 18px;
    color: var(--ink-soft);
    font-size: 12px;
    font-weight: 500;
}

.system-outputs li:first-child {
    padding-left: 0;
}

.system-outputs li + li {
    border-left: 1px solid var(--line);
}

.status-details {
    grid-template-columns: repeat(3, 1fr);
}

.status-details article {
    padding: 30px 34px 34px 0;
}

.status-details article + article {
    padding-left: 34px;
    border-left: 1px solid var(--line);
}

.status-details span {
    color: var(--blue);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.status-details article p {
    margin: 18px 0 0;
    padding: 0;
    color: #4d6472;
}

.site-footer__grid {
    grid-template-columns: 1.05fr 0.72fr 0.9fr 1fr 0.3fr;
}

.site-footer__related {
    display: flex;
    flex-direction: column;
    gap: 5px;
    color: rgba(255, 255, 255, 0.52);
    font-size: 12px;
}

.site-footer__related > span:first-child {
    margin-bottom: 13px;
    color: rgba(255, 255, 255, 0.3);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.site-footer__related a {
    color: var(--white);
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: color 180ms ease;
}

.site-footer__related a:hover {
    color: var(--aqua);
}

.site-footer__placeholder {
    color: rgba(255, 255, 255, 0.58);
    font-size: 13px;
    line-height: 1.45;
}

.site-footer__placeholder small {
    display: block;
    margin-top: 2px;
    color: rgba(255, 255, 255, 0.3);
    font-size: 9px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

@media (max-width: 1200px) and (min-width: 821px) {
    .site-header .primary-nav {
        gap: 16px;
    }

    .site-header .primary-nav > a {
        font-size: 12px;
    }
}

@media (max-width: 1024px) {
    .mission-topics,
    .users-overview {
        grid-template-columns: repeat(2, 1fr);
    }

    .mission-topics article:nth-child(odd),
    .users-overview article:nth-child(odd) {
        padding-left: 0;
        border-left: 0;
    }

    .mission-topics article:nth-child(n + 3),
    .users-overview article:nth-child(n + 3) {
        border-top: 1px solid var(--line);
    }

    .system-steps {
        grid-template-columns: repeat(2, 1fr);
        gap: 34px 0;
    }

    .system-steps li:nth-child(odd) {
        padding-left: 0;
        border-left: 0;
    }

    .system-steps li:nth-child(n + 3) {
        padding-top: 26px;
        border-top: 1px solid var(--line);
    }

    .system-outputs {
        grid-template-columns: 1fr;
    }

    .site-footer__grid {
        grid-template-columns: 1.1fr repeat(2, 0.8fr);
    }

    .site-footer__related {
        grid-column: 2;
    }
}

@media (max-width: 820px) {
    .system-steps,
    .status-details,
    .site-footer__grid {
        grid-template-columns: 1fr;
    }

    .site-footer__grid {
        gap: 46px;
    }

    .mission-topics,
    .users-overview {
        grid-template-columns: 1fr;
    }

    .mission-topics article,
    .mission-topics article + article,
    .users-overview article,
    .users-overview article + article {
        min-height: 0;
        padding: 28px 0 34px;
        border-left: 0;
    }

    .mission-topics article + article,
    .users-overview article + article {
        border-top: 1px solid var(--line);
    }

    .mission-topics h3,
    .users-overview h3 {
        margin-top: 28px;
    }

    .system-steps li,
    .system-steps li + li {
        padding: 26px 0;
        border-top: 1px solid var(--line);
        border-left: 0;
    }

    .status-details article,
    .status-details article + article {
        padding: 24px 0;
        border-left: 0;
    }

    .status-details article + article {
        border-top: 1px solid var(--line);
    }

    .site-footer__related {
        grid-column: auto;
    }
}

@media (max-width: 600px) {
    .system-outputs ul {
        grid-template-columns: 1fr;
    }

    .system-outputs li,
    .system-outputs li:first-child,
    .system-outputs li + li {
        padding: 10px 0;
        border-top: 1px solid var(--line);
        border-left: 0;
    }
}
