/* Three workspaces share one calm, centered introduction and presentation. */
#products.ws-products {
  --ws-blue: #0966d8;
  --ws-ink: #162c49;
  --ws-muted: #52667e;
  width: min(1200px, calc(100% - 112px));
  padding-block: 26px 36px;
  overflow-anchor: none;
}

#products.ws-products > .section-heading {
  display: block;
  max-width: none;
  margin: 0 auto 20px;
  text-align: center;
}

#products.ws-products > .section-heading > h2 {
  display: block;
  font-size: clamp(1.65rem, 2.35vw, 2rem);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -.035em;
  text-wrap: balance;
  color: var(--ws-ink);
}

#products.ws-products > .section-heading > p:not(.eyebrow),
#products.ws-products > .section-heading > .product-detail-links {
  display: none;
}

/* Align the chapter label with the platform section's label and breathe above the title. */
#products.ws-products > .section-heading > .eyebrow {
  display: flex;
  width: fit-content;
  max-width: 100%;
  margin-top: 0;
  margin-inline-start: 0;
  margin-inline-end: auto;
  margin-bottom: 30px !important;
}

#products.ws-products > .product-tabs {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 4px;
  width: fit-content;
  max-width: 100%;
  min-height: 54px;
  margin: 0 auto;
  padding: 4px;
  border: 1px solid #dce6f0;
  border-radius: 999px;
  background: white;
}

#products.ws-products > .product-tabs > button[data-product] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-direction: row;
  gap: 8px;
  width: auto;
  min-width: 0;
  min-height: 44px;
  padding: 9px 19px;
  border: 0;
  border-radius: 999px;
  color: #52667e;
  background: transparent;
  text-align: center;
  transition: background .16s ease, color .16s ease;
}

#products.ws-products > .product-tabs > button[data-product] > strong {
  font-size: .975rem;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -.02em;
  white-space: nowrap;
}

#products.ws-products > .product-tabs > button[data-product] > span {
  display: none;
}

#products.ws-products > .product-tabs .ws-tab-icon {
  display: block;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  color: currentColor;
}

#products.ws-products > .product-tabs > button[data-product]:hover {
  color: #24568e;
  background: #f5f8fc;
}

#products.ws-products > .product-tabs > button[data-product][aria-selected="true"] {
  color: #0757b6;
  background: #edf5ff;
}

#products.ws-products > .product-tabs > button[data-product]:focus-visible {
  outline: 2px solid var(--ws-blue);
  outline-offset: -2px;
}

#products.ws-products #product-panel[data-product] {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 0;
  margin-top: 18px;
}

#products.ws-products #product-panel[data-product] > .ws-summary {
  display: block;
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0 auto 22px;
  padding: 0;
  text-align: center;
}

#products.ws-products .ws-summary #product-audience,
#products.ws-products .ws-summary #product-title,
#products.ws-products .ws-summary #product-features {
  display: none;
}

#products.ws-products .ws-summary #product-description {
  width: min(920px, 100%);
  max-width: none;
  min-height: var(--ws-description-height, 1.65em);
  margin: 0 auto;
  padding: 0;
  color: #405b78;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.65;
  text-align: center;
  overflow-wrap: anywhere;
  text-wrap: pretty;
}

#products.ws-products .ws-summary .product-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px 20px;
  min-height: var(--ws-actions-height, 44px);
  margin-top: 10px;
}

#products.ws-products .ws-summary .product-actions > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  max-width: 100%;
  min-height: 44px;
  margin: 0;
  font-size: .875rem;
  line-height: 1.5;
  text-align: center;
  overflow-wrap: anywhere;
}

#products.ws-products .ws-summary #product-link {
  min-height: 44px;
  margin: 0;
  padding: 10px 20px;
  border: 1px solid transparent;
  border-radius: 5px;
  font-size: .875rem !important;

  color: white;
  background: var(--ws-blue);
}

#products.ws-products .ws-summary #product-link:hover {
  background: #0754b6;
}

#products.ws-products .ws-summary .text-link {
  min-height: 44px;
  padding: 7px 0;
  border-bottom: 1px solid #b9cadf;
  color: #285a91;
}

