
:root{
  --green-deep:#16321F; --green-mid:#2F5233; --green-line:#3E6B45;
  --gold:#C99A3B; --soil:#6B4A32; --rose:#B96B7C; --rose-tint:#F6E9EB;
  --paper:#F6F3EC; --paper-2:#EFEADD; --ink:#211F1B; --ink-soft:#4A473F;
  --card:#FFFFFF; --line:#DAD4C2; --radius:2px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#15140F; --paper-2:#1B1A14; --ink:#EFEAE0; --ink-soft:#C8C2B3;
    --card:#1F1E17; --line:#33321F; --rose-tint:#2A1E20;
  }
}
:root[data-theme="dark"]{
  --paper:#15140F; --paper-2:#1B1A14; --ink:#EFEAE0; --ink-soft:#C8C2B3;
  --card:#1F1E17; --line:#33321F; --rose-tint:#2A1E20;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--paper); color:var(--ink); font-family:'Work Sans', sans-serif; font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
h1,h2,h3,h4{font-family:'Fraunces', serif; font-weight:600; line-height:1.15; color:var(--green-deep); text-wrap:balance;}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) h1,:root:not([data-theme="light"]) h2,:root:not([data-theme="light"]) h3,:root:not([data-theme="light"]) h4{ color:#DDD3A8; } }
:root[data-theme="dark"] h1,:root[data-theme="dark"] h2,:root[data-theme="dark"] h3,:root[data-theme="dark"] h4{ color:#DDD3A8; }
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
.eyebrow{font-size:13px; letter-spacing:.02em; color:var(--soil); font-weight:600;}

header{position:sticky; top:0; z-index:50; background:var(--paper); border-bottom:1px solid var(--line);}
.nav-row{display:flex; align-items:center; justify-content:space-between; padding:12px 28px; max-width:1180px; margin:0 auto;}
.brand img{height:64px; width:64px; object-fit:contain;}
nav ul{list-style:none; display:flex; gap:28px;}
nav a{font-size:15px; font-weight:500; color:var(--ink); padding:4px 0;}
nav a.active{color:var(--green-mid); border-bottom:2px solid var(--gold);}
nav a:hover{color:var(--green-mid);}
.nav-cta{display:flex; align-items:center; gap:14px;}
.btn{display:inline-flex; align-items:center; gap:8px; padding:11px 22px; font-weight:600; font-size:14.5px; border-radius:var(--radius); border:1px solid transparent; cursor:pointer;}
.btn-primary{background:var(--green-deep); color:#F6F3EC;}
.btn-primary:hover{background:var(--green-mid);}
.btn-outline{border-color:var(--green-deep); color:var(--green-deep);}
.btn-outline:hover{background:var(--green-deep); color:#fff;}
.btn-gold{background:var(--gold); color:#2A1F09;}
.btn-rose{background:var(--rose); color:#fff;}
.menu-toggle{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer;}
.menu-toggle span{width:24px; height:2px; background:var(--ink);}

.page-hero{position:relative; height:340px; overflow:hidden;}
.page-hero img{width:100%; height:100%; object-fit:cover;}
.page-hero .scrim{position:absolute; inset:0; background:linear-gradient(100deg, rgba(15,26,17,.86) 0%, rgba(15,26,17,.55) 45%, rgba(15,26,17,.15) 80%);}
.page-hero .content{position:absolute; inset:0; display:flex; align-items:center;}
.page-hero .content .wrap{color:#fff;}
.page-hero h1{color:#fff; font-size:38px; margin-top:10px;}
.page-hero .eyebrow{color:var(--gold);}
.crumb{font-size:13px; color:#CFC9B7; margin-top:10px;}
.crumb a{text-decoration:underline;}

.hero{position:relative; overflow:hidden;}
.hero-media{position:relative; height:78vh; min-height:520px;}
.hero-media img{width:100%; height:100%; object-fit:cover; object-position:center 40%;}
.hero-scrim{position:absolute; inset:0; background:linear-gradient(100deg, rgba(15,26,17,.88) 0%, rgba(15,26,17,.62) 38%, rgba(15,26,17,.12) 68%, rgba(15,26,17,0) 100%);}
.hero-content{position:absolute; left:0; top:0; height:100%; display:flex; align-items:center; max-width:1180px; margin:0 auto; right:0; padding:0 28px;}
.hero-text{max-width:560px; color:#F6F3EC;}
.hero-text .eyebrow{color:var(--gold);}
.hero-text h1{color:#fff; font-size:48px; margin:14px 0 20px; font-weight:600;}
.hero-text p{font-size:17px; color:#E6E2D4; max-width:460px; margin-bottom:30px;}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap;}
.hero-strip{display:flex; border-top:1px solid rgba(255,255,255,.18); background:var(--green-deep);}
.hero-stat{flex:1; padding:18px 28px; border-right:1px solid rgba(255,255,255,.14);}
.hero-stat:last-child{border-right:none;}
.hero-stat b{display:block; font-family:'Fraunces',serif; font-size:22px; color:#fff;}
.hero-stat span{font-size:12.5px; color:#CFC9B7; text-transform:uppercase; letter-spacing:.04em;}

section{padding:88px 0;}
.section-head{max-width:640px; margin-bottom:46px;}
.section-head h2{font-size:34px; margin-top:10px;}
.section-head p{color:var(--ink-soft); margin-top:14px; font-size:16px;}
.furrow{height:1px; background:repeating-linear-gradient(90deg, var(--line) 0 22px, transparent 22px 30px);}

.about{display:grid; grid-template-columns:0.85fr 1.15fr; gap:60px; align-items:center;}
.about-photo{position:relative;}
.about-photo img{border-radius:var(--radius);}
.about-photo .frame-tag{position:absolute; bottom:-18px; left:-18px; background:var(--green-deep); color:#F6F3EC; padding:14px 20px; font-family:'Fraunces',serif; font-size:14px; max-width:220px;}
.about-copy h2{font-size:32px; margin-bottom:18px;}
.about-copy p{color:var(--ink-soft); margin-bottom:16px; max-width:520px;}
.about-points{display:grid; grid-template-columns:1fr 1fr; gap:18px 28px; margin-top:26px;}
.about-points div{border-left:2px solid var(--gold); padding-left:14px;}
.about-points b{display:block; font-family:'Fraunces',serif; font-size:15px; color:var(--green-deep);}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .about-points b{color:#DDD3A8;} }
:root[data-theme="dark"] .about-points b{color:#DDD3A8;}
.about-points span{font-size:13.5px; color:var(--ink-soft);}

.lines{background:var(--paper-2);}
.line-grid{display:grid; grid-template-columns:1fr 1fr; gap:2px; background:var(--line); border:1px solid var(--line);}
.line-card{background:var(--card); padding:0 0 42px;}
.line-card.mulch{border-top:4px solid var(--green-mid);}
.line-card.seeds{border-top:4px solid var(--rose);}
.line-card-img{width:100%; height:210px; object-fit:cover; margin-bottom:24px;}
.line-card-body{padding:0 42px;}
.line-tag{font-size:12.5px; letter-spacing:.06em; text-transform:uppercase; font-weight:700;}
.line-card.mulch .line-tag{color:var(--green-mid);}
.line-card.seeds .line-tag{color:var(--rose);}
.line-card h3{font-size:26px; margin:12px 0 14px;}
.line-card p{color:var(--ink-soft); margin-bottom:22px; max-width:400px;}
.line-card ul{list-style:none; margin-bottom:26px;}
.line-card li{font-size:14.5px; color:var(--ink-soft); padding:8px 0 8px 26px; border-bottom:1px dashed var(--line); position:relative;}
.line-card li:before{content:"✓"; position:absolute; left:0; top:8px; color:var(--gold); font-weight:700;}
.line-card li:last-child{border-bottom:none;}

.layers{display:grid; grid-template-columns:repeat(5,1fr); border:1px solid var(--line); margin-top:10px;}
.layer{padding:26px 18px; border-right:1px solid var(--line); position:relative;}
.layer:last-child{border-right:none;}
.layer .num{font-family:'Fraunces',serif; font-size:13px; color:var(--gold); font-weight:700; display:block; margin-bottom:10px;}
.layer h4{font-size:15px; margin-bottom:8px; min-height:38px;}
.layer p{font-size:13px; color:var(--ink-soft);}

.variant-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:10px;}
.variant{background:var(--card); border:1px solid var(--line); padding:26px;}
.variant .hole-viz{height:64px; margin-bottom:18px; display:flex; align-items:center; gap:8px;}
.dot{width:10px; height:10px; border-radius:50%; background:var(--green-mid);}
.variant h4{font-size:16.5px; margin-bottom:8px;}
.variant p{font-size:13.5px; color:var(--ink-soft);}

.crop-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:10px;}
.crop-card{background:var(--card); border:1px solid var(--line); padding:20px; text-align:center;}
.crop-card svg{width:52px; height:52px; margin:0 auto 12px;}
.crop-card span{font-size:14px; font-weight:600;}

.benefits{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:10px;}
.benefit{background:var(--card); padding:28px 22px;}
.benefit b{font-family:'Fraunces',serif; display:block; font-size:15.5px; margin-bottom:8px; color:var(--green-deep);}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .benefit b{color:#DDD3A8;} }
:root[data-theme="dark"] .benefit b{color:#DDD3A8;}
.benefit span{font-size:13px; color:var(--ink-soft);}

.stock-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:10px;}
.stock-grid img{height:320px; object-fit:cover; width:100%;}

.seeds-sec{background:var(--rose-tint);}
.seeds-inner{display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center;}
.seeds-copy .eyebrow{color:var(--rose);}
.seeds-copy h2{font-size:32px; margin:12px 0 16px;}
.seeds-copy p{color:var(--ink-soft); margin-bottom:14px; max-width:480px;}
.seed-badge{display:inline-flex; align-items:center; gap:10px; background:var(--card); border:1px solid var(--line); padding:10px 16px; margin-top:10px; font-size:13.5px; font-weight:600;}
.seeds-photo img{border-radius:var(--radius);}

.why-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:10px;}
.why-card{background:var(--card); padding:30px 32px; display:flex; gap:18px;}
.why-num{font-family:'Fraunces',serif; font-size:26px; color:var(--gold); font-weight:600; line-height:1;}
.why-card h4{font-size:17px; margin-bottom:8px;}
.why-card p{font-size:14px; color:var(--ink-soft);}

.product-grid{display:grid; grid-template-columns:1fr 1fr; gap:2px; background:var(--line); border:1px solid var(--line); margin-top:10px;}
.product-card{background:var(--card);}
.product-card img{width:100%; height:220px; object-fit:cover;}
.product-card-photos{display:flex; gap:2px;}
.product-card-photos img{height:220px; flex:1; object-fit:cover;}
.product-card-body{padding:26px 30px;}
.product-card h3{font-size:20px; margin-bottom:10px;}
.product-card p{color:var(--ink-soft); font-size:14.5px; margin-bottom:18px;}

.gal-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:10px;}
.gal-grid img{width:100%; height:260px; object-fit:cover;}

.contact{background:var(--green-deep); color:#F1EEE2;}
.contact h2{color:#fff;}
.contact-inner{display:grid; grid-template-columns:1.1fr 0.9fr; gap:60px;}
.contact-copy p{color:#CFC9B7; margin:16px 0 26px; max-width:440px;}
.contact-item{display:flex; gap:14px; padding:16px 0; border-top:1px solid rgba(255,255,255,.14);}
.contact-item:last-child{border-bottom:1px solid rgba(255,255,255,.14);}
.contact-item b{display:block; font-size:14px; color:#fff;}
.contact-item span{font-size:13.5px; color:#B9B29B;}
.form-card{background:#F6F3EC; color:var(--ink); padding:34px; border-radius:var(--radius);}
.form-card h3{margin-bottom:18px; font-size:20px;}
.form-row{margin-bottom:14px;}
.form-row label{display:block; font-size:12.5px; font-weight:600; margin-bottom:6px; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft);}
.form-row input, .form-row select, .form-row textarea{width:100%; padding:11px 14px; border:1px solid var(--line); background:#fff; font-family:inherit; font-size:14.5px; border-radius:2px;}
.form-row textarea{resize:vertical; min-height:80px;}
.map-box{margin-top:40px; height:280px; background:var(--paper-2); border:1px dashed var(--line); display:flex; align-items:center; justify-content:center; color:var(--ink-soft); font-size:14px;}

footer{background:#0F1A11; color:#B9B29B; padding:40px 0 26px; font-size:13.5px;}
.foot-row{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;}
.foot-links{display:flex; gap:22px; flex-wrap:wrap;}
.whatsapp-fab{position:fixed; bottom:26px; right:26px; z-index:60; background:#1F8A46; color:#fff; width:58px; height:58px; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 18px rgba(0,0,0,.28);}

@media (max-width: 900px){
  .nav-row nav{display:none;}
  .nav-cta .btn-outline{display:none;}
  .menu-toggle{display:flex;}
  nav.nav-open{
    display:block !important;
    position:absolute; top:84px; left:0; right:0;
    background:var(--paper); border-bottom:1px solid var(--line);
    padding:10px 28px 22px; z-index:40;
    box-shadow:0 12px 24px rgba(0,0,0,.12);
  }
  nav.nav-open ul{
    display:flex; flex-direction:column; align-items:flex-start; gap:2px;
  }
  nav.nav-open ul li{width:100%;}
  nav.nav-open ul li a{display:block; padding:12px 0; border-bottom:1px solid var(--line); width:100%;}
  nav.nav-open ul li:last-child a{border-bottom:none;}
  .hero-text h1{font-size:34px;}
  .about, .seeds-inner, .contact-inner{grid-template-columns:1fr;}
  .about-photo{margin-bottom:20px;}
  .line-grid{grid-template-columns:1fr;}
  .layers{grid-template-columns:1fr 1fr;}
  .layer{border-bottom:1px solid var(--line);}
  .variant-grid{grid-template-columns:1fr;}
  .crop-grid{grid-template-columns:repeat(2,1fr);}
  .benefits{grid-template-columns:1fr 1fr;}
  .why-grid{grid-template-columns:1fr;}
  .product-grid{grid-template-columns:1fr;}
  .gal-grid{grid-template-columns:1fr 1fr;}
  .stock-grid{grid-template-columns:1fr;}
  section{padding:60px 0;}
  .hero-strip{flex-wrap:wrap;}
  .hero-stat{flex:1 1 50%; border-bottom:1px solid rgba(255,255,255,.14);}
  .page-hero h1{font-size:28px;}
}

/* ---- buttons: icon sizing ---- */
.btn svg{width:16px; height:16px; flex-shrink:0;}

/* ---- thank-you popup ---- */
.modal-overlay{
  position:fixed; inset:0; background:rgba(15,26,17,.55); z-index:100;
  display:flex; align-items:center; justify-content:center; padding:20px;
}
.modal-box{
  background:var(--card); max-width:420px; width:100%; padding:40px 34px 34px;
  border-radius:var(--radius); position:relative; text-align:center;
  box-shadow:0 20px 50px rgba(0,0,0,.25);
}
.modal-close{
  position:absolute; top:14px; right:16px; background:none; border:none;
  font-size:22px; line-height:1; cursor:pointer; color:var(--ink-soft);
}
.modal-icon{
  width:64px; height:64px; border-radius:50%; background:var(--rose-tint);
  display:flex; align-items:center; justify-content:center; margin:0 auto 18px;
}
.modal-box h3{font-size:22px; margin-bottom:10px;}
.modal-box p{color:var(--ink-soft); font-size:14.5px; margin-bottom:24px;}
.modal-actions{display:flex; gap:12px; justify-content:center; flex-wrap:wrap;}
