/* GHME expert directory — scoped to the homepage team section. */
.experts.decorated {
  --experts-ink: #10244c;
  --experts-muted: #64738c;
  --experts-accent: #c54d0a;
  padding: 80px 0;
  background: #fff;
}
.experts.decorated::before, .experts.decorated::after { display: none; }
.experts [hidden] { display: none !important; }
.experts__container { width: calc(100% - 96px); max-width: 1248px; margin: auto; }
.experts__intro { margin-bottom: 38px; }
.experts .experts__eyebrow { display: flex; align-items: center; gap: 12px; font-size: 11px; font-weight: 700; letter-spacing: 1.7px; color: var(--experts-accent); line-height: 1.6; }
.experts__eyebrow::before { content: ''; width: 36px; height: 2px; flex-shrink: 0; background: var(--experts-accent); }
.experts .experts__intro h2 { text-align: left; color: var(--experts-ink); font-size: clamp(30px, 3.2vw, 44px); font-weight: 800; line-height: 1.3; letter-spacing: -1.3px; margin: 18px 0 14px; }
.experts__intro h2 em { color: var(--experts-accent); }
.experts__description { color: var(--experts-muted); font-size: 17px; line-height: 1.75; }
.experts__directory-header { display: none; align-items: center; justify-content: space-between; gap: 20px; padding: 20px; border-radius: 16px; background: #eef6fd; margin-bottom: 28px; scroll-margin-top: 24px; }
.experts--enhanced .experts__directory-header { display: flex; }
.experts__tabs { display: flex; align-self: stretch; flex: 0 0 auto; padding: 3px; border: 1px solid #d5e3ef; border-radius: 12px; background: #f8fbfe; }
.experts__tabs button { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 16px; min-height: 48px; border: 0; border-radius: 9px; background: transparent; color: #52647d; font-size: 13px; font-weight: 600; }
.experts__tabs button[aria-selected="true"] { color: #fff; background: var(--experts-accent); }
.experts__tabs button > span { font-size: 10px; padding: 2px 5px; border-radius: 4px; background: #e6eef5; }
.experts__tabs button[aria-selected="true"] > span { background: #ffffff24; }
.experts__filters { display: flex; align-items: center; gap: 14px; flex: 1; min-width: 0; }
.experts__search { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; min-height: 54px; padding: 0 16px; background: #fff; border: 1px solid #d5e3ef; border-radius: 10px; color: #536d91; }
.experts__search input { width: 100%; min-width: 0; padding: 14px 0; border: 0; outline: none; background: transparent; color: var(--experts-ink); font-size: 12px; }
.experts__search input::placeholder { color: #64738c; opacity: 1; }
.experts__search:focus-within { outline: 3px solid #1767ac; outline-offset: 3px; }
.experts__filter { flex: 0 1 220px; min-width: 0; }
.experts__filter select { width: 100%; min-height: 54px; padding: 12px; background: #fff; border: 1px solid #d5e3ef; border-radius: 10px; color: var(--experts-ink); font-size: 12px; text-overflow: ellipsis; }
.experts__group-title { margin: 24px 0; font-size: 24px; }
.experts--enhanced .experts__group-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
/* Two rows per page on desktop/tablet; two tall portrait cards on phones. */
.experts__grid { --experts-initial-count: 8; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 1fr; gap: 18px; }
/* Portrait cards: keep directory controls and profile dialog styles separate. */
.experts__card { --experts-card-accent: #c54d0a; display: flex; flex-direction: column; min-width: 0; background: #fff; border: 1px solid #dce6f1; border-radius: 15px; transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease; }
.experts__card--featured { border-color: #e58a4b; box-shadow: inset 0 0 0 .5px #e58a4b; }
.experts__photo { position: relative; flex: 0 0 220px; width: 100%; height: 220px; overflow: hidden; border-radius: 14px 14px 0 0; background: #fff; }
.experts__photo .experts__portrait { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.experts__photo::after { content: ''; position: absolute; inset: auto 0 0; height: 30px; background: linear-gradient(transparent, #fff); pointer-events: none; }
.experts__card-copy { display: flex; flex-direction: column; flex: 1; min-width: 0; min-height: 236px; padding: 18px 20px 20px; }
.experts__card .experts__card-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 0; color: var(--experts-ink); font-size: 20px; font-weight: 700; line-height: 1.3; letter-spacing: -.5px; overflow-wrap: anywhere; text-align: left; }
.experts__advisor-tag { position: absolute; z-index: 1; left: 16px; bottom: 8px; display: inline-flex; align-items: center; gap: 8px; max-width: calc(100% - 32px); margin: 0; padding: 7px 10px; border: 1px solid #f2d6c2; border-radius: 999px; background: #fffaf5; color: var(--experts-card-accent); font-size: 12px; line-height: 1.4; font-weight: 600; }
.experts__advisor-tag i { flex-shrink: 0; font-size: 16px; }
.experts__academic { margin-top: 5px; font-size: 12px; color: var(--experts-muted); line-height: 1.7; }
.experts__card .experts__academic { margin: 5px 0 0; font-size: 15px; line-height: 1.5; }
.experts__specialty { display: flex; align-items: flex-start; gap: 10px; margin: 24px 0 18px; color: var(--experts-muted); font-size: 15px; line-height: 1.5; }
.experts__specialty i { flex: 0 0 24px; margin-top: 1px; color: var(--experts-card-accent); font-size: 23px; line-height: 1; text-align: center; }
.experts__specialty span { min-width: 0; overflow-wrap: anywhere; }
.experts__card-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; padding-top: 4px; }
.experts__profile-button { display: inline-flex; align-items: center; gap: 12px; min-height: 46px; padding: 0; background: none; border: 0; color: var(--experts-card-accent); font-size: 15px; font-weight: 700; text-align: left; }
.experts__profile-arrow { font-size: 23px; font-weight: 400; transition: transform 220ms ease; }
.experts__profile-circle { display: grid; place-items: center; flex: 0 0 46px; width: 46px; height: 46px; padding: 0; border: 1px solid #dce6f1; border-radius: 50%; background: #fff; color: var(--experts-ink); transition: border-color 220ms ease; }
.experts__profile-circle i { font-size: 15px; transition: transform 220ms ease; }
.experts__card-actions button:focus-visible { outline: 3px solid #1767ac; outline-offset: 4px; }
.experts__position { margin-top: 12px; color: var(--experts-accent); font-size: 12px; font-weight: 600; line-height: 1.7; }
.experts__bio { color: var(--experts-muted); margin: 12px 0; font-size: 12px; line-height: 1.85; }
.experts__card .experts__position { margin: 5px 0 0; font-size: 15px; line-height: 1.5; color: var(--experts-muted); font-weight: 400; }
.experts__card .experts__bio { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.experts__footer { display: flex; flex-direction: column; align-items: center; gap: 14px; margin-top: 26px; text-align: center; }
.experts__footer p { color: var(--experts-muted); font-size: 12px; }
.experts__pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; }
.experts__pagination button, .experts__reset { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 8px 12px; border: 1px solid #c8d8e8; border-radius: 8px; background: #fff; color: var(--experts-ink); font-size: 12px; font-weight: 600; }
.experts__pagination button[aria-current="page"] { background: var(--experts-accent); border-color: var(--experts-accent); color: #fff; }
.experts__pagination button:disabled { color: #7b8797; background: #f4f7fa; cursor: default; }
.experts__empty { padding: 48px 20px; text-align: center; border: 1px dashed #cbd9e6; border-radius: 12px; color: var(--experts-muted); }
.experts__reset { margin-top: 18px; }
.experts button:focus-visible, .experts select:focus-visible, .experts__panel:focus-visible { outline: 3px solid #1767ac; outline-offset: 4px; }
.experts__dialog { width: min(760px, calc(100% - 32px)); max-width: 760px; max-height: calc(100dvh - 48px); padding: 38px; border: 1px solid #d3e2ed; border-radius: 16px; color: var(--experts-ink); overscroll-behavior: contain; }
.experts__dialog::backdrop { background: #061c37b8; backdrop-filter: blur(4px); }
.experts__close { position: sticky; z-index: 2; top: 0; float: right; display: grid; place-items: center; width: 44px; height: 44px; margin: -18px -18px 0 0; padding: 0; border: 1px solid #d9e5ef; border-radius: 50%; color: #24466b; background: #f1f6fb; font-size: 28px; line-height: 1; }
.experts__dialog-heading { display: flex; gap: 26px; align-items: center; padding-right: 24px; }
.experts__dialog-heading .experts__portrait { width: 130px; height: 130px; flex: 0 0 130px; object-fit: contain; border: 1px solid #e5edf3; border-radius: 12px; }
.experts .experts__dialog h2 { text-align: left; font-size: 25px; font-weight: 700; line-height: 1.4; letter-spacing: -.6px; margin: 12px 0 0; }
.experts__dialog .experts__eyebrow { font-size: 9px; letter-spacing: 1px; }
.experts__dialog .experts__eyebrow::before { width: 20px; }
.experts__details { display: grid; gap: 16px; margin: 26px 0; padding: 22px; border-radius: 10px; background: #f0f6fb; }
.experts__details dt { font-size: 11px; color: #586e83; margin-bottom: 4px; }
.experts__details dd { margin: 0; font-size: 14px; font-weight: 600; line-height: 1.7; }
.experts__full-bio h3 { font-size: 16px; margin-bottom: 16px; }
.experts__full-bio p { margin-top: 14px; font-size: 13px; line-height: 1.9; color: #495f75; }
.experts__source { margin-top: 26px; padding-top: 18px; border-top: 1px solid #e0e9f1; color: #5d7084; font-size: 10px; }
@media (hover: hover) {
  .experts__card:hover { transform: translateY(-3px); border-color: #adc5dc; box-shadow: 0 5px 16px #163b600c; }
  .experts__card--featured:hover { border-color: #e58a4b; }
  .experts__profile-button:hover .experts__profile-arrow { transform: translateX(3px); }
  .experts__profile-circle:hover { border-color: #e58a4b; }
  .experts__profile-circle:hover i { transform: translateX(2px); }
  .experts__pagination button:hover:not(:disabled):not([aria-current]), .experts__reset:hover { background: #eef6fd; }
}
@media (max-width: 1199.98px) {
  .experts__container { width: calc(100% - 64px); }
  .experts__directory-header { flex-wrap: wrap; }
  .experts__filters { flex-basis: 100%; }
  .experts__grid { --experts-initial-count: 6; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1023.98px) {
  .experts__grid { --experts-initial-count: 4; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
  .experts.decorated { padding: 64px 0; }
  .experts__container { width: calc(100% - 48px); }
}
@media (max-width: 767.98px) {
  .experts__grid { --experts-initial-count: 2; grid-template-columns: 1fr; }
  .experts__photo { height: 240px; flex-basis: 240px; }
  .experts__filter { flex-basis: 190px; }
}
@media (max-width: 575.98px) {
  .experts.decorated { padding: 46px 0; }
  .experts__container { width: calc(100% - 36px); }
  .experts__intro { margin-bottom: 26px; }
  .experts .experts__intro h2 { font-size: 30px; line-height: 1.35; letter-spacing: -1px; }
  .experts .experts__eyebrow { font-size: 10px; letter-spacing: 1.2px; }
  .experts__description { font-size: 14px; }
  .experts__directory-header { padding: 12px; gap: 12px; border-radius: 12px; }
  .experts__tabs { width: 100%; }
  .experts__tabs button { padding: 10px 8px; font-size: 11px; gap: 5px; flex: 1; }
  .experts__tabs button > span { font-size: 9px; padding: 1px 4px; }
  .experts__filters { flex-direction: column; align-items: stretch; gap: 12px; }
  .experts__search, .experts__filter { flex-basis: auto; }
  .experts__grid { gap: 16px; }
  .experts__dialog { padding: 26px 22px; max-height: calc(100dvh - 28px); width: calc(100% - 24px); border-radius: 12px; }
  .experts__close { margin: -14px -10px 0 0; }
  .experts__dialog-heading { flex-direction: column; align-items: flex-start; padding: 0; gap: 18px; }
  .experts__dialog-heading .experts__portrait { width: 112px; height: 112px; flex-basis: 112px; }
  .experts .experts__dialog h2 { font-size: 24px; }
  .experts__details { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .experts__card, .experts__profile-arrow, .experts__profile-circle, .experts__profile-circle i { transition: none; }
  .experts__card:hover, .experts__profile-button:hover .experts__profile-arrow, .experts__profile-circle:hover i { transform: none; }
}