:root{
  --green-950:#123a2a;
  --green-900:#1f4d3a;
  --green-800:#2e654d;
  --green-700:#47745c;
  --green-500:#6a8f5a;
  --sage:#a9bf9d;
  --earth:#e5ece1;
  --earth-strong:#d5e1d0;
  --paper:#fbfcf7;
  --white:#ffffff;
  --gold:#a8782d;
  --gold-pale:#eadfc8;
  --text:#17261f;
  --muted:#3e4b45;
  --line:#bfcbbf;
  --danger:#8f3434;
  --danger-bg:#f5e5e5;
  --success:#235f3e;
  --success-bg:#e5f2e7;
  --shadow:0 18px 48px rgba(25,64,46,.13);
  --shadow-soft:0 8px 24px rgba(25,64,46,.09);
  --radius:21px;
  --page:1180px;
}

*{box-sizing:border-box}
html{font-size:19px;scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--text);
  background:
    radial-gradient(circle at 0 0,rgba(168,120,45,.09),transparent 34rem),
    linear-gradient(180deg,#eef3ea 0%,#e5ece1 54%,#dce7da 100%);
}
body.modal-open{overflow:hidden}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
button:disabled{cursor:wait;opacity:.65}
a{color:inherit}
code{font-size:.9em}
[hidden]{display:none!important}
.page-width{width:min(var(--page),calc(100% - 36px));margin-inline:auto}

.setup-banner{
  padding:10px 18px;
  text-align:center;
  color:#4b3511;
  background:#f4dfae;
  border-bottom:2px solid #c89d42;
  font-size:.9rem;
}

.masthead{background:rgba(251,252,247,.97)}
.masthead-inner{padding:34px 0 0;text-align:center}
.brand{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  text-decoration:none;
}
.brand-word{
  font-family:Arial,Helvetica,sans-serif;
  color:var(--green-900);
  font-size:124px;
  line-height:.82;
  font-weight:900;
  letter-spacing:-8px;
  white-space:nowrap;
}
.brand-word span{color:var(--gold)}
.brand-subtitle{
  margin-top:28px;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--green-900);
  font-size:28px;
  line-height:1.15;
  font-weight:800;
  white-space:nowrap;
}
.header-rule,.hero-rule{
  width:100%;
  height:3px;
  border:0;
  background:var(--green-900);
}
.header-rule{margin:30px 0 0}

