and </script> into an
     Elementor "HTML" widget. Self-contained: no libraries,
     no external files (fonts load via @import).

     ADDING A HEADSHOT: upload to WP Media Library, copy the URL,
     and paste it into that person's  photo: ''  field below.
     Empty photo = coloured initials tile (automatic fallback).

     If your site has a fixed header the sticky bar slides under,
     bump  --mw-sticky-top  in the .mw-team rule.
     ============================================================ -->

<style>
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&family=DM+Sans:opsz,wght@9..40,400;9..40,500&display=swap');

.mw-team{
  --mw-ink:#171c2e; --mw-muted:#5b6478; --mw-line:#e5e8f0; --mw-card:#fff;
  --mw-brand:#455cb5; --mw-lead:#455cb5; --mw-solutions:#2e8bd0; --mw-eng:#6c5ce7; --mw-board:#5b6478;
  --mw-shadow:0 1px 2px rgba(23,28,46,.04), 0 8px 24px rgba(23,28,46,.06);
  --mw-shadow-lg:0 24px 60px rgba(23,28,46,.22);
  --mw-sticky-top:0px;
  font-family:'DM Sans',system-ui,sans-serif;color:var(--mw-ink, #171c2e);line-height:1.55;
  max-width:1120px;margin:0 auto;padding:8px 4px 40px;-webkit-font-smoothing:antialiased
}
.mw-team *{box-sizing:border-box}
.mw-team .mw-eyebrow{font-family:'Outfit',sans-serif;font-weight:600;letter-spacing:.14em;text-transform:uppercase;font-size:12px;color:var(--mw-brand, #455cb5);margin:0 0 10px}
.mw-team h2.mw-title{font-family:'Outfit',sans-serif;font-weight:700;font-size:clamp(28px,4.5vw,42px);line-height:1.05;margin:0 0 12px;letter-spacing:-.02em;color:var(--mw-ink, #171c2e)}
.mw-team .mw-lede{max-width:560px;color:var(--mw-muted, #5b6478);font-size:17px;margin:0 0 28px}

.mw-team .mw-controls{position:sticky;top:var(--mw-sticky-top, 0px);z-index:20;background:rgba(246,247,251,.9);backdrop-filter:blur(8px);padding:14px 0;margin-bottom:24px;border-bottom:1px solid var(--mw-line, #e5e8f0)}
.mw-team .mw-controls-inner{display:flex;gap:14px;align-items:center;flex-wrap:wrap;justify-content:space-between}
.mw-team .mw-pills{display:flex;gap:8px;flex-wrap:wrap}
.mw-team .mw-pill{font-family:'Outfit',sans-serif;font-weight:500;font-size:14px;border:1px solid var(--mw-line, #e5e8f0);background:var(--mw-card, #fff);color:var(--mw-muted, #5b6478);padding:9px 15px;border-radius:999px;cursor:pointer;transition:.16s ease;display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.mw-team .mw-pill:hover{border-color:#c7cde0;color:var(--mw-ink, #171c2e)}
.mw-team .mw-pill[aria-pressed="true"]{background:#171c2e !important;border-color:#171c2e !important;color:#fff !important}
.mw-team .mw-pill .mw-dot{width:8px;height:8px;border-radius:50%}
.mw-team .mw-pill .mw-count{font-size:12px;opacity:.6;font-variant-numeric:tabular-nums}
.mw-team .mw-pill[aria-pressed="true"] .mw-count{opacity:.75}
.mw-team .mw-search{position:relative;flex:0 1 260px;min-width:180px}
.mw-team .mw-search input{width:100%;font-family:'DM Sans',sans-serif;font-size:14px;color:var(--mw-ink, #171c2e);border:1px solid var(--mw-line, #e5e8f0);background:var(--mw-card, #fff);border-radius:999px;padding:10px 16px 10px 38px;outline:none;transition:.16s}
.mw-team .mw-search input:focus{border-color:var(--mw-brand, #455cb5);box-shadow:0 0 0 3px rgba(69,92,181,.14)}
.mw-team .mw-search svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--mw-muted, #5b6478)}

.mw-team .mw-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media(max-width:900px){.mw-team .mw-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.mw-team .mw-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:430px){.mw-team .mw-grid{grid-template-columns:1fr}}

.mw-team .mw-card{text-align:left;font:inherit;color:inherit;cursor:pointer;background:var(--mw-card, #fff);border:1px solid var(--mw-line, #e5e8f0);border-radius:16px;padding:0;overflow:hidden;box-shadow:var(--mw-shadow, 0 1px 2px rgba(23,28,46,.04), 0 8px 24px rgba(23,28,46,.06));transition:transform .18s ease, box-shadow .18s ease, border-color .18s;display:flex;flex-direction:column}
.mw-team .mw-card:hover{transform:translateY(-4px);box-shadow:var(--mw-shadow-lg, 0 24px 60px rgba(23,28,46,.22));border-color:transparent}
.mw-team .mw-card:hover .mw-photo img{transform:scale(1.04)}
.mw-team .mw-card:focus-visible{outline:2px solid var(--mw-brand, #455cb5);outline-offset:2px}
.mw-team .mw-photo{position:relative;width:100%;aspect-ratio:1/1;overflow:hidden;display:grid;place-items:center}
.mw-team .mw-photo img{width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block;transition:transform .3s ease}
.mw-team .mw-photo .mw-ini{font-family:'Outfit',sans-serif;font-weight:600;font-size:44px;color:#fff;letter-spacing:.02em}
.mw-team .mw-body{padding:16px 18px 18px;display:flex;flex-direction:column}
.mw-team .mw-card .mw-name{font-family:'Outfit',sans-serif;font-weight:600;font-size:17px;line-height:1.25;margin:0;color:var(--mw-ink, #171c2e)}
.mw-team .mw-card .mw-role{color:var(--mw-muted, #5b6478);font-size:14px;margin:4px 0 0}
.mw-team .mw-card .mw-tag{margin-top:14px;font-family:'Outfit',sans-serif;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;display:inline-flex;align-items:center;gap:7px}
.mw-team .mw-card .mw-tag .mw-dot{width:7px;height:7px;border-radius:50%}
.mw-team .mw-av{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;font-family:'Outfit',sans-serif;font-weight:600;font-size:19px;color:#fff;letter-spacing:.02em;overflow:hidden;flex:none}
.mw-team .mw-av img{width:100%;height:100%;object-fit:cover;object-position:center 22%;display:block}

.mw-team .mw-empty{grid-column:1/-1;text-align:center;padding:56px 20px;color:var(--mw-muted, #5b6478)}
.mw-team .mw-empty button{margin-top:12px;font-family:'Outfit',sans-serif;font-weight:500;background:none;border:1px solid var(--mw-line, #e5e8f0);border-radius:999px;padding:8px 16px;cursor:pointer;color:var(--mw-brand, #455cb5)}
.mw-team .mw-sep{grid-column:1/-1;display:flex;align-items:center;gap:12px;margin:24px 0 4px;padding-top:26px;border-top:1px solid var(--mw-line, #e5e8f0)}
.mw-team .mw-sep h3{font-family:'Outfit',sans-serif;font-weight:700;font-size:20px;letter-spacing:-.01em;margin:0;color:var(--mw-ink, #171c2e)}
.mw-team .mw-sep-dot{width:10px;height:10px;border-radius:50%;flex:none}
.mw-team .mw-sep-count{font-family:'Outfit',sans-serif;font-size:13px;color:var(--mw-muted, #5b6478);font-variant-numeric:tabular-nums}

/* modal */
.mw-team .mw-overlay{position:fixed;inset:0;background:rgba(20,26,46,.55) !important;backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;padding:24px;z-index:9999}
.mw-team .mw-overlay.mw-open{display:flex}
.mw-team .mw-modal{background:#fff !important;border-radius:20px;max-width:560px;width:100%;max-height:88vh;overflow:auto;box-shadow:var(--mw-shadow-lg, 0 24px 60px rgba(23,28,46,.22));padding:32px;position:relative;animation:mwpop .2s ease}
@keyframes mwpop{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
.mw-team .mw-close{position:absolute;top:16px;right:16px;width:36px!important;height:36px!important;min-width:0!important;padding:0!important;box-sizing:border-box;flex:none;aspect-ratio:1;line-height:1;-webkit-appearance:none;appearance:none;border-radius:50%;border:1px solid var(--mw-line, #e5e8f0);background:#fff;cursor:pointer;display:grid;place-items:center;color:var(--mw-muted, #5b6478)}
.mw-team .mw-close:hover{color:var(--mw-ink, #171c2e);border-color:#c7cde0}
.mw-team .mw-modal-head{display:flex;gap:18px;align-items:center;margin-bottom:20px;padding-right:36px}
.mw-team .mw-modal .mw-av{width:116px;height:116px;border-radius:18px;font-size:40px}
.mw-team .mw-modal .mw-name{font-family:'Outfit',sans-serif;font-weight:700;font-size:22px;margin:0;line-height:1.2;color:var(--mw-ink, #171c2e)}
.mw-team .mw-modal .mw-role{color:var(--mw-brand, #455cb5);font-weight:500;margin:4px 0 0;font-size:14.5px}
.mw-team .mw-bio{color:#3a4256;font-size:15.5px;margin:0 0 20px}
.mw-team .mw-contact{border-top:1px solid var(--mw-line, #e5e8f0);padding-top:16px;font-size:14px}
.mw-team .mw-contact a{color:var(--mw-brand, #455cb5);text-decoration:none}
.mw-team .mw-contact a:hover{text-decoration:underline}
.mw-team .mw-contact .mw-lbl{color:var(--mw-muted, #5b6478);margin-right:8px}
.mw-team .mw-contact .mw-row+.mw-row{margin-top:6px}

@media (prefers-reduced-motion: reduce){.mw-team *{animation:none !important;transition:none !important}}