:root{
  --green:#0c4b34; --green2:#0f6b43; --green3:#174f3b;
  --sand:#e6c37a; --ink:#16221d; --muted:#66716b; --line:#dfe6e2; --soft:#f4f8f5;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff;line-height:1.45}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(1180px,92%);margin:auto}
.topbar{background:#0a4b35;color:#fff;font-size:12px}
.topbar .container{height:34px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.topbar .left,.topbar .right{display:flex;align-items:center;gap:18px}
.topbar .lang a{padding:5px 10px;border:1px solid rgba(255,255,255,.35);margin-left:5px;border-radius:2px}
.topbar .lang a.active{background:#fff;color:#0a4b35}
header{background:#fff;border-bottom:1px solid #e8ece9;position:sticky;top:0;z-index:20}
.nav{height:66px;display:flex;align-items:center;gap:28px}
.logo{width:305px;max-width:42vw}
nav{margin-left:auto;display:flex;gap:30px;font-size:14px}
nav a{padding:24px 0 20px;border-bottom:3px solid transparent}
nav a:hover,nav a.active{color:var(--green2);border-bottom-color:var(--green2)}
.menu-btn{display:none;margin-left:auto;border:0;background:none;font-size:24px}

.hero{position:relative;min-height:395px;overflow:hidden;background:#222;color:#fff}
.hero:before{content:"";position:absolute;inset:0;background:
linear-gradient(90deg,rgba(9,27,20,.95) 0%,rgba(9,27,20,.78) 38%,rgba(9,27,20,.20) 66%,rgba(9,27,20,.08) 100%),
url('../img/hero.jpg') center right/cover no-repeat}
.hero .container{position:relative;z-index:1;padding:62px 0 58px}
.eyebrow{font-size:12px;letter-spacing:4px;font-weight:700;color:#9bd0b1;margin-bottom:12px}
.hero h1{font-size:48px;line-height:1.04;margin:0 0 16px;max-width:650px}
.hero p{font-size:17px;max-width:510px;margin:0 0 20px;color:#f2f4f3}
.actions{display:flex;gap:14px;flex-wrap:wrap}
.btn{display:inline-block;background:var(--green2);color:#fff;padding:13px 22px;border-radius:3px;font-weight:700;font-size:14px;border:1px solid var(--green2)}
.btn.outline{background:transparent;border-color:#fff}
.btn.light{background:#fff;color:var(--green);border-color:#fff}

.features{background:#fff;border-bottom:1px solid var(--line)}
.features .container{display:grid;grid-template-columns:repeat(4,1fr)}
.feature{display:flex;align-items:center;gap:14px;padding:24px 22px;border-right:1px solid var(--line)}
.feature:last-child{border-right:none}
.icon{width:46px;height:46px;border:2px solid var(--green2);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--green2);font-weight:800;font-size:18px}
.feature b{font-size:15px;display:block}
.feature span{font-size:12px;color:var(--muted)}

section{padding:58px 0}
.section-head{display:flex;justify-content:space-between;gap:30px;align-items:flex-end;margin-bottom:28px}
.section-head h2{font-size:36px;line-height:1.1;margin:6px 0 0}
.section-head p{color:var(--muted);max-width:520px;margin:0}
.products{background:linear-gradient(90deg,#f7fbf8,#eef7f2)}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.card{background:#fff;border:1px solid #e3e9e5;border-radius:4px;overflow:hidden}
.card img{width:100%;height:155px;object-fit:cover}
.card .body{padding:13px 14px}
.card h3{font-size:14px;margin:0 0 5px}
.card p{font-size:12px;color:var(--muted);margin:0}

.duo{display:grid;grid-template-columns:1.25fr 1fr}
.location{min-height:285px;color:#fff;position:relative;background:url('../img/location.jpg') center/cover no-repeat}
.location:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,34,25,.80),rgba(11,34,25,.20))}
.location .inside,.sustain .inside{position:relative;z-index:1;padding:50px 7%}
.location h2,.sustain h2{font-size:31px;margin:7px 0 10px}
.location p,.sustain p{max-width:520px;margin:0 0 18px}
.sustain{background:#0b4b35;color:#fff;position:relative}
.sustain .leaf{position:absolute;right:50px;top:65px;font-size:85px;opacity:.25}

.page-hero{background:#0d4a35;color:#fff;padding:64px 0}
.page-hero h1{font-size:42px;margin:0 0 8px}
.page-hero p{max-width:650px;color:#dbe7e1}
.content{padding:50px 0}
.content-grid{display:grid;grid-template-columns:2fr 1fr;gap:36px}
.content h2{font-size:28px;margin-top:0}
.content p{color:#56615b}
.sidebox{background:#f3f7f4;border-left:4px solid var(--green2);padding:22px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:25px}
.step{padding:18px;border:1px solid var(--line);background:#fff}
.step b{display:block;margin-bottom:5px}
.step span{font-size:13px;color:var(--muted)}

footer{background:#093e2d;color:#e6efea;padding:28px 0 22px}
.footer-grid{display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:28px;align-items:center}
.footer-logo{filter:brightness(0) invert(1);opacity:.95;width:250px}
.footer-nav{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;font-size:12px}
.footer-note{text-align:right;font-size:11px;color:#b8c9c1}
.legal{margin-top:18px;padding-top:15px;border-top:1px solid rgba(255,255,255,.15);font-size:10px;color:#a9bbb3}

@media(max-width:900px){
  nav{display:none}.menu-btn{display:block}.logo{width:245px}
  .hero h1{font-size:40px}
  .features .container{grid-template-columns:1fr 1fr}
  .feature:nth-child(2){border-right:none}
  .product-grid{grid-template-columns:1fr 1fr}
  .duo{grid-template-columns:1fr}
  .content-grid{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr;text-align:left}.footer-nav{justify-content:flex-start}.footer-note{text-align:left}
}
@media(max-width:560px){
  .topbar .left{display:none}.topbar .container{justify-content:flex-end}
  .logo{width:220px;max-width:70vw}.nav{height:60px}
  .hero .container{padding:48px 0}.hero h1{font-size:34px}.hero p{font-size:15px}
  .features .container,.product-grid{grid-template-columns:1fr}
  .feature{border-right:none;border-bottom:1px solid var(--line)}
  .section-head{display:block}.section-head h2{font-size:30px}
  .steps{grid-template-columns:1fr}
}