@media(max-width:980px) {

    :root {
        --banner-h: 60px
    }

    .nav-menu {
        display: none
    }

    .nav-toggle {
        display: block
    }

    .nav-menu.open {
        display: flex;
        position: absolute;
        top: var(--nav-h);
        left: 0;
        right: 0;
        flex-direction: column;
        gap: 18px;
        padding: 26px;
        background: #fff;
        border-bottom: 1px solid var(--line)
    }

    .stats {
        grid-template-columns: 1fr 1fr
    }

        .stats .s:nth-child(2) {
            border-right: 0
        }

    .weave, .idsec, .contact-grid, .showcase-teaser {
        grid-template-columns: 1fr
    }

    .featured-solution {
        grid-template-columns: 1fr;
        padding: 36px 30px
    }

    .hero::before {
        background: linear-gradient(180deg,rgba(252,252,252,.9),rgba(252,252,252,.96))
    }

    .fsplit {
        grid-template-columns: 1fr;
        gap: 32px
    }

    .pill-listing {
        columns: 1
    }

    .capgrid {
        grid-template-columns: 1fr 1fr
    }

    .duo {
        grid-template-columns: 1fr
    }

    .inds {
        grid-template-columns: 1fr
    }

    .clients-grid {
        grid-template-columns: repeat(3,1fr)
    }

    .foot-grid {
        grid-template-columns: 1fr;
        gap: 0
    }

    .foot-col {
        padding: 20px 0;
        border-top: 1px solid var(--line)
    }

    .foot-trust .security-banner {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px
    }

    .foot-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px
    }

    footer {
        /* clear the fixed .support-fab so it doesn't overlap footer content on small screens */
        padding-bottom: 90px
    }

    .security-banner {
        gap: 14px;
        font-size: .72rem;
        flex-wrap: nowrap
    }

        .security-banner-item {
            gap: 6px
        }

        .security-banner-item .sb-full {
            display: none
        }

        .security-banner-item .sb-short {
            display: inline
        }

    .idwrap {
        padding: 34px
    }

    .avaband {
        padding: 34px
    }

        .avaband .inner {
            grid-template-columns: 1fr
        }

    .phero .grid, .feat, .caps, .weaveband {
        grid-template-columns: 1fr
    }

    .weaveband {
        grid-template-columns: 1fr 1fr
    }

    .gov, .returns {
        grid-template-columns: 1fr 1fr
    }

    .ba {
        grid-template-columns: 1fr
    }

        .ba .arrow {
            transform: rotate(90deg)
        }

    .repl, .integ, .outs {
        grid-template-columns: 1fr
    }

    .nums {
        grid-template-columns: 1fr 1fr
    }

    .cs-layout {
        grid-template-columns: 1fr
    }

    .aside {
        position: static
    }

    .metrics {
        grid-template-columns: 1fr
    }
}

@media(max-width:560px) {
    .frow {
        grid-template-columns: 1fr
    }

    .gov, .trailer, .returns {
        grid-template-columns: 1fr
    }

    .capgrid {
        grid-template-columns: 1fr
    }

    .clients-grid {
        grid-template-columns: repeat(2,1fr)
    }

    .certwall {
        grid-template-columns: 1fr
    }
}

@media(max-width:900px) {

    .steps {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:560px) {

    .fitlist {
        grid-template-columns: 1fr
    }

    .steps {
        grid-template-columns: 1fr
    }

    .baba {
        grid-template-columns: 1fr
    }
}

@media(max-width:980px) {

    .pillars {
        grid-template-columns: 1fr
    }

    .trio {
        grid-template-columns: 1fr
    }

    .quad {
        grid-template-columns: 1fr 1fr
    }
}

@media(max-width:560px) {

    .quad {
        grid-template-columns: 1fr
    }
}

@media(max-width:980px) {

    .paths {
        grid-template-columns: 1fr
    }
}

@media(max-width:700px) {

    .tbl caption {
        padding-bottom: 6px
    }

    .tbl thead {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap
    }

    .tbl,.tbl tbody,.tbl tr,.tbl td {
        display: block;
        width: 100%
    }

    .tbl {
        border: 0;
        background: transparent
    }

    .tbl tr {
        border: 1px solid var(--line);
        border-radius: 14px;
        margin-bottom: 12px;
        background: #fff;
        overflow: hidden
    }

    .tbl td {
        border-bottom: 1px solid var(--line);
        padding: 12px 16px
    }

    .tbl tr td:last-child {
        border-bottom: 0
    }

    .tbl td::before {
        content: attr(data-label);
        display: block;
        font-size: .68rem;
        letter-spacing: .1em;
        text-transform: uppercase;
        color: var(--gold-deep);
        font-weight: 800;
        margin-bottom: 4px
    }
}