:root {
  --forest: #1d6a44;
  --forest-deep: #123c27;
  --lime: #8ed17a;
  --navy: #22305e;
  --cream: #f6fbf5;
  --card: #fff;
  --ink: #1f2a22;
  --muted: #647166;
  --line: #e1ede0;
  --radius: 1.2rem;
  --shadow: 0 20px 42px -26px rgba(18,60,39,.4);
  --display: 'Baloo 2', 'Montserrat', sans-serif;
}
html { scroll-behavior: smooth; }
body { background: var(--cream); -webkit-font-smoothing: antialiased; }
section[id] { scroll-margin-top: 110px; }
.section-title, .hero-title { font-family: var(--display); }

/* Header: already light, refine */
header { background: rgba(246,251,245,.95); backdrop-filter: blur(6px); box-shadow: none; border-bottom: 3px solid var(--forest); }
.nav { padding: .8rem 1.5rem; }
.logo-block img { width: 42px; height: 42px; border-radius: 50%; }
.logo-text { font-family: var(--display); font-size: 1.1rem; letter-spacing: .01em; color: var(--forest-deep); line-height: 1.2; }
.nav-links a { font-weight: 700; font-size: .86rem; color: var(--ink); }
.nav-links a.active, .nav-links a:hover { color: var(--forest); }

main .container { max-width: 1180px; }
main section[id], #aboutus, #productsservices, #deliveryinfo, #faq, #contact, #testimonials { margin-top: clamp(3.2rem, 7vw, 5.5rem); margin-bottom: 0; }
.section-title { font-size: clamp(1.8rem, 3.6vw, 2.6rem); color: var(--forest-deep); margin-bottom: 1.2rem; }

/* Hero: bold green (overriding original light hero) */
.hero-section {
  background: linear-gradient(145deg, var(--forest) 0%, var(--forest-deep) 100%) !important; color: #e3f3e7;
  margin-top: 1.6rem !important; box-shadow: var(--shadow) !important;
}
.hero-section::before { background: var(--lime) !important; opacity: .25 !important; }
.hero-title { color: #fff !important; font-size: clamp(2rem, 4vw, 3rem) !important; }
.hero-desc { color: var(--lime) !important; font-weight: 700; }
.hero-tagline { color: #d9efdc; }

/* Section bodies -> cards */
#aboutus .section-content, #productsservices .section-content, #deliveryinfo .section-content, #faq .section-content {
  background: var(--card); border: 1px solid var(--line); border-radius: 1.6rem; padding: clamp(1.8rem,4vw,3rem);
}
.section-content strong { color: var(--forest); }
.section-content ul { margin: .5rem 0 1rem 1.2rem; }

/* Products */
.products-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.1rem; margin-top: 1.4rem; }
.product-card { background: var(--card); border: none; border-radius: 1.1rem; box-shadow: var(--shadow); padding: 0 0 1.1rem; overflow: hidden; transition: transform .2s; }
.product-card:hover { transform: translateY(-5px); }
.product-card img { width: 100%; height: 130px; object-fit: contain; background: var(--cream); padding: .7rem; margin-bottom: .7rem; }
.product-title { font-family: var(--display); color: var(--forest-deep); font-weight: 700; font-size: .92rem; padding: 0 .8rem; }
.product-desc { color: var(--muted); font-size: .76rem; padding: .25rem .8rem 0; }
.product-meta { color: var(--muted); font-size: .72rem; padding: .35rem .8rem .7rem; }
.add-cart-btn { margin: 0 .8rem; width: calc(100% - 1.6rem); background: var(--forest); color: #fff; border: none; border-radius: 999px; padding: .6rem; font-weight: 700; font-size: .82rem; cursor: pointer; }
.add-cart-btn:hover { background: var(--navy); }

/* Contact / testimonials strong links already colored via inline style
   using --primary/--secondary which still map sensibly; just restyle
   the containers */
#contact .section-content, #testimonials .section-content { background: var(--navy); color: #dbe4f3; border-radius: 1.6rem; padding: clamp(1.8rem,4vw,3rem); border: none; }
#contact .section-content strong, #testimonials .section-content strong { color: var(--lime); }
#testimonials .section-content li { margin-bottom: .8rem; list-style: none; background: rgba(255,255,255,.06); border-radius: .8rem; padding: .8rem 1rem; }

footer { background: var(--forest-deep); border-radius: 1.8rem 1.8rem 0 0; }

@media (max-width: 1000px) {
  .products-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .products-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } * { transition: none !important; } }
