*{box-sizing:border-box}
body{font-family: Arial,Helvetica,sans-serif;margin:0;color:#222;background:#fff}
.wrap{max-width:1180px;margin:0 auto;padding:20px}
.site-header{background:linear-gradient(90deg,#006400,#ffffff,#cc0000);color:#fff}
.header-inner{display:flex;gap:18px;align-items:center;justify-content:flex-start}
.logo{height:72px;width:auto;border-radius:4px;background:#fff}
.business-name{color: black; margin:0;font-size:1.8rem}
.tagline{color: blue;margin:4px 0 0 0;font-weight:600}
.badge{background:#fff;color:#006400;display:inline-block;padding:4px 12px;border-radius:18px;font-weight:700;margin-top:8px}
.site-nav{background:#0a2a66}
.site-nav .wrap{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.site-nav a{color:#fff;text-decoration:none;padding:10px 12px;border-radius:6px}
.site-nav a:hover{background:#02163b}
.hero{text-align:center;padding:40px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.card{background:#f9f9f9;padding:12px;border-radius:8px;text-align:center;border:1px solid #eee}
.card img{width:100%;height:160px;object-fit:cover;border-radius:6px}
.btn{background:#006400;color:#fff;padding:10px 14px;border-radius:6px;text-decoration:none;display:inline-block}
.btn.ghost{background:transparent;border:2px solid #006400;color:#006400}
.small{padding:6px 10px;font-size:0.9rem}
.testimonials{margin-top:32px}
.test-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
blockquote{background:#f4f4f4;padding:12px;border-left:4px solid #006400;border-radius:4px}
.site-footer{
  background: linear-gradient(to right, #0a2a66, #0066cc);
  color: #ffffff;
  padding: 20px;
  text-align: center;
}

.service-list article{background:#fff;padding:12px;border-radius:6px;margin-bottom:10px;border:1px solid #eee}
.quick-enquire{background:#f5f5f5;padding:12px;border-radius:8px;margin-top:16px}
.quick-enquire form input, .quick-enquire form textarea, form input, form textarea{width:100%;padding:10px;margin:6px 0;border:1px solid #ccc;border-radius:4px}
form button{background:#006400;color:#fff;border:none;padding:10px 14px;border-radius:6px;cursor:pointer}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.gallery-grid img{width:100%;height:180px;object-fit:cover;border-radius:6px;cursor:pointer;border:1px solid #ddd}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.8);display:none;align-items:center;justify-content:center;z-index:9999}
.lightbox.open{display:flex}
.lightbox img{max-width:90vw;max-height:85vh;border-radius:8px;box-shadow:0 8px 30px rgba(0,0,0,.5)}
.lightbox .close, .lightbox .prev, .lightbox .next{
  position:absolute;color:#fff;background:rgba(0,0,0,.4);border:none;padding:10px 14px;border-radius:6px;cursor:pointer;font-size:18px
}
.lightbox .close{top:20px;right:20px}
.lightbox .prev{left:20px;top:50%;transform:translateY(-50%)}
.lightbox .next{right:20px;top:50%;transform:translateY(-50%)}
@media(max-width:680px){.header-inner{flex-direction:column;align-items:flex-start}.logo{height:56px}}
/* Uniform product gallery */
.image-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 16px;
}

/* Card (optional nice padding/border) */
.image-card {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
}

/* The image "box" — SAME SIZE for all */
.image-card .thumb {
  width: 100%;
  aspect-ratio: 4 / 3;          /* uniform box: change to 1/1 for square, 16/9, etc. */
  background: #fff;
  border-radius: 6px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Show entire image inside the box (no cropping) */
.image-card .thumb img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain !important;   /* override any old 'cover' rules */
  display: block;
}
}
.image-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: center;
}

.image-gallery img {
  max-width: 100%;   /* scale down if too wide */
  height: auto;      /* keep natural aspect ratio */
  border: 1px solid #ddd;
  border-radius: 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,.12);
}