/* ==========================================================================
   Mandate Labs · shared fixes for the v3 design
   Loaded last on every marketing page. Look-neutral fixes only: side
   gutters, a mobile menu, and phone layouts for tables and lists.
   ========================================================================== */

/* Side gutters. Several sections combine .container with a `padding: X 0`
   shorthand (or an inline style), which zeroed the horizontal padding below
   1180px and put text against the screen edge. */
.container { padding-left: 32px !important; padding-right: 32px !important; }
@media (max-width: 640px) {
    .container { padding-left: 20px !important; padding-right: 20px !important; }
}

/* Header: CTA and menu button sit together on the right. */
.nav-cta { display: flex; align-items: center; }
.nav-toggle { display: none; width: 44px; height: 44px; margin-left: 10px; flex: none; position: relative; padding: 0;
              border: 1px solid var(--line, #E4E8EF); background: #fff; cursor: pointer; }
.nav-toggle span { position: absolute; left: 12px; right: 12px; height: 2px; background: var(--ink, #0F172A);
                   transition: transform .2s, top .2s; }
.nav-toggle span:first-child { top: 17px; }
.nav-toggle span:last-child { top: 25px; }
.nav-toggle[aria-expanded="true"] span:first-child { top: 21px; transform: rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:last-child { top: 21px; transform: rotate(-45deg); }
.nav-toggle:focus-visible { outline: 2px solid var(--brand, #0E9F6E); outline-offset: 2px; }
.nav-panel { border-top: 1px solid var(--line, #E4E8EF); background: #fff; }
.nav-panel[hidden] { display: none; }
.nav-panel nav { display: flex; flex-direction: column; max-width: 1180px; margin: 0 auto; padding-top: 4px; padding-bottom: 18px; }
.nav-panel a { padding: 14px 0; font-size: 16px; font-weight: 500; color: var(--ink, #0F172A); border-bottom: 1px solid var(--line, #E4E8EF); }
.nav-panel a:last-child { border-bottom: 0; }
.nav-panel a[aria-current="page"] { color: var(--brand-text, #0B7D57); }

@media (max-width: 960px) {
    .nav-links { display: none !important; }
    .nav-toggle { display: inline-block; }
}
@media (max-width: 520px) {
    .nav .brand small { display: none; }
    .nav .nav-cta .btn { padding: 0 14px; font-size: 13.5px; white-space: nowrap; }
}

/* Phones: the coverage table stacks row by row instead of widening the page. */
@media (max-width: 640px) {
    .matrix thead { display: none; }
    .matrix, .matrix tbody, .matrix tr, .matrix td { display: block; width: 100%; }
    .matrix tr { padding: 14px 0; border-bottom: 1px solid var(--line, #E4E8EF); }
    .matrix td { border: 0 !important; padding: 2px 0 !important; white-space: normal !important; }
    .row-list .item { grid-template-columns: 1fr !important; gap: 6px !important; }
}
/* Phones: research paper tables scroll inside their own box. */
@media (max-width: 760px) {
    .paper table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
