/* ============ Design tokens ============ */
:root{
  --primary:#2E7D32;
  --primary-dark:#1F5B24;
  --secondary:#4CAF50;
  --accent:#F57C00;
  --accent-dark:#D96800;
  --highlight:#FFB74D;
  --text:#111111;
  --text-soft:#424242;
  --bg:#FFFFFF;
  --section-bg:#F8F8F8;
  --header-bg:#d4e39a;
  --border:#e4e4e0;
  --serif:'Fraunces',Georgia,serif;
  --sans:'Public Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --radius:4px;
  --max:1180px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --text:#EDEDE9; --text-soft:#C7C7C0;
    --bg:#14170F; --section-bg:#1B1F14;
    --border:#2B2F22;
  }
}
:root[data-theme="dark"]{
  --text:#EDEDE9; --text-soft:#C7C7C0;
  --bg:#14170F; --section-bg:#1B1F14;
  --border:#2B2F22;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:var(--sans); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit;}
h1,h2,h3,h4{font-family:var(--serif); font-weight:600; margin:0 0 .5em; line-height:1.15; letter-spacing:-0.01em;}
h1{font-size:clamp(2.1rem,4.5vw,3.4rem); font-weight:600;}
h2{font-size:clamp(1.6rem,3vw,2.3rem);}
h3{font-size:1.25rem;}
p{margin:0 0 1em; max-width:70ch;}
.container{max-width:var(--max); margin:0 auto; padding:0 24px;}
button{font-family:var(--sans); cursor:pointer;}
:focus-visible{outline:3px solid var(--accent); outline-offset:2px;}
@media (prefers-reduced-motion: reduce){ *{animation:none !important; transition:none !important;} html{scroll-behavior:auto;} }

/* ============ Header ============ */
.site-header{
  position:sticky; top:0; z-index:60; background:var(--header-bg);
  border-bottom:1px solid rgba(0,0,0,.08);
}
.header-inner{display:flex; align-items:center; justify-content:space-between; gap:20px; padding:10px 24px; max-width:var(--max); margin:0 auto;}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none;}
.brand img{height:42px; width:auto;}
.main-nav{display:flex; align-items:center; gap:2px;}
.main-nav a, .nav-btn{
  font-size:.94rem; font-weight:600; color:#1b3a10; text-decoration:none;
  padding:10px 14px; border-radius:var(--radius); background:transparent; border:none;
  font-family:var(--sans);
}
.main-nav a:hover, .nav-btn:hover{ background:rgba(46,125,50,.14); }
.main-nav a.active{ background:rgba(46,125,50,.2); }
.has-dropdown{position:relative;}
.dropdown-panel{
  position:absolute; top:calc(100% + 6px); left:0; background:var(--bg); color:var(--text);
  min-width:250px; border:1px solid var(--border); border-radius:8px;
  box-shadow:0 12px 28px rgba(0,0,0,.14); padding:8px; display:none; z-index:70;
}
.has-dropdown:hover .dropdown-panel, .has-dropdown:focus-within .dropdown-panel{display:block;}
.dropdown-panel a{display:block; padding:9px 12px; border-radius:6px; font-size:.92rem; font-weight:500; text-decoration:none; color:var(--text-soft);}
.dropdown-panel a:hover{background:var(--section-bg); color:var(--primary-dark);}
.dropdown-panel .dd-count{color:var(--accent); font-weight:700; font-size:.78rem; margin-left:6px;}
.header-cta{
  display:inline-flex; align-items:center; gap:8px; background:var(--accent); color:#fff;
  padding:10px 18px; border-radius:24px; font-weight:700; font-size:.88rem; text-decoration:none;
  white-space:nowrap;
}
.header-cta:hover{background:var(--accent-dark);}
.burger{display:none; background:none; border:none; padding:8px;}
.burger span{display:block; width:24px; height:2px; background:#1b3a10; margin:5px 0;}

@media (max-width:960px){
  .main-nav{display:none; position:absolute; top:100%; left:0; right:0; background:var(--header-bg);
    flex-direction:column; align-items:stretch; padding:8px 16px 16px; box-shadow:0 12px 20px rgba(0,0,0,.12);}
  .main-nav.open{display:flex;}
  .has-dropdown .dropdown-panel{position:static; box-shadow:none; display:none; margin-top:4px;}
  .has-dropdown.open .dropdown-panel{display:block;}
  .burger{display:block;}
  .header-cta{display:none;}
}

/* ============ Buttons ============ */
.btn{
  display:inline-flex; align-items:center; gap:8px; padding:13px 24px; border-radius:26px;
  font-weight:700; font-size:.95rem; text-decoration:none; border:2px solid transparent; transition:transform .15s ease, background .15s ease;
}
.btn-primary{ background:var(--accent); color:#fff; }
.btn-primary:hover{ background:var(--accent-dark); transform:translateY(-1px); }
.btn-outline{ background:transparent; color:var(--primary-dark); border-color:var(--primary); }
.btn-outline:hover{ background:var(--primary); color:#fff; }
.btn-ghost{ background:var(--section-bg); color:var(--text); border-color:var(--border);}
.btn-ghost:hover{ background:var(--border); }
.btn-sm{padding:9px 16px; font-size:.82rem;}
.btn[disabled]{opacity:.45; pointer-events:none;}

/* ============ Sections ============ */
section{padding:76px 0;}
.section-alt{background:var(--section-bg);}
.eyebrow-note{color:var(--accent-dark); font-weight:700; font-size:.8rem; margin-bottom:10px;}
.section-head{max-width:640px; margin-bottom:44px;}
.section-head p{color:var(--text-soft);}

/* ============ Hero ============ */
.hero{
  position:relative; overflow:hidden; padding:64px 0 88px;
  background:linear-gradient(180deg,#eef6e2 0%, var(--bg) 100%);
}
.hero-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center;}
.hero h1{color:var(--primary-dark); margin-bottom:22px;}
.hero .lede{font-size:1.15rem; color:var(--text-soft); max-width:52ch;}
.hero-actions{display:flex; gap:14px; margin-top:30px; flex-wrap:wrap;}
.hero-stats{display:flex; gap:28px; margin-top:40px; flex-wrap:wrap;}
.hero-stat b{display:block; font-family:var(--serif); font-size:1.7rem; color:var(--primary-dark);}
.hero-stat span{font-size:.82rem; color:var(--text-soft);}
.hero-photo{position:relative; border-radius:14px; overflow:hidden; box-shadow:0 24px 48px rgba(31,91,36,.22); aspect-ratio:1/1;}
.hero-photo img{width:100%; height:100%; object-fit:cover;}
.hero-photo-tag{
  position:absolute; bottom:16px; left:16px; background:rgba(255,255,255,.94); color:var(--primary-dark);
  padding:9px 14px; border-radius:8px; font-size:.82rem; font-weight:700;
}
@media (max-width:860px){ .hero-grid{grid-template-columns:1fr;} .hero-photo{max-width:420px;} }

/* ============ Cards ============ */
.grid{display:grid; gap:22px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
@media (max-width:860px){ .grid-2,.grid-3,.grid-4{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;} }

.info-card{ background:var(--bg); border:1px solid var(--border); border-radius:10px; padding:26px; }
.info-card.tone-primary{ border-top:3px solid var(--primary); }
.info-card.tone-accent{ border-top:3px solid var(--accent); }
.info-card h3{margin-bottom:10px; font-size:1.08rem;}
.info-card p{color:var(--text-soft); font-size:.94rem; margin-bottom:0;}

/* Category cards */
.cat-card{
  display:flex; flex-direction:column; background:var(--bg); border:1px solid var(--border);
  border-radius:12px; overflow:hidden; text-decoration:none; color:var(--text);
}
.cat-card .cat-swatch{height:8px;}
.cat-card .cat-body{padding:24px;}
.cat-card h3{margin-bottom:6px;}
.cat-card p{color:var(--text-soft); font-size:.92rem; margin-bottom:14px;}
.cat-card .cat-count{font-size:.78rem; font-weight:700; color:var(--accent-dark);}
.cat-card:hover{box-shadow:0 14px 30px rgba(0,0,0,.09);}

/* ============ Signature / featured products ============ */
.signature-section{ background:linear-gradient(180deg,#fff 0%, #fbf3e6 100%); }
.signature-grid{grid-template-columns:repeat(4,1fr);}
@media (max-width:960px){ .signature-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .signature-grid{grid-template-columns:1fr;} }
.signature-card{
  background:var(--bg); border:1px solid var(--border); border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column; box-shadow:0 10px 26px rgba(31,91,36,.08);
}
.signature-photo{display:block; aspect-ratio:4/5; overflow:hidden; background:var(--section-bg);}
.signature-photo img{width:100%; height:100%; object-fit:cover; transition:transform .35s ease;}
.signature-card:hover .signature-photo img{transform:scale(1.05);}
.signature-body{padding:20px 20px 22px; display:flex; flex-direction:column; gap:8px;}
.signature-body h3{font-size:1.12rem; margin-bottom:0;}
.signature-body p{font-size:.88rem; color:var(--text-soft); margin-bottom:2px;}
.featured-tag{
  display:inline-flex; align-self:flex-start; align-items:center; gap:5px; background:var(--accent); color:#fff;
  font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:5px 10px; border-radius:12px;
}
a.thumb-wrap{position:relative;}
.product-card .thumb-wrap .featured-tag{ position:absolute; top:10px; left:10px; z-index:2; }
.product-card.is-featured{ border-color:var(--accent); box-shadow:0 8px 20px rgba(245,124,0,.1); }
.gallery-item .featured-tag-sm{ position:absolute; top:8px; left:8px; z-index:2; font-size:.62rem; padding:4px 8px; }
.gallery-item.is-featured{ border-color:var(--accent); }

/* Product cards */
.product-card{
  background:var(--bg); border:1px solid var(--border); border-radius:12px; overflow:hidden;
  display:flex; flex-direction:column;
}
.product-card .thumb-wrap{aspect-ratio:1/1; overflow:hidden; background:var(--section-bg);}
.product-card .thumb-wrap img{width:100%; height:100%; object-fit:cover;}
.product-card .card-body{padding:18px 18px 20px; display:flex; flex-direction:column; gap:8px; flex:1;}
.product-card .cat-tag{font-size:.72rem; font-weight:700; color:var(--primary-dark); text-transform:uppercase; letter-spacing:.03em;}
.product-card h3{font-size:1.02rem; margin-bottom:2px;}
.product-card p{font-size:.86rem; color:var(--text-soft); flex:1;}
.product-card .card-actions{display:flex; gap:8px; margin-top:8px; flex-wrap:wrap;}

/* ============ Process steps ============ */
.steps{display:flex; flex-direction:column; gap:0; border-left:2px solid var(--border); margin-left:20px;}
.step{position:relative; padding:0 0 40px 34px;}
.step:last-child{padding-bottom:4px;}
.step .num{
  position:absolute; left:-21px; top:0; width:40px; height:40px; border-radius:50%;
  background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center;
  font-family:var(--serif); font-weight:700; font-size:1.05rem;
}
.step h3{margin-bottom:6px;}
.step p{color:var(--text-soft); margin-bottom:0;}

/* ============ Tables ============ */
.data-table{width:100%; border-collapse:collapse; font-size:.92rem;}
.data-table th,.data-table td{text-align:left; padding:13px 16px; border-bottom:1px solid var(--border); vertical-align:top;}
.data-table th{width:30%; color:var(--primary-dark); font-weight:700; background:var(--section-bg);}
.table-wrap{overflow-x:auto; border:1px solid var(--border); border-radius:10px;}
.table-wrap .data-table{margin:0;}
.table-wrap th,.table-wrap td{border-bottom:1px solid var(--border);}

/* ============ Product detail ============ */
.breadcrumb{font-size:.85rem; color:var(--text-soft); margin-bottom:22px;}
.breadcrumb a{text-decoration:none; color:var(--primary-dark); font-weight:600;}
.product-hero{display:grid; grid-template-columns:.85fr 1.15fr; gap:48px; align-items:flex-start;}
.product-hero .photo{border-radius:12px; overflow:hidden; border:1px solid var(--border); cursor:zoom-in; position:relative;}
.product-hero .photo img{width:100%;}
.product-hero .photo .zoom-hint{position:absolute; bottom:10px; right:10px; background:rgba(17,17,17,.68); color:#fff; font-size:.72rem; padding:5px 10px; border-radius:14px;}
.pd-hs{display:inline-block; font-size:.76rem; font-weight:700; background:var(--section-bg); color:var(--text-soft); padding:4px 10px; border-radius:12px; margin-bottom:10px;}
.pd-botanical{font-style:italic; color:var(--text-soft); margin-bottom:16px; font-size:.94rem;}
.pd-actions{display:flex; gap:10px; flex-wrap:wrap; margin:22px 0 8px;}
.pd-meta{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:26px; padding-top:22px; border-top:1px solid var(--border);}
.pd-meta div b{display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; color:var(--accent-dark); margin-bottom:4px;}
.pd-meta div span{font-size:.9rem; color:var(--text);}
@media (max-width:860px){ .product-hero{grid-template-columns:1fr;} .pd-meta{grid-template-columns:1fr 1fr;} }

.spec-list{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:10px 20px;}
.spec-list li{font-size:.92rem; padding:10px 0 10px 18px; border-bottom:1px solid var(--border); position:relative;}
.spec-list li::before{content:""; position:absolute; left:0; top:16px; width:7px; height:7px; border-radius:50%; background:var(--secondary);}
@media (max-width:600px){.spec-list{grid-template-columns:1fr;}}

.faq-item{border-bottom:1px solid var(--border);}
.faq-q{
  width:100%; text-align:left; background:none; border:none; padding:18px 4px; display:flex;
  justify-content:space-between; align-items:center; font-weight:700; font-size:.98rem; color:var(--text);
}
.faq-q .plus{font-family:var(--serif); font-size:1.3rem; color:var(--accent); transition:transform .2s ease;}
.faq-item[data-open="true"] .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .25s ease;}
.faq-item[data-open="true"] .faq-a{max-height:400px;}
.faq-a p{padding:0 4px 18px; color:var(--text-soft); font-size:.93rem;}

.related-strip{display:flex; gap:16px; overflow-x:auto; padding-bottom:8px;}
.related-strip .product-card{min-width:220px;}

/* ============ WhatsApp CTA banner ============ */
.wa-banner{
  background:var(--primary); color:#fff; border-radius:14px; padding:28px 30px;
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.wa-banner p{color:rgba(255,255,255,.86); margin:4px 0 0;}
.wa-banner h3{color:#fff; margin:0;}
.wa-banner .btn-primary{background:#fff; color:var(--primary-dark);}
.wa-banner .btn-primary:hover{background:var(--highlight); color:#1b3a10;}

/* Floating WA button */
.wa-float{
  position:fixed; right:20px; bottom:20px; z-index:80; background:#25D366; color:#fff;
  width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  text-decoration:none; box-shadow:0 10px 24px rgba(0,0,0,.25);
}
.wa-float svg{width:28px; height:28px;}

/* ============ Filters (products index) ============ */
.filter-row{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:34px;}
.filter-chip{
  border:1px solid var(--border); background:var(--bg); padding:9px 16px; border-radius:20px;
  font-size:.86rem; font-weight:600; color:var(--text-soft);
}
.filter-chip.active{background:var(--primary); border-color:var(--primary); color:#fff;}
.cat-group-title{display:flex; align-items:baseline; gap:10px; margin:48px 0 20px;}
.cat-group-title:first-child{margin-top:0;}
.cat-group-title span{font-size:.82rem; color:var(--text-soft); font-weight:600;}

/* ============ Gallery ============ */
.gallery-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:12px;}
@media (max-width:900px){.gallery-grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:560px){.gallery-grid{grid-template-columns:repeat(2,1fr);}}
.gallery-item{aspect-ratio:1/1; border-radius:8px; overflow:hidden; cursor:zoom-in; border:1px solid var(--border); position:relative; background:var(--section-bg);}
.gallery-item img{width:100%; height:100%; object-fit:cover; transition:transform .3s ease;}
.gallery-item:hover img{transform:scale(1.06);}
.gallery-item .g-label{position:absolute; left:0; right:0; bottom:0; padding:8px 10px 6px; font-size:.72rem; font-weight:700; color:#fff;
  background:linear-gradient(0deg, rgba(0,0,0,.66), rgba(0,0,0,0)); }

.lightbox{position:fixed; inset:0; background:rgba(10,14,8,.92); z-index:100; display:flex; align-items:center; justify-content:center; padding:30px;}
.lightbox[hidden]{display:none;}
.lightbox-inner{max-width:900px; width:100%; text-align:center;}
.lightbox img{max-height:74vh; margin:0 auto; border-radius:8px; width:auto; max-width:100%;}
.lightbox .lb-cap{color:#fff; margin-top:14px; font-size:.95rem;}
.lightbox .lb-close{position:absolute; top:18px; right:24px; background:none; border:none; color:#fff; font-size:2rem; line-height:1;}
.lightbox .lb-nav{position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.14); border:none; color:#fff; width:46px; height:46px; border-radius:50%; font-size:1.4rem;}
.lightbox .lb-prev{left:18px;} .lightbox .lb-next{right:18px;}
.lightbox .lb-actions{margin-top:16px; display:flex; gap:10px; justify-content:center;}

/* ============ Forms ============ */
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.form-grid .full{grid-column:1/-1;}
@media (max-width:700px){.form-grid{grid-template-columns:1fr;}}
label{display:block; font-size:.84rem; font-weight:700; color:var(--text-soft); margin-bottom:6px;}
input,select,textarea{
  width:100%; padding:12px 14px; border:1px solid var(--border); border-radius:8px; font-family:var(--sans);
  font-size:.95rem; background:var(--bg); color:var(--text);
}
input:focus,select:focus,textarea:focus{border-color:var(--primary); outline:none; box-shadow:0 0 0 3px rgba(46,125,50,.15);}
textarea{resize:vertical; min-height:110px;}
.form-note{font-size:.8rem; color:var(--text-soft); margin-top:14px;}
.form-success{background:#eaf6ea; border:1px solid var(--secondary); color:var(--primary-dark); padding:16px 18px; border-radius:10px; margin-top:18px; display:none; font-size:.92rem;}
.form-success.show{display:block;}

/* ============ Footer ============ */
.site-footer{background:#173015; color:#e7efe0; padding:56px 0 24px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:36px;}
.site-footer h4{color:#fff; font-family:var(--sans); font-size:.88rem; text-transform:uppercase; letter-spacing:.05em; margin-bottom:16px;}
.site-footer p, .site-footer li{color:#b9c9ae; font-size:.9rem;}
.site-footer ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:9px;}
.site-footer a{color:#d9e6cf; text-decoration:none;}
.site-footer a:hover{color:#fff;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12); margin-top:40px; padding-top:20px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.8rem; color:#93a487;}
.footer-logo{height:38px; margin-bottom:14px;}
@media (max-width:860px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr;}}

/* ============ Misc ============ */
.toc-mini{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:40px;}
.toc-mini a{font-size:.83rem; font-weight:600; padding:8px 14px; border:1px solid var(--border); border-radius:18px; text-decoration:none; color:var(--text-soft);}
.toc-mini a:hover{border-color:var(--primary); color:var(--primary-dark);}
.quote-block{border-left:4px solid var(--accent); background:var(--section-bg); padding:18px 22px; border-radius:0 10px 10px 0; font-style:italic; color:var(--text-soft);}
.badge{display:inline-flex; align-items:center; gap:6px; font-size:.78rem; font-weight:700; background:var(--section-bg); color:var(--primary-dark); padding:6px 12px; border-radius:14px;}
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:40px;}
@media (max-width:860px){.two-col{grid-template-columns:1fr;}}
.page-hero{padding:52px 0 20px;}
.page-hero .eyebrow-note{margin-bottom:12px;}
.empty-state{text-align:center; padding:60px 20px; color:var(--text-soft);}

/* ============ Multi-page extras ============ */
.skip-link{position:absolute; left:-999px; top:0; background:var(--primary); color:#fff; padding:10px 16px; z-index:200;}
.skip-link:focus{left:10px; top:10px;}
.single-zoom{position:fixed; inset:0; background:rgba(10,14,8,.92); z-index:100; display:flex; align-items:center; justify-content:center; padding:30px;}
.single-zoom[hidden]{display:none;}
.single-zoom img{max-height:88vh; max-width:100%; border-radius:8px;}
.single-zoom .lb-close{position:absolute; top:18px; right:24px; background:none; border:none; color:#fff; font-size:2rem; line-height:1;}

/* ============ Original image download UI ============ */
.orig-photo-note{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:10px;
  font-size:.8rem; color:var(--text-soft);
}
.orig-photo-note span{ font-weight:600; }
.orig-photo-note a{ color:var(--primary-dark); font-weight:700; text-decoration:none; }
.orig-photo-note a:hover{ text-decoration:underline; }
.lb-info{ color:rgba(255,255,255,.7); font-size:.82rem; margin-top:4px; }

/* ============ Site-wide banner ============ */
.site-banner{
  width:100% !important; height:clamp(140px, 24vw, 320px) !important; position:relative !important; overflow:hidden !important;
  background-color:var(--section-bg);
  background-size:cover !important; background-position:center center !important; background-repeat:no-repeat !important;
}
.site-banner .banner-tag{
  position:absolute; left:20px; bottom:16px; background:rgba(255,255,255,.94); color:var(--primary-dark);
  padding:8px 16px; border-radius:8px; font-weight:700; font-size:.82rem; line-height:1.3; box-shadow:0 6px 16px rgba(0,0,0,.12);
  z-index:2;
}
@media (max-width:560px){ .site-banner .banner-tag{ font-size:.72rem; padding:6px 12px; left:12px; bottom:10px; } }