:root {
    --green: #004230;
    --green-deep: #003426;
    --green-light: #71ab3a;
    --green-light-soft: #f1f7e9;
    --green-light-line: #c8dfb3;
    --orange: #fea66b;
    --ink: #17362d;
    --muted: #667872;
    --line: #dce8e3;
}

* { box-sizing: border-box; }

body {
    min-width: 320px;
    margin: 0;
    color: var(--ink);
    background:
        radial-gradient(circle at 0 0, rgba(254, 166, 107, .13), transparent 27rem),
        radial-gradient(circle at 97% 8%, rgba(113, 171, 58, .16), transparent 29rem),
        radial-gradient(circle at 95% 90%, rgba(0, 66, 48, .08), transparent 33rem),
        #fff;
    font-family: Montserrat, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
}

.directory-page { min-height: 100svh; padding: clamp(18px, 4vw, 54px); }
.directory-shell { width: min(100%, 1120px); margin: 0 auto; }
.directory-card { width: 100%; overflow: hidden; border: 1px solid rgba(113, 171, 58, .3); border-radius: 28px; background: rgba(255, 255, 255, .95); box-shadow: 0 26px 80px rgba(0, 66, 48, .12), 0 10px 30px rgba(113, 171, 58, .08); }
.directory-intro { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: clamp(34px, 5vw, 68px); background: linear-gradient(135deg, rgba(113, 171, 58, .14), transparent 44%), linear-gradient(145deg, var(--green-deep), var(--green) 66%, #216c36); color: #fff; }
.eyebrow { margin: 0 0 18px; color: var(--orange); font-size: .72rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.eyebrow::before { display: inline-block; width: 27px; height: 2px; margin: 0 9px 3px 0; content: ""; background: currentColor; }
.directory-intro h1 { max-width: 780px; margin: 0; color: #fff; font-size: clamp(2rem, 3.6vw, 3.45rem); font-weight: 800; letter-spacing: -.065em; line-height: 1.05; overflow-wrap: anywhere; }
.directory-intro h1 em { color: var(--orange); font-style: normal; }
.directory-intro h1::after { display: block; width: 58px; height: 4px; margin-top: 24px; content: ""; border-radius: 99px; background: var(--green-light); }
.directory-intro > p:nth-of-type(2) { max-width: 680px; margin: 25px 0 0; color: rgba(255, 255, 255, .79); font-size: .94rem; font-weight: 500; line-height: 1.7; }
.directory-professional-cta { margin: 29px 0 0; text-align: center; }
.directory-professional-cta a { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; width: min(100%, 430px); min-height: 62px; align-items: center; gap: 10px; margin: 0 auto; padding: 10px 12px 10px 19px; overflow: hidden; border: 1px solid rgba(113, 171, 58, .45); border-radius: 12px; background: var(--green); color: #fff; font-size: .78rem; font-weight: 800; line-height: 1.35; text-align: center; text-decoration: none; transition: background .2s ease, transform .2s ease; }
.directory-professional-cta a::before { position: absolute; top: 0; bottom: 0; left: 0; width: 7px; background: var(--orange); content: ""; }
.directory-professional-cta a:hover { background: var(--green-deep); transform: translateY(-1px); }
.directory-professional-cta a:focus-visible { outline: 3px solid rgba(113, 171, 58, .55); outline-offset: 4px; }
.directory-professional-cta__label { display: inline-flex; min-height: 24px; align-items: center; justify-content: center; padding: 3px 8px; border-radius: 999px; background: #fff; color: var(--green); font-size: .61rem; font-weight: 900; letter-spacing: .06em; }
.directory-professional-cta__arrow { display: inline-flex; width: 30px; height: 30px; align-items: center; justify-content: center; color: #fff; font-size: 1.35rem; line-height: 1; }
.directory-intro > a { width: fit-content; margin-top: 34px; color: #fff; font-size: .76rem; font-weight: 800; text-underline-offset: 4px; }
.directory-intro > a:focus-visible { outline: 3px solid var(--green-light); outline-offset: 4px; }
.directory-content { padding: clamp(30px, 5vw, 58px); background: linear-gradient(180deg, rgba(241, 247, 233, .48), transparent 25%); }
.directory-account-cta { display:flex; justify-content:center; margin:26px 0 0; }
.directory-account-cta a { position:relative; display:inline-flex; width:min(100%,620px); min-height:56px; align-items:center; justify-content:center; gap:11px; padding:12px 22px 12px 25px; overflow:hidden; border:1px solid var(--green-light-line); border-radius:12px; background:#fff; box-shadow:0 10px 24px rgba(0,66,48,.07); color:var(--green); font-size:.77rem; font-weight:800; line-height:1.4; text-align:center; text-decoration:none; transition:background .2s ease,border-color .2s ease,box-shadow .2s ease,transform .2s ease; }
.directory-account-cta a::before { position:absolute; top:0; bottom:0; left:0; width:6px; content:""; background:var(--orange); }
.directory-account-cta img { display:block; width:19px; height:19px; flex:0 0 19px; }
.directory-account-cta a:hover { border-color:var(--green-light); background:var(--green-light-soft); box-shadow:0 13px 28px rgba(0,66,48,.11); transform:translateY(-1px); }
.directory-account-cta a:focus-visible { outline:3px solid rgba(113,171,58,.55); outline-offset:4px; }
.directory-brand { display: flex; width: min(100%, 190px); justify-content: center; margin: 22px auto 0; padding: 7px 10px; border-radius: 12px; background: transparent; text-decoration: none; }
.directory-brand img { display: block; width: auto; max-width: 100%; max-height: 92px; object-fit: contain; }

.map-card { position: relative; overflow: hidden; min-height: 580px; border: 1px solid rgba(113, 171, 58, .38); border-radius: 18px; background: linear-gradient(135deg, #f8fbf5, var(--green-light-soft)); box-shadow: 0 24px 65px rgba(0, 66, 48, .1), 0 8px 28px rgba(113, 171, 58, .07); }
.map { width: 100%; height: 580px; }
.map-state { position: absolute; z-index: 500; top: 50%; left: 50%; width: min(85%, 360px); padding: 14px 17px; transform: translate(-50%, -50%); border: 1px solid var(--green-light-line); border-radius: 12px; background: rgba(255, 255, 255, .94); box-shadow: 0 12px 28px rgba(0, 66, 48, .12); color: var(--green); font-size: .79rem; font-weight: 700; line-height: 1.5; text-align: center; }
.profile-overlay { position: absolute; z-index: 600; right: 22px; bottom: 22px; width: min(400px, calc(100% - 44px)); padding: 25px; border: 1px solid rgba(113, 171, 58, .32); border-radius: 17px; background: rgba(255, 255, 255, .97); box-shadow: 0 20px 45px rgba(0, 66, 48, .18); }
.overlay-close { float: right; margin: -4px -4px 0 10px; padding: 7px 9px; border: 0; border-radius: 7px; background: var(--green-light-soft); color: var(--green); cursor: pointer; font: inherit; font-size: .68rem; font-weight: 800; }
.overlay-close:hover, .overlay-close:focus { background: #e1efd3; outline: 0; }
.overlay-heading { display: flex; align-items: center; gap: 13px; padding-right: 47px; }
.profile-avatar { display: block; width: 48px; height: 48px; flex: 0 0 48px; border: 1px solid rgba(113, 171, 58, .45); border-radius: 50%; object-fit: cover; }
.profile-avatar--fallback { display: grid; place-items: center; background: linear-gradient(145deg, var(--green), #216c36); color: #fff; font-size: .9rem; font-weight: 800; }
.overlay-heading h2 { margin: 0; color: var(--green); font-size: 1.05rem; letter-spacing: -.04em; line-height: 1.2; }
.profession { margin: 4px 0 0; color: #a44f1c; font-size: .73rem; font-weight: 750; }
.location { margin: 20px 0 0; color: var(--muted); font-size: .76rem; font-weight: 750; }
.visio-badge { display: inline-flex; align-items: center; gap: 6px; margin: 14px 0 0; padding: 6px 9px; border: 1px solid var(--green-light-line); border-radius: 999px; background: var(--green-light-soft); color: #245d28; font-size: .68rem; font-weight: 800; }
.visio-badge__icon { display: block; width: 12px; height: 12px; flex: 0 0 12px; background: currentColor; -webkit-mask: center / contain no-repeat url("../../include/img/fa-video.svg"); mask: center / contain no-repeat url("../../include/img/fa-video.svg"); }
.profile-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 17px; }
.profile-link, .website { display: flex; width: fit-content; align-items: center; gap: 9px; margin: 0; padding: 11px 14px; border-radius: 9px; color: #fff; font-size: .75rem; font-weight: 800; line-height: 1.2; text-decoration: none; transition: background .2s ease, transform .2s ease, box-shadow .2s ease; }
.profile-link { background: var(--orange); box-shadow: 0 7px 16px rgba(254, 166, 107, .32); }
.profile-link::before { width: 14px; height: 14px; flex: 0 0 14px; content: ""; background: currentColor; -webkit-mask: center / contain no-repeat url("../../include/img/fa-file.svg"); mask: center / contain no-repeat url("../../include/img/fa-file.svg"); }
.profile-link:hover { background: #e98a4d; color: #fff; box-shadow: 0 9px 18px rgba(254, 166, 107, .4); transform: translateY(-1px); }
.profile-link:focus-visible { outline: 3px solid rgba(254, 166, 107, .55); outline-offset: 3px; }
.website { background: var(--green); box-shadow: 0 7px 16px rgba(0, 66, 48, .16); }
.website::before { width: 14px; height: 14px; flex: 0 0 14px; content: ""; background: currentColor; -webkit-mask: center / contain no-repeat url("../../include/img/fa-globe.svg"); mask: center / contain no-repeat url("../../include/img/fa-globe.svg"); }
.website:hover { background: #216c36; color: #fff; box-shadow: 0 9px 18px rgba(0, 66, 48, .2); transform: translateY(-1px); }
.website:focus-visible { outline: 3px solid rgba(113, 171, 58, .5); outline-offset: 3px; }
.directory-note { margin: 17px 0 0; color: #73857d; font-size: .69rem; font-weight: 600; line-height: 1.5; text-align: center; }

.leaflet-container { font-family: Montserrat, Arial, sans-serif; }
.leaflet-control-attribution { font-size: 10px !important; }
.leaflet-bar a { color: var(--green); }
.leaflet-bar a:hover, .leaflet-bar a:focus { background: var(--green-light-soft); color: var(--green-deep); outline: 0; }

.directory-table-card { margin-top: 28px; padding: clamp(22px, 4vw, 38px); border: 1px solid rgba(113, 171, 58, .30); border-radius: 22px; background: linear-gradient(155deg, rgba(241, 247, 233, .42), rgba(255, 255, 255, .96) 34%); box-shadow: 0 20px 55px rgba(0, 66, 48, .08), 0 7px 24px rgba(113, 171, 58, .05); }
.table-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.table-heading h2 { margin: 0; color: var(--green); font-size: clamp(1.35rem, 2.3vw, 1.8rem); letter-spacing: -.055em; }
.directory-controls { display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
.table-search input { width: min(100%, 300px); min-height: 44px; padding: 0 13px; border: 1px solid var(--line); border-radius: 9px; outline: 0; color: var(--ink); font: inherit; font-size: .78rem; }
.table-search input:focus { border-color: var(--green-light); box-shadow: 0 0 0 4px rgba(113, 171, 58, .18); }
.directory-filter-switch { display: inline-flex; align-items: center; gap: 8px; color: var(--green); cursor: pointer; font-size: .7rem; font-weight: 800; line-height: 1.3; white-space: nowrap; }
.directory-filter-switch input { position: relative; width: 42px; min-width: 42px; height: 24px; margin: 0; padding: 0; appearance: none; border: 1px solid var(--line); border-radius: 999px; outline: 0; background: #edf2f0; cursor: pointer; transition: background .2s, border-color .2s, box-shadow .2s; }
.directory-filter-switch input::after { position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; content: ""; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 66, 48, .18); transition: transform .2s; }
.directory-filter-switch input:checked { border-color: var(--green-light); background: var(--green-light); }
.directory-filter-switch input:checked::after { transform: translateX(18px); }
.directory-filter-switch input:focus-visible { outline: 3px solid rgba(113, 171, 58, .35); outline-offset: 3px; }
.table-wrap { overflow-x: auto; border: 1px solid #e1ecd9; border-radius: 12px; }
.directory-table { width: 100%; min-width: 620px; border-collapse: collapse; font-size: .77rem; }
.directory-table th { padding: 13px 15px; border-bottom: 1px solid var(--green-light-line); background: var(--green-light-soft); color: var(--green); text-align: left; }
.directory-table th button { padding: 0; border: 0; background: transparent; color: inherit; cursor: pointer; font: inherit; font-size: .7rem; font-weight: 800; letter-spacing: .025em; }
.directory-table th button::after { margin-left: 5px; content: '↕'; color: #7da15e; }
.directory-table td { padding: 14px 15px; border-bottom: 1px solid #edf2e8; color: #526860; font-weight: 550; vertical-align: middle; }
.directory-table td:first-child:not([colspan]), .directory-table [data-directory-website] { white-space: nowrap; }
.directory-table tbody tr:last-child td { border-bottom: 0; }
.directory-table tbody tr[data-selectable] { cursor: pointer; }
.directory-table tbody tr[data-selectable]:hover, .directory-table tbody tr[data-selectable]:focus { background: var(--green-light-soft); outline: 0; }
.directory-contributor-icon { display: inline-flex; width: 19px; height: 19px; align-items: center; justify-content: center; margin: 0 0 0 6px; vertical-align: middle; border-radius: 50%; background: #fff3c9; color: #c58200; cursor: help; }
.directory-contributor-icon img { display: block; width: 12px; height: 12px; }
.directory-table .person { display: inline; color: var(--green); font-weight: 800; }
.directory-table .place { color: #71837b; font-size: .7rem; }
.directory-table a { color: var(--green); font-weight: 750; text-underline-offset: 3px; }
.directory-table a:hover { color: #216c36; }
.table-footer { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-top: 17px; }
.table-footer p { margin: 0; color: #71837b; font-size: .7rem; font-weight: 650; }
.table-pagination { display: flex; gap: 6px; }
.table-pagination button { min-width: 32px; height: 32px; padding: 0 8px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--green); cursor: pointer; font: inherit; font-size: .7rem; font-weight: 800; }
.table-pagination button:hover, .table-pagination button:focus { border-color: var(--green-light); background: var(--green-light-soft); outline: 0; }
.table-pagination button[aria-current="page"] { border-color: var(--green); background: var(--green); color: #fff; }
.table-pagination button:disabled { opacity: .45; cursor: default; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; clip-path: inset(50%); }

@media (max-width: 650px) {
    .directory-page { padding: 0; }
    .directory-shell { width: 100%; }
    .directory-card { border: 0; border-radius: 0; }
    .directory-intro, .directory-content { padding-right: 25px; padding-left: 25px; }
    .directory-intro { padding-bottom: 55px; }
    .directory-content { padding-top: 38px; }
    .map-card, .map { min-height: 520px; height: 520px; }
    .profile-overlay { right: 14px; bottom: 14px; width: calc(100% - 28px); }
    .directory-intro h1 { font-size: 2.35rem; }
    .directory-professional-cta { width: 100%; }
    .directory-account-cta { width:100%; }
    .table-heading, .table-footer, .directory-controls { align-items: stretch; flex-direction: column; }
    .table-search input, .directory-filter-switch { width: 100%; }
    .directory-filter-switch { justify-content: space-between; padding: 9px 10px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
    .table-pagination { justify-content: flex-end; }
}

@media (max-width: 600px) {
    .eyebrow { font-size: .8rem; }
    .directory-intro > p:nth-of-type(2) { font-size: 1rem; }
    .directory-professional-cta a { min-height: 66px; font-size: .92rem; }
    .directory-professional-cta__label { font-size: .7rem; }
    .directory-professional-cta__arrow { width: 36px; height: 36px; font-size: 1.55rem; }
    .directory-account-cta a { min-height:62px; padding:13px 20px 13px 24px; font-size:.9rem; }
    .directory-account-cta img { width:21px; height:21px; flex-basis:21px; }
    .directory-intro > a { min-height: 44px; display: inline-flex; align-items: center; font-size: .9rem; }
    .map-card, .map { min-height: 500px; height: 500px; }
    .map-state { font-size: .9rem; }
    .profile-overlay { padding: 21px; }
    .overlay-close { min-height: 40px; padding: 8px 11px; font-size: .8rem; }
    .overlay-heading h2 { font-size: 1.2rem; }
    .profession, .location { font-size: .9rem; }
    .visio-badge { min-height: 36px; padding: 7px 11px; font-size: .82rem; }
    .profile-actions { gap: 11px; }
    .profile-link, .website { min-height: 44px; padding: 11px 14px; font-size: .88rem; }
    .directory-note { font-size: .8rem; }
    .table-heading h2 { font-size: 1.65rem; }
    .table-search input { min-height: 50px; font-size: 16px; }
    .directory-filter-switch { min-height: 52px; font-size: .88rem; }
    .directory-filter-switch input { width: 48px; min-width: 48px; height: 28px; }
    .directory-filter-switch input::after { width: 22px; height: 22px; }
    .directory-filter-switch input:checked::after { transform: translateX(20px); }
    .directory-table { min-width: 680px; font-size: .9rem; }
    .directory-table th button, .directory-table .place, .table-footer p { font-size: .8rem; }
    .directory-table th, .directory-table td { padding: 15px 16px; }
    .table-pagination button { min-width: 44px; height: 44px; font-size: .86rem; }
}