/* ============================================================
   POC ORGANIZER SEARCH v2.0
   ============================================================ */

:root {
    --red:        #E51837;
    --red-dark:   #c01230;
    --red-pale:   #fff0f2;
    --navy:       #1a1a2e;
    --navy-mid:   #2d1b2e;
    --grey-900:   #1e1e1e;
    --grey-700:   #444;
    --grey-500:   #888;
    --grey-300:   #d0d0d0;
    --grey-100:   #f6f6f7;
    --white:      #fff;
    --green:      #2e7d32;
    --green-pale: #e8f5e9;
    --blue-pale:  #e3f2fd;
    --blue:       #1565c0;
    --gold:       #b8860b;
    --shadow-s:   0 1px 4px rgba(0,0,0,.08);
    --shadow-m:   0 4px 16px rgba(0,0,0,.10);
    --shadow-l:   0 8px 32px rgba(0,0,0,.14);
    --r:          10px;
    --r-sm:       6px;
    --r-pill:     100px;
    --ease:       200ms ease;
    --font:       'Lato', sans-serif;
}

/* RESET */
.poc-app *, .poc-app *::before, .poc-app *::after { box-sizing: border-box; }
.poc-app { font-family: var(--font); color: var(--grey-700); max-width: 1080px; margin: 0 auto 60px; }
.poc-app h2, .poc-app h3, .poc-app h4 { margin: 0; }
.poc-app p { margin: 0; }
.poc-app a { color: inherit; text-decoration: none; }
.poc-app button { cursor: pointer; font-family: var(--font); }

/* ============================================================
   HERO
   ============================================================ */

.poc-hero {
    background: linear-gradient(140deg, var(--navy) 0%, var(--navy-mid) 55%, #1a0a0f 100%);
    border-radius: var(--r);
    padding: 48px 40px 44px;
    position: relative;
    overflow: hidden;
}

.poc-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 60% 80% at 15% 60%, rgba(229,24,55,.16) 0%, transparent 70%),
        radial-gradient(ellipse 40% 60% at 85% 20%, rgba(229,24,55,.08) 0%, transparent 70%);
    pointer-events: none;
}

.poc-hero__inner {
    position: relative;
    max-width: 660px;
    margin: 0 auto;
    text-align: center;
}

.poc-hero__eyebrow {
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(255,255,255,.45);
    margin-bottom: 10px;
}

.poc-hero__title {
    font-size: 2.1rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: -.025em;
    line-height: 1.15;
    margin-bottom: 10px;
}

.poc-hero__sub {
    font-size: .95rem;
    color: rgba(255,255,255,.6);
    margin-bottom: 28px;
    line-height: 1.5;
}

/* Search wrap — now sits OUTSIDE hero to avoid overflow:hidden clipping the dropdown */
.poc-search-wrap-outer {
    position: relative;
    background: var(--white);
    border: 1px solid var(--grey-300);
    border-top: none;
    border-radius: 0 0 var(--r) var(--r);
    padding: 16px 20px 14px;
    margin-bottom: 0;
    box-shadow: 0 4px 16px rgba(0,0,0,.08);
}

/* Legacy search wrap (inside hero) — kept for reference */
.poc-search-wrap {
    position: relative;
}

.poc-search-field {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #fff;
    border-radius: var(--r-sm);
    padding: 0 14px;
    height: 50px;
    box-shadow: 0 2px 16px rgba(0,0,0,.18);
}

.poc-search-icon {
    width: 18px;
    height: 18px;
    color: var(--grey-500);
    flex-shrink: 0;
}

.poc-search-field input {
    flex: 1;
    border: none;
    outline: none;
    font-family: var(--font);
    font-size: 1rem;
    color: var(--grey-900);
    background: transparent;
    min-width: 0;
}

.poc-search-field input::placeholder { color: var(--grey-500); }

.poc-search-clear {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: var(--grey-200);
    border: none;
    border-radius: 50%;
    color: var(--grey-500);
    flex-shrink: 0;
    transition: background var(--ease);
    cursor: pointer;
}

