* {

  margin: 0;

  padding: 0;

}



:root {

  --bg: #f6f4ee;

  --white: #ffffff;

  --text: #1b1b1b;

  --muted: #4d4d4d;

  --green: #4b7132;

  --green-dark: #30541e;

  --green-soft: #dfe8cf;

  --gold: #bba56c;

  --border: #e1dbd0;

}



body {

  background: var(--bg);
  overflow-x: hidden;
  font-family: "Inter", sans-serif;
  color: var(--text);

}



img {

  max-width: 100%;

  display: block;

}



a {

  text-decoration: none;

}


/* HEADER */

/* HEADER */

.site-header {

  display: grid;
  padding:0;
  grid-template-columns: 420px 1fr 208px;
  background-color: white;
  align-items: start;
  column-gap: 10px;
  margin-bottom: 16px;
transform: scale(1.1);
transform-origin: top center;
}



.logo-column {

  display: flex;
padding: 0;
  align-items: flex-start;
  justify-content: flex-start;
margin: 0;
}



.logo-img {
  padding-left: 70px;
  width: auto;
display: block ;
  height: 140px;
  margin: 0;

}



.main-nav {

  display: flex;
  background-color: white;
  justify-content: center;
  align-items: center;
  height: 115px;
  margin-left: auto;
  font-family:"inter",sans-serif;

}



.nav-list {

  list-style: none;

  display: flex;

  gap: 34px;

}



.nav-list a {

  color: #121212;

  font-size: 14px;

  font-weight: 800;

  letter-spacing: 0.01em;

}



.nav-list a.active {

  color: var(--green);

  position: relative;

}



.nav-list a.active::after {

  content: "";

  position: absolute;

  left: 0;

  bottom: -8px;

  width: 44px;

  height: 3px;

  background: var(--green);

}



.badge-column {

  display: flex;

  justify-content: flex-end;

}



.badge-img {

  width: 112px;

  height: auto;

  margin-top: 2px;

}


.about-hero {
	position: relative;
height: 150px;
overflow: hidden;

}



/* HERO */

.hero-section {

  display: grid;
  grid-template-columns: 1fr 1.2fr; 
  gap: 11.5px;
  align-items: center;
  width:100%;
  height:455px;
  max-width: 1600px;
  background-color: #e6e1d8;
  letter-spacing: 1px;
  margin-top: 10px;
  margin-bottom: 20px;
  border:1px solid black;
}



.hero-left {
  max-width: 700px;
  margin-left: 20px;
  
}



.hero-left h1 {

  font-family: "Cormorant Garamond", serif;

  font-size: 64px;

  line-height: 1.05;

  font-weight: 700;

  color: #1f2e1d;

}

.hero-subtitle {
	font-size: 27px; 
	font-family: "Cormorant Garamond", serif;
}


.mini-divider {

  display: flex;

  align-items: center;

  gap: 12px;

  margin-bottom: 18px;

}



.mini-divider span {

  width: 56px;

  height: 1.5px;

  background: var(--gold);

}



.mini-divider p {

  font-size: 15px;

  font-weight: 800;

  color: var(--green);

  letter-spacing: 0.01em;

}

.about-hero {
	position: relative;
height: 300px;
overflow: hidden;
}



.hero-copy {

  width: 360px;

  color: #3f3f3f;

  font-size: 15px;

  line-height: 1.85;

  margin-bottom: 18px;

}



