:root{
  --paper:#f7f9fa;
  --paper-dim:#eef2f4;
  --ink:#1c2733;
  --ink-soft:#44525f;
  --line:#d7dee3;
  --gray:#7b8894;
  --teal:#1f7a6c;
  --teal-dim:#4fa393;
  --max:1100px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:'Source Serif 4','Georgia',serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.wordmark{
  font-family:'Cormorant Garamond','Georgia',serif;
  font-weight:600;
  letter-spacing:.01em;
}
.sans{font-family:'Inter','Helvetica Neue',sans-serif;}
a{color:var(--teal);text-decoration:none;}
a:hover{color:var(--ink);}
img{max-width:100%;display:block;}

.wrap{max-width:var(--max);margin:0 auto;padding:0 28px;}

/* ---- Header ---- */
header.site{
  border-bottom:1px solid var(--line);
  background:var(--paper);
  position:sticky;top:0;z-index:20;
}
header.site .bar{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 28px;max-width:var(--max);margin:0 auto;
}
.brand{display:flex;align-items:center;gap:10px;}
.brand .name{
  font-family:'Cormorant Garamond',serif;
  font-size:1.5rem;letter-spacing:.04em;
  color:var(--ink);
}
.brand .name strong{color:var(--teal);}
nav.primary{display:flex;gap:26px;font-family:'Inter',sans-serif;font-size:.92rem;letter-spacing:.02em;}
nav.primary a{color:var(--ink-soft);}
nav.primary a.active{color:var(--teal);border-bottom:1px solid var(--teal);padding-bottom:2px;}

.menu-toggle{
  display:none;
  background:none;border:none;cursor:pointer;
  width:40px;height:40px;
  padding:8px;
  flex-direction:column;justify-content:center;gap:5px;
}
.menu-toggle span{
  display:block;height:2px;width:100%;background:var(--ink);
  transition:transform .2s ease, opacity .2s ease;
}
.menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-toggle.open span:nth-child(2){opacity:0;}
.menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

@media (max-width:720px){
  .menu-toggle{display:flex;}
  nav.primary{
    position:fixed;top:67px;left:0;right:0;bottom:0;
    background:var(--paper);
    flex-direction:column;
    gap:0;
    padding:8px 0;
    transform:translateY(-8px);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity .18s ease, transform .18s ease;
    z-index:19;
  }
  nav.primary.open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0);
  }
  nav.primary a{
    padding:18px 28px;
    border-bottom:1px solid var(--line);
    font-size:1.05rem;
  }
  nav.primary a.active{border-bottom:1px solid var(--line);}
}

/* ---- Hero ---- */
.hero{
  padding:80px 0 48px;
  text-align:center;
  border-bottom:1px solid var(--line);
}
.hero h1{
  font-size:clamp(2.1rem,5vw,3.2rem);
  margin:0 0 18px;
  color:var(--ink);
}
.hero p.lede{
  font-family:'Inter',sans-serif;
  font-size:1.1rem;
  color:var(--ink-soft);
  max-width:640px;margin:0 auto;
}
.hero .tag{
  font-family:'Inter',sans-serif;
  font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--teal);margin-bottom:16px;display:block;
}

/* ---- Sections ---- */
section{padding:56px 0;}
section.alt{background:var(--paper-dim);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.section-head{max-width:680px;margin:0 auto 32px;text-align:center;}
.section-head h2{font-size:1.9rem;margin:0 0 10px;}
.section-head p{font-family:'Inter',sans-serif;color:var(--ink-soft);margin:0;}

/* ---- Directory controls ---- */
.directory-controls{
  display:flex;gap:14px;flex-wrap:wrap;align-items:center;
  margin-bottom:32px;
  font-family:'Inter',sans-serif;
}
.directory-controls input[type=search]{
  flex:1;min-width:220px;
  padding:12px 16px;border:1px solid var(--line);background:#fff;
  font-family:inherit;font-size:.95rem;color:var(--ink);
}
.directory-controls select{
  padding:12px 16px;border:1px solid var(--line);background:#fff;
  font-family:inherit;font-size:.9rem;color:var(--ink);
}
.result-count{font-family:'Inter',sans-serif;font-size:.82rem;color:var(--gray);margin-bottom:20px;}

.category-heading{
  font-size:1.5rem;margin:36px 0 16px;
  padding-bottom:8px;border-bottom:1px solid var(--line);
  color:var(--teal);
}
.category-heading:first-child{margin-top:0;}

/* ---- Resource cards ---- */
.resource-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;
}
.resource-card{
  background:#fff;border:1px solid var(--line);padding:22px 24px;
  display:flex;flex-direction:column;gap:8px;
}
.resource-card h3{font-size:1.2rem;margin:0;}
.resource-card .cat{
  font-family:'Inter',sans-serif;font-size:.7rem;letter-spacing:.09em;text-transform:uppercase;
  color:var(--teal);
}
.resource-card p{font-family:'Inter',sans-serif;font-size:.88rem;color:var(--ink-soft);margin:0;flex:1;}
.resource-card .meta{font-family:'Inter',sans-serif;font-size:.8rem;color:var(--gray);}
.resource-card a.go{font-family:'Inter',sans-serif;font-size:.85rem;margin-top:4px;}
.no-results{
  text-align:center;font-family:'Inter',sans-serif;color:var(--gray);padding:40px 0;
}

/* ---- CTA blocks ---- */
.cta-row{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:8px;}
.btn{
  font-family:'Inter',sans-serif;font-size:.85rem;letter-spacing:.03em;
  padding:12px 22px;border:1px solid var(--ink);color:var(--ink);
  transition:.15s ease;display:inline-block;
}
.btn:hover{background:var(--ink);color:var(--paper);}
.btn.primary{background:var(--teal);border-color:var(--teal);color:#fff;}
.btn.primary:hover{background:var(--ink);border-color:var(--ink);}

/* ---- About page ---- */
.story{max-width:680px;margin:0 auto;}
.story p{margin:0 0 20px;font-size:1.05rem;}

/* ---- Footer ---- */
footer.site{
  border-top:1px solid var(--line);
  padding:36px 0;
  font-family:'Inter',sans-serif;font-size:.82rem;color:var(--gray);
}
footer.site .wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;}
footer.site a{color:var(--gray);}
footer.site a:hover{color:var(--ink);}
footer.site .disclaimer{max-width:680px;font-size:.78rem;}