.poc-search-clear:hover { background: var(--grey-300); color: var(--grey-700); }
.poc-search-clear svg { width: 13px; height: 13px; }

/* Near Me — inline button inside search field */
.poc-search-divider {
    width: 1px;
    height: 24px;
    background: #d0d0d0;
    flex-shrink: 0;
    margin: 0 4px;
}

.poc-locate-inline {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    background: none;
    border: none;
    color: #E51837;
    font-family: Lato, sans-serif;
    font-size: .8rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
    border-radius: 6px;
    transition: background 150ms ease;
    flex-shrink: 0;
}

.poc-locate-inline:hover { background: #fff0f2; }
.poc-locate-inline.is-active { color: #2e7d32; background: #e8f5e9; }
.poc-locate-inline svg { width: 13px; height: 13px; flex-shrink: 0; }

/* Autocomplete dropdown */
.poc-autocomplete {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: var(--white);
    border: 1px solid var(--grey-300);
    border-radius: var(--r);
    box-shadow: 0 8px 32px rgba(0,0,0,.18);
    overflow: hidden;
    z-index: 9999;
}

.poc-autocomplete[hidden] { display: none; }

.poc-ac-section { padding: 4px 0; }
.poc-ac-section + .poc-ac-section { border-top: 1px solid var(--grey-100); }

.poc-ac-label {
    font-size: .67rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--grey-500);
    padding: 8px 14px 4px;
    display: block;
}

.poc-ac-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 14px;
    cursor: pointer;
    transition: background var(--ease);
    text-decoration: none;
}

.poc-ac-item:hover { background: var(--red-pale); }

.poc-ac-icon {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .68rem;
    font-weight: 700;
}

.poc-ac-icon--place {
    background: var(--red-pale);
    color: var(--red);
}

.poc-ac-icon--person {
    background: var(--grey-100);
    color: var(--grey-700);
}

.poc-ac-name {
    font-size: .88rem;
    font-weight: 600;
    color: var(--grey-900);
    line-height: 1.25;
}

.poc-ac-name em {
    color: var(--red);
    font-style: normal;
}

.poc-ac-sub {
    font-size: .75rem;
    color: var(--grey-500);
}

.poc-ac-arrow {
    margin-left: auto;
    color: var(--grey-300);
    font-size: .9rem;
    flex-shrink: 0;
}

.poc-ac-empty {
    padding: 16px 14px;
    text-align: center;
    font-size: .83rem;
    color: var(--grey-500);
}

/* Active filter pills in hero */
.poc-active-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    margin-top: 14px;
    min-height: 0;
}

.poc-active-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px 4px 12px;
    background: rgba(255,255,255,.12);
    border: 1px solid rgba(255,255,255,.2);
    border-radius: var(--r-pill);
    color: #fff;
    font-size: .78rem;
    font-weight: 600;
    cursor: pointer;
    transition: background var(--ease);
}

.poc-active-pill:hover { background: rgba(229,24,55,.5); border-color: var(--red); }
.poc-active-pill__x { font-size: .9rem; opacity: .7; line-height: 1; }

/* ============================================================
   FILTER BAR
   ============================================================ */

.poc-filter-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    background: var(--white);
    border: 1px solid var(--grey-300);
    border-top: none;
    border-radius: 0 0 var(--r) var(--r);
    margin-bottom: 20px;
}

.poc-filter-bar__toggle {
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 7px 14px;
    background: var(--grey-100);
    border: 1.5px solid var(--grey-300);
    border-radius: var(--r-pill);
    font-size: .83rem;
    font-weight: 700;
    color: var(--grey-700);
    letter-spacing: .02em;
    transition: all var(--ease);
}

.poc-filter-bar__toggle:hover,
.poc-filter-bar__toggle[aria-expanded="true"] {
    border-color: var(--red);
    color: var(--red);
    background: var(--red-pale);
}

.poc-filter-bar__arrow { transition: transform var(--ease); }
.poc-filter-bar__toggle[aria-expanded="true"] .poc-filter-bar__arrow { transform: rotate(180deg); }

