
:root{
  --accent: #0b6f6b;
  --muted: #666;
  --bg: #fff;
}
*{box-sizing:border-box}
body{font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial; margin:0; color:#222; background:var(--bg); line-height:1.45}
.container{max-width:1100px; margin:0 auto; padding:1.25rem}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:1rem}
.brand{display:flex; gap:0.75rem; align-items:center}
.logo{width:72px; height:72px}
.slogan{margin:0;font-size:0.9rem;color:var(--muted)}
.site-header{background:#f7f7f7;border-bottom:1px solid #e6e6e6;padding:0.5rem 0}
.nav a{margin-left:1rem; text-decoration:none; color:#0b6f6b; font-weight:600}
.nav-toggle{display:none; background:none; border:0; font-size:1.75rem}
.hero{display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:1rem; padding:2rem 0}
.hero-img{width:100%; max-height:300px; object-fit:cover; border-radius:8px}
.hero-text h2{font-size:1.6rem; margin:0 0 0.5rem}
.btn{display:inline-block; padding:0.6rem 1rem; background:var(--accent); color:white; text-decoration:none; border-radius:6px; margin-top:0.75rem}
.about, .products, .services, .contact{padding:2rem 0}
.highlights{display:flex; gap:1rem; list-style:none; padding:0; margin-top:0.75rem}
.grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem}
.card{padding:1rem; border:1px solid #eee; border-radius:8px; background:#fff}
.site-footer{background:#f1f1f1; padding:1rem 0; margin-top:2rem; border-top:1px solid #e6e6e6}
.small{color:var(--muted); font-size:0.9rem}
.contact-form{display:grid; gap:0.5rem; max-width:480px}
.contact-form label{display:flex; flex-direction:column; font-size:0.95rem}
.contact-form input, .contact-form textarea{padding:0.5rem; border:1px solid #ddd; border-radius:6px}
.form-note{font-size:0.85rem; color:var(--muted)}
@media (max-width:800px){
  .hero{grid-template-columns:1fr; text-align:center}
  .nav{display:none; position:absolute; right:1.25rem; top:72px; background:#fff; border:1px solid #eee; padding:0.5rem; border-radius:6px}
  .nav-toggle{display:block}
  .grid{grid-template-columns:1fr}
  .header-inner{position:relative}
}
