:root{
  --bg:#f7faf8;
  --surface:#ffffff;
  --surface-2:#f2f7f4;
  --ink:#0d1720;
  --muted:#556170;
  --line:rgba(11,23,32,.08);
  --green-900:#0d3b2b;
  --green-800:#115237;
  --green-700:#166844;
  --green-600:#1b7d50;
  --green-100:#e9f7ef;
  --teal:#0f766e;
  --shadow:0 12px 40px rgba(10, 24, 20, .08);
  --radius:22px;
  --radius-sm:16px;
  --max:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;
  color:var(--ink);
  background:
    radial-gradient(1200px 500px at 80% -10%, rgba(27,125,80,.08), transparent 50%),
    radial-gradient(900px 400px at 10% 0%, rgba(15,118,110,.06), transparent 45%),
    var(--bg);
}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.shell{width:min(var(--max), calc(100% - 2rem)); margin:0 auto}
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(247,250,248,.82);
  backdrop-filter: blur(14px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:1rem;
  min-height:76px;
}
.brand{
  display:flex; align-items:center; gap:.8rem; font-weight:700; letter-spacing:-.02em;
}
.brand img{height:38px; width:auto}
.brand-mark{
  width:38px;height:38px;border-radius:12px;
  background:linear-gradient(135deg, var(--green-700), var(--teal));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2);
}
.brand small{display:block;color:var(--muted);font-weight:600;font-size:.76rem;letter-spacing:.02em}
.nav-links{
  display:flex; justify-content:center; gap:1.35rem; flex-wrap:wrap;
  color:#334155; font-size:.96rem;
}
.nav-links a{position:relative; padding:.3rem 0}
.nav-links a::after{
  content:""; position:absolute; left:0; bottom:-.15rem;
  width:0; height:2px; background:var(--green-700); transition:width .2s ease;
}
.nav-links a:hover::after, .nav-links a.active::after{width:100%}
.nav-cta,.button,.button-secondary{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  padding:.88rem 1.1rem; border-radius:999px; font-weight:700; letter-spacing:-.01em;
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.nav-cta,.button{
  color:white;
  background:linear-gradient(135deg, var(--green-800), var(--green-600));
  box-shadow:0 10px 24px rgba(22,104,68,.22);
}
.nav-cta:hover,.button:hover{transform:translateY(-1px)}
.button-secondary{
  color:var(--green-900); border:1px solid rgba(17,82,55,.14); background:#fff;
}
.button-secondary:hover{background:var(--green-100)}
.mobile-toggle{display:none; background:none; border:none; font-size:1.6rem}

.hero{padding:5.25rem 0 3.2rem}
.hero-grid{
  display:grid; grid-template-columns:1.15fr .85fr; gap:2.2rem; align-items:center;
}
.eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.45rem .8rem; border-radius:999px;
  background:rgba(233,247,239,.88); color:var(--green-800);
  border:1px solid rgba(22,104,68,.08);
  font-size:.76rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase;
}
.hero h1{
  margin:.9rem 0 .95rem;
  font-size:clamp(2.8rem, 5vw, 5rem);
  line-height:.95; letter-spacing:-.05em;
}
.hero p.lede{
  font-size:1.12rem; line-height:1.75; color:var(--muted); max-width:52rem;
}
.hero-actions{display:flex; flex-wrap:wrap; gap:.9rem; margin:1.5rem 0 1.2rem}
.hero-proof{display:flex; gap:1.2rem; flex-wrap:wrap; color:#334155; font-size:.95rem}
.hero-proof span{display:inline-flex; align-items:center; gap:.55rem}
.panel{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(255,255,255,.92));
  border:1px solid rgba(15,23,42,.06);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}
.hero-card{padding:1.2rem}
.metric-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:.9rem; margin-top:1rem}
.metric{
  padding:1rem; border-radius:18px; background:var(--surface-2); border:1px solid rgba(15,23,42,.05)
}
.metric h3{margin:0; font-size:1.65rem; letter-spacing:-.04em}
.metric p{margin:.28rem 0 0; color:var(--muted); line-height:1.45}

