body
{
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
  margin: 0;
  padding: 0;
	
}
.products
{
	background-image: url('background.jpg');
	background-size: 100% 100%; /* Adjusts image to cover the entire element */
        background-position: center; /* Centers the image */
        background-repeat: repeat; /* Prevents image from repeating */
        min-height: 100vh; /* Example: ensure container takes full viewport height */
        color: black; /* Example: text color for readability */
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	
}
ul
{
list-style-type: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	background-color: #198A02;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
}
ul li
{
	float: left;
}
ul li a { 
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

ul li a:hover {
  background-color: #111111;
}
.product-section {
  padding: 2rem 1rem;
	padding-left: 50px;
	padding-right: 50px;
}

.section-intro {
  text-align: center;
  max-width: 800px;
  margin: 0 auto 2rem;
  color: #333;
  font-size: 18px;
  line-height: 1.4;
}

.section-intro span {
  color: darkgreen;
  font-size: 30px;
  font-weight: bold;
}

/* --- Product Grid --- */
.product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 2rem;
  justify-items: center;
  align-items: start;
}

/* --- Product Card --- */
.product-card {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  padding: 1rem;
  text-align: center;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  max-width: 300px;
}

.product-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 15px rgba(0,0,0,0.15);
}

.product-card img {
  width: 100%;
  height: auto;
  border-radius: 8px;
}

.product-card p {
  color: #222;
  font-size: 15px;
  line-height: 1.5;
  margin-top: 1rem;
}

.product-name {
  color: darkgreen;
}

/* --- Dropdown (Desktop) --- */
.dropbtn1 {
  background-color: darkgreen;
  color: white;
  padding: 10px 18px;
  border: none;
  border-radius: 6px;
  cursor: pointer;
  font-weight: bold;
  margin-top: 10px;
  transition: background 0.2s ease;
}

.dropbtn1:hover {
  background-color: #0b5e0b;
}

.dropdown1 {
  position: relative;
  display: inline-block;
}

.dropdown-content1 {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 140px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  border-radius: 8px;
  z-index: 1;
  overflow: hidden;
}

.dropdown-content1 a {
  color: black;
  padding: 10px 12px;
  text-decoration: none;
  display: block;
}

.dropdown-content1 a:hover {
  background-color: #ddd;
}

.dropdown1:hover .dropdown-content1 {
  display: block;
}

/* --- Mobile Buttons --- */
.mobile-links {
  display: none;
  gap: 0.5rem;
  margin-top: 10px;
  flex-wrap: wrap;
  justify-content: center;
}

.order-btn {
  background-color: darkgreen;
  color: white;
  padding: 8px 14px;
  border-radius: 6px;
  text-decoration: none;
  font-weight: bold;
  font-size: 14px;
  transition: background 0.2s ease;
}

.order-btn:hover {
  background-color: #0b5e0b;
}

/* --- Responsive Rules --- */
@media (max-width: 768px) {
  .section-intro span {
    font-size: 24px;
  }

  .product-grid {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1.5rem;
  }

  .product-card {
    max-width: 100%;
  }

  /* Hide dropdown on mobile, show buttons */
  .desktop-only {
    display: none;
  }

  .mobile-links {
    display: flex;
  }

  .order-btn {
    flex: 1 1 auto;
    text-align: center;
  }
}
.footer
{
	background-color: #198A02; 
	padding: 50px 50px 50px 50px;
	align-content: center;
	text-align: center;
	color: white;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
}
.footernavigation
{
	color: white;
}
.footernavigation:visited
{
	color: white;
}
address
{
	font-style: normal;
}
.section
{
	padding-bottom: 50px;
}
:root{--accent:#2E8B57;--muted:#6b7280;--maxw:1000px}
body{font-family:Inter,system-ui,Segoe UI,Roboto,Arial;line-height:1.6;color:#111;margin:0;background:#fff}
.wrap{max-width:var(--maxw);margin:32px auto;padding:0 20px}
header.hero{display:flex;gap:20px;align-items:center}
header.hero .hero-text{flex:1}
h1{margin:0;font-size:28px}
p.lead{color:var(--muted);margin-top:8px}
.card{display:grid;grid-template-columns:1fr 360px;gap:24px;background:#fbfbfb;padding:18px;border-radius:12px;align-items:center}
.section
{
	margin:28px 0;
	border-bottom:1px solid #eee;
}
.section:last-of-type{border-bottom:0}
.img-wrap{width:100%;height:220px;overflow:hidden;border-radius:10px}
.img-wrap img{width:100%;height:100%;object-fit:cover;display:block}
.values-list{display:flex;flex-direction:column;gap:10px}
.value{background:#fff;padding:12px;border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,0.04)}
.cta{display:inline-block;background:var(--accent);color:#fff;padding:10px 16px;border-radius:8px;text-decoration:none}
@media(max-width:880px){.card{grid-template-columns:1fr;}.img-wrap{height:180px}}
.section{margin:40px 0}
.values{display:flex;flex-wrap:wrap;gap:20px}
.value1{flex:1 1 260px;background:#fafafa;padding:16px;border-radius:8px;box-shadow:0 1px 4px rgba(0,0,0,0.05)}
.jobs-table{width:100%;border-collapse:collapse;margin-top:16px}
.jobs-table th,.jobs-table td{border:1px solid #e5e7eb;padding:12px;text-align:left}
.jobs-table th{background:#f9fafb}
.cta{display:inline-block;background:var(--accent);color:#fff;padding:10px 18px;border-radius:8px;text-decoration:none;margin-top:12px}

.btn1 {
  border: none;
  color: white;
  padding: 16px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  transition-duration: 0.4s;
  cursor: pointer;
  background-color: #216D16;
  border-radius: 10px;
}

.btn1:hover {
  background-color: #04AA6D;
  color: white;
}
