.dl-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  align-items: center;
  gap: 64px;
}
.dl-intro > * {
  min-width: 0;
}
.dl-intro h1 {
  margin-top: 20px;
}
.dl-intro .button-row {
  margin-top: 24px;
}
.dl-intro .button-row .btn {
  min-height: 48px;
}
.dl-summary {
  max-width: 42em;
  margin-top: 24px;
  color: var(--muted);
  line-height: var(--leading-prose);
}
.dl-selection {
  display: grid;
  gap: 16px;
}
.dl-selection > .mono {
  font-size: var(--text-xs);
}
.dl-selection h2 {
  font-size: var(--text-h3);
}
.dl-selection p {
  line-height: var(--leading-prose);
}
.dl-selection .text-link {
  justify-self: start;
  font-size: var(--text-sm);
}
.dl-catalog > .tab-list {
  padding: 16px;
  border-bottom: 1px solid var(--line);
}
.dl-catalog > .tab-list [role="tab"] {
  flex: 1 1 120px;
}
.dl-panel-heading {
  margin-bottom: 28px;
}
.dl-panel-heading > p {
  max-width: 58em;
  margin-top: 16px;
}
.dl-client-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
.dl-client-grid > .client-card:first-child {
  grid-column: 1 / -1;
}
.dl-client-grid .client-card > p {
  font-size: var(--text-sm);
  line-height: var(--leading-prose);
}
.dl-client-grid .client-head .badge,
.dl-client-grid .client-head .tag {
  margin-top: 8px;
}
.dl-client-grid .client-actions {
  flex-direction: column;
  align-items: stretch;
}
.dl-client-grid .client-actions .btn {
  width: 100%;
  min-height: 48px;
}
.dl-requirements {
  margin-top: 32px;
}
.dl-core-table {
  margin-top: 28px;
}
.dl-core-table .btn {
  white-space: nowrap;
}
.dl-core-notes {
  max-width: var(--reading);
  margin-top: 28px;
}
.dl-core-notes > * + * {
  margin-top: 18px;
}
#package-notes > h2 {
  margin-top: 18px;
}
@media (max-width: 900px) {
  .dl-intro {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }
  .dl-selection {
    max-width: var(--reading);
  }
}
@media (max-width: 768px) {
  .dl-client-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .dl-catalog > .tab-list {
    padding: 12px;
  }
  .dl-catalog > .tab-list [role="tab"] {
    flex-basis: 86px;
    padding-inline: 10px;
  }
}
@media (max-width: 640px) {
  .dl-intro {
    padding-top: 32px;
  }
  .dl-catalog > .tab-panels {
    padding: 24px 16px;
  }
  .dl-client-grid {
    gap: 16px;
  }
}