:root{--green:#0b3b35;--olive:#788d22;--sand:#f3eee4;--cream:#fbf8f1;--text:#16322f;--muted:#66716e;--line:#ddd8cc}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff}a{text-decoration:none;color:inherit}.wrap{width:min(1180px,92%);margin:auto}
.top{background:var(--green);color:#fff;padding:9px 0;font-size:13px}.top .wrap,.head,.nav{display:flex;justify-content:space-between;align-items:center;gap:18px}
header{position:sticky;top:0;z-index:20;background:#fff;box-shadow:0 4px 18px #0000000c}.head{padding:15px 0}.brand{font-size:30px;font-weight:900;letter-spacing:-1px}.brand span{color:var(--olive)}
.search{flex:1;display:flex;border:1px solid var(--line);border-radius:999px;overflow:hidden}.search input{border:0;outline:0;padding:13px 18px;flex:1}.search button,.btn{border:0;background:var(--green);color:#fff;padding:13px 20px;border-radius:999px;font-weight:800;cursor:pointer}
.nav{border-top:1px solid #eee9de;padding:12px 0;font-weight:700;font-size:14px}.nav a:hover{color:var(--olive)}
.hero{background:linear-gradient(120deg,#f8f4eb,#eef3e7);padding:28px 0}.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center}.hero-copy h1{font-family:Georgia,serif;font-size:54px;line-height:1.05;margin:14px 0}.hero-copy h1 em{font-style:normal;color:var(--olive)}.hero-copy p{font-size:18px;color:var(--muted);line-height:1.7}.eyebrow{display:inline-block;background:#e9efda;color:#4d6419;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:800}
.hero-img{border-radius:28px;overflow:hidden;box-shadow:0 25px 70px #18352f26}.hero-img img{display:block;width:100%}
section{padding:58px 0}.sec-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.sec-head h2{font-family:Georgia,serif;font-size:34px;margin:0}.sec-head p{margin:6px 0 0;color:var(--muted)}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden}.category{padding:24px;background:var(--cream);transition:.25s}.category:hover,.product:hover{transform:translateY(-6px);box-shadow:0 18px 34px #18352f14}.ico{font-size:42px}.category b{display:block;margin:12px 0 5px}.category p{color:var(--muted);font-size:14px}
.products{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.product{transition:.25s}.product .pic{height:200px;background:linear-gradient(145deg,#f4f0e6,#e8ede3);display:grid;place-items:center;font-size:85px}.product .body{padding:17px}.price{font-size:22px;font-weight:900}.old{color:#909a96;text-decoration:line-through;font-size:13px}.tag{display:inline-block;background:#eef2e2;color:#5b6e1e;border-radius:999px;padding:6px 9px;font-size:12px;font-weight:800}.stars{color:#c69218;font-size:13px;margin:8px 0}
.banner{background:linear-gradient(120deg,#0b3b35,#37584f);color:#fff;border-radius:26px;padding:38px;display:grid;grid-template-columns:1fr auto;gap:25px;align-items:center}.banner h2{font-family:Georgia,serif;font-size:36px;margin:0 0 8px}.banner .btn{background:#a6b34a;color:#17352f}
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.feature{padding:22px}.feature p,.copy p,.footer p{color:var(--muted);line-height:1.6}
.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.faq details{border:1px solid var(--line);border-radius:14px;padding:15px 18px;background:#fff}.faq summary{font-weight:800;cursor:pointer}
.quote{padding:22px}.quote small{color:var(--muted)}footer{background:#0b3b35;color:#fff;padding:46px 0 24px}.footer{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:28px}.footer p{color:#c7d3ce}.footer a{display:block;color:#e6eeeb;margin:9px 0}.copyline{border-top:1px solid #ffffff22;margin-top:30px;padding-top:18px;font-size:13px;color:#a8b9b3}
.pagehero{background:linear-gradient(120deg,#f7f2e8,#eef3e8);padding:60px 0}.pagehero h1{font-family:Georgia,serif;font-size:46px;margin:0 0 10px}.content{max-width:850px}.notice{padding:16px;border:1px solid #dfd5b5;background:#fffaf0;border-radius:13px}
@media(max-width:850px){.head{flex-wrap:wrap}.search{order:3;flex-basis:100%}.nav{overflow:auto;justify-content:flex-start}.hero-grid{grid-template-columns:1fr}.hero-copy h1{font-size:41px}.grid4,.products,.features{grid-template-columns:1fr 1fr}.grid3,.faq-grid,.footer{grid-template-columns:1fr}.banner{grid-template-columns:1fr}}
@media(max-width:520px){.grid4,.products,.features{grid-template-columns:1fr}.hero-copy h1{font-size:34px}.top{display:none}}