:root{--ink:#192525;--bg:#faf9f3;--line:#cbd3c9;--lime:#dfff68;--muted:#43544d}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 Tahoma,Arial,sans-serif}a{color:inherit}a:focus-visible{outline:3px solid #285b45;outline-offset:4px}h1,h2,h3,p,figure{margin:0}.wrap{width:min(1120px,calc(100% - 40px));margin-inline:auto}.nav,.actions,.top,.logo{display:flex;align-items:center;gap:16px}.nav,.top{justify-content:space-between}.nav{min-height:72px;border-bottom:1px solid var(--line)}.logo{font-weight:900;font-size:23px;text-decoration:none;gap:8px}.logo i{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--lime);font-style:normal}.btn{display:inline-block;background:var(--ink);color:white;padding:10px 16px;border-radius:8px;text-decoration:none;font-weight:bold}.btn:hover{background:#365244}.hero{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,6vw,80px);align-items:center;padding-block:64px}.eyebrow{color:#315b46;font-weight:bold}h1{font-size:clamp(49px,8vw,94px);line-height:1.08;margin-block:13px 22px}h1 em{color:#305745;font-style:normal}.lead{font-size:clamp(17px,2vw,20px);color:var(--muted);max-width:54ch}.actions{margin-top:24px;flex-wrap:wrap}.board{display:grid;place-items:center;min-height:360px;padding:28px;background:#dcefdf radial-gradient(#789c80 1px,transparent 1px);background-size:16px 16px;border-radius:22px}.paper{width:min(100%,340px);padding:22px;background:#fffef9;border:1px solid #283f33;border-radius:14px;transform:rotate(-3deg);box-shadow:7px 8px #283f33}.top{font-size:12px;color:var(--muted)}.paper strong{display:block;font-size:clamp(25px,4vw,40px);line-height:1.3;margin-block:16px}.paper p{border-top:1px solid var(--line);padding-block:8px;font-size:13px}.section{padding-block:40px;border-top:1px solid var(--line)}h2{font-size:clamp(28px,4vw,48px);line-height:1.25;margin-bottom:16px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.grid article{background:#fffef9;border:1px solid var(--line);border-radius:12px;padding:20px}.grid p{color:var(--muted)}.demo{background:var(--lime);padding:clamp(22px,5vw,55px);border-radius:16px;margin-block:12px 25px}.demo .btn{margin-top:16px}footer.nav{border-top:1px solid var(--line);border-bottom:0}@media(max-width:680px){.hero,.grid{grid-template-columns:1fr}.hero{padding-block:36px}.board{min-height:290px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
