/* Install: the command again, at the point the page has earned it, plus the
   two builds and the unsigned-build disclosure.

   One inner wrapper holds the measure. Putting `max-width` and `auto` margins
   on every child instead centres any child that has a narrower max-width of
   its own, and leaves the rest left-aligned — which reads as a broken grid. */

.install {
  padding: var(--band-y) var(--gutter-x);
  border-top: 1px solid var(--hairline);
  background: var(--day-bg);
}

/* Centred, like the hero: this is the page's other call to action, not reading
   matter. Everything between them stays on the left axis. */
.install__inner {
  max-width: var(--page);
  margin: 0 auto;
  text-align: center;
}

.install__lead {
  margin: 1.15rem auto 0;
  max-width: 52ch;
  color: var(--muted);
  font-size: var(--lead);
  line-height: 1.6;
}

/* Centred as a block; the command inside it is left-aligned by the component,
   which is where that belongs — the hero needed the same and did not have it. */
.install .command {
  margin: clamp(1.8rem, 3.4vw, 2.6rem) auto 0;
}

.install__or {
  margin-top: clamp(1.7rem, 3vw, 2.3rem);
  color: var(--dim);
  font-family: var(--mono);
  font-size: var(--label);
  letter-spacing: 0.05em;
}

.install__zips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.7rem;
  margin-top: 0.85rem;
}

/* Both builds get the same width — an equal basis rather than `auto`, or the
   longer label claims the wider half — without stretching to the column. */
.install__zips .btn {
  flex: 0 1 15rem;
  justify-content: space-between;
}

/* The same stack as the other two rows, so the whole page agrees about what a
   row of buttons does when it runs out of width. The label and its .zip keep
   the two ends of the button. */
@media (max-width: 560px) {
  .install__zips {
    flex-direction: column;
    align-items: stretch;
  }

  .install__zips .btn {
    flex: 0 0 auto;
  }
}

.install__note {
  margin: clamp(2rem, 3.6vw, 2.8rem) auto 0;
  max-width: 66ch;
  color: var(--dim);
  font-size: 0.87rem;
  line-height: 1.75;
}

.install__note code.mono {
  color: var(--muted);
  white-space: normal;
}