:root { --bg:#f7f7f4; --ink:#171817; --muted:#686b66; --line:#d9dcd6; --accent:#126e52; --card:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.55; }
.site-header { height:72px; display:flex; align-items:center; justify-content:space-between; max-width:1160px; margin:auto; padding:0 28px; border-bottom:1px solid var(--line); }
.brand { font-size:20px; font-weight:800; color:inherit; text-decoration:none; letter-spacing:-.7px; }
.brand span { color:var(--accent); }
.header-actions { display:flex; gap:7px; align-items:center; }
.language { border:0; background:transparent; color:var(--muted); font-size:12px; font-weight:700; padding:7px; cursor:pointer; text-decoration:none; }
.language.active { color:var(--accent); text-decoration:underline; }
.download { display:inline-flex; align-items:center; justify-content:center; background:var(--accent); color:#fff; border-radius:5px; padding:13px 19px; font-size:14px; font-weight:700; text-decoration:none; transition:transform .15s,background .15s; }
.download:hover { background:#0e5a43; transform:translateY(-1px); }
.download.compact { padding:9px 12px; font-size:12px; }
.hero { max-width:1160px; margin:auto; padding:100px 28px 90px; border-bottom:1px solid var(--line); }
.eyebrow { color:var(--accent); font-size:12px; font-weight:800; letter-spacing:1.1px; text-transform:uppercase; margin:0 0 18px; }
.hero h1 { font-size:clamp(42px,7vw,82px); letter-spacing:-.065em; line-height:.98; max-width:800px; margin:0; }
.lead { font-size:20px; max-width:650px; color:#4d504c; margin:28px 0; }
.hero-actions { display:flex; gap:24px; align-items:center; flex-wrap:wrap; }
.text-link { color:var(--ink); font-weight:700; text-decoration:none; }
.meta { font-size:13px; color:var(--muted); margin-top:44px; }
.features { max-width:1160px; margin:auto; display:grid; grid-template-columns:repeat(4,1fr); padding:0 28px; border-bottom:1px solid var(--line); }
.features article { padding:38px 20px 44px 0; border-right:1px solid var(--line); }
.features article + article { padding-left:20px; }
.features article:last-child { border-right:0; }
.features span { color:var(--accent); font-size:12px; font-weight:800; }
.features h2 { font-size:22px; letter-spacing:-.6px; margin:16px 0 6px; }
.features p { color:var(--muted); margin:0; }
.manual { max-width:900px; margin:auto; padding:100px 28px; }
.section-title h2 { font-size:44px; letter-spacing:-1.8px; margin:0 0 44px; }
.steps { list-style:none; padding:0; margin:0 0 46px; counter-reset:step; }
.steps li { counter-increment:step; position:relative; padding:0 0 27px 58px; border-left:1px solid var(--line); margin-left:13px; }
.steps li::before { content:counter(step,decimal-leading-zero); position:absolute; left:-14px; top:0; background:var(--bg); color:var(--accent); font-weight:800; font-size:12px; padding:0 6px; }
.steps b { font-size:18px; }
.steps p { margin:4px 0 0; color:var(--muted); }
.note { padding:22px 24px; border-left:3px solid var(--accent); background:#eef6f1; margin:40px 0; }
.note p { margin:5px 0 0; color:#385148; }
h3 { font-size:20px; letter-spacing:-.4px; margin:48px 0 13px; }
pre { overflow:auto; background:#1d211f; color:#e7eee9; padding:22px; border-radius:5px; font:13px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; }
code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.92em; }
.grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.grid article { background:var(--card); border:1px solid var(--line); border-radius:5px; padding:7px 22px 22px; }
.grid h3 { margin-top:18px; }
.grid p, .manual > p { color:var(--muted); }
.requirements { padding-left:20px; color:var(--muted); }
footer { max-width:1160px; margin:auto; border-top:1px solid var(--line); padding:28px; color:var(--muted); font-size:13px; display:flex; justify-content:space-between; }
footer a { color:var(--ink); text-decoration:none; font-weight:700; }
@media (max-width:680px) {
  .site-header { padding:0 18px; }
  .hero, .manual { padding-left:18px; padding-right:18px; }
  .hero { padding-top:70px; }
  .features { grid-template-columns:1fr; padding:0 18px; }
  .features article, .features article + article { padding:30px 0; border-right:0; border-bottom:1px solid var(--line); }
  .features article:last-child { border-bottom:0; }
  .grid { grid-template-columns:1fr; }
  .section-title h2 { font-size:34px; }
  .lead { font-size:18px; }
  .compact { display:none; }
}
