/* Product details inherit the approved homepage's Manrope, navy and mint system. */
.product-detail { background: var(--paper); color: var(--text); }
.product-detail .site-header, .product-detail .site-footer { color: #fff; }
.product-detail .container { width: min(100% - var(--gutter) * 2, 1320px); margin-inline: auto; }
.product-detail main { overflow: clip; }
.product-detail h2 { font-size: clamp(34px, 3.5vw, 52px); }
.product-detail h3 { font-size: clamp(23px, 2.1vw, 29px); line-height: 1.25; }
.product-detail p { max-width: 68ch; }
.product-detail a { text-underline-offset: 5px; }
.product-detail :is(.section, .page-cta, .demo-cta-section, .platform-pathway) { padding-block: clamp(64px, 7vw, 104px); }
.product-detail :is(#page-details, #platform-modules, #demo-form) { scroll-margin-top: 64px; }

.detail-hero { position: relative; isolation: isolate; overflow: hidden; min-height: 640px; background: #041b28; color: white; }
.detail-hero > .container { position: relative; z-index: 2; pointer-events: none; }
.detail-hero-copy { width: 47%; padding-block: 44px 64px; pointer-events: auto; }
.detail-hero-copy h1 { font-size: clamp(48px, 4.5vw, 68px); line-height: 1.08; font-weight: 550; letter-spacing: -.04em; }
.detail-hero-copy h1 span { color: var(--mint); }
.detail-hero-copy > p:not(.endorsement) { margin-top: 24px; color: #bdd1d8; font-size: 18px; line-height: 1.8; max-width: 44ch; }
.page-breadcrumb { display: flex; gap: 12px; align-items: center; font-size: 13px; color: #acc8d1; margin-bottom: 32px; }
.page-breadcrumb a { padding-block: 6px; }
.page-breadcrumb a:hover { color: var(--mint); text-decoration: underline; }
.page-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 28px; margin-top: 30px; }
.page-text-link { font-size: 15px; font-weight: 650; display: inline-flex; align-items: center; gap: 14px; padding-block: 9px; border-bottom: 1px solid #729a9b; }
.page-text-link:hover { color: #256e60; }
.detail-hero .page-text-link:hover { color: var(--mint); }
.endorsement { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 30px; color: #b4cdd4; font-size: 12px; }
.endorsement .hlink-logo { width: 89px; height: auto; }
.endorsement .relationship-strip { flex-basis: 100%; margin-top: 2px; font-size: 13px; }
.detail-art { position: absolute; z-index: 0; width: 80%; right: -1%; top: 50%; transform: translateY(-48%); pointer-events: none; }
.detail-art img { width: 100%; max-width: none; height: auto; mask-image: linear-gradient(90deg, transparent, #000 25%, #000 92%, transparent); }
.detail-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, #041b28, transparent 20%, transparent 83%, #041b28); }
.detail-art figcaption { position: absolute; bottom: 9%; right: 20%; z-index: 1; font-size: 12px; color: #acc4cd; }
@media (prefers-reduced-motion: no-preference) {
  .detail-art { animation: detail-arrive 1.1s var(--ease) both; }
  @keyframes detail-arrive { from { opacity: .65; transform: translate(18px, -46%); } to { opacity: 1; transform: translate(0, -48%); } }
}
.product-route-nav { position: sticky; top: var(--header); z-index: 15; background: #092735; color: #c4d9df; border-block: 1px solid #2c4855; }
.product-route-nav .container { display: flex; align-items: stretch; gap: 42px; }
.product-route-nav a { display: flex; align-items: center; min-height: 64px; padding-block: 12px; font-size: 15px; position: relative; white-space: nowrap; }
.product-route-nav a[aria-current="page"] { color: var(--mint); }
.product-route-nav a[aria-current="page"]::after { content: ""; position: absolute; height: 2px; bottom: -1px; left: 0; right: 0; background: var(--mint); }
.product-route-nav a:hover { color: #fff; }
.product-route-nav .all-products { margin-left: auto; font-size: 13px; }
.portal-access-notice { padding-block: 23px; background: #e2ebe6; border-bottom: 1px solid #c5d7d0; color: #365851; font-size: 15px; }
.portal-access-notice p { max-width: none; }

.section-heading { margin-bottom: 44px; }
.section-heading h2 { max-width: none; }
.section-heading > p { color: #506d77; font-size: 17px; line-height: 1.8; max-width: 60ch; }
.section-heading > h2 ~ p { margin-top: 22px; }
.section-heading h2:only-child { max-width: 25ch; }
.platform-pathway { background: #092735; color: #fff; }
.product-detail .platform-pathway { padding-block: 46px 52px; }
.page-network > p { font-size: 20px; color: #b9d3da; margin-bottom: 32px; }
.page-network ol, .page-steps, .showcase-workflow, .referral-connection-map { padding: 0; margin: 0; list-style: none; }
.page-network ol { display: grid; grid-template-columns: repeat(3, 1fr); gap: 36px; }
.page-network li { border-top: 1px solid #385661; padding-top: 22px; display: grid; grid-template-columns: 30px 1fr; gap: 7px 12px; }
.page-network li > span { color: #8db2be; font-size: 13px; padding-top: 4px; }
.page-network strong { font-size: 19px; font-weight: 600; }
.page-network small { grid-column: 2; color: #b2cbd4; font-size: 15px; line-height: 1.75; max-width: 32ch; }
.page-network .network-core { border-color: var(--mint); }
.page-network .network-core strong { color: var(--mint); }
.product-proof { padding: 30px; background: #dfe8e4; border-radius: 6px; }
.product-proof img { width: 100%; height: auto; box-shadow: 0 14px 30px #0927351a; }
.product-proof figcaption { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 24px; font-size: 13px; color: #48666c; }
.product-proof figcaption a { font-size: 14px; font-weight: 650; text-decoration: underline; }
#platform-modules { padding-top: 0; }
.product-family-grid--modules { display: grid; grid-template-columns: 1fr 1fr; gap: 0 70px; border-top: 1px solid #b8ccca; }
.product-family-card { padding: 34px 0 38px; border-bottom: 1px solid #b8ccca; }
.product-family-card > p { color: #506d77; font-size: 17px; line-height: 1.8; max-width: 44ch; margin-block: 18px 22px; }
.product-family-card > a { font-size: 15px; font-weight: 650; display: inline-flex; align-items: center; gap: 18px; padding-block: 6px; color: #216b5e; }
.product-family-card > a:hover { text-decoration: underline; }
.ris-pacs-outcomes-section { background: #e2ebe6; }
.ris-pacs-outcomes-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px 70px; }
.ris-pacs-outcomes-grid article { padding-top: 24px; border-top: 1px solid #bacdc4; }
.ris-pacs-outcomes-grid h3 { font-size: 23px; }
.ris-pacs-outcomes-grid p { color: #4b695f; font-size: 16px; line-height: 1.85; margin-top: 14px; }
.demo-cta-section, .page-cta { background: #092735; color: #fff; }
.demo-cta-section > .container, .page-cta > .container { display: flex; align-items: center; justify-content: space-between; gap: 48px; }
.demo-cta-section h2, .page-cta h2 { max-width: 21ch; }
.page-cta p { color: #b6cdd5; margin-top: 24px; max-width: 50ch; }
.page-cta .button, .demo-cta-section .button { flex-shrink: 0; }

.referral-showcase-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: center; }
.referral-showcase-grid > div > p { color: #506d77; margin-top: 24px; line-height: 1.8; }
.showcase-workflow { counter-reset: referral; margin-top: 34px; }
.showcase-workflow li { position: relative; padding: 22px 0 22px 46px; border-top: 1px solid #bfd1cd; counter-increment: referral; }
.showcase-workflow li::before { content: counter(referral, decimal-leading-zero); position: absolute; left: 0; top: 27px; color: #537b72; font-size: 13px; }
.showcase-workflow h3 { font-size: 22px; }
.showcase-workflow p { font-size: 16px; color: #506d77; line-height: 1.8; margin-top: 12px; }
.referral-care-image { min-width: 0; }
.referral-care-image img { width: 100%; height: auto; aspect-ratio: 4/5; object-fit: cover; object-position: right center; border-radius: 5px; }
.referral-care-image figcaption { color: #526f78; font-size: 13px; padding-top: 18px; }
.referral-connection-story { margin-top: 86px; padding-block: 64px 30px; border-top: 1px solid #b8ccca; }
.referral-connection-story > p { color: #506d77; margin-top: 24px; }
.referral-connection-map { display: grid; grid-template-columns: repeat(3, 1fr); gap: 38px; margin-top: 42px; }
.referral-connection-map li { border-top: 1px solid #9cbab4; padding-top: 28px; }
.referral-connection-map svg { display: block; box-sizing: border-box; width: 60px; height: 60px; padding: 12px; border-radius: 14px; background: #e1eeea; box-shadow: inset 0 0 0 1px #c9ddd7; fill: none; stroke: #2c7262; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 22px; }
.referral-connection-map .referral-connection-core svg { background: #216b5e; box-shadow: 0 8px 20px -10px rgba(33,107,94,.7); stroke: #e8fbf5; }
.referral-connection-map h3 { font-size: 23px; }
.referral-connection-map p { font-size: 16px; color: #506d77; line-height: 1.8; margin-top: 18px; }
.referral-connection-map .referral-connection-core { border-color: #287f6d; }
.referral-connection-core h3 { color: #216b5e; }
.referral-connection-story .referral-connection-note { font-size: 15px; max-width: 75ch; margin-top: 36px; }
.referral-connection-story > a { margin-top: 18px; }
.product-preview-details { border-top: 1px solid #adc4bc; border-bottom: 1px solid #adc4bc; margin-top: 50px; }
.product-preview-details summary { cursor: pointer; padding: 25px 0; font-size: 19px; font-weight: 600; }
.product-preview-details summary::marker { color: #397c6e; }
.product-preview-details summary:hover { color: #216b5e; }
.gp-referral-feature-grid, .patient-portal-feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; padding-block: 16px 32px; }
.gp-referral-feature-grid h3, .patient-portal-feature-grid h3 { font-size: 23px; }
.product-preview-details ul { padding-left: 20px; font-size: 16px; color: #506d77; margin-top: 22px; }
.product-preview-details li { padding-block: 8px; }
.product-preview-details li::marker { color: #397c6e; }
.gp-access-section { background: #e2ebe6; }
.gp-plan-comparison { overflow: auto; border-top: 1px solid #9bb7ad; scrollbar-color: #527e71 #d2e2d9; }
.comparison-hint { display: none; }
.clinic-plan-table { width: 100%; border-collapse: collapse; text-align: left; font-size: 16px; font-variant-numeric: tabular-nums; }
.clinic-plan-table caption { text-align: left; font-size: 14px; color: #526f64; padding-block: 22px; }
.clinic-plan-table :is(th, td) { padding: 19px 24px; border-bottom: 1px solid #bdcfc5; width: 30%; }
.clinic-plan-table tr > :first-child { padding-left: 0; width: 40%; }
.clinic-plan-table thead th { background: #163f42; color: #fff; font-size: 20px; font-weight: 600; }
.clinic-plan-table thead th:first-child { padding-left: 24px; }
.clinic-plan-table thead th:last-child { color: #b4f3df; }
.clinic-plan-table tbody th { font-weight: 550; }
.clinic-plan-table tbody td { color: #45665c; }
.clinic-plan-table tbody tr:hover { background: #d6e5db; }
.clinic-access-next { display: flex; align-items: center; justify-content: space-between; gap: 50px; margin-top: 40px; }
.clinic-access-next p { font-size: 16px; color: #45665c; max-width: 70ch; }
.clinic-access-next .button { background: #163f42; color: #fff; flex-shrink: 0; }
.clinic-access-next .button:hover { background: #265a54; }

.portal-walkthrough { display: grid; grid-template-columns: .8fr 1.2fr; gap: 8%; align-items: center; }
.page-steps li { display: grid; grid-template-columns: 32px 1fr; column-gap: 18px; padding-block: 30px; border-top: 1px solid #b8ccca; }
.page-steps li > span { font-size: 13px; color: #537b72; padding-top: 5px; }
.page-steps li p { grid-column: 2; font-size: 17px; color: #506d77; line-height: 1.8; margin-top: 16px; }
.portal-product-previews { padding: 38px 32px 28px; background: #dfe8e4; border-radius: 6px; min-width: 0; }
.portal-screen-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.portal-screen-pair figure { min-width: 0; }
.portal-screen-pair figure:nth-child(2) { padding-top: 45px; }
.portal-screen-pair a { display: block; cursor: zoom-in; }
.portal-screen-pair img { width: 100%; height: auto; border-radius: 10px; box-shadow: 0 12px 25px #09273522; }
.portal-screen-pair figcaption { font-size: 12px; color: #4b696b; padding-top: 17px; line-height: 1.6; }
.portal-product-previews > p { font-size: 12px; color: #4b696b; margin-top: 25px; }
.page-dark { background: #e2ebe6; }
.portal-outcomes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 48px; }
.portal-outcomes article { border-top: 1px solid #b3c9be; padding-top: 28px; }
.portal-outcomes p { color: #4b695f; font-size: 17px; line-height: 1.8; margin-top: 20px; }

@media (min-width: 1600px) { .detail-hero-copy { padding-block: 76px 84px; } .detail-hero { min-height: 720px; } }
@media (max-width: 1100px) and (min-width: 800px) {
  .detail-hero-copy { width: 52%; }
  .detail-hero-copy h1 { font-size: 50px; }
  .detail-art { right: -2%; width: 78%; }
  .detail-hero-copy > p:not(.endorsement) { font-size: 17px; max-width: 37ch; }
  .detail-art figcaption { right: 28%; }
}
@media (max-width: 950px) {
  .referral-showcase-grid { gap: 5%; }
  .product-route-nav .container { gap: 26px; }
  .product-route-nav a { font-size: 14px; }
  .product-route-nav .all-products { display: none; }
}
@media (max-width: 799px) {
  .detail-hero { min-height: 0; display: flex; flex-direction: column; }
  .detail-hero-copy { width: 100%; padding-block: 30px 24px; }
  .detail-hero-copy h1 { font-size: clamp(42px, 7.2vw, 58px); max-width: 19ch; }
  .detail-hero-copy > p:not(.endorsement) { max-width: 54ch; font-size: 17px; }
  .page-breadcrumb { margin-bottom: 25px; }
  .detail-art { position: relative; top: auto; right: auto; transform: none; width: 120%; margin: -22px -4% -12px -16%; animation: none; }
  .detail-art img { mask-image: linear-gradient(90deg, transparent, #000 10%, #000 95%, transparent); }
  .detail-art figcaption { right: 13%; font-size: 11px; bottom: 8%; }
  .page-hero-actions { gap: 18px; }
  .endorsement { margin-top: 24px; }
  .product-route-nav .container { width: 100%; padding-inline: var(--gutter); gap: 25px; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
  .product-route-nav a { flex-shrink: 0; min-height: 60px; }
  .section-heading { margin-bottom: 34px; }
  .page-network ol { grid-template-columns: 1fr; gap: 24px; }
  .page-network small { max-width: 55ch; }
  .page-network > p { font-size: 19px; }
  .referral-showcase-grid, .portal-walkthrough { grid-template-columns: 1fr; gap: 38px; }
  .referral-care-image img { aspect-ratio: 3/2; }
  .referral-connection-map { grid-template-columns: 1fr; gap: 25px; }
  .referral-connection-map li { display: grid; grid-template-columns: 52px 1fr; gap: 0 18px; }
  .referral-connection-map svg { width: 52px; height: 52px; padding: 10px; border-radius: 12px; }
  .referral-connection-map svg { grid-row: 1/3; margin: 0; }
  .referral-connection-map p { grid-column: 2; }
  .referral-connection-story { margin-top: 60px; padding-top: 50px; }
  .gp-referral-feature-grid, .patient-portal-feature-grid { grid-template-columns: 1fr; gap: 32px; }
  .clinic-access-next, .demo-cta-section > .container, .page-cta > .container { flex-direction: column; align-items: flex-start; gap: 30px; }
  .portal-outcomes { grid-template-columns: 1fr; gap: 28px; }
  .portal-outcomes p { max-width: 65ch; }
  .product-proof { padding: 20px; }
}
@media (max-width: 600px) {
  .product-detail { font-size: 17px; }
  .product-detail h2 { font-size: 34px; }
  .detail-hero-copy h1 { font-size: 42px; }
  .detail-art { width: 145%; margin-inline: -42% -3%; margin-top: -6px; }
  .detail-art figcaption { right: 10%; font-size: 10px; }
  .product-route-nav .container { gap: 23px; }
  .product-route-nav a { font-size: 12px; }
  .product-detail :is(#page-details, #platform-modules, #demo-form) { scroll-margin-top: 44px; }
  .product-family-grid--modules, .ris-pacs-outcomes-grid { grid-template-columns: 1fr; }
  .product-proof { padding: 12px; }
  .product-proof figcaption { align-items: flex-start; flex-direction: column; gap: 12px; padding: 20px 5px 8px; }
  .product-preview-details summary { font-size: 17px; }
  .clinic-plan-table { min-width: 580px; font-size: 15px; }
  .comparison-hint { display: block; color: #45665c; font-size: 14px; margin-bottom: 18px; }
  .clinic-plan-table :is(th, td) { padding: 16px; }
  .clinic-plan-table thead th { font-size: 18px; }
  .portal-product-previews { padding: 24px 15px; }
  .portal-screen-pair { gap: 16px; }
  .portal-screen-pair figure:nth-child(2) { padding-top: 30px; }
  .portal-screen-pair figcaption { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) { .detail-art { animation: none; } }