/* The download page. Builds on /styles.css. */
.dl { max-width: 880px; margin: 0 auto; padding: 0 16px; }
.dl-hero { text-align: center; padding: 96px 0 56px; }
.dl-title { font-size: clamp(42px, 7vw, 76px); }
.dl-btn { padding: 15px 28px; font-size: 16px; }
.dl-meta { margin: 22px 0 0; font-size: 14px; color: var(--dim); font-variant-numeric: tabular-nums; }
.dl-trust { margin: 6px 0 0; font-size: 13.5px; color: var(--soft); }

.dl-h2 { font-size: clamp(26px, 3.4vw, 34px); margin-bottom: 26px; }
.dl-steps { padding: 56px 0; border-top: 1px solid var(--line); }
.dl-steps ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
.dl-steps li { display: flex; gap: 16px; align-items: flex-start; color: var(--fg-2); }
.dl-steps b { color: var(--fg); font-weight: 600; }
.dl-num {
  flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  border: 1px solid var(--line-2); background: var(--bg-2); color: var(--fg); font: 600 13px var(--sans);
  margin-top: 1px;
}

.dl-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; padding: 56px 0 96px; border-top: 1px solid var(--line); }
.dl-grid p { margin: 0; font-size: 14.5px; color: var(--dim); }
.dl-grid b { color: var(--fg-2); font-weight: 500; }
.dl-link { color: var(--fg); border-bottom: 1px solid var(--line-2); transition: border-color .2s; }
.dl-link:hover { border-color: var(--fg); }

@media (max-width: 720px) {
  .nav-links { display: none; }
  .dl-hero { padding: 64px 0 40px; }
  .dl-grid { grid-template-columns: 1fr; gap: 26px; }
}
