/* === Active menu state === */

/* ══════════════════════════════════════════════════════
   GENERATIVE PRESS — NUCLEAR BACKGROUND OVERRIDE
   Kills the gray #f7f8f9 that GeneratePress injects
══════════════════════════════════════════════════════ */
html {
    background: #0b1a30 !important;
    min-width: 100%;
    width: 100%;
    overflow-x: hidden;
}
html::before {
    content: '';
    position: fixed;
    inset: 0;
    width: 100%;
    background: #0b1a30;
    z-index: -1;
    pointer-events: none;
}
/* Belt-and-braces: ensure body always fills viewport */
body {
    min-width: 100%;
    background: #0b1a30 !important;
    overflow-x: hidden;
}
body,
body.home, body.page, body.single, body.archive, body.category, body.tag, body.search,
#page, .site, .site-content, .content-area,
.inside-article, .entry-content, .post-inner,
.generate-columns-container, .grid-container,
article.post, article.page, article.attachment,
.singular .entry-content,
.generate-inside-left, .generate-inside-right {
    background: #0b1a30 !important;
    background-color: #0b1a30 !important;
    color: rgba(232,240,248,0.88) !important;
}

/* ── Active menu item ─────────────────────────── */
/* Desktop: WP class + aria-current + JS-added class */
.header-nav li.current-menu-item > a,
.header-nav li.current-menu-parent > a,
.header-nav li.current-menu-ancestor > a,
.header-nav li.current_page_item > a,
.header-nav li.current_page_ancestor > a,
.header-nav ul li.current-menu-item > a,
.header-nav ul li.current-menu-parent > a,
.header-nav ul li.current-menu-ancestor > a,
.header-nav a[aria-current="page"],
.header-nav > a.active,
.mobile-nav > a.active {
    color: var(--teal) !important;
    font-weight: 700 !important;
}
/* Teal underline — parallelogram to match brand line style */
.header-nav li.current-menu-item > a,
.header-nav ul li.current-menu-item > a,
.header-nav a[aria-current="page"],
.header-nav > a.active {
    position: relative !important;
}
.header-nav li.current-menu-item > a::after,
.header-nav ul li.current-menu-item > a::after,
.header-nav a[aria-current="page"]::after,
.header-nav > a.active::after {
    content: '';
    display: block;
    position: absolute;
    bottom: -6px;
    left: 0; right: 0;
    height: 2px;
    background: var(--teal);
    border-radius: 0;
    clip-path: polygon(4px 0%, 100% 0%, calc(100% - 4px) 100%, 0% 100%);
}
.header-nav ul li > a { position: relative; overflow: visible; }

/* Mobile */
.mobile-nav li.current-menu-item > a,
.mobile-nav a[aria-current="page"] {
    color: var(--teal) !important;
    font-weight: 600 !important;
    border-left: 3px solid var(--teal) !important;
    padding-left: 21px !important;
}

/* ══════════════════════════════════════════════════════
   MEMBER CARDS v2 — text only / hover logo / click popup
══════════════════════════════════════════════════════ */

/* Grid: 3 cols, all 10 in 4 rows (3+3+3+1) */
.members-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    margin-top: 40px;
}
/* For exactly 10 cards — no orphan centering needed.
   Fallback: if last row has < 5, center remaining */
.members-grid .member-card:nth-child(5n+1):last-child {
    grid-column: 1 / -1;
    max-width: 20%;
    justify-self: center;
}
.members-grid .member-card:nth-child(5n+2):last-child,
.members-grid .member-card:nth-child(5n+3):last-child,
.members-grid .member-card:nth-child(5n+4):last-child {
    justify-self: center;
}

/* Card base */
.member-card {
    position: relative;
    display: block !important;  /* force override old flex */
    padding: 0 !important;
    height: 88px !important;    /* equal height — prevent text-wrap expanding card */
    border: 1px solid rgba(0,201,167,0.12);
    border-radius: 6px;
    overflow: hidden;
    cursor: pointer;
    transition: border-color 0.25s, box-shadow 0.25s, transform 0.25s;
    background: linear-gradient(145deg, rgba(15,34,64,0.9), rgba(11,26,48,0.95));
    outline: none;
    gap: 0;
    flex-direction: unset !important;
}
.member-card:hover,
.member-card:focus-visible {
    border-color: rgba(0,201,167,0.4);
    box-shadow: 0 8px 32px rgba(0,0,0,0.3);
    transform: translateY(-2px);
}