.poc-filter-count {
    background: var(--red);
    color: #fff;
    border-radius: var(--r-pill);
    font-size: .68rem;
    font-weight: 700;
    min-width: 18px;
    height: 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
}

.poc-filter-bar__right {
    display: flex;
    align-items: center;
    gap: 16px;
}

.poc-result-count {
    font-size: .82rem;
    color: var(--grey-500);
    white-space: nowrap;
}

.poc-result-count strong { color: var(--grey-900); }

.poc-sort {
    display: flex;
    align-items: center;
    gap: 8px;
}

.poc-sort label {
    font-size: .75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--grey-500);
}

.poc-sort select {
    padding: 6px 28px 6px 10px;
    border: 1.5px solid var(--grey-300);
    border-radius: var(--r-sm);
    font-family: var(--font);
    font-size: .83rem;
    color: var(--grey-700);
    background: var(--white);
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 14px;
    cursor: pointer;
}

/* ============================================================
   FILTER DRAWER
   ============================================================ */

.poc-filter-drawer {
    background: var(--white);
    border: 1px solid var(--grey-300);
    border-radius: var(--r);
    margin-bottom: 20px;
    overflow: hidden;
}

.poc-filter-drawer[hidden] { display: none; }

.poc-filter-drawer__inner {
    padding: 24px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px 28px;
}

.poc-filter-section--wide {
    grid-column: 1 / -1;
}

.poc-filter-section__title {
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--grey-500);
    margin-bottom: 10px;
}

/* CHIPS — uniform width using auto layout + wrapping */
.poc-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.poc-chip {
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    min-width: 0;
    padding: 4px 10px;
    border-radius: 100px;
    border: 1.5px solid #d0d0d0;
    background: #fff;
    color: #444;
    font-family: Lato, sans-serif;
    font-size: .76rem;
    font-weight: 600;
    text-align: center;
    line-height: 1.4;
    transition: all 150ms ease;
    cursor: pointer;
}

.poc-chip:hover {
    border-color: #E51837;
    color: #E51837;
    background: #fff0f2;
}

.poc-chip.is-on {
    background: #E51837 !important;
    border-color: #E51837 !important;
    color: #fff !important;
}

.poc-filter-drawer__footer {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 14px 24px;
    border-top: 1px solid var(--grey-100);
    background: var(--grey-100);
}

.poc-btn-ghost {
    padding: 8px 18px;
    border-radius: var(--r-sm);
    border: 1.5px solid var(--grey-300);
    background: var(--white);
    color: var(--grey-500);
    font-family: var(--font);
    font-size: .83rem;
    font-weight: 700;
    transition: all var(--ease);
}
.poc-btn-ghost:hover { border-color: var(--grey-500); color: var(--grey-700); }

.poc-btn-red {
    padding: 8px 20px;
    border-radius: var(--r-sm);
    border: 2px solid var(--red);
    background: var(--red);
    color: #fff;
    font-family: var(--font);
    font-size: .83rem;
    font-weight: 700;
    transition: background var(--ease);
}
.poc-btn-red:hover { background: var(--red-dark); border-color: var(--red-dark); }

/* ============================================================
   LOCATION BAR
   ============================================================ */

.poc-location-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    background: var(--green-pale);
    border: 1px solid #a5d6a7;
    border-radius: var(--r-sm);
    font-size: .83rem;
    font-weight: 600;
    color: var(--green);
    margin-bottom: 16px;
}

.poc-location-bar[hidden] { display: none; }

#poc-clear-location {
    margin-left: auto;
    background: none;
    border: none;
    color: var(--green);
    font-size: .78rem;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 4px;
    transition: background var(--ease);
}
#poc-clear-location:hover { background: rgba(0,0,0,.07); }

/* ============================================================
   MEMBER GRID
   ============================================================ */

.poc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
    grid-auto-rows: 1fr;
    gap: 18px;
    align-items: stretch;
}

/* ============================================================
   MEMBER CARD
   ============================================================ */

