/* the install guide: same wall as the home page, steps set like a checklist */
.logo { text-decoration: none; color: var(--fg); }
.hero-small { padding-block: 40px 20px; }
.hero-small h1 { font-size: clamp(44px, 8vw, 96px); }
.checklist { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.checklist div { border: 1px solid var(--line); border-radius: 6px; padding: 18px; display: grid; gap: 8px; align-content: start; min-width: 0; }
.checklist b { font-weight: 600; }
.checklist span { color: var(--muted); font-size: 15px; }
.howto { margin: 0; padding-left: 0; list-style: none; counter-reset: s; display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; max-width: 78ch; }
.howto li { counter-increment: s; position: relative; padding-left: 48px; min-height: 28px; color: #cfcfcb; }
.howto li::before { content: counter(s); position: absolute; left: 0; top: -2px; width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--line); display: grid; place-items: center; font: 500 13px/1 var(--mono); color: var(--tally); }
.howto li > b { color: var(--fg); }
.copyable { display: flex; align-items: center; gap: 10px; white-space: normal; margin-block: 10px; }
.copyable code { flex: 1 1 auto; min-width: 0; overflow-x: auto; white-space: nowrap; font: 13px/1.5 var(--mono); color: var(--fg); }
.copy { flex: none; padding: 7px 12px; border-radius: 4px; border: 1px solid var(--line); background: var(--panel); color: var(--fg); font: 500 13px/1 var(--body); cursor: pointer; }
.copy:hover { border-color: var(--muted); }
.copy:focus-visible { outline: 2px solid var(--tally); outline-offset: 2px; }
.cta-gap { margin-top: 28px; }
.spec code { font: 12px/1.5 var(--mono); color: var(--fg); word-break: break-all; }
footer a { color: inherit; }
.howto kbd { font: 13px/1 var(--mono); padding: 2px 6px; border: 1px solid var(--line); border-radius: 4px; background: var(--panel); white-space: nowrap; }