﻿
:root{--blue:#124DC4;--ink:#111827;--body:#374151;--bg:#ffffff;--card:#ffffff;--ring:rgba(21,53,84,.35);--radius:16px;--shadow:0 10px 30px rgba(0,0,0,.08);--header-offset:96px;--outline:#E5E7EB;}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;font-family:var(--font-family-body,'Satoshi'),system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;line-height:1.6;color:var(--body);background:var(--bg)}
img{max-width:100%;height:auto;display:block}
.container{max-width:1120px;margin-inline:auto;padding-inline:1rem}
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;background:#fff;padding:.5rem 1rem;border-radius:8px;box-shadow:var(--shadow)}

.site-header{background:transparent;position:sticky;top:0;z-index:50;padding:1rem 0 0}
.nav-surface{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:#fff;color:var(--ink);border-radius:16px;padding:.6rem .8rem;border:1px solid var(--outline)}
.brand{display:flex;align-items:center;gap:.6rem;color:#111827;text-decoration:none;font-weight:500}
.brand-mark{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--blue);color:#fff;font-weight:700}
.menu{display:flex;align-items:center;gap:2rem}
.menu-group{display:flex;align-items:center;gap:1rem}

/* Consistent nav typography & color */
.menu a:link,.menu a:visited{color:#111827}
.menu-link{color:#111827;text-decoration:none;padding:.45rem .6rem;border-radius:8px;font-weight:400;font-size:16px;line-height:1.4;border:none;background:transparent}
.dropdown-item{display:block;padding:.45rem .6rem;border-radius:8px;color:#111827;text-decoration:none;background:transparent;font-weight:400;font-size:16px;line-height:1.4}
.menu-link:hover,.menu-link:focus,.menu-link.active{color:var(--e-global-color-accent,var(--blue))}
.menu-dropdown:hover>.menu-link,.menu-dropdown.open>.menu-link{color:var(--e-global-color-accent,var(--blue))}
.dropdown-item{transition:color .12s ease}
.dropdown-item:hover,.dropdown-item:focus{color:var(--e-global-color-accent,var(--blue));background:transparent}

/* Dropdowns */
.menu-dropdown{position:relative}
.menu-dropdown .has-caret::after{content:none}
.dropdown{position:absolute;top:100%;left:0;margin-top:0;background:#fff;color:var(--ink);border-radius:12px;border:1px solid var(--outline);box-shadow:none;padding:.5rem;display:none;min-width:260px;z-index:100}
.menu-dropdown:focus-within .dropdown,.menu-dropdown:hover .dropdown,.menu-dropdown.open .dropdown{display:block}

/* CTA */
.menu-cta{display:flex;gap:.6rem}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.6rem .9rem;border-radius:999px;background:var(--blue);color:#fff;text-decoration:none;font-weight:600;box-shadow:var(--shadow)}
.btn-outline{background:transparent;color:#111827;border:1px solid var(--outline);box-shadow:none}

/* Mobile */
.nav-toggle{display:none}
.hamburger{display:none}
@media (max-width: 900px){
  .site-header{padding:0}
  .nav-surface{border-radius:0;border-left:none;border-right:none}
  .hamburger{display:inline-flex;width:36px;height:36px;align-items:center;justify-content:center;border-radius:10px;border:1px solid var(--outline);cursor:pointer;z-index:1001}
  .hamburger span{width:18px;height:2px;background:#111827;position:relative}
  .hamburger span::before,.hamburger span::after{content:\"\";position:absolute;left:0;right:0;height:2px;background:#111827}
  .hamburger span::before{top:-6px}.hamburger span::after{top:6px}
  .menu{position:fixed;left:0;right:0;top:var(--header-offset);width:100vw;background:#fff;padding:1rem;display:flex;flex-direction:column;align-items:stretch;gap:.25rem;transform:translateY(-120%);transition:transform .2s ease;border-top:1px solid var(--outline);z-index:1000}
  .nav-toggle:checked ~ .menu{transform:translateY(0)}
  .menu-group,.menu-cta{display:flex;flex-direction:column;gap:.25rem}
  .menu a,.menu button.menu-link{width:100%;text-align:left;color:#111827}
  .menu .menu-dropdown{position:static}
  .menu .dropdown{position:static;display:none;margin:.25rem 0 0 .5rem;min-width:unset}
  .menu .menu-dropdown.open .dropdown{display:block}
}

.hero{background:linear-gradient(180deg,#0f2d4a,#0a1a2b);color:#fff;padding:3rem 0;margin-top:1rem;border-radius:16px}
.hero-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center}
.hero h1{font-family:var(--font-family-heading,'Satoshi'),system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;margin:0 0 .5rem;color:#fff}
.hero p{color:#e5e7eb;font-size:1.05rem;max-width:60ch}
.hero .actions{display:flex;gap:.75rem;margin-top:1rem}
.hero-media{border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}

.site-footer{background:#05302C;color:#cbd5e1;margin-top:3rem}
.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;padding:2rem 0}
.footer-title{color:#fff;font-size:1rem;margin:0 0 .5rem}
.footer-grid a{color:#cbd5e1;text-decoration:none}.footer-grid a:hover{color:#fff}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-top:1px solid rgba(255,255,255,.15);padding:1rem 0}


/* === NAV COLOR & WEIGHT EQUALIZER (v14) === */
/* Ensure all anchors (top-level and submenu) use the same dark color and normal weight */
.site-header .menu a:link,
.site-header .menu a:visited,
.site-header .menu button.menu-link {
  color:#111827 !important;
  font-weight:400 !important;
  opacity:1 !important;
  letter-spacing:0;
}

/* Submenu items */
.site-header .dropdown-item {
  color:#111827 !important;
  font-weight:400 !important;
  opacity:1 !important;
  letter-spacing:0;
}

/* Hover/active blue */
.site-header .menu a:hover,
.site-header .menu a:focus,
.site-header .menu .menu-link.active,
.site-header .menu-dropdown:hover > .menu-link,
.site-header .menu-dropdown.open > .menu-link,
.site-header .dropdown-item:hover,
.site-header .dropdown-item:focus {
  color:var(--e-global-color-accent, var(--blue)) !important;
  background:transparent !important;
}

/* Mobile: left-align items explicitly and ensure full-width tap targets */
@media (max-width: 900px){
  .site-header .menu a,
  .site-header .menu button.menu-link {
    width:100% !important;
    text-align:left !important;
    padding:.6rem .75rem !important;
  }
  /* Ensure 3-line hamburger is clearly visible */
  .site-header .hamburger{display:inline-flex !important}
  .site-header .hamburger span{display:block !important}
  .site-header .hamburger span,
  .site-header .hamburger span::before,
  .site-header .hamburger span::after{height:2px;background:#111827}
}
/* ===== NAV FIXES (force precedence) ===== */

/* Base color/weight for ALL header links (top + sub) */
.site-header .menu a:link,
.site-header .menu a:visited,
.site-header .menu button.menu-link,
.site-header .dropdown-item {
    color: #111827 !important; /* same dark color everywhere */
    font-weight: 400 !important; /* normalize thickness */
    letter-spacing: 0 !important;
    opacity: 1 !important; /* avoid “lighter” look */
    text-decoration: none !important;
}

    /* Hover/active turns blue (no background chip) */
    .site-header .menu a:hover,
    .site-header .menu a:focus,
    .site-header .menu .menu-link.active,
    .site-header .menu-dropdown:hover > .menu-link,
    .site-header .menu-dropdown.open > .menu-link,
    .site-header .dropdown-item:hover,
    .site-header .dropdown-item:focus {
        color: var(--e-global-color-accent, var(--blue)) !important; /* #124DC4 */
        background: transparent !important;
    }

/* Desktop dropdown: remove the gap so it never closes on the way down */
.site-header .menu-dropdown .dropdown {
    top: 100% !important;
    margin-top: 0 !important;
}

/* ===== Mobile (“hamburger”) ===== */
@media (max-width: 900px) {
    /* Make sure hamburger shows 3 bars (was appearing as a minus) */
    .site-header .hamburger {
        display: inline-flex !important;
    }

        .site-header .hamburger span,
        .site-header .hamburger span::before,
        .site-header .hamburger span::after {
            content: "";
            display: block !important;
            width: 18px;
            height: 2px;
            background: #111827;
            position: relative;
        }

            .site-header .hamburger span::before,
            .site-header .hamburger span::after {
                position: absolute;
                left: 0;
                right: 0;
            }

            .site-header .hamburger span::before {
                top: -6px;
            }

            .site-header .hamburger span::after {
                top: 6px;
            }

    /* Drawer: vertical list, left-aligned, full-width tap targets */
    .site-header .menu {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
    }

        .site-header .menu .menu-group,
        .site-header .menu .menu-cta {
            display: flex !important;
            flex-direction: column !important;
            gap: .25rem !important;
        }

        .site-header .menu a,
        .site-header .menu button.menu-link {
            width: 100% !important;
            text-align: left !important; /* ← left align text */
            padding: .65rem .85rem !important;
        }

        /* Mobile submenus behave like accordions */
        .site-header .menu .menu-dropdown {
            position: static !important;
        }

            .site-header .menu .menu-dropdown .dropdown {
                position: static !important;
                display: none;
                margin: .25rem 0 0 .75rem !important; /* slight indent for children */
                min-width: unset !important;
                border-radius: 10px !important;
            }

            .site-header .menu .menu-dropdown.open .dropdown {
                display: block !important;
            }
}
/* ===== MOBILE LEFT-ALIGN HARD OVERRIDES ===== */
@media (max-width: 900px) {
    /* Make the drawer and its children left-aligned no matter what brand.css says */
    .site-header .menu,
    .site-header .menu * {
        text-align: left !important;
    }

        /* Ensure labels render as left-aligned blocks, not centered flex children */
        .site-header .menu .menu-link,
        .site-header .menu .dropdown-item {
            display: block !important;
            width: 100% !important;
            padding: .65rem .85rem !important;
            margin: 0 !important;
            justify-content: flex-start !important; /* if some rule makes them flex */
            align-items: center !important;
        }

        /* Parent rows (with submenus) also left-aligned */
        .site-header .menu .menu-dropdown > .menu-link {
            display: block !important;
        }

        /* Group columns stretch so links sit flush left */
        .site-header .menu .menu-group,
        .site-header .menu .menu-cta {
            align-items: stretch !important;
        }

            /* Keep buttons full-width but keep their label centered (usually desired) */
            .site-header .menu .menu-cta .btn,
            .site-header .menu .menu-cta .btn-outline {
                width: 100% !important;
                justify-content: center !important;
            }
}
/* Logo sizing + accessibility */
.brand-logo {
    height: 28px;
    display: block
}

@media (min-width: 900px) {
    .brand-logo {
        height: 30px
    }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0
}

/* If the logo is white on transparent, make it visible on the white header */
.brand-logo {
    filter: drop-shadow(0 0 .5px rgba(0,0,0,.45))
}
/* --- Contain page width on mobile --- */
html, body {
    max-width: 100%;
    overflow-x: hidden; /* stop horizontal scroll bars */
}

/* Make all media responsive */
img, svg, canvas, video, iframe {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Long words/URLs won’t push layout */
* {
    word-break: break-word;
}

/* Tables or wide blocks */
table {
    width: 100%;
    table-layout: fixed;
}

pre, code {
    white-space: pre-wrap;
}

/* --- Header/drawer fixes --- */
@media (max-width: 900px) {
    /* Use measured header height; avoid 100vw which can overflow */
    .site-header .menu {
        position: fixed;
        left: 0;
        right: 0;
        /* top = safe area + actual header height measured in JS below */
        top: calc(env(safe-area-inset-top, 0px) + var(--header-height, 64px));
        width: 100%; /* ← instead of 100vw */
    }
    
}
.chart-wrap {
    overflow-x: auto;
}
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

img, svg, canvas, video, iframe {
    max-width: 100%;
    height: auto;
    display: block;
}
/* === Global Header & Footer Layout === */

/* Header: global look */
.nav-surface {
    border-radius: 16px;
    border: 1px solid #E5E7EB;
    padding-inline: 16px !important; /* consistent horizontal padding */
}

/* Footer: global containment */
.site-footer .footer-grid,
.site-footer .footer-bottom {
    max-width: 1120px;
    margin: 0 auto;
    background: #05302C;
}

/* === Global horizontal padding for header + footer (desktop & mobile) === */
:root {
    --pad-x: 16px; /* desktop/tablet default */
}

@media (max-width: 900px) {
    :root {
        --pad-x: 12px;
    }
    /* mobile */
}

/* Container padding */
.container {
    padding-inline: var(--pad-x) !important;
}

/* Header card padding & containment */
.nav-surface {
    padding-inline: var(--pad-x) !important;
    border-radius: 16px; /* keep the rounded corners */
}

/* Footer containers get the same side padding */
.site-footer .footer-grid,
.site-footer .footer-bottom {
    padding-inline: var(--pad-x) !important;
}

/* === Mobile containment, spacing, and footer collapse === */
@media (max-width: 900px) {
    /* Mobile header drawer aligns with same side padding */
    .site-header .menu {
        left: var(--pad-x) !important;
        right: var(--pad-x) !important;
        width: auto !important; /* prevent overflow */
        border-left: 1px solid #E5E7EB;
        border-right: 1px solid #E5E7EB;
        border-bottom: 1px solid #E5E7EB;
        border-radius: 0 0 16px 16px; /* attaches cleanly to header */
    }

    /* Mobile-only: collapse footer into a single list */
    .site-footer .footer-grid {
        display: block !important;
        padding: 16px 0;
    }

        /* hide section headings */
        .site-footer .footer-grid h3 {
            display: none !important;
        }

        /* flatten all section lists into one flowing list */
        .site-footer .footer-grid ul {
            list-style: none;
            margin: 0;
            padding: 0;
        }

        .site-footer .footer-grid li {
            display: block;
            margin: 0;
            padding: 8px 0; /* touch-friendly rows */
            border-top: 1px solid rgba(255,255,255,.12);
        }

            .site-footer .footer-grid li:first-child {
                border-top: 0;
            }

        /* links occupy full width */
        .site-footer .footer-grid a {
            display: block;
            text-decoration: none;
        }

    /* footer bottom stacks nicely */
    .site-footer .footer-bottom {
        flex-direction: column;
        align-items: flex-start;
        gap: .5rem;
        padding: 12px 0;
        background: #05302C;
    }
}
/* Base: tighter table for all screens */
#agencyTable {
    table-layout: fixed; /* prevent columns from expanding unpredictably */
    width: 100%;
}

    #agencyTable th, #agencyTable td {
        padding: .45rem .5rem; /* slimmer padding than Bootstrap default */
        vertical-align: middle;
        text-align: left;
        font-size: 0.95rem;
    }

    /* Text handling: truncate long Agency names with ellipsis */
    #agencyTable .agency-name {
        display: inline-block;
        max-width: 100%;
        overflow: hidden;
        white-space: normal; /* allow wrap */
        word-break: break-word;
    }

    /* Desktop-ish defaults (you can tune these) */
    #agencyTable .col-agency {
        width: 60%;
    }

    

    #agencyTable .col-count {
        width: 40%;
    }

/* Mobile: reduce fonts, padding, and rebalance widths */
@media (max-width: 576px) {
    #agencyTable th, #agencyTable td {
        padding: .35rem .4rem;
        font-size: .88rem;
        line-height: 1.1;
    }

    #agencyTable .col-agency {
        width: 65%;
    }



    #agencyTable .col-count {
        width: 35%;
       /* align-content: center;
        text-align: center;*/
    }
}

/* If content still overflows on very narrow screens, allow horizontal scroll safely */
.table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
h2.title {
    font-family: var(--font-family-display);
    font-size: var(--display-lg-size);
    line-height: var(--display-lg-line);
    font-weight: var(--display-lg-weight);
    letter-spacing: var(--display-lg-spacing);
    padding: 24px 0;
}