#products.ws-products .ws-summary .text-link:hover {
  color: #0757b6;
  border-bottom-color: #0757b6;
}



#products.ws-products .ws-summary .product-actions > a[hidden],
#products.ws-products #clinmate-capabilities[hidden],
#products.ws-products .ws-product-visual [hidden],
#products.ws-products #product-screenshot[hidden] {
  display: none !important;
}

#products.ws-products .ws-summary .ws-measure-description {
  position: absolute;
  inset-inline: 0;
  width: min(920px, 100%);
  min-height: 0;
  margin-inline: auto;
  color: transparent;
  font-size: 1rem;
  line-height: 1.65;
  visibility: hidden;
  pointer-events: none;
  overflow-wrap: anywhere;
}

#products.ws-products .ws-summary .product-actions.ws-measure-actions {
  position: absolute;
  inset-inline: 0;
  min-height: 0 !important;
  margin-inline: auto;
  visibility: hidden;
  pointer-events: none;
}

#products.ws-products #clinmate-capabilities.cx-explorer {
  width: 100%;
  margin: 0;
  padding: 0;
}

#products.ws-products .cx-explorer > .cx-intro {
  display: none;
}

#products.ws-products .cx-explorer > .cx-motion-toggle {
  display: none !important;
}

#products.ws-products #product-panel[data-product="clin"] > .ws-product-visual {
  display: none;
}

#products.ws-products #product-panel[data-product="work"] > .ws-product-visual,
#products.ws-products #product-panel[data-product="health"] > .ws-product-visual {
  display: block;
  width: 100%;
  max-width: 1000px;
  min-width: 0;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: white;
  box-shadow: none;
  overflow: visible;
}

#products.ws-products #product-panel[data-product] > .ws-product-visual > .screenshot-heading,
#products.ws-products #product-panel[data-product] > .ws-product-visual > figcaption {
  display: none;
}

#products.ws-products #product-panel[data-product="work"] .ws-product-visual .screenshot-stage,
#products.ws-products #product-panel[data-product="health"] .ws-product-visual .screenshot-stage {
  display: block;
  position: static;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  aspect-ratio: auto;
  overflow: visible;
  background: white;
}

#products.ws-products #product-panel[data-product="work"] .ws-product-visual .inline-player {
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: white;
  box-shadow: none;
}

#products.ws-products #product-panel[data-product="work"] .ws-product-visual .inline-player-screen {
  width: 100%;
  height: auto;
  max-height: 520px;
  min-height: 0;
  margin: 0;
  border: 0;
  border-radius: 8px;
  background: white;
  box-shadow: none;
  overflow: hidden;
}

#products.ws-products #product-panel[data-product="work"] .ws-product-visual .product-inline-video,
#products.ws-products #product-panel[data-product="work"] .ws-product-visual #product-image {
  display: block;
  position: static;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 520px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  object-fit: contain;
  object-position: center;
  background: white;
  box-shadow: none;
}

#products.ws-products #product-panel[data-product="work"] .ws-product-visual .inline-player-controls {
  min-height: 44px;
  padding-inline: 0;
  background: white;
}

#products.ws-products #product-panel[data-product="work"] .ws-product-visual .inline-player-controls button {
  width: 44px;
  height: 44px;
  min-height: 44px;
  flex-basis: 44px;
}

#products.ws-products #product-panel[data-product="work"] .ws-product-visual .inline-player-fallback {
  max-height: 564px;
  min-height: 480px;
  padding: 18px;
  border: 0;
  border-radius: 8px;
  background: white;
  box-shadow: none;
  overflow: auto;
  overscroll-behavior: contain;
}

#products.ws-products #product-panel[data-product="work"] .ws-product-visual .inline-player-fallback img {
  position: static;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 380px;
  margin: 0 auto;
  border: 0;
  object-fit: contain;
  background: white;
  box-shadow: none;
}

#products.ws-products #product-panel[data-product="health"] .healthmate-live {
  gap: 12px;
}