/* Text layer — default visible, fades on hover */
.member-card-text {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 10px 12px;
    transition: opacity 0.28s ease;
    z-index: 1;
}
.member-card:hover .member-card-text,
.member-card:focus-visible .member-card-text {
    opacity: 0;
}
.member-card .member-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
    margin-bottom: 3px;
}
.member-card .member-spec {
    font-family: var(--font-code);
    font-size: 8.5px;
    color: var(--teal);
    opacity: 0.65;
    letter-spacing: 0.03em;
    line-height: 1.4;
}

/* Logo hover layer — hidden by default, appears on hover */
.member-card-logo-hover {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: linear-gradient(145deg, rgba(11,26,48,0.97), rgba(7,18,36,0.98));
    opacity: 0;
    transition: opacity 0.28s ease;
    z-index: 2;
    padding: 20px;
}
.member-card:hover .member-card-logo-hover,
.member-card:focus-visible .member-card-logo-hover {
    opacity: 1;
}
.member-hover-img {
    max-height: 52px;
    max-width: 150px;
    width: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);
    opacity: 0.9;
}
.member-hover-monogram {
    width: 56px;
    height: 56px;
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(0,201,167,0.15), rgba(0,201,167,0.07));
    border: 1px solid rgba(0,201,167,0.3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 800;
    color: var(--teal);
}
.member-hover-hint {
    font-family: var(--font-code);
    font-size: 11px;
    color: rgba(0,201,167,0.6);
    letter-spacing: 0.06em;
}

/* ── Member Popup ─────────────────────────────── */
.member-popup {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease;
}
.member-popup.active {
    opacity: 1;
    pointer-events: all;
}
.member-popup-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.65);
    backdrop-filter: blur(4px);
}
.member-popup-box {
    position: relative;
    background: linear-gradient(145deg, #0f2240, #0b1a30);
    border: 1px solid rgba(0,201,167,0.25);
    border-radius: 10px;
    padding: 40px 36px 36px;
    width: 90%;
    max-width: 480px;
    max-height: 80vh;
    overflow-y: auto;
    transform: translateY(20px) scale(0.97);
    transition: transform 0.25s ease;
    box-shadow: 0 24px 64px rgba(0,0,0,0.5);
}
.member-popup.active .member-popup-box {
    transform: translateY(0) scale(1);
}
.member-popup-close {
    position: absolute;
    top: 16px; right: 16px;
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 50%;
    width: 36px; height: 36px;
    display: flex; align-items: center; justify-content: center;
    cursor: pointer;
    color: rgba(232,240,248,0.6);
    transition: background 0.2s, color 0.2s;
}
.member-popup-close:hover { background: rgba(0,201,167,0.15); color: var(--teal); }

.member-popup-logo-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 64px;
    margin-bottom: 20px;
}
.member-popup-logo-img {
    max-height: 52px;
    max-width: 200px;
    width: auto;
    object-fit: contain;
    filter: brightness(0) invert(1);
}
.member-popup-monogram {
    width: 64px; height: 64px;
    border-radius: 10px;
    background: linear-gradient(135deg, rgba(0,201,167,0.18), rgba(0,201,167,0.06));
    border: 1px solid rgba(0,201,167,0.3);
    display: flex; align-items: center; justify-content: center;
    font-size: 26px; font-weight: 800; color: var(--teal);
}
.member-popup-name {
    font-size: 22px;
    font-weight: 800;
    color: #fff;
    text-align: center;
    margin-bottom: 8px;
}
.member-popup-spec {
    font-family: var(--font-code);
    font-size: 11px;
    color: var(--teal);
    opacity: 0.8;
    text-align: center;
    letter-spacing: 0.04em;
    margin-bottom: 16px;
}
.member-popup-desc {
    font-size: 15px;
    color: rgba(232,240,248,0.7);
    line-height: 1.7;
    text-align: center;
    margin-bottom: 24px;
}
.member-popup-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--teal);
    color: var(--navy);
    font-weight: 700;
    font-size: 14px;
    padding: 11px 24px;
    border-radius: 4px;
    text-decoration: none;
    transition: opacity 0.2s;
    margin: 0 auto;
}
.member-popup-link:hover { opacity: 0.88; }
.member-popup-link svg { stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex-shrink: 0; }

/* Responsive */
@media (max-width: 900px) {
    .members-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
    .members-grid { grid-template-columns: 1fr; }
    .member-popup-box { padding: 32px 20px 28px; }
}