/* Shared geometry for the catalog, studio and server-setup landing pages. */
body main.tools-shell.wbs-tool-family {
  --wbs-family-shell: 26px;
  --wbs-family-panel: 18px;
  --wbs-family-line: rgba(242, 234, 255, .53);
  width: min(1160px, calc(100% - 24px));
  max-width: none;
  margin: clamp(16px, 2vw, 24px) auto 36px;
  padding-inline: 0;
  box-sizing: border-box;
}
body .wbs-tool-family > :is(#ts-studio, .wbs-font-tool, .wbs-cat5, .bs-main) {
  width: 100%;
  max-width: none;
  margin-inline: 0;
}
body .wbs-tool-family :is(.wbs-cat5-shell, .wbs-font-hero, .wbs-font-workspace,
  .wbs-font-library, .wbs-font-help, .tsv2-hero) {
  border-radius: var(--wbs-family-shell);
  border-color: var(--wbs-family-line);
  box-shadow: 0 18px 38px rgba(0, 0, 0, .24), inset 0 1px rgba(255, 255, 255, .48),
    inset 0 -1px rgba(136, 218, 255, .28);
}
body .wbs-tool-family :is(.wbs-cat5-head, .wbs-font-hero, .tsv2-hero) h1 {
  font-size: clamp(27px, 3.2vw, 44px);
  line-height: 1.1;
  overflow-wrap: anywhere;
}
body .wbs-tool-family :is(.wbs-cat5-card, .wbs-font-panel, .tsv2-panel) {
  border-radius: var(--wbs-family-panel);
  border-color: var(--wbs-family-line);
}
body .wbs-tool-family :is(.wbs-cat5-link, .wbs-font-control, .tsv2-primary, .tsv2-secondary) {
  border-radius: 12px;
}
body .wbs-tool-family :is(.wbs-cat5-head-copy p, .wbs-font-hero > p, .tsv2-hero .wbs-diff-hero-copy > p) {
  font-size: clamp(13px, 1.25vw, 16px);
  line-height: 1.55;
}
body .wbs-tool-family .bs-main .wbs-cat5-cards {
  grid-template-columns: minmax(0, 1fr);
}
@media (max-width: 700px) {
  body main.tools-shell.wbs-tool-family { --wbs-family-shell: 20px; --wbs-family-panel: 14px; }
}