:root{--cream:#f7f1e3;--paper:#fffaf0;--sand:#eadcc0;--forest:#2f5d3a;--moss:#5d8a4c;--leaf:#cfe3b4;--bark:#7a5233;--clay:#c06b3e;--sun:#f2c46d;--ink:#2b2a22;--muted:#5e5a4c;--r:18px}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Nunito Sans',system-ui,sans-serif;color:var(--ink);background:var(--cream);line-height:1.65;font-size:17px}
img,svg{display:block;max-width:100%}
a{color:inherit}
.wrap{width:min(1120px,92%);margin:0 auto}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;line-height:1.12;color:var(--forest)}
h1{font-size:clamp(2.6rem,6vw,4.4rem);font-weight:700}
h1 em{font-style:italic;color:var(--clay);font-weight:600}
h2{font-size:clamp(1.9rem,3.6vw,2.7rem);font-weight:600;margin-bottom:1rem}
h3{font-size:1.35rem;margin-bottom:.5rem}
.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.78rem;font-weight:700;color:var(--clay);margin-bottom:.8rem}
.center{text-align:center}
.light{color:var(--paper)!important}
.eyebrow.light{color:var(--sun)!important}
/* nav */
.nav{position:sticky;top:0;z-index:20;background:rgba(247,241,227,.92);backdrop-filter:blur(8px);border-bottom:1px solid rgba(122,82,51,.12)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:70px}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;font-family:'Fraunces',serif;font-weight:700;font-size:1.25rem;color:var(--forest)}
.brand.small{font-size:1.05rem;color:var(--paper)}
.menu{display:flex;gap:1.6rem;align-items:center}
.menu a{text-decoration:none;font-weight:600;color:var(--muted);transition:color .2s}
.menu a:hover{color:var(--forest)}
.menu a.pill{background:var(--forest);color:var(--paper);padding:.5rem 1.1rem;border-radius:999px}
.menu a.pill:hover{background:var(--moss)}
.menu-btn{display:none;background:none;border:0;cursor:pointer;padding:8px}
.menu-btn span{display:block;width:24px;height:2px;background:var(--forest);margin:5px 0;border-radius:2px}
/* buttons */
.btn{display:inline-block;padding:.85rem 1.6rem;border-radius:999px;font-weight:700;text-decoration:none;transition:transform .2s,background .2s,box-shadow .2s}
.btn:hover{transform:translateY(-2px)}
.btn.primary{background:var(--clay);color:#fff;box-shadow:0 8px 20px rgba(192,107,62,.28)}
.btn.primary:hover{background:#a95a31}
.btn.ghost{border:2px solid var(--forest);color:var(--forest)}
.btn.ghost:hover{background:var(--forest);color:var(--paper)}
.btn.sun{background:var(--sun);color:var(--ink);margin-top:2.4rem}
/* hero */
.hero{padding:clamp(3rem,7vw,6rem) 0 clamp(2rem,5vw,4rem);background:radial-gradient(ellipse at 80% 20%,#fbe9c4 0,transparent 55%),linear-gradient(180deg,var(--cream),#f1e7d0)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.lede{font-size:1.2rem;color:var(--muted);margin:1.4rem 0 2rem;max-width:36rem}
.actions{display:flex;gap:1rem;flex-wrap:wrap}
.tree{width:100%;max-width:440px;margin:0 auto}
.canopy{transform-origin:200px 190px;animation:sway 7s ease-in-out infinite}
.roots path{stroke-dasharray:260;stroke-dashoffset:260;animation:grow 2.6s ease-out forwards}
.roots path:nth-child(n+4){animation-delay:.8s}
@keyframes grow{to{stroke-dashoffset:0}}
@keyframes sway{0%,100%{transform:rotate(-1.2deg)}50%{transform:rotate(1.2deg)}}
/* about */
.about{padding:clamp(4rem,8vw,6.5rem) 0;background:var(--paper)}
.two-col{display:grid;grid-template-columns:.9fr 1.1fr;gap:3.5rem;align-items:start}
.prose p{margin-bottom:1.1rem;color:var(--muted)}
blockquote{margin:1.6rem 0;padding:1.4rem 1.6rem;background:var(--cream);border-left:5px solid var(--moss);border-radius:0 var(--r) var(--r) 0;font-family:'Fraunces',serif;font-style:italic;font-size:1.15rem}
blockquote p{color:var(--forest)!important;margin:0!important}
/* work */
.work{padding:clamp(4rem,8vw,6.5rem) 0;background:linear-gradient(180deg,var(--cream),var(--sand))}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:2.6rem}
.card{background:var(--paper);padding:2rem 1.7rem;border-radius:var(--r);box-shadow:0 10px 30px rgba(122,82,51,.10);border-top:5px solid var(--moss);transition:transform .25s}
.card:nth-child(2){border-top-color:var(--clay)}
.card:nth-child(3){border-top-color:var(--sun)}
.card:hover{transform:translateY(-4px)}
.card p{color:var(--muted)}
.icon{width:54px;height:54px;border-radius:14px;background:var(--leaf);color:var(--forest);display:grid;place-items:center;margin-bottom:1.1rem}
.icon svg{width:32px;height:32px}
/* involved */
.involved{padding:clamp(4rem,8vw,6.5rem) 0;background:var(--forest);background-image:radial-gradient(circle at 10% 90%,rgba(207,227,180,.14) 0,transparent 40%),radial-gradient(circle at 90% 10%,rgba(242,196,109,.14) 0,transparent 40%)}
.ways{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:2.6rem}
.way{border:1px solid rgba(255,250,240,.2);border-radius:var(--r);padding:2rem 1.7rem;background:rgba(255,250,240,.05)}
.way h3{color:var(--paper)}
.way p{color:#dfe8d4}
.num{font-family:'Fraunces',serif;font-size:2rem;color:var(--sun);display:block;margin-bottom:.4rem}
/* contact */
.contact{padding:clamp(4rem,8vw,6rem) 0;background:var(--paper)}
.contact-box{display:grid;grid-template-columns:1.2fr .8fr;gap:2.5rem;align-items:center;background:var(--cream);border:1px solid var(--sand);border-radius:28px;padding:clamp(2rem,5vw,3.5rem)}
.contact-box p{color:var(--muted)}
.mail{display:flex;align-items:center;gap:.7rem;justify-content:center;background:var(--forest);color:var(--paper);text-decoration:none;font-weight:700;padding:1.1rem 1.4rem;border-radius:16px;font-size:1.05rem;word-break:break-all;transition:background .2s}
.mail:hover{background:var(--moss)}
.mail svg{width:24px;height:24px;flex:none}
/* footer */
.footer{background:#23402b;color:#d6dfcc;padding:2rem 0;font-size:.9rem}
.foot-inner{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap}
/* reveal */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.roots path{stroke-dashoffset:0}.reveal{opacity:1;transform:none}}
/* responsive */
@media (max-width:900px){
  .hero-grid,.two-col,.contact-box{grid-template-columns:1fr}
  .hero-art{order:-1}.tree{max-width:300px}
  .cards,.ways{grid-template-columns:1fr}
}
@media (max-width:720px){
  .menu-btn{display:block}
  .menu{position:absolute;top:70px;left:0;right:0;flex-direction:column;gap:0;background:var(--cream);border-bottom:1px solid var(--sand);display:none;padding:.5rem 0 1rem}
  .menu.open{display:flex}
  .menu a{padding:.8rem 0;width:100%;text-align:center}
  .menu a.pill{width:auto;padding:.6rem 1.4rem;margin-top:.4rem}
  body{font-size:16px}
}
