:root{--bg:#f4f1e8;--fg:#111;--ac:#ff5a1f}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.6 ui-monospace,monospace}
header,footer{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;border-bottom:2px solid #111}
footer{border-top:2px solid #111;border-bottom:none}
nav a{margin-left:1rem;color:inherit;text-decoration:none}
main{max-width:1100px;margin:auto;padding:2rem}
.label{text-transform:uppercase;font-size:.85rem;opacity:.7}
.hero{min-height:80vh;display:grid;align-content:center;border-bottom:2px solid #111}
h1{font-size:clamp(4rem,12vw,9rem);line-height:.88;letter-spacing:-.08em}
.lead{font-size:1.4rem}
section{padding:4rem 0;border-bottom:2px solid #111}
.box{border:3px solid #111}
.cap{background:#111;color:#f4f1e8;padding:1rem;font-weight:bold;text-transform:uppercase}
.flow{padding:2rem}
.step{border:2px solid #111;padding:1rem}.arrow{font-size:2rem;color:var(--ac);padding:.5rem 0}
.props{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0;border-top:2px solid #111;border-left:2px solid #111}
.props>div{border-right:2px solid #111;border-bottom:2px solid #111;padding:1rem}