:root {
    --m11-navy: #0b2d6f;
    --m11-blue: #1b56c9;
    --m11-bg: #f7f9fc;
    --m11-line: #dfe7f1;
    --m11-text: #20314d;
    --m11-muted: #6a7a95;
    --m11-green: #45b77d;
    --m11-purple: #9a72f7;
}

.m11-page,
.m11-page * { box-sizing: border-box; }
.m11-page {
    background: var(--m11-bg);
    color: var(--m11-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    min-height: 100vh;
}
.m11-wrap {
    width: min(1440px, calc(100% - 64px));
    margin: 0 auto;
}

.m11-topbar {
    position: sticky;
    top: 0;
    z-index: 40;
    background: rgba(255,255,255,.98);
    border-bottom: 1px solid #ebeff5;
    backdrop-filter: blur(8px);
}
.m11-topbar__inner {
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.m11-brand {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
    color: inherit;
    flex: 0 0 auto;
}
.m11-brand__mark {
    width: 34px;
    height: 40px;
    display: grid;
    place-items: center;
}
.m11-brand__mark svg { width: 100%; height: 100%; stroke: #bc8f1e; stroke-width: 1.8; fill: none; }
.m11-brand__text { display: grid; gap: 2px; }
.m11-brand__text strong,
.m11-brand__text span {
    display: block;
    font-size: 12px;
    line-height: 1.15;
    color: var(--m11-navy);
    font-weight: 800;
    letter-spacing: .01em;
}
.m11-brand__text span { font-weight: 700; }

.m11-nav {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: auto;
}
.m11-nav__item {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 44px;
    padding: 0 16px;
    border-radius: 12px;
    text-decoration: none;
    color: #324767;
    font-size: 14px;
    font-weight: 600;
    transition: .18s ease;
}
.m11-nav__item svg {
    width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.8; fill: none;
}
.m11-nav__item.is-active {
    color: var(--m11-blue);
    background: #eaf2ff;
}
.m11-nav__item:hover { background: #f0f4fa; color: var(--m11-blue); }

.m11-account {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--m11-navy);
}
.m11-theme {
    width: 34px; height: 34px; border: 0; background: transparent; color: #98a4b7; font-size: 20px; cursor: default;
}
.m11-avatar {
    width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: #eef2f7; color: #5a6d8f; font-weight: 800;
}
.m11-account__copy { display: grid; gap: 2px; }
.m11-account__copy strong { font-size: 14px; line-height: 1.1; }
.m11-account__copy span { font-size: 12px; color: #8090a8; }
.m11-account__chev { color: #7a89a1; text-decoration: none; font-size: 18px; }

.m11-hero {
    position: relative;
    min-height: 430px;
    overflow: hidden;
    border-bottom: 1px solid #edf2f7;
    background: #eff5fb;
}
.m11-hero__bg {
    position: absolute; inset: 0;
    width: 100%; height: 100%; object-fit: cover; object-position: center center;
}
.m11-hero__wash {
    position: absolute; inset: 0;
    background: linear-gradient(90deg,
        rgba(255,255,255,1) 0%,
        rgba(255,255,255,.995) 12%,
        rgba(255,255,255,.96) 23%,
        rgba(255,255,255,.84) 33%,
        rgba(255,255,255,.62) 42%,
        rgba(255,255,255,.30) 52%,
        rgba(255,255,255,.08) 61%,
        rgba(255,255,255,0) 70%);
}
.m11-hero__inner {
    position: relative; z-index: 2;
    min-height: 286px;
    display: flex; align-items: center;
}
.m11-hero__copy {
    max-width: 410px;
    padding-top: 10px;
}
.m11-hero__copy h1 {
    margin: 0 0 18px;
    color: var(--m11-navy);
    font-size: 64px;
    line-height: .92;
    letter-spacing: -.05em;
    font-weight: 900;
}
.m11-hero__copy p {
    margin: 0;
    font-size: 17px;
    line-height: 1.62;
    color: #4d6180;
}
.m11-accent {
    display: block;
    width: 42px;
    height: 4px;
    margin-top: 22px;
    border-radius: 999px;
    background: var(--m11-blue);
}

.m11-stats-wrap {
    position: relative;
    z-index: 4;
    margin-top: -8px;
    padding-bottom: 24px;
}
.m11-stats {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 20px;
}
.m11-stat {
    display: flex; align-items: center; gap: 18px;
    min-height: 108px;
    padding: 22px 24px;
    background: rgba(255,255,255,.98);
    border: 1px solid var(--m11-line);
    border-radius: 18px;
    box-shadow: 0 14px 28px rgba(20,45,80,.08);
}
.m11-stat__icon {
    width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; flex: 0 0 52px;
}
.m11-stat__icon svg { width: 22px; height: 22px; stroke: currentColor; stroke-width: 1.8; fill: none; }
.m11-stat__icon.is-blue { background: #eef4ff; color: #2b6cff; }
.m11-stat__icon.is-green { background: #edf9f2; color: var(--m11-green); }
.m11-stat__icon.is-purple { background: #f4ecff; color: var(--m11-purple); }
.m11-stat__line { display: flex; align-items: baseline; gap: 14px; margin-bottom: 4px; }
.m11-stat__line strong { font-size: 24px; line-height: 1; font-weight: 900; color: var(--m11-navy); }
.m11-stat__line span { font-size: 14px; font-weight: 800; color: #203a66; }
.m11-stat__copy p { margin: 0; font-size: 12px; color: #8794a9; }
.m11-stat__chev { margin-left: auto; color: #8da0bd; font-size: 22px; line-height: 1; }

.m11-main { padding: 22px 0 34px; }
.m11-filter {
    display: grid;
    grid-template-columns: minmax(0, 2.15fr) minmax(250px,.9fr) 170px 190px;
    gap: 18px;
    padding: 20px 20px;
    background: #fff;
    border: 1px solid var(--m11-line);
    border-radius: 18px;
    box-shadow: 0 6px 20px rgba(20,45,80,.03);
}
.m11-field label {
    display: block;
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 800;
    color: #24395d;
}
.m11-input,
.m11-field select,
.m11-btn {
    height: 46px;
    border-radius: 12px;
}
.m11-input {
    display: flex; align-items: center; gap: 10px;
    padding: 0 14px;
    background: #fff;
    border: 1px solid #d9e3ef;
}
.m11-input svg,
.m11-btn svg { width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.8; fill: none; flex: 0 0 auto; }
.m11-input input {
    width: 100%; height: 100%; border: 0; outline: none; background: transparent; font-size: 15px; color: var(--m11-text);
}
.m11-field select {
    width: 100%;
    padding: 0 16px;
    border: 1px solid #d9e3ef;
    background: #fff;
    font-size: 15px;
    color: var(--m11-text);
}
.m11-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 10px;
    padding: 0 18px;
    border: 1px solid transparent;
    text-decoration: none;
    font-weight: 800;
    font-size: 15px;
    cursor: pointer;
}
.m11-btn--primary { background: var(--m11-blue); color: #fff; }
.m11-btn--outline { background: #fff; color: var(--m11-navy); border-color: #d9e3ef; }

.m11-results-bar {
    display: flex; justify-content: space-between; align-items: center; gap: 16px;
    min-height: 74px;
    padding: 14px 2px 8px;
}
.m11-results-bar p { margin: 0; font-size: 14px; color: #6b7c97; }
.m11-results-bar strong { color: var(--m11-navy); }
.m11-sort { display: inline-flex; align-items: center; gap: 12px; }
.m11-sort label { font-size: 14px; font-weight: 800; color: #21395f; }
.m11-sort select {
    min-width: 170px; height: 46px; padding: 0 16px; border-radius: 12px; border: 1px solid #d9e3ef; background: #fff; color: #314866; font-size: 15px;
}

.m11-empty {
    padding: 42px 28px; text-align: center; background: #fff; border: 1px solid var(--m11-line); border-radius: 18px;
}
.m11-empty h2 { margin: 0 0 10px; font-size: 28px; color: var(--m11-navy); }
.m11-empty p { margin: 0 0 18px; color: #6b7c97; }

.m11-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 20px;
}
.m11-card {
    background: #fff;
    border: 1px solid var(--m11-line);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 6px 20px rgba(20,45,80,.035);
}
.m11-card__photo {
    height: 230px;
    background: #eef4fa;
}
.m11-card__photo img,
.m11-card__fallback {
    width: 100%; height: 100%;
}
.m11-card__photo img { object-fit: cover; object-position: center top; display: block; }
.m11-card__fallback {
    display: grid; place-items: center;
    font-size: 64px; font-weight: 900; color: #295ed7;
    background: linear-gradient(180deg,#eff4fb,#e8eff9);
}
.m11-card__body { padding: 16px 22px 20px; }
.m11-badge {
    display: inline-flex; align-items: center; max-width: 100%;
    min-height: 26px; padding: 0 10px; border-radius: 999px;
    background: #eef4ff; color: #3568d8; font-size: 11px; font-weight: 700;
}
.m11-card h2 {
    margin: 14px 0 6px; color: var(--m11-navy); font-size: 20px; line-height: 1.18; font-weight: 900;
}
.m11-position { margin: 0 0 14px; color: #687a95; font-size: 15px; }
.m11-contact { display: grid; gap: 8px; }
.m11-contact div { display: flex; align-items: center; gap: 8px; color: #4a5d79; font-size: 14px; }
.m11-contact svg { width: 16px; height: 16px; stroke: currentColor; stroke-width: 1.8; fill: none; flex: 0 0 auto; }
.m11-profile {
    margin-top: 16px; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; color: var(--m11-blue); font-weight: 800;
}

.m11-pagination {
    display: flex; justify-content: center; align-items: center; gap: 8px;
    margin-top: 26px;
}
.m11-pagebtn {
    min-width: 42px; height: 42px; padding: 0 12px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: 12px; background: #fff; border: 1px solid var(--m11-line); text-decoration: none; color: var(--m11-text); font-weight: 700;
}
.m11-pagebtn.is-active { background: var(--m11-blue); color: #fff; border-color: var(--m11-blue); }
.m11-pagebtn.is-disabled { pointer-events: none; opacity: .45; }
.m11-pagebtn--dots { pointer-events: none; }

@media (max-width: 1280px) {
    .m11-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
}
@media (max-width: 1100px) {
    .m11-nav { display: none; }
    .m11-filter { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
    .m11-wrap { width: calc(100% - 28px); }
    .m11-hero { min-height: 520px; }
    .m11-hero__bg { object-position: 64% center; }
    .m11-hero__wash { background: linear-gradient(180deg,#fff 0%,rgba(255,255,255,.94) 36%,rgba(255,255,255,.55) 62%,rgba(255,255,255,.08) 100%); }
    .m11-hero__inner { min-height: 248px; align-items: flex-start; padding-top: 42px; }
    .m11-hero__copy { max-width: 100%; }
    .m11-hero__copy h1 { font-size: 52px; }
    .m11-stats { grid-template-columns: 1fr; }
    .m11-filter { grid-template-columns: 1fr; }
    .m11-results-bar { flex-direction: column; align-items: flex-start; }
    .m11-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px) {
    .m11-topbar__inner { height: auto; min-height: 64px; padding: 10px 0; gap: 14px; }
    .m11-account__copy, .m11-theme { display: none; }
    .m11-brand__text strong, .m11-brand__text span { font-size: 10px; }
    .m11-hero__copy h1 { font-size: 42px; }
    .m11-hero__copy p { font-size: 15px; }
    .m11-grid { grid-template-columns: 1fr; }
    .m11-card__photo { height: 300px; }
}


/* ========================================================================
   M12 ACCESS-GATE VISUAL OVERRIDES
   ======================================================================== */

/* Brand intentionally removed. Navigation begins from left. */
.m11-topbar__inner {
    justify-content: flex-start;
}

.m11-nav {
    margin-right: 0;
}

.m11-nav-spacer {
    flex: 1 1 auto;
}

.m11-lock {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    padding: 0 13px;
    border: 1px solid #dfe6ef;
    border-radius: 10px;
    color: #61728d;
    background: #fff;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
}

.m11-lock:hover {
    color: #174db4;
    background: #f5f8fd;
}

/* Intro sentence removed: vertically rebalance hero title. */
.m11-hero__copy {
    max-width: 440px;
    padding-top: 0;
}

.m11-hero__copy h1 {
    margin-bottom: 0;
}

.m11-accent {
    margin-top: 26px;
}

@media (max-width: 900px) {
    .m11-lock { display: none; }
}


/* M14 security lock control */
.m11-lock-form {
    margin: 0;
    padding: 0;
}
button.m11-lock {
    appearance: none;
    border: 0;
    cursor: pointer;
    font: inherit;
}


/* ==========================================================================
   M16 — PUBLIC DIRECTORY + PROTECTED DETAILS
   ========================================================================== */

.m16-privacy-note {
    margin: 16px 0 0;
    padding: 11px 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #dfe7f2;
    border-radius: 10px;
    background: #f8fbff;
    color: #62728c;
    font-size: 12px;
}

.m16-privacy-note__lock {
    font-size: 13px;
}

.m16-lock-mini {
    font-size: 11px;
    margin-right: 2px;
}

.m11-profile {
    justify-content: center;
    width: 100%;
    min-height: 42px;
    border: 1px solid #d9e5f3;
    border-radius: 10px;
    background: #ffffff;
}

.m11-profile:hover {
    background: #f4f8ff;
}

/* Protected details page */
.m16-detail-page {
    min-height: calc(100vh - 70px);
    padding: 38px 0 54px;
    background:
        radial-gradient(circle at top right, rgba(34,96,210,.08), transparent 32%),
        #f6f8fc;
}

.m16-detail-wrap {
    width: min(1120px, calc(100% - 40px));
    margin: 0 auto;
}

.m16-detail-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.m16-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #18396e;
    font-weight: 800;
    text-decoration: none;
}

.m16-lock-form {
    margin: 0;
}

.m16-lock-btn {
    min-height: 40px;
    padding: 0 16px;
    border: 1px solid #d8e2ee;
    border-radius: 10px;
    background: #ffffff;
    color: #193b72;
    font-weight: 800;
    cursor: pointer;
}

.m16-security-strip {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    padding: 14px 17px;
    border: 1px solid #dce7f5;
    border-radius: 14px;
    background: #eef5ff;
}

.m16-security-strip__icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #ffffff;
}

.m16-security-strip strong,
.m16-security-strip span {
    display: block;
}

.m16-security-strip strong {
    color: #173e80;
    font-size: 13px;
}

.m16-security-strip span {
    margin-top: 2px;
    color: #6c7f9c;
    font-size: 12px;
}

.m16-detail-card {
    display: grid;
    grid-template-columns: minmax(290px, 360px) minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid #dfe7f1;
    border-radius: 22px;
    background: #ffffff;
    box-shadow: 0 20px 55px rgba(26,49,86,.10);
}

.m16-detail-photo {
    min-height: 590px;
    background: #edf3fa;
}

.m16-detail-photo img,
.m16-detail-fallback {
    width: 100%;
    height: 100%;
}

.m16-detail-photo img {
    display: block;
    object-fit: cover;
    object-position: center top;
}

.m16-detail-fallback {
    display: grid;
    place-items: center;
    color: #245dd7;
    font-size: 72px;
    font-weight: 900;
}

.m16-detail-content {
    padding: 42px 46px;
}

.m16-unit {
    display: inline-flex;
    padding: 7px 12px;
    border-radius: 999px;
    background: #edf4ff;
    color: #2b63d7;
    font-size: 12px;
    font-weight: 800;
}

.m16-detail-content h1 {
    margin: 18px 0 8px;
    color: #0b2e6c;
    font-size: clamp(30px, 4vw, 46px);
    line-height: 1.06;
    letter-spacing: -.035em;
}

.m16-position {
    margin: 0 0 24px;
    color: #64758f;
    font-size: 17px;
}

.m16-public-info {
    padding: 18px 0 24px;
    border-top: 1px solid #e9eef5;
}

.m16-info-row {
    display: grid;
    grid-template-columns: 130px minmax(0, 1fr);
    gap: 14px;
    padding: 8px 0;
    color: #263b5d;
    font-size: 15px;
}

.m16-info-row a {
    color: #2056b8;
    text-decoration: none;
}

.m16-info-label {
    color: #7c8ba0;
    font-size: 13px;
    font-weight: 800;
}

.m16-protected-box {
    padding: 24px;
    border: 1px solid #d9e5f3;
    border-radius: 16px;
    background: #f8fbff;
}

.m16-protected-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    color: #173e80;
    font-size: 13px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.m16-scope {
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #dde7f1;
}

.m16-scope h2 {
    margin: 0 0 12px;
    color: #18396e;
    font-size: 16px;
}

.m16-scope ul {
    margin: 0;
    padding-left: 20px;
}

.m16-scope li {
    margin: 7px 0;
    color: #485c7a;
    line-height: 1.55;
}

.m16-scope p {
    margin: 0;
    color: #7a899e;
}

@media (max-width: 800px) {
    .m16-detail-card {
        grid-template-columns: 1fr;
    }

    .m16-detail-photo {
        min-height: 420px;
        max-height: 520px;
    }

    .m16-detail-content {
        padding: 28px 24px;
    }

    .m16-detail-top {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 520px) {
    .m16-info-row {
        grid-template-columns: 1fr;
        gap: 3px;
    }
}


/* ==========================================================================
   M17 — SLIM CORPORATE HEADER + SILVER ABSTRACT PUBLIC DIRECTORY
   ========================================================================== */

:root {
    --m17-navy: #08245d;
    --m17-navy-2: #102f6f;
    --m17-blue: #1f5fd5;
    --m17-gold: #c79b48;
    --m17-text: #0b2d68;
    --m17-muted: #6f7f95;
    --m17-border: #dfe6ef;
    --m17-surface: rgba(255,255,255,.94);
}

/* Main page background — clean grey / silver abstract */
.m11-page,
.m11-directory,
body {
    background-color: #f7f9fc;
}

.m11-page {
    position: relative;
    isolation: isolate;
    background:
        linear-gradient(145deg, rgba(255,255,255,.96), rgba(244,247,251,.97));
}

.m11-page::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    opacity: .72;
    background:
        linear-gradient(128deg, transparent 0 18%, rgba(145,157,176,.07) 18.2% 27%, transparent 27.2% 100%),
        linear-gradient(42deg, transparent 0 63%, rgba(125,138,159,.06) 63.2% 73%, transparent 73.2% 100%),
        linear-gradient(160deg, transparent 0 77%, rgba(170,180,195,.06) 77.2% 86%, transparent 86.2% 100%);
}

/* Hide old large hero background/visual if legacy CSS still targets it */
.m11-hero,
.m11-hero__bg,
.m11-hero::before,
.m11-hero::after {
    display: none !important;
}

/* Slim identity banner */
.m17-brand-header {
    width: 100%;
    min-height: 118px;
    overflow: hidden;
    border-bottom: 2px solid rgba(199,155,72,.85);
    background:
        linear-gradient(90deg, #071d4d 0%, #0d2a65 47%, #193a75 72%, #18376f 100%);
    color: #fff;
}

.m17-brand-header__inner {
    position: relative;
    width: min(1440px, calc(100% - 44px));
    min-height: 118px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.m17-brand-header__identity {
    position: relative;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 22px;
    padding: 18px 0;
}

.m17-brand-logo {
    width: 92px;
    height: 72px;
    object-fit: contain;
    object-position: center;
    filter: drop-shadow(0 4px 8px rgba(0,0,0,.14));
}

.m17-brand-divider {
    width: 1px;
    height: 64px;
    background: rgba(255,255,255,.42);
}

.m17-brand-title {
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(28px, 3vw, 44px);
    line-height: 1;
    letter-spacing: -.025em;
    color: #fff;
}

.m17-brand-subtitle {
    margin-top: 8px;
    color: rgba(255,255,255,.78);
    font-size: 14px;
    letter-spacing: .01em;
}

.m17-brand-building {
    position: absolute;
    top: 0;
    right: 0;
    width: min(46vw, 700px);
    height: 100%;
    background:
        linear-gradient(90deg, #17366f 0%, rgba(23,54,111,.60) 22%, rgba(23,54,111,.10) 52%, rgba(23,54,111,0) 100%),
        url("../images/header-building.png?v=20260821-m17") center 42% / cover no-repeat;
    opacity: .98;
}

.m17-brand-building::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, #16356f 0%, rgba(22,53,111,.30) 35%, rgba(9,30,75,.02) 70%);
}

/* Page heading */
.m17-page-heading {
    padding: 32px 0 8px;
}

.m17-shell {
    width: min(1400px, calc(100% - 44px));
    margin: 0 auto;
}

.m17-page-heading h1 {
    margin: 0;
    color: var(--m17-text);
    font-size: clamp(34px, 4.5vw, 56px);
    line-height: 1.05;
    font-weight: 850;
    letter-spacing: -.04em;
}

.m17-heading-line {
    display: block;
    width: 48px;
    height: 4px;
    margin-top: 18px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--m17-blue), #3b73e8);
}

/* Public nav should sit cleanly under banner */
.m11-topbar {
    position: relative !important;
    top: auto !important;
    z-index: 30;
    min-height: 72px;
    border-bottom: 1px solid #e7ecf3;
    background: rgba(255,255,255,.97);
    backdrop-filter: blur(16px);
}

/* Content width / spacing */
.m11-directory {
    padding-top: 12px !important;
}

.m11-stats,
.m11-search,
.m16-privacy-note,
.m11-results-bar,
.m11-grid,
.m11-pagination {
    width: min(1400px, calc(100% - 44px));
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Stats cards */
.m11-stat {
    border: 1px solid var(--m17-border) !important;
    background: var(--m17-surface) !important;
    box-shadow: 0 12px 28px rgba(27,49,84,.07) !important;
    backdrop-filter: blur(8px);
}

.m11-stat:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 34px rgba(27,49,84,.10) !important;
}

/* Search/filter */
.m11-search {
    border: 1px solid var(--m17-border) !important;
    background: rgba(255,255,255,.96) !important;
    box-shadow: 0 10px 26px rgba(31,49,79,.055) !important;
}

/* Privacy note */
.m16-privacy-note {
    display: flex !important;
    margin-top: 14px !important;
    border-color: #dce6f2 !important;
    background: rgba(248,251,255,.95) !important;
    color: #5d6f89 !important;
}

/* Staff cards */
.m11-card {
    overflow: hidden;
    border: 1px solid var(--m17-border) !important;
    background: rgba(255,255,255,.97) !important;
    box-shadow: 0 10px 26px rgba(31,49,79,.07) !important;
}

.m11-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 36px rgba(31,49,79,.11) !important;
}

.m11-card-photo {
    background: #edf2f8 !important;
}

/* Details button */
.m11-profile {
    border-color: #a9c2f5 !important;
    color: #1755c1 !important;
    background: #fff !important;
    font-weight: 800 !important;
}

.m11-profile:hover {
    color: #fff !important;
    background: linear-gradient(90deg, #1549a8, #2365dc) !important;
    border-color: transparent !important;
}

/* Prevent old background-image hero rules from bleeding through */
.m11-directory,
.m11-main,
main {
    background-image: none !important;
}

/* Responsive */
@media (max-width: 900px) {
    .m17-brand-header {
        min-height: 104px;
    }

    .m17-brand-header__inner {
        width: min(100% - 28px, 1400px);
        min-height: 104px;
    }

    .m17-brand-logo {
        width: 72px;
        height: 58px;
    }

    .m17-brand-divider {
        height: 54px;
    }

    .m17-brand-building {
        width: 48%;
        opacity: .72;
    }

    .m17-brand-subtitle {
        font-size: 12px;
    }

    .m17-shell,
    .m11-stats,
    .m11-search,
    .m16-privacy-note,
    .m11-results-bar,
    .m11-grid,
    .m11-pagination {
        width: calc(100% - 28px);
    }
}

@media (max-width: 640px) {
    .m17-brand-header {
        min-height: 94px;
    }

    .m17-brand-header__inner {
        min-height: 94px;
    }

    .m17-brand-logo {
        width: 58px;
        height: 48px;
    }

    .m17-brand-divider {
        display: none;
    }

    .m17-brand-header__identity {
        gap: 12px;
    }

    .m17-brand-title {
        font-size: 24px;
    }

    .m17-brand-subtitle {
        max-width: 220px;
        font-size: 10px;
    }

    .m17-brand-building {
        width: 46%;
        opacity: .50;
    }

    .m17-page-heading {
        padding-top: 24px;
    }
}


/* ==========================================================================
   M17.1 — AUTHORITATIVE HEADER FIX
   ========================================================================== */

.m17-brand-header {
    display: block !important;
    position: relative !important;
    z-index: 40 !important;
    width: 100% !important;
    min-height: 118px !important;
    overflow: hidden !important;
    margin: 0 !important;
    border-bottom: 2px solid #c89a47 !important;
    background:
        linear-gradient(
            90deg,
            #061c4b 0%,
            #0a285f 50%,
            #16366f 76%,
            #193a73 100%
        ) !important;
}

.m17-brand-header__inner {
    position: relative !important;
    width: min(1440px, calc(100% - 64px)) !important;
    min-height: 118px !important;
    margin: 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.m17-brand-header__identity {
    position: relative !important;
    z-index: 5 !important;
    display: flex !important;
    align-items: center !important;
    gap: 22px !important;
}

.m17-brand-logo {
    display: block !important;
    width: 94px !important;
    height: 76px !important;
    object-fit: contain !important;
    object-position: center !important;
}

.m17-brand-divider {
    display: block !important;
    width: 1px !important;
    height: 64px !important;
    background: rgba(255,255,255,.52) !important;
}

.m17-brand-copy {
    display: block !important;
    position: relative !important;
    z-index: 5 !important;
}

.m17-brand-title {
    display: block !important;
    color: #fff !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 38px !important;
    font-weight: 500 !important;
    line-height: 1.05 !important;
    letter-spacing: -.02em !important;
}

.m17-brand-subtitle {
    display: block !important;
    margin-top: 7px !important;
    color: rgba(255,255,255,.80) !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
}

.m17-brand-building {
    display: block !important;
    position: absolute !important;
    z-index: 1 !important;
    top: 0 !important;
    right: 0 !important;
    width: min(50vw, 690px) !important;
    height: 118px !important;
    opacity: 1 !important;
    background:
        linear-gradient(
            90deg,
            #17366f 0%,
            rgba(23,54,111,.80) 17%,
            rgba(23,54,111,.28) 42%,
            rgba(23,54,111,.03) 73%,
            rgba(23,54,111,0) 100%
        ),
        url("../images/header-building.png?v=20260821-m171")
        center 41% / cover no-repeat !important;
}

.m17-brand-building::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        linear-gradient(
            90deg,
            #16356f 0%,
            rgba(22,53,111,.40) 30%,
            rgba(22,53,111,.04) 72%,
            transparent 100%
        ) !important;
}

.m17-page-heading {
    display: block !important;
    padding: 34px 0 10px !important;
    margin: 0 !important;
}

.m17-shell {
    width: min(1400px, calc(100% - 64px)) !important;
    margin: 0 auto !important;
}

.m17-page-heading h1 {
    margin: 0 !important;
    color: #0a3478 !important;
    font-size: clamp(36px, 4vw, 52px) !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    letter-spacing: -.045em !important;
}

.m17-heading-line {
    display: block !important;
    width: 45px !important;
    height: 4px !important;
    margin-top: 18px !important;
    border-radius: 999px !important;
    background: #2362d6 !important;
}

/* Keep navigation immediately below corporate banner */
.m11-topbar {
    margin-top: 0 !important;
}

/* Ensure existing main width does not swallow the new heading */
.m11-main {
    padding-top: 16px !important;
}

/* No old giant building hero */
.m11-hero,
.m11-hero__bg {
    display: none !important;
}

@media (max-width: 800px) {
    .m17-brand-header,
    .m17-brand-header__inner {
        min-height: 100px !important;
    }

    .m17-brand-header__inner,
    .m17-shell {
        width: calc(100% - 28px) !important;
    }

    .m17-brand-logo {
        width: 70px !important;
        height: 58px !important;
    }

    .m17-brand-title {
        font-size: 28px !important;
    }

    .m17-brand-subtitle {
        font-size: 11px !important;
    }

    .m17-brand-divider {
        height: 50px !important;
    }

    .m17-brand-building {
        height: 100px !important;
        width: 50% !important;
        opacity: .72 !important;
    }
}

@media (max-width: 560px) {
    .m17-brand-building {
        opacity: .35 !important;
        width: 55% !important;
    }

    .m17-brand-divider {
        display: none !important;
    }

    .m17-brand-header__identity {
        gap: 10px !important;
    }

    .m17-brand-logo {
        width: 58px !important;
    }

    .m17-brand-title {
        font-size: 23px !important;
    }

    .m17-brand-subtitle {
        max-width: 190px !important;
    }
}


/* ==========================================================================
   M17.2 — HEADER PREMIUM BLEND
   Authoritative visual override
   ========================================================================== */

.m17-brand-header {
    display: block !important;
    position: relative !important;
    z-index: 40 !important;
    width: 100% !important;
    min-height: 116px !important;
    overflow: hidden !important;
    margin: 0 !important;
    border-bottom: 1px solid rgba(198,154,72,.88) !important;
    background:
        radial-gradient(circle at 72% 50%, rgba(63,94,151,.20), transparent 30%),
        linear-gradient(
            90deg,
            #061942 0%,
            #082153 34%,
            #0d2a63 62%,
            #17396f 100%
        ) !important;
    box-shadow: 0 5px 16px rgba(12,35,75,.06) !important;
}

.m17-brand-header::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(
            90deg,
            rgba(255,255,255,.015) 0%,
            rgba(255,255,255,0) 36%,
            rgba(255,255,255,.025) 72%,
            rgba(255,255,255,0) 100%
        ) !important;
}

.m17-brand-header__inner {
    position: relative !important;
    z-index: 2 !important;
    width: min(1460px, calc(100% - 72px)) !important;
    min-height: 116px !important;
    margin: 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    overflow: visible !important;
}

.m17-brand-header__identity {
    position: relative !important;
    z-index: 6 !important;
    display: flex !important;
    align-items: center !important;
    gap: 23px !important;
    padding: 14px 0 !important;
}

.m17-brand-logo {
    display: block !important;
    width: 102px !important;
    height: 78px !important;
    object-fit: contain !important;
    object-position: center !important;
    filter:
        drop-shadow(0 3px 7px rgba(0,0,0,.16))
        saturate(.96) !important;
}

.m17-brand-divider {
    display: block !important;
    width: 1px !important;
    height: 62px !important;
    background: linear-gradient(
        180deg,
        transparent,
        rgba(255,255,255,.62) 18%,
        rgba(255,255,255,.62) 82%,
        transparent
    ) !important;
}

.m17-brand-copy {
    position: relative !important;
    z-index: 6 !important;
    padding-right: 30px !important;
}

.m17-brand-title {
    display: block !important;
    margin: 0 !important;
    color: #ffffff !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 36px !important;
    font-weight: 500 !important;
    line-height: 1.03 !important;
    letter-spacing: -.025em !important;
    text-shadow: 0 2px 9px rgba(4,18,51,.16) !important;
}

.m17-brand-subtitle {
    display: block !important;
    margin-top: 7px !important;
    color: rgba(255,255,255,.82) !important;
    font-size: 13.5px !important;
    line-height: 1.25 !important;
    letter-spacing: .01em !important;
}

/* Building is blended into navy instead of rendered as a rectangle */
.m17-brand-building {
    display: block !important;
    position: absolute !important;
    z-index: 1 !important;
    top: -7px !important;
    right: -36px !important;
    width: min(49vw, 720px) !important;
    height: 130px !important;
    opacity: .98 !important;
    border: 0 !important;
    box-shadow: none !important;

    background:
        url("../images/header-building.png?v=20260821-m172")
        right 43% / cover no-repeat !important;

    -webkit-mask-image: linear-gradient(
        90deg,
        transparent 0%,
        rgba(0,0,0,.04) 5%,
        rgba(0,0,0,.12) 10%,
        rgba(0,0,0,.25) 16%,
        rgba(0,0,0,.45) 23%,
        rgba(0,0,0,.70) 31%,
        rgba(0,0,0,.90) 39%,
        #000 48%,
        #000 100%
    ) !important;

    mask-image: linear-gradient(
        90deg,
        transparent 0%,
        rgba(0,0,0,.04) 5%,
        rgba(0,0,0,.12) 10%,
        rgba(0,0,0,.25) 16%,
        rgba(0,0,0,.45) 23%,
        rgba(0,0,0,.70) 31%,
        rgba(0,0,0,.90) 39%,
        #000 48%,
        #000 100%
    ) !important;
}

.m17-brand-building::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    background:
        linear-gradient(
            90deg,
            #0d2a63 0%,
            rgba(13,42,99,.98) 7%,
            rgba(13,42,99,.92) 13%,
            rgba(13,42,99,.80) 21%,
            rgba(13,42,99,.58) 31%,
            rgba(13,42,99,.34) 41%,
            rgba(13,42,99,.16) 51%,
            rgba(13,42,99,.04) 62%,
            transparent 74%
        ) !important;
}

.m17-brand-building::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    z-index: 3 !important;
    background:
        linear-gradient(
            180deg,
            rgba(9,27,66,.03) 0%,
            rgba(9,27,66,0) 46%,
            rgba(3,14,36,.08) 100%
        ) !important;
}

/* Page spacing remains clean beneath header */
.m17-page-heading {
    display: block !important;
    padding: 34px 0 10px !important;
    margin: 0 !important;
}

.m17-shell {
    width: min(1400px, calc(100% - 64px)) !important;
    margin: 0 auto !important;
}

.m17-page-heading h1 {
    margin: 0 !important;
    color: #0a3478 !important;
    font-size: clamp(36px, 4vw, 52px) !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    letter-spacing: -.045em !important;
}

.m17-heading-line {
    display: block !important;
    width: 46px !important;
    height: 4px !important;
    margin-top: 18px !important;
    border-radius: 999px !important;
    background: linear-gradient(90deg, #1f5fd5, #3d75e8) !important;
}

@media (max-width: 1180px) {
    .m17-brand-building {
        width: 610px !important;
        right: -40px !important;
    }
}

@media (max-width: 900px) {
    .m17-brand-header,
    .m17-brand-header__inner {
        min-height: 104px !important;
    }

    .m17-brand-header__inner {
        width: calc(100% - 32px) !important;
    }

    .m17-brand-logo {
        width: 80px !important;
        height: 62px !important;
    }

    .m17-brand-title {
        font-size: 30px !important;
    }

    .m17-brand-subtitle {
        font-size: 11.5px !important;
    }

    .m17-brand-divider {
        height: 52px !important;
    }

    .m17-brand-building {
        height: 116px !important;
        width: 54% !important;
        right: -24px !important;
        opacity: .72 !important;
    }
}

@media (max-width: 620px) {
    .m17-brand-header,
    .m17-brand-header__inner {
        min-height: 92px !important;
    }

    .m17-brand-header__identity {
        gap: 11px !important;
    }

    .m17-brand-logo {
        width: 60px !important;
        height: 50px !important;
    }

    .m17-brand-divider {
        display: none !important;
    }

    .m17-brand-title {
        font-size: 24px !important;
    }

    .m17-brand-subtitle {
        max-width: 205px !important;
        font-size: 10px !important;
    }

    .m17-brand-building {
        height: 104px !important;
        width: 58% !important;
        opacity: .42 !important;
    }
}