.poc-card {
    background: var(--white);
    border: 1px solid var(--grey-300);
    border-radius: var(--r);
    box-shadow: var(--shadow-s);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: transform var(--ease), box-shadow var(--ease);
    min-height: 220px;
    height: 100%;
}


.poc-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow-m);
}

/* Card accent strip */
.poc-card__strip {
    height: 4px;
    background: var(--red);
}

.poc-card__strip--gold     { background: linear-gradient(90deg, #b8860b, #daa520); }
.poc-card__strip--silver   { background: linear-gradient(90deg, #888, #bbb); }
.poc-card__strip--platinum { background: linear-gradient(90deg, #5f9ea0, #b0c4de); }

/* Card body */
.poc-card__body {
    display: flex;
    gap: 14px;
    padding: 16px 16px 12px;
    flex: 1;
    align-items: flex-start;
}

.poc-card__avatar-col {
    flex-shrink: 0;
}

.poc-card__avatar {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
    border: 2px solid var(--grey-100);
    background: var(--grey-100);
}

.poc-card__info {
    flex: 1;
    min-width: 0;
    min-height: 80px;
}

.poc-card__name {
    font-size: 1rem;
    font-weight: 700;
    color: var(--grey-900);
    margin-bottom: 3px;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.poc-card__name a:hover { color: var(--red); }

.poc-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-bottom: 6px;
}

.poc-card__location {
    display: flex;
    align-items: center;
    gap: 3px;
    font-size: .78rem;
    color: var(--grey-500);
}

.poc-card__location svg { width: 12px; height: 12px; flex-shrink: 0; }

.poc-card__distance {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: .72rem;
    font-weight: 700;
    color: var(--red);
    background: var(--red-pale);
    border-radius: var(--r-pill);
    padding: 2px 8px;
}

.poc-card__badges {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    margin-bottom: 8px;
}

.poc-card__badge {
    display: inline-block !important;
    font-size: .68rem !important;
    font-weight: 700 !important;
    padding: 2px 8px !important;
    border-radius: 100px !important;
    letter-spacing: .03em !important;
    text-transform: uppercase !important;
    width: auto !important;
    height: auto !important;
}

.poc-card__badge--inperson { background: var(--green-pale); color: var(--green); }
.poc-card__badge--virtual  { background: var(--blue-pale);  color: var(--blue);  }
.poc-card__badge--cert     { background: #fff8e1; color: var(--gold); }

.poc-card__bio {
    font-size: .8rem;
    color: #888;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.4em;
}

/* Tags */
.poc-card__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 10px 16px;
    border-top: 1px solid #f0f0f0;
    margin-top: auto;
}

.poc-card__tag {
    display: inline-block !important;
    font-size: .7rem !important;
    font-weight: 600 !important;
    color: #c01230 !important;
    background: #fff0f2 !important;
    border-radius: 100px !important;
    padding: 2px 9px !important;
    line-height: 1.5 !important;
    width: auto !important;
    height: auto !important;
}

/* Card footer */
.poc-card__footer {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px 14px;
    margin-top: auto;
}

.poc-card__cta {
    flex: 1;
    text-align: center;
    padding: 8px;
    background: var(--red);
    color: #fff !important;
    border-radius: var(--r-sm);
    font-size: .8rem;
    font-weight: 700;
    transition: background var(--ease);
    letter-spacing: .02em;
    text-decoration: none !important;
}

.poc-card__cta:hover { background: var(--red-dark); color: #fff !important; }

.poc-card__icon-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border: 1.5px solid var(--grey-300);
    border-radius: var(--r-sm);
    color: var(--grey-500);
    transition: all var(--ease);
    flex-shrink: 0;
}

.poc-card__icon-btn:hover { border-color: var(--red); color: var(--red); }
.poc-card__icon-btn svg { width: 15px; height: 15px; }

/* ============================================================
   STATES
   ============================================================ */

.poc-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 64px 20px;
    text-align: center;
    color: var(--grey-500);
}

.poc-state[hidden] { display: none; }

.poc-state h3 {
    font-size: 1.15rem;
    color: var(--grey-700);
    font-weight: 700;
}

.poc-state p { font-size: .9rem; }

.poc-spinner {
    width: 34px;
    height: 34px;
    border: 3px solid var(--grey-300);
    border-top-color: var(--red);
    border-radius: 50%;
    animation: spin .65s linear infinite;
}

@keyframes spin { to { transform: rotate(360deg); } }

/* ============================================================
   PAGINATION
   ============================================================ */

.poc-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    padding: 28px 0 0;
    flex-wrap: wrap;
}

.poc-page-btn {
    min-width: 36px;
    height: 36px;
    padding: 0 10px;
    border-radius: var(--r-sm);
    border: 1.5px solid var(--grey-300);
    background: var(--white);
    color: var(--grey-700);
    font-family: var(--font);
    font-size: .83rem;
    font-weight: 600;
    cursor: pointer;
    transition: all var(--ease);
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.poc-page-btn:hover:not(:disabled) { border-color: var(--red); color: var(--red); }
.poc-page-btn.is-on { background: var(--red); border-color: var(--red); color: #fff; }
.poc-page-btn:disabled { opacity: .35; cursor: not-allowed; }

.poc-page-ellipsis {
    padding: 0 4px;
    color: var(--grey-500);
    font-size: .83rem;
    line-height: 36px;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */

@media (max-width: 680px) {
    .poc-hero { padding: 28px 18px 24px; }
    .poc-hero__title { font-size: 1.5rem; }
    .poc-search-row { flex-direction: column; }
    .poc-locate-btn { justify-content: center; height: 44px; }
    .poc-filter-drawer__inner { grid-template-columns: 1fr; }
    .poc-filter-section--wide { grid-column: 1; }
    .poc-grid { grid-template-columns: 1fr; }
    .poc-filter-bar { flex-wrap: wrap; gap: 10px; }
    .poc-filter-bar__right { width: 100%; justify-content: space-between; }
    .poc-card__name { white-space: normal; }
}

/* Sort dimmed when keyword search is active */
.poc-sort select:disabled {
    opacity: .45;
    cursor: not-allowed;
}

/* Placeholder avatar — shown when member has no photo */
.poc-card__avatar-placeholder {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: linear-gradient(135deg, #c01230 0%, #E51837 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    letter-spacing: .02em;
    flex-shrink: 0;
    border: 2px solid var(--grey-100);
}

/* ============================================================
   SERVICE AREA FILTER INPUT
   ============================================================ */

.poc-area-input-wrap {
    position: relative;
}

.poc-area-input {
    width: 100%;
    padding: 8px 12px;
    border: 1.5px solid #d0d0d0;
    border-radius: 8px;
    font-family: Lato, sans-serif;
    font-size: .875rem;
    color: #444;
    background: #fff;
    outline: none;
    transition: border-color 200ms ease;
}

.poc-area-input:focus {
    border-color: #E51837;
}

.poc-area-suggestions {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #d0d0d0;
    border-radius: 8px;
    box-shadow: 0 6px 20px rgba(0,0,0,.12);
    z-index: 9999;
    max-height: 220px;
    overflow-y: auto;
}

.poc-area-suggestions[hidden] { display: none; }

.poc-area-suggestion {
    padding: 8px 14px;
    font-size: .85rem;
    color: #444;
    cursor: pointer;
    transition: background 150ms ease;
    display: flex;
    align-items: center;
    gap: 8px;
}

.poc-area-suggestion:hover,
.poc-area-suggestion.is-focused {
    background: #fff0f2;
    color: #E51837;
}

.poc-area-suggestion em {
    color: #E51837;
    font-style: normal;
    font-weight: 700;
}

.poc-area-active {
    margin-top: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.poc-area-active[hidden] { display: none; }

.poc-area-pill {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 10px 3px 12px;
    background: #E51837;
    color: #fff !important;
    border-radius: 100px;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
    border: none;
    font-family: Lato, sans-serif;
    transition: background 150ms ease;
}

.poc-area-pill:hover { background: #c01230; }
.poc-area-pill__x { opacity: .8; font-size: .9rem; line-height: 1; }

/* ============================================================
   CONSULTATION TYPE TOGGLE — in filter bar
   ============================================================ */

.poc-consult-toggle {
    display: flex;
    background: #f0f0f0;
    border-radius: 100px;
    padding: 3px;
    gap: 2px;
}

.poc-consult-btn {
    padding: 4px 14px;
    border-radius: 100px;
    border: none;
    background: transparent;
    color: #888;
    font-family: Lato, sans-serif;
    font-size: .78rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 150ms ease;
    white-space: nowrap;
}

.poc-consult-btn.is-active {
    background: #fff;
    color: #1e1e1e;
    box-shadow: 0 1px 4px rgba(0,0,0,.12);
}

.poc-consult-btn[data-value="In-person"].is-active { color: #2e7d32; }
.poc-consult-btn[data-value="Virtual"].is-active { color: #1565c0; }
/* ============================================================
   MEGA-MENU FILTER PANEL
   ============================================================ */

.poc-mega-menu {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-top: none;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 12px 40px rgba(0,0,0,.12);
    overflow: hidden;
}

.poc-mega-menu__search {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    background: #f8f8f8;
    border-bottom: 1px solid #ebebeb;
}

.poc-mega-menu__search svg { color: #aaa; flex-shrink: 0; }

.poc-mega-menu__search input {
    flex: 1;
    border: none;
    background: transparent;
    font-family: Lato, sans-serif;
    font-size: .875rem;
    color: #333;
    outline: none;
}

.poc-mega-menu__search input::placeholder { color: #bbb; }

.poc-mega-menu__search-clear {
    background: none;
    border: none;
    color: #aaa;
    font-size: .8rem;
    cursor: pointer;
    padding: 2px 4px;
    border-radius: 4px;
    transition: color 150ms ease;
}
.poc-mega-menu__search-clear:hover { color: #E51837; }

/* 3-column layout */
.poc-mega-menu__cols {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0;
    max-height: 420px;
    overflow-y: auto;
}

.poc-mega-col {
    padding: 16px 18px;
    border-right: 1px solid #f0f0f0;
}
.poc-mega-col:last-child { border-right: none; }

/* Column headers — different accent per type */
.poc-mega-col__header {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .68rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .1em;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 2px solid #f0f0f0;
}

.poc-mega-col__header--specialty   { color: #7b3fa0; border-color: #ede0f5; }
.poc-mega-col__header--specialty svg { stroke: #7b3fa0; }
.poc-mega-col__header--business    { color: #0d6b9a; border-color: #dceef8; }
.poc-mega-col__header--business svg { stroke: #0d6b9a; }
.poc-mega-col__header--residential { color: #2e7d32; border-color: #dff0df; }
.poc-mega-col__header--residential svg { stroke: #2e7d32; }
.poc-mega-col__header--languages   { color: #b06000; border-color: #fdefd6; }
.poc-mega-col__header--languages svg { stroke: #b06000; }

/* Chips inside mega-menu — more compact */
.poc-mega-col__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

/* Chip variants by section */
.poc-chip--specialty.is-on   { background: #7b3fa0 !important; color: #fff !important; border-color: #7b3fa0 !important; }
.poc-chip--business.is-on    { background: #0d6b9a !important; color: #fff !important; border-color: #0d6b9a !important; }
.poc-chip--residential.is-on { background: #2e7d32 !important; color: #fff !important; border-color: #2e7d32 !important; }
.poc-chip--language.is-on    { background: #b06000 !important; color: #fff !important; border-color: #b06000 !important; }

/* Highlight matched text from search */
.poc-chip mark {
    background: #fff176;
    color: inherit;
    border-radius: 2px;
    padding: 0 1px;
}

/* Chips that don't match the search are dimmed */
.poc-chip.is-hidden {
    opacity: .18 !important;
    pointer-events: none !important;
}

/* Pending count badge */
.poc-mega-menu__pending {
    font-size: .8rem;
    font-weight: 700;
    color: #E51837;
    background: #fff0f2;
    border: 1px solid #ffc5cc;
    border-radius: 100px;
    padding: 3px 12px;
}

/* Footer */
.poc-mega-menu__footer {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    background: #f8f8f8;
    border-top: 1px solid #ebebeb;
}

.poc-mega-menu__footer .poc-btn-red { margin-left: auto; }

/* OLD drawer styles removed — kept for reference */
.poc-filter-drawer { display: none !important; }


/* ============================================================
   MEGA-MENU — MOBILE BOTTOM SHEET
   Below 768px the filter panel becomes a full-screen bottom sheet
   ============================================================ */

@media (max-width: 768px) {

    /* Mega-menu becomes a fixed bottom sheet */
    .poc-mega-menu {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        border-radius: 20px 20px 0 0 !important;
        box-shadow: 0 -8px 40px rgba(0,0,0,.2) !important;
        border: none !important;
        z-index: 10000;
        max-height: 82vh;
        display: flex;
        flex-direction: column;
        transform: translateY(100%);
        transition: transform 300ms cubic-bezier(0.32, 0.72, 0, 1);
    }

    /* Animate in when visible */
    .poc-mega-menu:not([hidden]) {
        transform: translateY(0);
        display: flex !important;
    }

    /* Handle bar at the top */
    .poc-mega-menu::before {
        content: '';
        display: block;
        width: 40px;
        height: 4px;
        background: #d0d0d0;
        border-radius: 2px;
        margin: 10px auto 0;
        flex-shrink: 0;
    }

    /* Search bar */
    .poc-mega-menu__search {
        flex-shrink: 0;
    }

    /* Columns stack to single column, full height scrollable */
    .poc-mega-menu__cols {
        grid-template-columns: 1fr !important;
        max-height: none;
        flex: 1;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .poc-mega-col {
        border-right: none !important;
        border-bottom: 1px solid #f0f0f0;
    }

    .poc-mega-col:last-child {
        border-bottom: none;
    }

    /* Footer stays pinned at bottom */
    .poc-mega-menu__footer {
        flex-shrink: 0;
        padding-bottom: max(16px, env(safe-area-inset-bottom));
    }

    /* Backdrop overlay — shown via jQuery fadeIn/fadeOut when filter opens */
    .poc-mega-menu-overlay {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.4);
        z-index: 9999;
        backdrop-filter: blur(2px);
    }

    /* Filter bar - stack on mobile */
    .poc-filter-bar {
        flex-wrap: wrap;
        gap: 8px;
    }

    .poc-filter-bar__right {
        flex-wrap: wrap;
        gap: 6px;
    }

    .poc-consult-toggle {
        width: 100%;
    }

    /* Cards single column on mobile */
    .poc-grid {
        grid-template-columns: 1fr !important;
        grid-auto-rows: auto !important;
    }

    /* Search field on mobile */
    .poc-search-wrap-outer {
        border-radius: 0 !important;
        border-left: none !important;
        border-right: none !important;
    }
}

/* Overlay hidden by default — jQuery fadeIn/fadeOut controls visibility */
.poc-mega-menu-overlay { display: none; }

/* ============================================================
   TOP-5 + MORE BUTTON
   ============================================================ */

/* Hidden more chips — must override display:inline-block !important on .poc-chip */
.poc-chip--hidden {
    display: none !important;
}

.poc-more-btn {
    display: inline-block !important;
    margin-top: 6px;
    padding: 3px 10px;
    background: none;
    border: 1.5px dashed #d0d0d0;
    border-radius: 100px;
    color: #999;
    font-family: Lato, sans-serif;
    font-size: .72rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 150ms ease;
    letter-spacing: .02em;
    width: auto !important;
    height: auto !important;
}

.poc-more-btn:hover {
    border-color: #E51837;
    color: #E51837;
    background: #fff0f2;
}

.poc-more-btn.is-expanded {
    color: #999;
    border-style: solid;
    border-color: #d0d0d0;
}

.poc-more-btn.is-expanded::before {
    content: '− ';
}