
:root{
  --primary:#059669;
  --primary-dark:#047857;
  --bg:#f3f4f6;
  --text:#111827;
  --muted:#6b7280;
  --card:#ffffff;
  --border:#e5e7eb;
}

*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.6;
}
a{text-decoration:none;color:inherit}

header{
  background:linear-gradient(135deg,#022c22,#065f46);
  color:#ecfdf5;
  padding:.6rem 1rem;
  position:sticky;
  top:0;
  z-index:10;
}
.navbar{
  max-width:1100px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
}
.nav-left{
  display:flex;
  align-items:center;
  gap:.75rem;
}
.nav-logo img{height:52px;width:auto}
.nav-brand-title{
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-size:.9rem;
}
.nav-brand-sub{
  font-size:.7rem;
  opacity:.8;
  text-transform:uppercase;
  letter-spacing:.16em;
}
.nav-links{
  display:flex;
  gap:1rem;
  font-size:.9rem;
}
.nav-links a{color:#bbf7d0}
.nav-links a:hover{color:#fff}
.nav-cta{
  padding:.45rem .9rem;
  border-radius:999px;
  background:#6ee7b7;
  color:#022c22;
  font-size:.8rem;
  font-weight:600;
}
main{
  max-width:1100px;
  margin:0 auto;
  padding:1.25rem 1rem 2.5rem;
}
.hero{
  display:grid;
  grid-template-columns:minmax(0,3fr) minmax(0,2.2fr);
  gap:1.5rem;
  margin-bottom:2.2rem;
}
.badge{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  background:#d1fae5;
  color:#047857;
  padding:.18rem .6rem;
  border-radius:999px;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  margin-bottom:.5rem;
}
.badge-dot{width:8px;height:8px;border-radius:999px;background:#16a34a}
.hero h1{
  font-size:clamp(2rem,3vw,2.5rem);
  margin-bottom:.45rem;
}
.hero h1 span{color:var(--primary)}
.hero-sub{
  color:var(--muted);
  font-size:.95rem;
  max-width:33rem;
  margin-bottom:1rem;
}
.hero-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
  margin-bottom:.4rem;
}
.btn{
  border-radius:999px;
  padding:.55rem 1rem;
  font-size:.9rem;
  border:1px solid transparent;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.btn-primary{
  background:var(--primary);
  color:#ecfdf5;
}
.btn-primary:hover{background:var(--primary-dark)}
.btn-secondary{
  background:#fff;
  border-color:#d1d5db;
}
.btn-secondary:hover{background:#f3f4f6}
.hero-note{
  font-size:.8rem;
  color:var(--muted);
}
.hero-card{
  background:var(--card);
  border-radius:1rem;
  padding:1rem;
  border:1px solid var(--border);
  box-shadow:0 12px 32px rgba(15,23,42,.12);
}
.hero-card h2{font-size:1rem;margin-bottom:.6rem}
.kpi-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.75rem;
  margin-bottom:.6rem;
}
.kpi{
  border-radius:.75rem;
  padding:.5rem .6rem;
  background:#f9fafb;
  border:1px solid var(--border);
}
.kpi-label{
  font-size:.7rem;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--muted);
}
.kpi-value{font-size:.96rem;font-weight:700}
.kpi-sub{font-size:.75rem;color:var(--muted)}

.section{margin-bottom:2.4rem}
.section h2{font-size:1.25rem;margin-bottom:.4rem}
.section-intro{
  color:var(--muted);
  font-size:.95rem;
  max-width:34rem;
  margin-bottom:1rem;
}
.grid-3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.9rem;
}
.card{
  background:var(--card);
  border-radius:.9rem;
  padding:.9rem;
  border:1px solid var(--border);
}
.card h3{font-size:.98rem;margin-bottom:.35rem}
.card p{font-size:.88rem;color:var(--muted)}
.chips{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.35rem}
.chip{
  font-size:.72rem;
  padding:.12rem .5rem;
  border-radius:999px;
  background:#ecfdf5;
  color:#047857;
}

.two-cols{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
  gap:1.2rem;
}
.list{list-style:none;margin-top:.5rem}
.list li{
  display:flex;
  gap:.4rem;
  font-size:.88rem;
  color:#4b5563;
  margin-bottom:.3rem;
}
.list li:before{content:"•";color:var(--primary);margin-top:.08rem}

.contact-card{
  background:var(--card);
  border-radius:1rem;
  padding:1rem;
  border:1px solid var(--border);
}
.contact-card h3{font-size:.98rem;margin-bottom:.4rem}
.contact-card p{font-size:.86rem;color:var(--muted);margin-bottom:.45rem}
.form-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:.45rem;
  margin-bottom:.6rem;
}
label{font-size:.78rem;font-weight:500}
input,textarea,select{
  width:100%;
  border-radius:.55rem;
  border:1px solid #d1d5db;
  padding:.4rem .6rem;
  font-size:.85rem;
  font-family:inherit;
}
textarea{min-height:80px;resize:vertical}
input:focus,textarea:focus,select:focus{
  outline:2px solid #bbf7d0;
  border-color:#22c55e;
}

.footer{
  border-top:1px solid var(--border);
  margin-top:1.6rem;
  padding-top:.7rem;
  font-size:.78rem;
  color:var(--muted);
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:.5rem;
}
.footer-links{display:flex;gap:.75rem;flex-wrap:wrap}
.footer a{color:var(--muted)}
.footer a:hover{text-decoration:underline}

.simple-main{
  max-width:800px;
  margin:1.5rem auto 2.5rem;
  padding:0 1rem;
}

@media(max-width:860px){
  .navbar{flex-wrap:wrap}
  .nav-links{display:none}
  main{padding:1rem .75rem 2rem}
  .hero{grid-template-columns:minmax(0,1fr)}
  .grid-3{grid-template-columns:minmax(0,1fr)}
  .two-cols{grid-template-columns:minmax(0,1fr)}
}
