/* Fairhand design system — packet §B0. Self-hosted fonts arrive at S7; system stack until then. */
:root{
  --charcoal:#1C1E1A; --green:#0E7A4E; --leaf:#0A5C3B; --amber:#F2A900;
  --paper:#F7F5EF; --alert:#B3261E; --white:#FFFFFF; --wa:#25D366;
  --r-card:12px; --r-btn:8px;
  --font-head:"Space Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);font-size:15px;line-height:1.47;color:var(--charcoal);background:var(--paper)}
h1,h2,h3{font-family:var(--font-head);line-height:1.2}
h1{font-size:28px}h2{font-size:22px}h3{font-size:18px}
small,.small{font-size:13px}
a{color:var(--green)}
.wrap{max-width:720px;margin:0 auto;padding:0 20px}
section{padding:32px 0}

/* header */
.hd{background:var(--white);border-bottom:1px solid #e6e2d8;padding:14px 0;position:sticky;top:0;z-index:5}
.hd .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px}
.logo{font-family:var(--font-head);font-weight:700;font-size:20px;color:var(--charcoal);text-decoration:none}
.logo em{color:var(--green);font-style:normal}

/* buttons */
.btn{display:inline-block;font-family:var(--font-head);font-weight:600;font-size:15px;padding:13px 22px;border-radius:var(--r-btn);text-decoration:none;min-height:44px;border:2px solid transparent;cursor:pointer;text-align:center}
.btn-p{background:var(--green);color:var(--white)}
.btn-p:hover{background:var(--leaf)}
.btn-a{background:transparent;color:var(--leaf);border-color:var(--amber)}
.btn-wa{background:var(--wa);color:#08340f}
.btn[aria-disabled="true"]{opacity:.55;pointer-events:none}

/* hero */
.hero{background:var(--white);padding:44px 0 36px}
.hero h1{font-size:30px;margin-bottom:14px}
.hero .sub{font-size:16px;margin-bottom:22px;max-width:60ch}
.hero .sub strong{color:var(--green)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:14px}
.hero .note{color:#6a6a63}

/* trust strip */
.trust{background:var(--leaf);color:var(--white);padding:16px 0}
.trust ul{list-style:none;display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:center;font-size:14px}
.trust li{display:flex;align-items:center;gap:8px}
.trust .sw{opacity:.85;font-size:12.5px}

/* steps */
.steps{display:grid;gap:16px}
.step{background:var(--white);border-radius:var(--r-card);padding:20px;border:1px solid #e6e2d8}
.step .n{font-family:var(--font-head);font-weight:700;color:var(--amber);font-size:14px;letter-spacing:.06em}
.step h3{margin:6px 0}

/* buyer panel */
.buyer{background:var(--charcoal);color:var(--paper);border-radius:var(--r-card);padding:26px 22px}
.buyer h2{color:var(--white);margin-bottom:10px}
.buyer strong{color:var(--amber)}
.buyer .btn{margin-top:16px}

/* towns */
.towns p{margin-bottom:8px}
.tag{display:inline-block;background:var(--white);border:1px solid #dcd8cc;border-radius:999px;padding:4px 12px;font-size:13px;margin:3px 3px 3px 0}
.tag.soon{opacity:.55}

/* pledge */
.pledge{background:#fff8e8;border:1.5px solid var(--amber);border-radius:var(--r-card);padding:22px}
.pledge h2{font-size:18px;margin-bottom:8px}

/* faq */
details{background:var(--white);border:1px solid #e6e2d8;border-radius:var(--r-card);padding:14px 18px;margin-bottom:10px}
summary{font-family:var(--font-head);font-weight:600;cursor:pointer}
details p{margin-top:10px;color:#3c3e39}

/* footer */
footer{background:var(--charcoal);color:#c9c9c2;padding:26px 0;font-size:13px}
footer a{color:#e8e8e0}
footer .wrap{display:flex;flex-direction:column;gap:8px}

@media (min-width:760px){
  .steps{grid-template-columns:repeat(3,1fr)}
  h1{font-size:34px}.hero h1{font-size:38px}
}