/* ============================================================
   HOME PAGE
   ============================================================ */

.hero{
  position:relative;
  min-height:560px;
  display:flex;
  align-items:center;
  background:
    linear-gradient(120deg, rgba(8,81,42,.88) 0%, rgba(11,110,54,.72) 55%, rgba(232,169,59,.55) 130%),
    url("https://images.unsplash.com/photo-1542838132-92c53300491e?auto=format&fit=crop&w=1600&q=80") center/cover;
  color:var(--white);
  overflow:hidden;
}
.hero::after{
  /* torn-canopy edge, echoes a market stall awning */
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:34px;
  background:var(--cream);
  clip-path:polygon(
    0% 100%, 0% 40%, 4% 100%, 8% 40%, 12% 100%, 16% 40%, 20% 100%, 24% 40%,
    28% 100%, 32% 40%, 36% 100%, 40% 40%, 44% 100%, 48% 40%, 52% 100%, 56% 40%,
    60% 100%, 64% 40%, 68% 100%, 72% 40%, 76% 100%, 80% 40%, 84% 100%, 88% 40%,
    92% 100%, 96% 40%, 100% 100%, 100% 100%
  );
}
.hero .container{
  position:relative;
  z-index:2;
  padding-top:40px;
  padding-bottom:60px;
  max-width:640px;
}
.hero .eyebrow{ background:rgba(255,255,255,.16); color:var(--cream); }
.hero .eyebrow::before{ background:var(--amber); }
.hero h1{
  color:var(--white);
  font-size:52px;
  font-weight:800;
  letter-spacing:-.01em;
}
.hero p.lede{
  margin-top:16px;
  font-size:17px;
  color:rgba(255,255,255,.86);
  max-width:480px;
}
.hero .hero-actions{
  display:flex;
  gap:14px;
  margin-top:32px;
  flex-wrap:wrap;
}
.hero .stat-strip{
  display:flex;
  gap:32px;
  margin-top:46px;
  flex-wrap:wrap;
}
.hero .stat-strip div{ font-family:var(--font-mono); }
.hero .stat-strip strong{
  display:block;
  font-size:24px;
  color:var(--amber);
}
.hero .stat-strip span{
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(255,255,255,.7);
}

/* ---- suppliers strip (home teaser) ---- */
.supplier-strip{
  background:var(--white);
}
.supplier-marquee{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  justify-content:center;
}
.supplier-chip{
  background:var(--cream);
  border:1px solid #EAE2CC;
  border-left:5px solid var(--amber);
  border-radius:8px;
  padding:12px 18px;
  font-weight:600;
  font-size:14px;
}

/* ---- why-us strip ---- */
.why-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(230px,1fr));
  gap:26px;
}
.why-card{
  padding:26px;
  border-radius:var(--radius);
  background:var(--white);
  box-shadow:var(--shadow-sm);
}
.why-card .icon{
  width:44px; height:44px;
  border-radius:12px;
  background:var(--green-deep);
  color:var(--white);
  display:flex; align-items:center; justify-content:center;
  font-size:19px;
  margin-bottom:16px;
}
.why-card h3{ font-size:16.5px; margin-bottom:8px; }
.why-card p{ font-size:14px; color:var(--charcoal-60); }

@media (max-width:600px){
  .hero h1{ font-size:36px; }
  .hero{ min-height:auto; padding-bottom:20px; }
}