.hero-actions {

  display: flex;

  align-items: center;

  gap: 20px;

  margin-top: 8px;

}

	
.btn-primary {

  background: linear-gradient(180deg, #5d873d 0%, #426b2a 100%);

  color: white;

  font-size: 14px;

  font-weight: 800;

  padding: 16px 20px;

  border-radius: 9px;

  display: inline-flex;

  align-items: center;

  gap: 10px;

  min-width: 212px;

  justify-content: center;

}


.btn-text {

  color: #222;

  font-size: 14px;

  font-weight: 800;

  display: inline-flex;

  align-items: center;

  gap: 10px;

}


.hero-right {
  width:100%;
  position: relative; 
  margin-left:10px;
}


.hero-video {
  position: relative;
  width: 100%;
  height: 455px;
  object-fit: cover;
}
 
 
.badge-50 {
	  position: absolute;
	  top: -45px;
	  right: -20px;
	  width: 220px;
	  z-index: 10;
  }


/* SECTION TITLE */

.section-title-wrap {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 16px;


}


.title-line {

  width: 125px;
  margin: 0 auto;
  height: 1.5px;

  background: var(--gold);

}


.section-title-wrap h2 {

  font-family: "Cormorant Garamond", serif;
  letter-spacing: 2px;
  font-size: 56px;
  text-align: center;
  line-height: 1;
  color: #1f2e1d;
  font-weight: 700;

}


.featured-title {

  font-family: "Cormorant Garamond", sans-serif !important;

  font-size: 26px !important;

  letter-spacing: 0.02em;

  font-weight: 800 !important;

}
.fa-tractor {



  font-size: 20px;   /* size */



  color: #2e7d32;    /* green */



  margin-right: 8px;



}

.section-subtitle {

  text-align: center;

  color: #393939;
letter-spacing: 2px;
  font-size: 18px;

  margin-bottom: 18px;

}


/* WHY */

.why-section {

  margin-top: 8px;
  margin-bottom: 18px;

}


.why-grid {

  display: grid;

  grid-template-columns: repeat(4, 1fr);
  
  gap: 22px;

  margin-top: 14px;

}


.why-card {

  background: rgba(255, 255, 255, 0.45);

  border: 1px solid var(--border);

  border-radius: 16px;

  text-align: center;

  padding: 18px 20px 16px;

  min-height: 208px;

}


.why-icon {

  width: 82px;

  height: 82px;

  border-radius: 50%;

  background: #edf2e4;

  margin: 0 auto 12px;

  display: grid;
place-items: center;

}


.why-icon i {

  font-size: 35px;

  color: var(--green);

}


.why-card h3 {

  font-size: 20px;

  font-weight: 800;

  margin-bottom: 8px;

}


.why-card p {

  font-size: 16px;

  line-height: 1.7;

  color: #414141;

}


.products-section {

  margin-top: 14px;

  margin-bottom: 18px;

}


.featured-wrap {

  margin-bottom: 10px;

}


.product-grid {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 20px;

  margin-top: 14px;

}


.product-card {

  background: var(--white);

  border: 1px solid var(--border);

  border-radius: 14px;

  overflow: hidden;

}


.product-photo {

  width: 100%;

  height: 175px;

  object-fit: cover;

}


.product-bottom {

  position: relative;

  padding: 18px 18px 16px 94px;

  min-height: 118px;

}


.product-icon {

  position: absolute;

  left: 16px;

  top: -28px;

  width: 72px;

  height: 72px;

  border-radius: 50%;

  background: var(--green);

  border: 5px solid #f6f4ee;

  display: grid;
  place-items: center;

}


.product-icon i {

  color: white;

  font-size: 28px;

}


.product-text h3 {

  font-size: 20px;
text-align: center;
  font-weight: 800;

  margin-bottom: 8px;

}


.product-text p {

  font-size: 16px;

  color: #3f3f3f;

  line-height: 1.7;

  margin-bottom: 10px;

}


.product-text a {

  color: var(--green);

  font-size: 13px;

  font-weight: 800;

  display: inline-flex;

  align-items: center;

  gap: 8px;

}


.back-link {
	display:block !important;
	width: fit-content !important;
	margin-top:40px auto!important;
}

/* CTA */

.cta-section {

  margin-top: 8px;

}


.cta-banner {

  position: relative;

  background:

    linear-gradient(90deg, rgba(20, 44, 16, 0.94) 0%, rgba(27, 65, 21, 0.92) 36%, rgba(32, 83, 31, 0.83) 100%),

    url("images/cta-bg.jpg") center/cover no-repeat;

  min-height: 138px;

  border-radius: 18px;

  padding: 26px 26px 24px 185px;
margin-left: -60px;
  display: grid;

  grid-template-columns: 1.15fr 1fr;

  align-items: center;

  overflow: hidden;

}
.cta-left{
display: flex;

flex:1;
}

.cta-left h2 {

  color: white;

  font-size: 23px;

  font-weight: 800;

  margin-bottom: 10px;

}
.cta-left i {
	align-items: center;
	display: flex;
	gap: 10px;
	font-size:40px;
	color: #4caf50;
	justify-content: flex-start;
text-align: left;
}

.cta-left p {

  color: rgba(255,255,255,0.92);
text-align: center;
  font-size: 16px;

  line-height: 1.7;

  max-width: 480px;

}


.cta-stats {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  align-items: center;

}


.stat-item {

  text-align: center;

  color: white;

  border-left: 1px solid rgba(215, 192, 108, 0.35);

  padding: 0 16px;

}


.stat-item:first-child {

  border-left: none;

}


.stat-item i {

  color: #e0bf64;

  font-size: 26px;

  margin-bottom: 10px;

}


.stat-item strong {

  display: block;

  font-size: 14px;

  font-weight: 800;

  margin-bottom: 4px;

}


.stat-item span {

  display: block;

  font-size: 12px;

  font-weight: 700;

  line-height: 1.35;

}



/* FOOTER */

/* MAIN FOOTER */

.footer {

  background: #2f4f3a;
font-size: 21px;
  color: #f5f5f5;
font-size: 21px;
  font-family: "Cormorant Garamond", serif;

}



/* TOP SECTION */

.footer-top {

  display: flex;
background-image: url("grass.png");
background-size: cover;
background-position: center;
color: white;
  justify-content: space-between;
text-align: center;
  padding: 40px 30px;
font-size: 21px;
  border-bottom: 2px solid rgba(255,255,255,0.1);

  flex-wrap: wrap;

}



.footer-col {

  flex: 1;

  min-width: 220px;
font-size: 21px;
  margin: 10px;

}



/* LOGO STYLE */

.logo {

  font-size: 28px;

  margin-bottom: 10px;

  letter-spacing: 2px;

}



.logo span {

  font-size: 14px;

  color: #c8e6c9;

}



/* LINKS */

.links {

  list-style: none;

  padding: 0;

}



.links li {

  margin-bottom: 10px;

  font-size: 18px;

}
                         

.logo {
	margin-bottom: 10px;
}

/*linked footer*/

a {
	color: white;
	text-decoration: none;
}

/* Auto-fit website screens */

* {

  box-sizing: border-box;

}

html, body {

  width: 100%;

  max-width: 100%;

  overflow-x: hidden;

}

img, video {

  max-width: 100%;

  height: auto;

}

.container,

.wrapper,

.page-content,

.section {

  max-width: 1200px;

  width: 90%;

  margin-left: auto;

  margin-right: auto;

}

/* Let rows/cards wrap instead of overflowing */

.products,

.product-grid,

.card-container,

.gallery,

.services,

.row {

  display: flex;

  flex-wrap: wrap;

  gap: 20px;

}

.card,

.product-card,

.service-card,

.gallery-item {

  flex: 1 1 250px;

}

/* Tablet + phone */

@media (max-width: 768px) {

  nav ul,

  .navbar ul,

  .nav-links {

    flex-direction: column;

    gap: 12px;

    text-align: center;

  }

  h1 {

    font-size: 2rem;

  }

  h2 {

    font-size: 1.5rem;

  }

  .hero,

  .banner,

  section {

    padding-left: 20px;

    padding-right: 20px;

  }

  .products,

  .product-grid,

  .card-container,

  .gallery,

  .services,

  .row {

    flex-direction: column;

  }

}