/* Platform summaries and alternative setup steps on the connection guide. */
.docs-platforms {
  display: grid;
  gap: 8px;
  margin: 18px 0 0;
  font-size: 14px;
  line-height: 22px;
}

.docs-platforms > div {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  gap: 12px;
}

.docs-platforms dt {
  font-weight: 600;
  color: var(--ink);
}

.docs-platforms dd {
  margin: 0;
  color: var(--muted);
}

.docs-alternative {
  margin-top: 22px;
  border-bottom: 1px solid var(--rule);
}

.docs-alternative > summary {
  padding: 14px 0;
  font-size: 15px;
  line-height: 22px;
  font-weight: 600;
  color: var(--ink);
  cursor: pointer;
}

.docs-alternative > summary:focus-visible {
  outline: 2px solid var(--coral-deep);
  outline-offset: 4px;
}

.docs-alternative > .docs-steps {
  margin-top: 0;
}

@media (max-width: 480px) {
  .docs-platforms > div {
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 8px;
  }
}