/* Preserve Nature - Netlify Static Site */
:root{
  --green:#0f3d2e;
  --green-2:#1e6a47;
  --mint:#e9f4ea;
  --text:#123;
  --muted:#4a5a57;
  --card:#ffffff;
  --border:#e6ece9;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:#fff;}
a{color:inherit;text-decoration:none}

.container{max-width:1040px;margin:0 auto;padding:0 18px;}

/* Header */
header{background:var(--green);color:#fff;position:sticky;top:0;z-index:50;}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:.2px;}
.brand img{height:34px;width:34px;border-radius:10px;background:#fff;object-fit:cover;}

nav{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:flex-end;}
nav a{opacity:.92;font-weight:650;padding:8px 10px;border-radius:10px;}
nav a:hover{background:rgba(255,255,255,.12);opacity:1;}
nav a.active{background:rgba(255,255,255,.18);}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:12px;padding:12px 16px;font-weight:750;cursor:pointer;}
.btn-primary{background:var(--green-2);color:#fff;}
.btn-primary:hover{filter:brightness(1.05)}
.btn-ghost{background:rgba(255,255,255,.14);color:#fff;}

/* Hero */
.hero{position:relative;overflow:hidden;background:var(--mint);}
.hero::before{
  content:"";
  position:absolute;inset:0;
  background-image:url('logo.png');
  background-repeat:no-repeat;
  background-position:center;
  background-size:contain;
  opacity:.20;
  transform:scale(1.05);
  pointer-events:none;
}
.hero-inner{position:relative;padding:64px 0 42px;}
.hero h1{margin:0 0 14px;font-size:44px;line-height:1.08;color:var(--green);}
.hero p{margin:0 0 18px;color:var(--muted);font-size:18px;max-width:760px;}
.hero .pillars{margin-top:10px;font-weight:700;color:var(--green);}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px;}

/* Sections */
section{padding:48px 0;border-top:1px solid var(--border);}
section:first-of-type{border-top:0;}
.section-title{margin:0 0 10px;color:var(--green);font-size:30px;}
.section-lead{margin:0 0 22px;color:var(--muted);max-width:860px;font-size:17px;}

/* Cards */
.grid{display:grid;gap:16px;}
.grid-4{grid-template-columns:repeat(4,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:18px;box-shadow:0 1px 0 rgba(0,0,0,.02);}
.card h3{margin:10px 0 8px;font-size:18px;color:var(--green);}
.card p{margin:0;color:var(--muted);line-height:1.55;}
.icon{height:42px;width:42px;border-radius:14px;display:grid;place-items:center;background:rgba(30,106,71,.10);}
.icon svg{height:22px;width:22px;fill:var(--green-2);}

/* Lists */
ul.clean{margin:0;padding-left:18px;color:var(--muted);line-height:1.7;}

/* Callout */
.callout{background:var(--mint);border:1px solid var(--border);border-radius:20px;padding:22px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;}
.callout h3{margin:0;color:var(--green);}
.callout p{margin:6px 0 0;color:var(--muted);max-width:720px;}

/* Forms */
form{display:grid;gap:12px;max-width:640px;}
input,textarea{width:100%;padding:12px 12px;border:1px solid var(--border);border-radius:12px;font:inherit;}
textarea{min-height:130px;resize:vertical;}

/* Footer */
footer{border-top:1px solid var(--border);padding:28px 0;color:var(--muted);text-align:center;}
footer .name{font-weight:800;color:var(--green);}

/* Responsive */
@media (max-width: 980px){
  .grid-4{grid-template-columns:repeat(2,1fr);} 
  .grid-3{grid-template-columns:repeat(2,1fr);} 
  .hero h1{font-size:38px;}
}
@media (max-width: 640px){
  .header-inner{align-items:flex-start;}
  nav{justify-content:flex-start;gap:8px;}
  nav a{padding:8px 8px;}
  .grid-4,.grid-3{grid-template-columns:1fr;}
  .hero-inner{padding:46px 0 30px;}
  .hero h1{font-size:32px;}
}

/* Utility */
.two-col{grid-template-columns:1.1fr .9fr;}
@media (max-width: 900px){
  .two-col{grid-template-columns:1fr;}
}