/* Shade Tree Psychology — shared stylesheet */

:root{
  --green: #2F4B3C;
  --green-dark: #1f3327;
  --cream: #F7F2E9;
  --cream-alt: #EFEAE0;
  --ink: #1A1A1A;
  --muted: #55534C;
  --border: #E1DBCC;
  --white: #FFFFFF;
  --radius: 10px;
  --max: 1100px;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body{
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: var(--ink);
  background: var(--white);
  line-height: 1.55;
}
img{ max-width: 100%; display:block; }
a{ color: var(--green); text-decoration: none; }
a:hover{ text-decoration: underline; }

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

/* Header */
header.site{
  position: sticky; top:0; z-index: 50;
  background: var(--white);
  border-bottom: 1px solid var(--border);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding: 16px 24px; max-width: var(--max); margin:0 auto;
}
.brand{ display:flex; align-items:center; gap:10px; font-weight:700; font-size:1.05rem; color:var(--ink); }
.brand .logo-mark{ width:32px; height:32px; object-fit:contain; border-radius:50%; }
.brand:hover{ text-decoration:none; }

.headshot{
  width:160px; height:160px; object-fit:cover; border-radius:50%;
  float:right; margin: 0 0 20px 28px; border:1px solid var(--border);
}
@media (max-width: 560px){
  .headshot{ float:none; display:block; margin: 0 auto 24px; }
}
nav.links{ display:flex; gap: 28px; }
nav.links a{ color: var(--ink); font-size: 0.95rem; font-weight:500; }
nav.links a.active{ color: var(--green); }
.nav-toggle{ display:none; background:none; border:none; cursor:pointer; padding:8px; }
.nav-toggle span{ display:block; width:24px; height:2px; background:var(--ink); margin:5px 0; }

@media (max-width: 780px){
  nav.links{
    position:fixed; inset:0; top:64px;
    background:var(--white);
    flex-direction:column; align-items:flex-start;
    padding: 24px; gap: 20px;
    transform: translateX(100%);
    transition: transform .25s ease;
  }
  nav.links.open{ transform: translateX(0); }
  nav.links a{ font-size: 1.2rem; }
  .nav-toggle{ display:block; }
}

/* Hero */
.hero{
  background: linear-gradient(135deg, var(--cream) 0%, #EAD9BE 100%);
  padding: 72px 24px 56px;
  text-align:center;
}
.hero h1{
  font-size: clamp(2.2rem, 5vw, 3.2rem);
  margin: 0 0 18px;
  letter-spacing: -0.02em;
}
.hero p.lead{
  max-width: 640px; margin: 0 auto 30px;
  font-size: 1.15rem; color: var(--muted);
}
.hero .cta-row{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

.btn{
  display:inline-block; padding: 12px 26px; border-radius: 999px;
  font-weight:600; font-size:0.95rem; border:2px solid var(--green);
  transition: all .15s ease;
}
.btn-primary{ background: var(--green); color:var(--white); }
.btn-primary:hover{ background: var(--green-dark); border-color:var(--green-dark); text-decoration:none; }
.btn-ghost{ background: transparent; color: var(--green); }
.btn-ghost:hover{ background: rgba(47,75,60,0.08); text-decoration:none; }

/* Trust bar */
.trust-bar{
  background: var(--green); color: var(--white);
}
.trust-bar .wrap{
  display:grid; grid-template-columns: repeat(4, 1fr);
  gap: 0; padding: 22px 24px;
}
.trust-bar .item{
  text-align:center; font-size:0.92rem; font-weight:600;
  padding: 6px 12px; border-left: 1px solid rgba(255,255,255,0.18);
}
.trust-bar .item:first-child{ border-left:none; }
@media (max-width: 780px){
  .trust-bar .wrap{ grid-template-columns: repeat(2,1fr); gap:14px 0; }
  .trust-bar .item{ border-left:none; border-top:1px solid rgba(255,255,255,.18); padding-top:14px; }
  .trust-bar .item:nth-child(1),.trust-bar .item:nth-child(2){ border-top:none; }
}

/* Sections */
section{ padding: 64px 24px; }
section.alt{ background: var(--cream-alt); }
h2.section-title{
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  margin: 0 0 8px; text-align:center;
}
p.section-sub{
  text-align:center; color:var(--muted); max-width:620px; margin: 0 auto 44px;
}

/* Cards */
.grid-3{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
@media (max-width: 900px){ .grid-3{ grid-template-columns: 1fr; } }
.card{
  background: var(--white); border:1px solid var(--border); border-radius: var(--radius);
  padding: 28px;
}
.card h3{ margin:0 0 6px; font-size:1.15rem; }
.card .tag{ color: var(--green); font-weight:600; font-size:0.9rem; display:block; margin-bottom:10px; }
.card p{ color: var(--muted); margin: 0; }

/* Referral pathways list */
.pathways{ display:grid; grid-template-columns: repeat(4, 1fr); gap:20px; }
@media (max-width: 900px){ .pathways{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 560px){ .pathways{ grid-template-columns: 1fr; } }
.pathway{
  border:1px solid var(--border); border-radius: var(--radius); padding:22px;
  background: var(--white);
}
.pathway h4{ margin:0 0 8px; font-size:1.02rem; }
.pathway p{ margin:0; color:var(--muted); font-size:0.92rem; }

/* Steps */
.steps{ counter-reset: step; display:grid; gap:22px; max-width: 720px; margin: 0 auto; }
.step{ display:flex; gap:18px; }
.step .num{
  flex: none; width:38px; height:38px; border-radius:50%;
  background: var(--green); color:var(--white); font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.step h4{ margin:0 0 4px; }
.step p{ margin:0; color:var(--muted); }

/* Contact box */
.contact-box{
  border:1px solid var(--border); border-radius: var(--radius);
  padding: 30px; max-width: 460px; margin: 0 auto; text-align:center;
  background: var(--cream);
}
.contact-box .row{ margin: 10px 0; font-size:1.05rem; }
.contact-box .row strong{ display:block; font-size:0.82rem; text-transform:uppercase; letter-spacing:0.05em; color:var(--muted); margin-bottom:2px; }

/* Policy text blocks */
.policy h3{ margin-top:44px; }
.policy h4{ margin-top:26px; margin-bottom:6px; }
.policy p, .policy li{ color: var(--muted); }
.policy ul{ padding-left: 20px; }

table.fees{ width:100%; border-collapse:collapse; margin: 18px 0 30px; }
table.fees th, table.fees td{ text-align:left; padding:10px 12px; border-bottom:1px solid var(--border); }
table.fees th{ font-size:0.85rem; text-transform:uppercase; letter-spacing:0.04em; color:var(--muted); }

.note-box{
  border-left: 4px solid var(--green); background: var(--cream-alt);
  padding: 16px 20px; border-radius: 0 8px 8px 0; margin: 24px 0;
  font-size: 0.95rem;
}

/* Footer */
footer{
  background: var(--green-dark); color: rgba(255,255,255,0.85);
  padding: 44px 24px 28px; margin-top: 40px;
}
footer .wrap{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:24px; }
footer a{ color: var(--white); }
footer .brand-foot{ font-weight:700; color:var(--white); font-size:1.1rem; margin-bottom:8px; }
footer .cols{ display:flex; gap:60px; flex-wrap:wrap; }
footer .col h5{ margin:0 0 10px; font-size:0.85rem; text-transform:uppercase; letter-spacing:0.05em; color: rgba(255,255,255,0.6); }
footer .col a, footer .col p{ display:block; margin: 0 0 8px; font-size:0.92rem; color: rgba(255,255,255,0.85); }
footer .bottom{ text-align:center; font-size:0.8rem; color: rgba(255,255,255,0.5); margin-top:30px; }
