
:root{--green:#29392f;--green2:#405848;--cream:#f4f2ec;--sand:#e8e2d5;--text:#1e2520;--muted:#657069;--accent:#b65432;--white:#fff;--line:#d8ddd8;--black:#111;}
*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff;line-height:1.65}
a{color:var(--green2)}img{max-width:100%;height:auto}
.topbar{background:#eef0ec;color:#4c574f;font-size:13px;padding:7px 0}.wrap{width:min(1160px,calc(100% - 36px));margin:auto}
.header{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}.header-inner{min-height:84px;display:flex;align-items:center;gap:30px}
.brand{text-decoration:none;font-weight:800;font-size:27px;color:var(--green);white-space:nowrap}.brand span{color:var(--accent)}
.nav{display:flex;gap:19px;align-items:center;margin-left:auto}.nav a{text-decoration:none;color:#2a332d;font-size:14px;font-weight:700}.nav a:hover{color:var(--accent)}
.mobile-toggle{display:none;margin-left:auto;border:0;background:none;font-size:27px;padding:9px;cursor:pointer}
.hero{background:linear-gradient(120deg,#eef1eb,#faf8f3);padding:58px 0}.hero-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:44px;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:12px;font-weight:800;color:var(--accent)}h1{font-size:clamp(35px,5vw,58px);line-height:1.08;margin:8px 0 20px;color:var(--green)}
h2{font-size:28px;line-height:1.2;margin:38px 0 14px;color:var(--green)}h3{font-size:20px;color:var(--green)}
.lead{font-size:19px;color:#4e5a52}.btn{display:inline-block;background:var(--green);color:#fff!important;text-decoration:none;padding:13px 19px;border-radius:6px;font-weight:700;margin:4px 6px 4px 0}.btn.alt{background:var(--accent)}
.section{padding:48px 0}.section.alt{background:var(--cream)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{border:1px solid var(--line);border-radius:12px;padding:23px;background:#fff}.card h3{margin-top:0}.card a{text-decoration:none;font-weight:700}
.page-head{background:#f1f3ef;padding:40px 0;border-bottom:1px solid var(--line)}.breadcrumbs{font-size:13px;color:var(--muted);margin-bottom:8px}
.content{max-width:820px;padding:44px 0}.content p{font-size:17px}.content ul{padding-left:23px}.content li{margin:8px 0}
.example{background:#f7f1e9;border-left:4px solid var(--accent);padding:18px 20px;margin:26px 0;border-radius:0 8px 8px 0}.note{background:#eef4ef;border:1px solid #cedace;padding:18px 20px;border-radius:8px;margin:25px 0}
.tool-link{background:#f2f5f8;border:1px solid #d3dce4;padding:18px;border-radius:8px;margin:28px 0}.tool-link a{font-weight:800}
.cta{background:#18221c;color:#fff;border-radius:13px;padding:28px;margin-top:42px}.cta h2,.cta h3{color:#fff;margin-top:0}.cta p{color:#dfe5df}.cta .btn{background:#fff;color:#17221c!important}.cta .btn.alt{background:var(--accent);color:#fff!important}
.footer{background:#0b0d0b;color:#cfd4cf;padding:44px 0 18px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}.footer h3{color:#fff}.footer a{color:#e8ece9}.copyright{border-top:1px solid #333;margin-top:32px;padding-top:16px;font-size:13px}
.hub-image{border-radius:12px;aspect-ratio:4/3;object-fit:cover}
.toolbox{background:#f7f8f6;border:1px solid var(--line);border-radius:12px;padding:24px}.field{margin:14px 0}.field label{display:block;font-weight:700;margin-bottom:5px}.field input,.field select{width:100%;padding:11px;border:1px solid #bbc4bd;border-radius:6px;font-size:16px}.result{margin-top:20px;padding:18px;background:#fff;border-left:4px solid var(--accent);display:none}
.sourcebox{font-size:14px;color:#59645d;background:#fafafa;border-top:1px solid var(--line);padding-top:17px;margin-top:28px}
@media(max-width:900px){.mobile-toggle{display:block}.header-inner{min-height:70px;position:relative}.brand{font-size:22px}.nav{display:none;position:absolute;left:-18px;right:-18px;top:70px;background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 18px 18px;flex-direction:column;align-items:flex-start;gap:0}.nav.open{display:flex}.nav a{width:100%;padding:10px 0;border-bottom:1px solid #eee}.hero-grid{grid-template-columns:1fr}.grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr}.hero{padding:40px 0}}
@media(max-width:600px){.wrap{width:min(100% - 28px,1160px)}.grid,.footer-grid{grid-template-columns:1fr}h1{font-size:36px}.content p{font-size:16px}.topbar{font-size:12px}.hero{padding:32px 0}.section{padding:35px 0}}
