@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,700;0,900;1,400&family=Lato:wght@400;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

:root {
  --bg-primary:    #e8f0e8;
  --bg-secondary:  #d8e8d8;
  --bg-card:       #ffffff;
  --accent:        #1a5c1a;
  --accent-dim:    #104010;
  --accent-light:  #2a8a2a;
  --accent-pale:   #4db84d;
  --text-primary:  #0a180a;
  --text-secondary:#142814;
  --text-body:     #1c381c;
  --text-muted:    #2a5a2a;
  --border:        #7aab7a;
  --nav-bg:        rgba(220,238,220,0.98);
  --footer-bg:     #07120a;
  --glow:          0 4px 24px rgba(26,92,26,0.25);
  --glow-strong:   0 6px 40px rgba(26,92,26,0.35);
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body {
  font-family:'Lato',sans-serif;
  background: var(--bg-primary);
  color: var(--text-primary);
  overflow-x:hidden;
  font-size: 16px;
  line-height: 1.6;
}

/* NAV */
nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background: var(--nav-bg);
  border-bottom: 2px solid var(--border);
  padding:0 2rem; height:70px;
  display:flex; align-items:center; justify-content:space-between;
  box-shadow: 0 2px 16px rgba(26,92,26,0.15);
}
.nav-logo-wrap { display:flex; align-items:center; gap:0.6rem; text-decoration:none; }
.nav-logo-wrap img { height:42px; width:auto; object-fit:contain; }
.nav-logo-text {
  font-family:'Playfair Display',serif;
  font-size:0.95rem; font-weight:700;
  color: var(--accent); line-height:1.2;
}
.nav-logo-text span { color: #0a180a; display:block; font-size:0.82rem; }

/* keep legacy .nav-logo class working too */
.nav-logo {
  font-family:'Playfair Display',serif;
  font-size:0.95rem; font-weight:700;
  color: var(--accent); text-decoration:none; line-height:1.2;
}
.nav-logo span { color:#0a180a; }

.nav-links { display:flex; align-items:center; gap:2rem; list-style:none; }
.nav-links a {
  font-family:'Space Grotesk',sans-serif;
  font-weight:700; font-size:0.9rem;
  color: #0a280a;
  text-decoration:none; letter-spacing:0.04em;
  text-transform:uppercase; transition:color 0.2s;
}
.nav-links a:hover { color:var(--accent); }
.nav-cta {
  background:var(--accent) !important; color:#fff !important;
  padding:0.5rem 1.2rem; border-radius:6px; font-weight:700 !important;
}
.nav-cta:hover { background:var(--accent-dim) !important; }

/* BUTTONS */
.btn-primary {
  display:inline-block; background:var(--accent); color:#fff;
  padding:0.9rem 2.2rem; border-radius:6px;
  font-family:'Space Grotesk',sans-serif; font-weight:700;
  font-size:0.95rem; letter-spacing:0.05em;
  text-decoration:none; text-transform:uppercase;
  transition:all 0.25s; border:2px solid var(--accent); cursor:pointer;
}
.btn-primary:hover { background:var(--accent-dim); box-shadow:var(--glow-strong); transform:translateY(-2px); }

.btn-secondary {
  display:inline-block; background:transparent; color:var(--accent);
  padding:0.9rem 2.2rem; border-radius:6px;
  font-family:'Space Grotesk',sans-serif; font-weight:700;
  font-size:0.95rem; letter-spacing:0.05em;
  text-decoration:none; text-transform:uppercase;
  transition:all 0.25s; border:2px solid var(--accent); cursor:pointer;
}
.btn-secondary:hover { background:var(--accent); color:#fff; }

.section-label {
  font-family:'Space Grotesk',sans-serif;
  font-size:0.75rem; color:var(--accent);
  letter-spacing:0.3em; text-transform:uppercase;
  margin-bottom:0.75rem; font-weight:700;
}

/* FOOTER */
footer {
  background:var(--footer-bg);
  border-top:2px solid #1a4a1a;
  padding:3.5rem 2rem 1.5rem;
  position:relative; z-index:1;
}
.footer-inner { max-width:1100px; margin:0 auto; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:3rem; margin-bottom:2.5rem; }
.footer-brand p { margin-top:1rem; font-size:0.92rem; color:#c8e8c8; line-height:1.8; font-weight:500; }
.footer-col h4 {
  font-family:'Space Grotesk',sans-serif; font-size:0.72rem;
  color:#a8e0a8; letter-spacing:0.2em; text-transform:uppercase;
  margin-bottom:1rem; font-weight:700;
}
.footer-col a { display:block; color:#c8e8c8; text-decoration:none; font-size:0.92rem; margin-bottom:0.5rem; font-weight:500; }
.footer-col a:hover { color:#ffffff; }
.footer-col p { color:#c8e8c8; font-size:0.92rem; margin-bottom:0.4rem; font-weight:500; }
.footer-bottom { border-top:1px solid #1a4a1a; padding-top:1.5rem; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.footer-bottom p { font-size:0.85rem; color:#a8c8a8; font-weight:500; }

/* PRODUCT CARD */
.product-card {
  background:#fff; border:2px solid var(--border); border-radius:16px;
  overflow:hidden; box-shadow:0 4px 20px rgba(26,92,26,0.12);
  transition:all 0.3s; position:relative;
}
.product-card:hover { transform:translateY(-6px); box-shadow:0 16px 48px rgba(26,92,26,0.22); border-color:var(--accent); }
.product-badge { position:absolute; top:16px; left:16px; background:var(--accent); color:#fff; font-size:0.72rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; padding:0.35rem 0.9rem; border-radius:100px; }
.product-img-wrap { background:linear-gradient(135deg,#8ec88e,#70b070); padding:1.5rem; display:flex; justify-content:center; }
.product-img-wrap img { width:180px; border-radius:10px; box-shadow:0 8px 32px rgba(26,92,26,0.3); object-fit:contain; height:260px; }
.product-body { padding:2rem; }
.product-body h3 { font-family:'Playfair Display',serif; font-size:1.3rem; font-weight:700; color:#0a180a; margin-bottom:0.5rem; }
.product-price { font-size:2rem; font-weight:800; color:var(--accent); margin-bottom:1rem; font-family:'Space Grotesk',sans-serif; }
.product-price span { font-size:1rem; color:#2a5a2a; font-weight:600; }
.product-features { list-style:none; margin-bottom:1.5rem; }
.product-features li { font-size:0.92rem; color:#142814; padding:0.38rem 0; padding-left:1.5rem; position:relative; font-weight:600; line-height:1.5; }
.product-features li::before { content:'✓'; position:absolute; left:0; color:var(--accent-light); font-weight:700; }
.payment-icons { display:flex; align-items:center; gap:0.6rem; margin-top:0.8rem; justify-content:center; }
.payment-icons img { height:28px; width:auto; object-fit:contain; opacity:0.92; }

section { position:relative; z-index:1; }
main { padding-top:70px; }

/* HAMBURGER */
.nav-hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; }
.nav-hamburger span { display:block; width:24px; height:2px; background:var(--accent); }

@media (max-width:768px) {
  .nav-hamburger { display:flex; }
  .nav-links { display:none; position:absolute; top:70px; left:0; right:0; background:var(--nav-bg); flex-direction:column; padding:1.5rem 2rem; gap:1.2rem; border-bottom:2px solid var(--border); }
  .nav-links.open { display:flex; }
  .footer-grid { grid-template-columns:1fr; gap:2rem; }
}