#products.ws-products #product-panel[data-product="health"] .healthmate-phone {
  width: min(390px, 100%);
  margin-inline: auto;
  border: 1px solid #dae6f4;
  border-radius: 14px;
  background: white;
  box-shadow: none;
}

#products.ws-products #healthmate-live-frame {
  height: 660px;
  background: white;
}

#products.ws-products #healthmate-live .healthmate-live-caption > span,
#products.ws-products #healthmate-live .healthmate-live-caption > a {
  display: none;
}

#products.ws-products #healthmate-live .healthmate-live-caption {
  width: min(480px, 100%);
  margin: 0;
  padding: 0;
  color: #657a92;
  font-size: .875rem;
  line-height: 1.65;
  text-align: center;
}

#products.ws-products #healthmate-live .healthmate-live-caption p {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
}

#products.ws-products .ws-summary a:focus-visible {
  outline: 2px solid var(--ws-blue);
  outline-offset: 3px;
}

@media (max-width: 1050px) {
  #products.ws-products {
    width: calc(100% - 64px);
  }
}

@media (max-width: 760px) {
  #products.ws-products {
    width: calc(100% - 40px);
    padding-block: 24px 32px;
  }

  #products.ws-products > .section-heading {
    margin-bottom: 18px;
  }

  #products.ws-products > .section-heading > h2 {
    font-size: 1.45rem;
    line-height: 1.45;
    letter-spacing: -.025em;
  }

  #products.ws-products > .product-tabs {
    gap: 2px;
    min-height: 52px;
    padding: 3px;
  }

  #products.ws-products > .product-tabs > button[data-product] {
    flex: 1 1 auto;
    gap: 5px;
    min-height: 44px;
    padding: 9px 8px;
  }

  #products.ws-products > .product-tabs > button[data-product] > strong {
    font-size: .825rem;
    line-height: 1.4;
  }

  #products.ws-products > .product-tabs .ws-tab-icon {
    width: 16px;
    height: 16px;
    flex-basis: 16px;
  }

  #products.ws-products #product-panel[data-product] {
    margin-top: 16px;
  }

  #products.ws-products #product-panel[data-product] > .ws-summary {
    margin-bottom: 20px;
  }

  #products.ws-products .ws-summary #product-description,
  #products.ws-products .ws-summary .ws-measure-description {
    font-size: .9375rem;
    line-height: 1.7;
  }

  #products.ws-products .ws-summary .product-actions {
    gap: 6px 16px;
    margin-top: 8px;
  }

  #products.ws-products .ws-summary .product-actions > a {
    font-size: .825rem;
  }

  #products.ws-products .ws-summary #product-link {
    padding-inline: 16px;
  }

  #products.ws-products #product-panel[data-product="work"] .ws-product-visual .inline-player-screen,
  #products.ws-products #product-panel[data-product="work"] .ws-product-visual .product-inline-video,
  #products.ws-products #product-panel[data-product="work"] .ws-product-visual #product-image {
    max-height: 430px;
    border-radius: 5px;
  }

  #products.ws-products #product-panel[data-product="work"] .ws-product-visual .inline-player-fallback {
    min-height: 320px;
    max-height: 470px;
    padding: 12px 0;
  }

  #products.ws-products #product-panel[data-product="work"] .ws-product-visual .inline-player-fallback img {
    max-height: 300px;
  }

  #products.ws-products #healthmate-live-frame {
    height: min(660px, 75dvh);
    min-height: 520px;
  }
}

@media (max-width: 360px) {
  #products.ws-products {
    width: calc(100% - 32px);
  }

  #products.ws-products > .product-tabs > button[data-product] {
    gap: 4px;
    padding-inline: 6px;
  }

  #products.ws-products > .product-tabs > button[data-product] > strong {
    font-size: .75rem;
  }

  #products.ws-products > .product-tabs .ws-tab-icon {
    width: 14px;
    height: 14px;
    flex-basis: 14px;
  }

  #products.ws-products > .section-heading > h2 {
    font-size: 1.3rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  #products.ws-products > .product-tabs > button[data-product] {
    transition: none;
  }
}