
:root {
  --primary: #1c3d5a;
  --accent: #f5a623;
  --light-bg: #f6f8fa;
  --text: #222;
  --max-w: 1180px;
}

* { margin:0; padding:0; box-sizing:border-box; }

body {
  font-family: "Urbanist", sans-serif;
  background: var(--light-bg);
  color: var(--text);
  line-height: 1.8;
}

img { width:100%; border-radius:6px; display:block; }

.container { width:92%; max-width:var(--max-w); margin:auto; }

.site-header {
  background: var(--primary);
}

.logo {
  color:#fff;
  font-weight:600;
  font-size:1.6rem;
  letter-spacing:-.5px;
}

.nav-links { list-style:none; display:flex; gap:1.3rem; }

.nav-links a {
  color:#fff;
  text-decoration:none;
  font-weight:500;
  transition:opacity .2s;
}

.nav-links a:hover { opacity:.75; }

.nav-container { display:flex; justify-content:space-between; align-items:center; padding:1rem 0; }

.hero {
  height:72vh;
  background-size:cover;
  background-position:center;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.hero-overlay {
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.5);
}

.hero-content {
  position:relative;
  color:#fff;
  max-width:740px;
  padding:0 1rem;
}

.hero-content h2 { font-size:2.8rem; font-weight:700; margin-bottom:1rem; }

.btn-primary {
  display:inline-block;
  background: var(--accent);
  color:#fff;
  padding:.9rem 1.8rem;
  border-radius:28px;
  text-decoration:none;
  font-weight:600;
  margin-top:1.4rem;
  transition:background .2s;
}

.btn-primary:hover { background:#d88d18; }

.intro { padding:4rem 0; text-align:center; }

.intro h3 { font-size:2rem; color:var(--primary); margin-bottom:1rem; }

.pillars {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:2rem;
  padding-bottom:4rem;
}

.pillar h4 { color:var(--accent); font-size:1.3rem; margin-bottom:.6rem; }

.about {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2.5rem;
  padding:4rem 0;
}

.about ul { list-style:disc; padding-left:1rem; margin-top:.6rem; }

.products { padding:4rem 0; }

.products h2 { text-align:center; font-size:2.1rem; color:var(--primary); margin-bottom:3rem; }

.product {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2rem;
  margin-bottom:4rem;
  align-items:center;
}

.product.reverse img { order:2; }

.product-info h3 { color:var(--accent); font-size:1.5rem; margin-bottom:.7rem; }

.product-info ul { list-style:square; padding-left:1rem; margin-top:.6rem; }

.gallery-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:1rem;
  margin-top:2rem;
}

.contact { padding:4rem 0; }

.contact-details p { margin-bottom:.5rem; }

.contact-form {
  margin-top:2rem;
  display:grid;
  gap:1rem;
  max-width:600px;
}

.contact-form input, .contact-form textarea {
  padding:.9rem;
  border:1px solid #cdd2d6;
  border-radius:6px;
  font-family:inherit;
}

.contact-form button { cursor:pointer; }

footer {
  background:var(--primary);
  color:#fff;
  text-align:center;
  padding:2rem 0;
  font-size:.9rem;
  margin-top:4rem;
}

@media(max-width:768px){
  .about, .product { grid-template-columns:1fr; }
  .hero-content h2 { font-size:2.2rem; }
}
