:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#193532;background:#f5f3eb}*{box-sizing:border-box}body{margin:0}header{max-width:1100px;margin:auto;padding:28px 24px;display:flex;justify-content:space-between;align-items:center}.brand{font-weight:900;letter-spacing:-1px;color:inherit;text-decoration:none}.brand span{color:#71877a}.badge,.eyebrow{font-size:12px;font-weight:800;letter-spacing:2px}.badge{border:1px solid #bcc8bc;border-radius:30px;padding:9px 12px}main{max-width:1060px;margin:40px auto 70px;padding:0 24px}h1{font-size:clamp(38px,6vw,72px);line-height:1.04;letter-spacing:-3px;margin:20px 0}h2{font-size:32px;letter-spacing:-1px}p{font-size:18px;line-height:1.65;color:#52645b}.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:48px;align-items:center}.card{background:white;border:1px solid #dce1d7;padding:32px;border-radius:20px;box-shadow:0 12px 40px #19353208}.demo{background:#193532;color:#fff;transform:rotate(2deg)}.demo p{color:#d4dfd7}.demo strong{font-size:38px}.ruler{display:flex;height:90px;background:#e8b753;margin:26px 0;border-radius:6px;overflow:hidden}.tick{flex:1;border-left:1px solid #193532;height:50%;position:relative}.tick:nth-child(4n+1){height:75%}.tick:first-child{height:100%}.tick.on{background:#19353240}.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:50px}.step{border-top:2px solid #c9d2c4;padding-top:16px;font-size:14px}.step b{display:block;color:#71877a;margin-bottom:10px}button{font:inherit;background:#193532;color:white;padding:15px 22px;border:0;border-radius:10px;cursor:pointer;font-weight:700}button:hover{background:#31584c}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #bf8517;outline-offset:4px}button:disabled{opacity:.5;cursor:default}.text{display:block;background:none;color:#52645b;font-size:13px;margin:10px auto;padding:8px}.text:hover{background:#e7e8df}.secondary{background:#e8b753;color:#193532;margin:8px}.panel{max-width:720px;margin:auto}input{display:block;width:100%;padding:16px;font:inherit;border:2px solid #bcc8bc;border-radius:8px;margin:10px 0 18px}.feedback{background:#eff3ea;border-left:4px solid #71877a;padding:18px;margin:24px 0}.feedback p{margin:8px 0}.muted{font-size:14px;color:#657467}progress{width:100%;height:10px;accent-color:#193532}.grid{display:grid;gap:15px}.grid button{text-align:left}.area{background:#e8b753;padding:30px;text-align:center;font-weight:800;margin:20px auto;max-width:280px;border:2px dashed #193532}footer{text-align:center;padding:30px 24px;border-top:1px solid #dce1d7;color:#52645b}footer small{display:block;max-width:640px;margin:12px auto;line-height:1.6}@media(max-width:700px){.hero{grid-template-columns:1fr}.demo{transform:none}.steps{grid-template-columns:1fr 1fr}main{margin-top:15px}.card{padding:23px}h1{letter-spacing:-2px}}

@media(max-width:700px){header{flex-wrap:wrap;gap:12px}.brand{max-width:100%}.brand img{max-width:100%;height:auto}header>a{overflow-wrap:anywhere}}