section.block{padding:1rem 0 4rem}
.section-head{display:flex; align-items:end; justify-content:space-between; gap:1rem; margin-bottom:1.3rem}
.section-head h2{
  margin:0; font-size:clamp(1.8rem, 3vw, 2.7rem); line-height:1.05; letter-spacing:-.04em;
}
.section-head p{max-width:42rem; color:var(--muted); line-height:1.7; margin:0}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:1.15rem}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:1rem}
.card{
  padding:1.3rem; border-radius:var(--radius); background:#fff; border:1px solid rgba(15,23,42,.06); box-shadow:var(--shadow);
}
.card h3,.card h4{margin:.1rem 0 .55rem; letter-spacing:-.03em}
.card p{margin:0; color:var(--muted); line-height:1.68}
.kicker{font-size:.78rem; font-weight:800; text-transform:uppercase; letter-spacing:.14em; color:var(--green-700); margin-bottom:.7rem}
.tag-row{display:flex; gap:.55rem; flex-wrap:wrap; margin-top:.95rem}
.tag{
  padding:.4rem .62rem; border-radius:999px; background:var(--green-100); color:var(--green-800); font-size:.78rem; font-weight:700;
}
.dual{
  display:grid; grid-template-columns:1fr 1fr; gap:1.15rem;
}
.list{
  margin:0; padding-left:1.15rem; color:var(--muted); line-height:1.8;
}
.list strong{color:var(--ink)}
.quote{
  padding:1.35rem 1.5rem; border-left:4px solid var(--green-700); background:#fff; border-radius:0 18px 18px 0; box-shadow:var(--shadow)
}
.quote p{margin:0; color:#1f2937; font-size:1.03rem; line-height:1.75}
.band{
  padding:1.5rem; border-radius:var(--radius);
  background:linear-gradient(135deg, rgba(13,59,43,.98), rgba(15,118,110,.92));
  color:white; box-shadow:var(--shadow)
}
.band p{color:rgba(255,255,255,.88); line-height:1.75}
.cta-row{display:flex; gap:.9rem; flex-wrap:wrap; margin-top:1.1rem}
.site-footer{
  padding:2rem 0 2.6rem; border-top:1px solid var(--line); background:#f9fbfa; margin-top:3.5rem
}
.footer-grid{display:grid; grid-template-columns:1.2fr .8fr .8fr; gap:1rem}
.footer-grid p,.footer-grid a{color:var(--muted); line-height:1.8}
.page-hero{padding:4rem 0 2rem}
.page-hero .lede{max-width:58rem}
.content-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:1.25rem}
.feature-list{display:grid; gap:.9rem}
.feature{
  display:flex; gap:.9rem; align-items:flex-start;
  padding:1rem 1rem 1rem .95rem; border-radius:18px; background:#fff; border:1px solid rgba(15,23,42,.06)
}
.feature-icon{
  width:38px; height:38px; flex:0 0 38px; border-radius:12px;
  background:linear-gradient(135deg, rgba(22,104,68,.16), rgba(15,118,110,.16));
}
.split-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:.85rem}
.split-stats .card{padding:1rem}
.split-stats h3{margin:0; font-size:1.5rem}
.contact-card form{display:grid; gap:.9rem}
input, textarea{
  width:100%; padding:1rem 1rem; border-radius:16px; border:1px solid rgba(15,23,42,.12);
  background:#fff; font:inherit; color:var(--ink)
}
textarea{min-height:160px; resize:vertical}
.notice{
  background:rgba(233,247,239,.85); border:1px solid rgba(22,104,68,.08);
  border-radius:18px; padding:1rem 1rem
}
.muted{color:var(--muted)}
.center{text-align:center}
@media (max-width: 960px){
  .hero-grid,.content-grid,.dual,.footer-grid,.grid-4,.grid-3{grid-template-columns:1fr}
  .nav{grid-template-columns:auto auto}
  .nav-links{
    display:none; grid-column:1 / -1; justify-content:flex-start; padding:0 0 1rem 0;
    flex-direction:column; align-items:flex-start; gap:.75rem
  }
  .nav-links.open{display:flex}
  .mobile-toggle{display:block; justify-self:end}
  .nav-cta{display:none}
  .split-stats,.metric-grid{grid-template-columns:1fr 1fr}
}
@media (max-width: 640px){
  .shell{width:min(var(--max), calc(100% - 1.2rem))}
  .hero{padding-top:4rem}
  .hero-proof,.hero-actions{flex-direction:column; align-items:flex-start}
  .split-stats,.metric-grid{grid-template-columns:1fr}
}