
:root{
  --teal:#0b5a57;
  --bg:#f4efe8;
  --text:#1c1c1c;
  --muted:#666;
  --max-width:1100px;
}
*{box-sizing:border-box}
body{font-family:Inter, system-ui, sans-serif; margin:0; color:var(--text); background:var(--bg);}
.container{max-width:var(--max-width); margin:0 auto; padding:28px;}
.site-header{background:white; border-bottom:1px solid #e9e6e3;}
.header-inner{display:flex; align-items:center; justify-content:space-between;}
.brand{display:flex; gap:16px; align-items:center;}
.logo{width:68px; height:68px; object-fit:contain; border-radius:6px;}
.brand-text h1{font-size:18px; margin:0; color:var(--teal);}
.tag{margin:0; color:var(--muted); font-size:13px;}
.nav a{margin-left:18px; color:var(--text); text-decoration:none; font-weight:600; font-size:14px;}
.hero{padding:60px 0; text-align:center; background:linear-gradient(180deg, rgba(11,90,87,0.06), transparent);}
.hero h2{font-size:32px; margin:0 0 12px; color:var(--teal);}
.lead{max-width:720px; margin:0 auto 20px; color:var(--muted);}
.cta{display:inline-block; padding:12px 20px; background:var(--teal); color:white; border-radius:6px; text-decoration:none; font-weight:700;}
.about, .services, .contact{background:white; margin:24px 0; padding:28px; border-radius:10px;}
.services .cards{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:18px;}
.card{padding:18px; border-radius:8px; background:rgba(11,90,87,0.02);}
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.contact-card{padding:18px;}
.contact-form label{display:block; margin-bottom:10px; font-size:14px;}
.contact-form input, .contact-form textarea{width:100%; padding:10px; border-radius:6px; border:1px solid #e2e0dd; margin-top:6px;}
.btn{background:var(--teal); color:white; padding:10px 14px; border:none; border-radius:6px; cursor:pointer; font-weight:700;}
.site-footer{padding:18px 0; text-align:center; color:var(--muted);}
@media (max-width:800px){
  .contact-grid{grid-template-columns:1fr;}
  .nav{display:none;}
  .hero h2{font-size:24px;}
}