.hero{padding:29px 0 35px}
.hero h1{
  margin:0 auto;
  color:var(--green-950);
  text-align:center;
  font-size:clamp(2.7rem,5vw,4.8rem);
  line-height:1.03;
  letter-spacing:-.055em;
  font-weight:900;
}
.hero h1 span{color:var(--gold)}
.text-size-control{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  width:max-content;
  max-width:100%;
  margin:26px auto 0;
  padding:11px 13px 11px 24px;
  border:2px solid var(--line);
  border-radius:28px;
  background:var(--white);
  box-shadow:var(--shadow-soft);
}
.text-size-control>strong{white-space:nowrap;color:var(--green-950)}
.text-size-buttons{display:flex;gap:9px}
.text-size-button{
  min-height:54px;
  padding:13px 22px;
  border:2px solid transparent;
  border-radius:17px;
  color:var(--green-950);
  background:#edf0e8;
  font-weight:900;
}
.text-size-button:hover{background:#dde7da}
.text-size-button[aria-pressed=true]{
  color:#fff;
  background:var(--green-900);
  border-color:var(--green-900);
}
.hero-rule{margin:30px 0 27px}
.hero-intro{
  max-width:790px;
  margin:0 auto 24px;
  text-align:center;
  color:var(--muted);
  line-height:1.6;
  font-size:1.08rem;
}
.search-panel{
  max-width:920px;
  margin-inline:auto;
  padding:23px;
  border:2px solid #adc1a8;
  border-radius:27px;
  background:var(--earth-strong);
  box-shadow:var(--shadow);
}
.search-panel>label{
  display:block;
  margin-bottom:11px;
  text-align:center;
  color:var(--green-950);
  font-size:1.12rem;
  font-weight:900;
}
.search-row{
  display:flex;
  gap:10px;
  padding:9px;
  border:3px solid var(--green-900);
  border-radius:17px;
  background:var(--white);
}
.search-row input{
  flex:1;
  min-width:0;
  padding:15px 16px;
  border:0;
  outline:0;
  color:var(--text);
  background:transparent;
}
.search-clear-button{
  min-height:48px;
  padding:12px 16px;
  border:2px solid var(--green-700);
  border-radius:13px;
  color:var(--green-950);
  background:#eef3ea;
  font-weight:900;
  white-space:nowrap;
}
.search-clear-button:hover,
.search-clear-button:focus-visible{
  color:#fff;
  background:var(--green-900);
}
.primary-button,.secondary-button,.white-button{
  min-height:48px;
  border-radius:13px;
  padding:12px 18px;
  font-weight:900;
}
.primary-button{
  border:2px solid var(--green-900);
  color:#fff;
  background:var(--green-900);
}
.primary-button:hover{background:var(--green-800)}
.secondary-button{
  border:2px solid var(--line);
  color:var(--green-950);
  background:var(--white);
}
.secondary-button:hover{border-color:var(--green-700)}
.white-button{
  border:2px solid #fff;
  color:#fff;
  background:transparent;
}
.white-button:hover{color:var(--green-900);background:#fff}
.suggestions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top:14px;
}
.suggestions>span{font-weight:800}
.suggestions button{
  padding:7px 10px;
  border:2px solid var(--line);
  border-radius:999px;
  color:var(--green-950);
  background:rgba(255,255,255,.9);
  font-weight:800;
}
.suggestions button:hover{border-color:var(--green-700)}

.skills-cta{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:20px;
  margin-block:22px;
  padding:18px 22px;
  border-radius:20px;
  color:#fff;
  background:var(--green-900);
  box-shadow:var(--shadow-soft);
}
.skills-cta h2{margin:0 0 4px;color:#fff;font-size:1.38rem}
.skills-cta p{margin:0;color:rgba(255,255,255,.94);line-height:1.4;font-size:.94rem}

.section{padding:43px 0}
.section-heading{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:25px;
  margin-bottom:23px;
}
.section-heading>p{max-width:520px;margin:0;color:var(--muted);line-height:1.55}
.eyebrow{
  margin:0 0 6px;
  color:var(--gold);
  font-size:.82rem;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}
h2{margin:0;color:var(--green-950);font-size:clamp(1.8rem,3.8vw,2.8rem);line-height:1.08;letter-spacing:-.035em}
h3{color:var(--green-950)}

.category-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:15px;
}
.category-card{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  min-height:220px;
  padding:20px;
  text-align:left;
  border:2px solid rgba(31,77,58,.13);
  border-radius:20px;
  color:var(--text);
  background:rgba(255,255,255,.86);
  box-shadow:0 8px 20px rgba(31,77,58,.06);
}
.category-card:hover,.category-card.selected{
  transform:translateY(-2px);
  border-color:var(--green-700);
  box-shadow:var(--shadow-soft);
}
.category-icon{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  margin-bottom:13px;
  border-radius:14px;
  color:var(--green-950);
  background:#e6eee3;
  font-size:1.35rem;
}
.category-card strong{font-size:1.04rem;color:var(--green-950)}
.category-card>span:not(.category-icon){margin-top:8px;color:var(--muted);line-height:1.45}
.category-card small{margin-top:auto;padding-top:14px;color:var(--green-700);font-weight:900}

.directory-section{
  padding:45px 0;
  border-block:1px solid rgba(31,77,58,.09);
  background:rgba(255,255,255,.56);
}
.results-bar{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:end;
  gap:24px;
  margin-bottom:14px;
}
.results-bar h2{margin-top:5px}
#resultsSummary{margin:8px 0 0;color:var(--muted)}
.filter-block{display:grid;gap:7px;min-width:320px}
.filter-block label{color:var(--green-950);font-weight:900}
.filter-row{display:flex;gap:9px}
select,input,textarea{
  min-height:50px;
  padding:13px 14px;
  border:2px solid var(--line);
  border-radius:13px;
  outline:0;
  color:var(--text);
  background:var(--white);
}
select:focus,input:focus,textarea:focus{
  border-color:var(--green-700);
  box-shadow:0 0 0 4px rgba(106,143,90,.20);
}
.filter-row select{min-width:235px}
.results-count-row{
  display:flex;
  align-items:center;
  min-height:34px;
  margin-bottom:14px;
  color:var(--green-950);
}
.loading-indicator:not(:empty)::before{
  content:"";
  display:inline-block;
  width:18px;
  height:18px;
  margin-left:10px;
  vertical-align:-3px;
  border:3px solid var(--line);
  border-top-color:var(--green-900);
  border-radius:50%;
  animation:spin .8s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

.profile-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}
.profile-card{
  display:flex;
  flex-direction:column;
  min-height:390px;
  padding:19px;
  border:2px solid rgba(31,77,58,.12);
  border-radius:20px;
  background:#fff;
  box-shadow:0 9px 22px rgba(31,77,58,.06);
}
.profile-card:hover{border-color:var(--sage)}
.profile-card-header{display:flex;align-items:center;gap:13px}
.avatar{
  display:grid;
  place-items:center;
  flex:0 0 55px;
  width:55px;
  height:55px;
  border-radius:15px;
  color:#fff;
  background:linear-gradient(145deg,var(--green-700),var(--green-900));
  font-weight:900;
}
.profile-card h3{margin:0 0 3px;font-size:1rem}
.profile-role{color:var(--muted);font-size:.9rem;line-height:1.35}
.confirmed{
  display:inline-flex;
  gap:5px;
  margin-top:5px;
  color:var(--green-700);
  font-size:.78rem;
  font-weight:900;
}
.profile-description{
  display:-webkit-box;
  overflow:hidden;
  margin:14px 0;
  color:var(--muted);
  line-height:1.52;
  font-size:.91rem;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
}
.tag-list{display:flex;flex-wrap:wrap;gap:6px}
.tag{
  padding:6px 8px;
  border-radius:999px;
  color:var(--green-950);
  background:#eaf1e7;
  font-size:.76rem;
  font-weight:850;
}
.profile-facts{
  display:grid;
  gap:7px;
  margin-top:auto;
  padding:12px 13px;
  border-radius:13px;
  background:#f2f6f0;
}
.fact{
  display:grid;
  grid-template-columns:82px 1fr;
  gap:8px;
  align-items:start;
  font-size:.82rem;
  line-height:1.38;
}
.fact span{color:var(--muted);font-weight:800}
.fact strong{color:var(--green-950)}
.profile-card-footer{
  display:flex;
  justify-content:flex-end;
  padding-top:13px;
  margin-top:12px;
  border-top:1px solid var(--line);
}
.card-button{
  padding:9px 12px;
  border:0;
  border-radius:11px;
  color:var(--green-950);
  background:#e5eee2;
  font-weight:900;
}
.card-button:hover{background:#d8e7d4}
.empty-state{
  padding:42px 22px;
  text-align:center;
  border:2px dashed var(--sage);
  border-radius:20px;
  background:#fff;
}
.empty-state h3{margin-top:0}
.error-state{border-color:#cdaaaa}

.compact-heading{margin-bottom:18px}
.how-box{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  overflow:hidden;
  border:2px solid var(--line);
  border-radius:20px;
  background:#fff;
  box-shadow:var(--shadow-soft);
}
.how-item{
  display:grid;
  grid-template-columns:40px 1fr;
  align-items:start;
  gap:12px;
  padding:19px 21px;
}
.how-item+.how-item{border-left:1px solid var(--line)}
.how-item>span{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:11px;
  color:#fff;
  background:var(--green-900);
  font-weight:900;
}
.how-item strong{color:var(--green-950)}
.how-item p{margin:4px 0 0;color:var(--muted);line-height:1.4;font-size:.88rem}

.reassurance{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:13px;
  margin-block:18px;
}
.reassurance>div{
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 18px;
  border:2px solid var(--line);
  border-radius:17px;
  background:#fff;
  box-shadow:var(--shadow-soft);
}
.reassurance>div>span{
  display:grid;
  place-items:center;
  flex:0 0 42px;
  width:42px;
  height:42px;
  border-radius:12px;
  color:var(--green-950);
  background:#e7efe4;
  font-size:1.12rem;
  font-weight:900;
}
.reassurance p{display:grid;gap:2px;margin:0}
.reassurance small{color:var(--muted)}

.help-section{
  display:flex;
  justify-content:center;
  gap:10px;
  margin-block:24px 42px;
  text-align:center;
}
.help-section a{color:var(--green-900);font-weight:900}

footer{margin-top:52px;padding:35px 0 25px;color:#fff;background:#183b2d}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:28px}
.footer-grid>div{display:flex;flex-direction:column;align-items:flex-start;gap:7px}
.footer-grid p,.footer-grid a,.footer-link{color:rgba(255,255,255,.91)}
.footer-grid p{line-height:1.55}
.footer-logo{font-size:1.55rem;font-weight:900}
.footer-logo span{color:#d1a24c}
.footer-link{
  padding:0;
  border:0;
  text-decoration:underline;
  background:transparent;
}
.footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-top:25px;
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,.24);
  color:rgba(255,255,255,.82);
  font-size:.78rem;
}

.modal{
  position:fixed;
  inset:0;
  z-index:100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(13,35,26,.69);
  backdrop-filter:blur(7px);
}
.modal-card{
  position:relative;
  width:min(620px,100%);
  max-height:90vh;
  overflow:auto;
  padding:29px;
  border-radius:24px;
  background:var(--paper);
  box-shadow:0 28px 90px rgba(0,0,0,.28);
}
.modal-card-wide{width:min(800px,100%)}
.modal-card-xwide{width:min(1000px,100%)}
.modal-close{
  position:sticky;
  top:0;
  z-index:4;
  float:right;
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  margin:-10px -10px 0 10px;
  border:2px solid var(--line);
  border-radius:50%;
  color:var(--text);
  background:#fff;
  font-size:1.35rem;
  font-weight:900;
}
.modal-heading{padding-right:38px;margin-bottom:21px}
.modal-heading h2{font-size:2rem}
.modal-heading>p:last-child{color:var(--muted);line-height:1.5}
.modal-actions{
  display:flex;
  justify-content:flex-end;
  flex-wrap:wrap;
  gap:9px;
  margin-top:22px;
}

.auth-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:0 0 18px;
  padding:6px;
  border:2px solid var(--line);
  border-radius:15px;
  background:#edf2e9;
}
.auth-tab{
  min-height:47px;
  padding:10px 14px;
  border:0;
  border-radius:10px;
  color:var(--green-950);
  background:transparent;
  font-weight:900;
}
.auth-tab.active{
  color:#fff;
  background:var(--green-900);
}

.password-field{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:stretch;
  gap:8px;
}
.password-field input{
  width:100%;
  min-width:0;
}
.show-password-button{
  min-width:82px;
  min-height:50px;
  padding:10px 14px;
  border:2px solid var(--green-700);
  border-radius:12px;
  color:var(--green-950);
  background:#eef3ea;
  font-weight:900;
}
.show-password-button:hover,
.show-password-button[aria-pressed="true"]{
  color:#fff;
  background:var(--green-900);
}

.password-rule{
  padding:12px 14px;
  border-left:5px solid var(--gold);
  border-radius:8px;
  color:var(--text);
  background:#f3e8cf;
  font-size:.84rem;
  font-weight:750;
}

.form-stack{display:grid;gap:10px}
.form-stack label,.field>label,.filter-block label{font-size:.9rem;font-weight:900}
.form-stack textarea{min-height:145px;resize:vertical}
.form-note,.field small{margin:0;color:var(--muted);font-size:.78rem;line-height:1.45}
.success-message{
  padding:18px;
  border:2px solid #add0b5;
  border-radius:15px;
  color:var(--success);
  background:var(--success-bg);
}
.success-message p{margin-bottom:0}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.field{display:grid;align-content:start;gap:7px}
.field.full{grid-column:1/-1}
.field textarea{min-height:130px;resize:vertical}
fieldset.field{
  padding:0;
  border:0;
}
fieldset legend{
  margin-bottom:9px;
  color:var(--green-950);
  font-size:.9rem;
  font-weight:900;
}
fieldset legend small{font-weight:600}
.check-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}
.check-option,.consent-box{
  display:flex;
  align-items:flex-start;
  gap:9px;
  padding:11px;
  border:2px solid var(--line);
  border-radius:12px;
  color:var(--text);
  background:#f6f8f3;
  font-weight:700;
}
.check-option input,.consent-box input{
  flex:0 0 21px;
  width:21px;
  height:21px;
  margin-top:1px;
  accent-color:var(--green-900);
}
.form-status-note{
  margin-top:17px;
  padding:13px 15px;
  border-radius:13px;
  color:#574019;
  background:#f3e8cf;
}
.profile-modal-hero{
  display:flex;
  gap:16px;
  align-items:center;
  margin:-29px -29px 25px;
  padding:31px 29px 24px;
  background:linear-gradient(145deg,#e6efe3,#f4ecdb);
}
.profile-modal-hero .avatar{width:68px;height:68px;flex-basis:68px;font-size:1.1rem}
.profile-modal-hero h2{font-size:1.8rem}
.profile-modal-description{color:var(--muted);line-height:1.65}
.profile-modal-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:22px 0;
}
.info-box{
  padding:14px;
  border:2px solid var(--line);
  border-radius:14px;
  background:#fff;
}
.info-box small{display:block;margin-bottom:5px;color:var(--muted);font-weight:850;text-transform:uppercase;letter-spacing:.06em}
.contact-options{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}
.contact-options a{text-decoration:none}

.account-status{
  padding:15px;
  border:2px solid var(--line);
  border-radius:14px;
  background:#fff;
}
.status-badge{
  display:inline-block;
  padding:6px 9px;
  border-radius:999px;
  color:var(--green-950);
  background:#e7efe4;
  font-size:.78rem;
  font-weight:900;
}
.status-badge.pending{color:#654b18;background:#f3e6c7}
.status-badge.rejected{color:var(--danger);background:var(--danger-bg)}
.messages-list{display:grid;gap:10px;margin-top:18px}
.message-card{
  padding:15px;
  border:2px solid var(--line);
  border-radius:14px;
  background:#fff;
}
.message-card.unread{border-color:var(--green-700)}
.message-card h4{margin:0 0 5px;color:var(--green-950)}
.message-card p{white-space:pre-wrap;color:var(--muted);line-height:1.5}
.message-meta{color:var(--muted);font-size:.78rem}

.admin-toolbar{
  display:flex;
  align-items:end;
  flex-wrap:wrap;
  gap:10px;
  margin-bottom:17px;
}
.admin-toolbar label{font-weight:900}
.admin-list{display:grid;gap:12px}
.admin-card{
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  align-items:center;
  padding:15px;
  border:2px solid var(--line);
  border-radius:15px;
  background:#fff;
}
.admin-card h3{margin:0 0 4px;font-size:1rem}
.admin-card p{margin:0;color:var(--muted);font-size:.86rem}
.admin-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:7px}
.admin-actions button{
  padding:8px 10px;
  border:0;
  border-radius:9px;
  color:var(--green-950);
  background:#e5eee2;
  font-weight:900;
}
.admin-actions button.danger{color:var(--danger);background:var(--danger-bg)}

.toast{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:200;
  max-width:min(420px,calc(100% - 36px));
  padding:14px 17px;
  border:2px solid var(--green-700);
  border-radius:13px;
  color:var(--green-950);
  background:#fff;
  box-shadow:var(--shadow);
  font-weight:800;
}

@media(max-width:940px){
  .brand-word{font-size:96px;letter-spacing:-6px}
  .brand-subtitle{font-size:23px}
  .category-grid,.profile-grid{grid-template-columns:repeat(2,1fr)}
  .section-heading{align-items:flex-start;flex-direction:column}
  .footer-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:680px){
  .page-width{width:min(var(--page),calc(100% - 24px))}
  .masthead-inner{padding-top:26px}
  .brand-word{font-size:72px;letter-spacing:-5px}
  .brand-subtitle{
    max-width:350px;
    margin-top:18px;
    font-size:18px;
    white-space:normal;
  }
  .header-rule{margin-top:23px}
  .hero h1{font-size:2.85rem}
  .text-size-control{
    width:100%;
    padding:12px;
    flex-direction:column;
    border-radius:19px;
  }
  .text-size-buttons{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    width:100%;
    gap:7px;
  }
  .text-size-button{padding:10px 6px;white-space:normal}
  .search-row{display:grid}
  .search-row .primary-button,
  .search-row .search-clear-button{width:100%}
  .skills-cta{grid-template-columns:1fr;padding:16px 17px}
  .skills-cta .white-button{width:100%}
  .category-grid,.profile-grid,.footer-grid,.form-grid,.profile-modal-facts,.reassurance,.how-box{grid-template-columns:1fr}
  .results-bar{grid-template-columns:1fr;align-items:start}
  .filter-block{width:100%;min-width:0}
  .filter-row select{flex:1;min-width:0}
  .how-item+.how-item{border-top:1px solid var(--line);border-left:0}
  .footer-bottom{flex-direction:column}
  .check-grid{grid-template-columns:1fr}
  .modal{padding:10px}
  .modal-card{padding:23px 18px;border-radius:20px}
  .profile-modal-hero{margin:-23px -18px 22px;padding:28px 18px 22px}
  .admin-card{grid-template-columns:1fr}
  .admin-actions{justify-content:flex-start}
}

@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}
