.product-page .product-hero { position: relative; height: 690svh; min-height: 4600px; overflow: visible; padding: 0; background: radial-gradient(circle at 10% 92%,rgba(72,169,166,.13),transparent 31%),radial-gradient(circle at 90% 78%,rgba(55,99,97,.09),transparent 30%),linear-gradient(180deg,#f7f6f0 0%,#eef5f2 100%); }
.product-hero-sticky { position: sticky; top: 0; height: 100svh; min-height: 0; overflow: hidden; }
.product-hero-inner { position: relative; height: 100%; }
.product-hero-copy { position: absolute; z-index: 2; top: clamp(100px,11svh,116px); left: 50%; width: min(900px,100%); display: block; opacity: var(--hero-copy-opacity,1); text-align: center; transform: translate3d(-50%,var(--hero-copy-y,0),0); will-change: transform,opacity; }
.product-page .product-hero h1 { max-width: 820px; margin: 0 auto; font-size: clamp(46px,4.25vw,62px); line-height: 1; text-wrap: balance; }
.product-hero-copy .page-actions { justify-content: center; margin-top: 28px; }
.product-hero-story { position: absolute; z-index: 3; top: 50%; left: 0; width: min(340px,29vw); opacity: var(--hero-story-opacity,0); pointer-events: none; transform: translate3d(0,calc(-50% + var(--hero-story-y,24px)),0); will-change: transform,opacity; }
.product-hero-story .page-kicker { display: block; margin-bottom: 17px; }
.product-hero-story h2 { margin: 0; font-family: var(--serif); font-size: clamp(34px,3vw,44px); font-weight: 400; line-height: 1.01; letter-spacing: -.035em; }
.product-hero-story p { margin: 22px 0 0; color: #52615e; font-size: 15px; line-height: 1.62; }
.product-hero-chapters {
  display: grid;
  gap: 4px;
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
  pointer-events: auto;
}
.product-hero-chapters button {
  width: 100%;
  min-height: 32px;
  display: flex;
  align-items: center;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  color: #52615e;
  background: transparent;
  font: 650 12px/1.2 inherit;
  text-align: left;
  cursor: pointer;
}
.product-hero-chapters button:hover { background: rgba(55,99,97,.08); }
.product-hero-chapters button.is-active {
  color: #244b49;
  background: #e5f1ee;
}
.product-hero-story ul { display: grid; gap: 10px; margin: 25px 0 0; padding: 0; list-style: none; }
.product-hero-story li { position: relative; padding-left: 20px; color: #344642; font-size: 12px; line-height: 1.5; }
.product-hero-story li::before { position: absolute; top: .5em; left: 0; width: 8px; height: 8px; border-radius: 50%; background: #48a9a6; content: ""; }
.product-hero-window { position: absolute; z-index: 1; top: 315px; left: 50%; width: min(1120px,calc(100vw - 72px),calc((100svh - 72px) * 1.7778)); aspect-ratio: 16/9; height: auto; margin: 0; overflow: hidden; border: 1px solid #b7cbc6; border-radius: 22px; background: #fff; box-shadow: 0 38px 90px -42px rgba(28,54,49,.44); transform: translate3d(calc(-50% + var(--hero-window-x,0px)),var(--hero-window-y,0),0) scale(var(--hero-window-scale,.86)); transform-origin: 50% 50%; will-change: transform; }
.product-page .product-hero + .page-section.paper { position: relative; z-index: 3; margin-top: 0; padding-top: clamp(62px,6vw,82px); border-radius: 32px 32px 0 0; box-shadow: 0 -18px 46px -38px rgba(28,54,49,.62); }
.process-overview { padding-bottom: clamp(86px,9vw,130px); }
.process-intro { max-width: 800px; margin: 0 auto clamp(52px,7vw,92px); text-align: center; }
.process-intro .page-kicker { display: block; margin-bottom: 18px; }
.process-intro h2 { max-width: none; margin: 0; font-family: var(--serif); font-size: clamp(48px,5.4vw,72px); font-weight: 400; line-height: .98; letter-spacing: -.04em; }
.process-intro p { max-width: 600px; margin: 22px auto 0; color: #596560; font-size: 17px; line-height: 1.55; }
.process-list { position: relative; display: grid; gap: clamp(64px,7vw,96px); }
.process-list::before { position: absolute; top: 0; bottom: 0; left: 16px; width: 1px; background: #c8d5d1; content: ""; }
.process-step { position: relative; min-height: 740px; display: grid; grid-template-columns: minmax(280px,430px) minmax(0,590px); justify-content: center; gap: clamp(48px,5vw,72px); align-items: center; padding-left: 66px; transform: translateY(16px); transition: transform .6s cubic-bezier(.22,.8,.28,1); }
.process-step::before { position: absolute; top: 50%; left: 8px; width: 17px; height: 17px; border: 5px solid #faf8f4; border-radius: 50%; background: #aebfba; box-shadow: 0 0 0 1px #9fb4ae; content: ""; transform: translateY(-50%); transition: background-color .35s, box-shadow .35s; }
.process-step.is-active,.process-step.is-seen { transform: none; }
.process-step.is-active::before { background: #376361; box-shadow: 0 0 0 1px #376361,0 0 0 7px rgba(72,169,166,.12); }
.process-step:nth-child(even) .process-copy { grid-column: 2; grid-row: 1; }
.process-step:nth-child(even) .process-demo { grid-column: 1; grid-row: 1; }
.process-step:nth-child(even) { grid-template-columns: minmax(0,590px) minmax(280px,430px); }
.process-copy { max-width: 430px; }
.process-number { display: block; margin-bottom: 20px; color: #2f7773; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.process-copy h3 { margin: 0; font-family: var(--serif); font-size: clamp(44px,5vw,68px); font-weight: 400; line-height: .96; letter-spacing: -.04em; }
.process-copy p { max-width: 390px; margin: 26px 0 0; color: #596560; font-size: 16px; line-height: 1.62; }
.process-copy ul { display: grid; gap: 9px; max-width: 390px; margin: 22px 0 0; padding: 0; list-style: none; }
.process-copy li { position: relative; padding-left: 18px; color: #3e4d49; font-size: 12px; line-height: 1.5; }
.process-copy li::before { position: absolute; top: .55em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: #48a9a6; content: ""; }
.process-next { max-width: 390px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 10px; align-items: center; margin-top: 24px; padding-top: 17px; border-top: 1px solid #cbd8d4; color: #244b49; }
.process-next small { padding: 5px 7px; border-radius: 999px; color: #376361; background: #e3f0ed; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.process-next b { font-size: 11px; font-weight: 800; }
.process-next span { font-size: 15px; transition: transform .2s ease; }
.process-step.is-active .process-next span { transform: translateX(4px); }
.process-next.is-complete small { color: #28775e; background: #def2e7; }
.process-demo { position: relative; width: min(100%,590px); min-height: 720px; justify-self: end; overflow: hidden; border: 1px solid #c8d5e2; border-radius: 22px; background: radial-gradient(circle at 82% 22%,rgba(238,218,222,.58),transparent 42%),linear-gradient(145deg,#eef0fb 0%,#eef5f2 100%); box-shadow: 0 32px 76px -42px rgba(28,54,49,.58); }
.process-step:nth-child(even) .process-demo { justify-self: start; }
.process-demo::before { position: absolute; inset: 0; background: linear-gradient(90deg,transparent 18%,rgba(90,118,181,.13) 18%,rgba(90,118,181,.13) calc(18% + 1px),transparent calc(18% + 1px)),linear-gradient(180deg,transparent 34%,rgba(90,118,181,.13) 34%,rgba(90,118,181,.13) calc(34% + 1px),transparent calc(34% + 1px)); content: ""; }
.process-demo > header { position: absolute; z-index: 2; top: 86px; left: 8%; width: 84%; min-height: 60px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 18px; padding: 0 22px; border: 1px solid #d4dfdc; border-radius: 16px 16px 0 0; color: #52615e; background: rgba(255,255,255,.98); box-shadow: 0 18px 45px rgba(40,55,68,.08); font-size: 11px; }
.process-demo > header > b { color: #376361; font-size: 22px; font-weight: 400; letter-spacing: -.05em; }
.process-demo > header > b strong { font-weight: 800; }
.process-demo > header > span { font-weight: 700; }
.process-demo > header > i { justify-self: end; padding: 6px 9px; border-radius: 999px; color: #315957; background: #e0efec; font-size: 8px; font-style: normal; font-weight: 800; }
.process-demo .workflow-visual { position: absolute; z-index: 1; top: 145px; left: 8%; width: 84%; min-height: 466px; padding: 32px; border: 1px solid #d4dfdc; border-top: 0; border-radius: 0 0 16px 16px; background: rgba(248,250,249,.98); box-shadow: 0 18px 45px rgba(40,55,68,.08); }
.workflow-steps { position: absolute; z-index: 3; right: 8%; bottom: 30px; left: 8%; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; }
.workflow-steps span { padding-top: 10px; border-top: 3px solid rgba(71,96,91,.16); color: #66716e; font-size: 7px; font-weight: 700; line-height: 1.25; transition: color .25s ease,border-color .25s ease; }
.process-step.is-resetting .workflow-visual *,
.process-step.is-resetting .workflow-steps span { transition: none !important; }
.process-step[data-phase="0"] .workflow-steps span:nth-child(1),
.process-step[data-phase="1"] .workflow-steps span:nth-child(2),
.process-step[data-phase="2"] .workflow-steps span:nth-child(3),
.process-step[data-phase="3"] .workflow-steps span:nth-child(4) { color: #244b49; border-color: #376361; }
.process-step[data-phase="1"] .workflow-steps span:nth-child(1),
.process-step[data-phase="2"] .workflow-steps span:nth-child(-n+2),
.process-step[data-phase="3"] .workflow-steps span:nth-child(-n+3) { border-color: #8fc4ba; }
.process-step[data-workflow-step="0"][data-phase="0"] .micro-patient-list header > span,
.process-step[data-workflow-step="1"][data-phase="0"] .micro-upload-library > header > span,
.process-step[data-workflow-step="2"][data-phase="0"] .micro-data-grid article:first-child,
.process-step[data-workflow-step="3"][data-phase="0"] .micro-report-grid article:first-child,
.process-step[data-workflow-step="4"][data-phase="0"] .micro-share-list article:first-child { animation: workflow-target-0 1.28s ease both; }
.process-step[data-workflow-step="0"][data-phase="1"] .micro-patient-button,
.process-step[data-workflow-step="1"][data-phase="1"] .micro-upload-file.micro-focus,
.process-step[data-workflow-step="2"][data-phase="1"] .micro-data-biomarkers article.is-selected,
.process-step[data-workflow-step="3"][data-phase="1"] .micro-report-actions strong,
.process-step[data-workflow-step="4"][data-phase="1"] .micro-share-actions strong { animation: workflow-target-1 1.28s ease both; }
.process-step[data-workflow-step="0"][data-phase="2"] .micro-patient-created .micro-patient-actions span,
.process-step[data-workflow-step="1"][data-phase="2"] .micro-upload-review figure,
.process-step[data-workflow-step="2"][data-phase="2"] .micro-data-care article:first-of-type,
.process-step[data-workflow-step="3"][data-phase="2"] .micro-report-source,
.process-step[data-workflow-step="4"][data-phase="2"] .micro-share-mail strong { animation: workflow-target-2 1.28s ease both; }
.process-step[data-workflow-step="0"][data-phase="3"] .micro-patient-edit .micro-patient-actions strong,
.process-step[data-workflow-step="1"][data-phase="3"] .micro-upload-organized .micro-upload-toolbar span:last-child,
.process-step[data-workflow-step="2"][data-phase="3"] .micro-data-sources article:first-of-type strong,
.process-step[data-workflow-step="3"][data-phase="3"] .micro-report-approve footer strong,
.process-step[data-workflow-step="4"][data-phase="3"] .micro-share-report > article { animation: workflow-target-3 1.28s ease both; }
@keyframes workflow-target-0 { 0%,56%,76%,100% { transform: scale(1); } 64% { transform: scale(.975); } }
@keyframes workflow-target-1 { 0%,56%,76%,100% { transform: scale(1); } 64% { transform: scale(.975); } }
@keyframes workflow-target-2 { 0%,56%,76%,100% { transform: scale(1); } 64% { transform: scale(.975); } }
@keyframes workflow-target-3 { 0%,56%,76%,100% { transform: scale(1); } 64% { transform: scale(.975); } }
.micro-patient { overflow: hidden; }
.micro-patient-view { position: absolute; inset: 28px; opacity: 0; transform: translateY(10px) scale(.985); transition: opacity .38s ease,transform .45s cubic-bezier(.22,.8,.28,1); }
.process-step[data-phase="0"] .micro-patient-list,
.process-step[data-phase="1"] .micro-patient-form,
.process-step[data-phase="2"] .micro-patient-created,
.process-step[data-phase="3"] .micro-patient-edit { opacity: 1; transform: none; }
.micro-patient-view header { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.micro-patient-view b,.micro-patient-view small { display: block; }
.micro-patient-view header b { color: #202523; font-size: 14px; }
.micro-patient-view small { margin-top: 3px; color: #64716d; font-size: 8px; }
.micro-patient-view header > span,.micro-patient-button { padding: 8px 10px; border-radius: 7px; color: #fff; background: #376361; font-size: 8px; font-weight: 800; }
.micro-patient-search { height: 34px; display: flex; align-items: center; padding: 0 11px; border: 1px solid #d2dfdc; border-radius: 7px; color: #7a8682; background: #fff; font-size: 8px; }
.micro-patient-list article { min-height: 64px; display: grid; grid-template-columns: 34px minmax(0,1fr) auto; gap: 11px; align-items: center; border-bottom: 1px solid #dce5e2; }
.micro-patient-list article > i,.micro-patient-form header > i,.micro-patient-selector > i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #376361; font-size: 8px; font-style: normal; font-weight: 800; }
.micro-patient-list article b { font-size: 10px; }
.micro-patient-list article > strong { color: #376361; font-size: 15px; }
.micro-patient-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px 12px; }
.micro-patient-fields label { color: #66736f; font-size: 7px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.micro-patient-fields em { min-height: 42px; display: flex; align-items: center; margin-top: 6px; padding: 0 11px; border: 1px solid #d2dfdc; border-radius: 7px; color: #29302d; background: #fff; font-size: 9px; font-style: normal; font-weight: 500; letter-spacing: 0; text-transform: none; }
.micro-patient-invite { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 14px; padding: 10px 11px; border: 1px solid #bad0ca; border-radius: 9px; background: #fff; }
.micro-patient-invite b { font-size: 9px; }
.micro-patient-invite small { margin-top: 4px; font-size: 7px; line-height: 1.35; }
.micro-patient-invite > span { min-width: 35px; padding: 6px 8px; border-radius: 999px; color: #596560; background: #e5ebe9; font-size: 7px; font-weight: 800; text-align: center; }
.micro-patient-button { width: fit-content; display: block; margin: 22px 0 0 auto; }
.micro-patient-form .micro-patient-button { margin-top: 12px; }
.micro-patient-selector { min-height: 58px; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; gap: 11px; align-items: center; padding: 9px 11px; border: 1px solid #bad0ca; border-radius: 9px; background: #fff; }
.micro-patient-selector b { font-size: 11px; }
.micro-patient-selector > strong { color: #376361; font-size: 14px; }
.micro-patient-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 17px; }
.micro-patient-summary article { min-height: 71px; padding: 12px; border: 1px solid #d8e2df; border-radius: 8px; background: #fff; }
.micro-patient-summary span { display: block; color: #68746f; font-size: 7px; }
.micro-patient-summary b { margin-top: 8px; color: #315957; font-size: 9px; }
.micro-patient-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.micro-patient-actions span,.micro-patient-actions strong { padding: 8px 10px; border: 1px solid #b8cbc6; border-radius: 7px; color: #315957; background: #fff; font-size: 8px; font-weight: 800; }
.micro-patient-actions strong { border-color: #376361; color: #fff; background: #376361; }
.micro-patient-edit header > span { color: #315957; background: #e1efec; }
.micro-review > strong { position: absolute; right: 28px; bottom: 24px; opacity: 0; color: #26694f; font-size: 10px; transform: translateY(5px); transition: opacity .35s ease,transform .35s ease; }
.process-step[data-phase="3"] .micro-review > strong { opacity: 1; transform: none; }
.micro-upload { overflow: hidden; }
.micro-upload-view { position: absolute; inset: 28px; visibility: hidden; opacity: 0; }
.process-step[data-phase="0"] .micro-upload-library,
.process-step[data-phase="1"] .micro-upload-processing,
.process-step[data-phase="2"] .micro-upload-review,
.process-step[data-phase="3"] .micro-upload-organized { visibility: visible; opacity: 1; animation: micro-upload-view-in .38s cubic-bezier(.22,.8,.28,1) both; }
@keyframes micro-upload-view-in { from { opacity: 0; transform: translateY(9px) scale(.988); } to { opacity: 1; transform: none; } }
.micro-upload-view > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.micro-upload-view b,.micro-upload-view small { display: block; }
.micro-upload-view > header b { font-size: 14px; }
.micro-upload-view small { margin-top: 3px; color: #64716d; font-size: 8px; }
.micro-upload-view > header > span { padding: 8px 10px; border-radius: 7px; color: #fff; background: #376361; font-size: 8px; font-weight: 800; }
.micro-upload-toolbar { display: flex; gap: 6px; align-items: center; margin-bottom: 10px; }
.micro-upload-toolbar em { min-width: 0; flex: 1; padding: 8px 9px; border: 1px solid #d2dfdc; border-radius: 7px; color: #7a8682; background: #fff; font-size: 7px; font-style: normal; }
.micro-upload-toolbar span { padding: 7px 8px; border-radius: 999px; color: #315957; background: #e1efec; font-size: 7px; font-weight: 800; white-space: nowrap; }
.micro-upload-rows article { min-height: 67px; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; gap: 11px; align-items: center; border-bottom: 1px solid #dce5e2; }
.micro-upload-rows i,.micro-upload-file > i { width: 34px; height: 29px; display: grid; place-items: center; border-radius: 6px; color: #376361; background: #e3f0ed; font-size: 7px; font-style: normal; font-weight: 800; }
.micro-upload-rows b { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.micro-upload-rows strong,.micro-upload-file > strong { color: #34725e; font-size: 7px; }
.micro-upload-file { min-height: 89px; display: grid; grid-template-columns: 36px minmax(0,1fr) auto; gap: 11px; align-items: center; padding: 11px 12px; border: 1px solid #d7e2df; border-radius: 9px; background: #fff; }
.micro-upload-file + .micro-upload-file { margin-top: 9px; }
.micro-upload-file b { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.micro-upload-file em { height: 6px; display: block; margin-top: 8px; overflow: hidden; border-radius: 5px; background: #e2e9e7; }
.micro-upload-file em span { height: 100%; display: block; border-radius: inherit; background: #48a9a6; }
.micro-upload-pipeline { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 5px; margin-top: 15px; }
.micro-upload-pipeline span { padding: 8px 4px; border-radius: 6px; color: #71807b; background: #edf2f0; font-size: 6px; font-weight: 800; text-align: center; }
.micro-upload-pipeline .is-done { color: #2c6654; background: #ddf0e9; }
.micro-upload-review-grid { display: grid; grid-template-columns: .88fr 1.12fr; gap: 10px; }
.micro-upload-review-grid article,.micro-upload-review-grid figure { min-width: 0; height: 285px; margin: 0; padding: 14px; overflow: hidden; border: 1px solid #d6e1de; border-radius: 9px; background: #fff; }
.micro-upload-review-grid article > span { color: #687570; font-size: 7px; }
.micro-upload-review-grid article h4 { margin: 12px 0 5px; font: 400 15px/1.1 var(--serif); }
.micro-upload-review-grid article > b { color: #315957; font-size: 14px; }
.micro-upload-review-grid dl { display: grid; gap: 8px; margin-top: 18px; }
.micro-upload-review-grid dl div { display: grid; gap: 3px; }
.micro-upload-review-grid dt { color: #75817d; font-size: 6px; }
.micro-upload-review-grid dd { margin: 0; font-size: 8px; }
.micro-upload-review-grid figure > b { font-family: var(--serif); font-size: 11px; }
.micro-upload-review-grid figure em { height: 5px; display: block; margin-top: 12px; border-radius: 4px; background: #e2e5e4; }
.micro-upload-review-grid figure em:nth-of-type(1) { width: 86%; }
.micro-upload-review-grid figure em:nth-of-type(2) { width: 61%; }
.micro-upload-review-grid figure strong { display: block; margin: 17px -5px 0; padding: 8px 5px; color: #244b49; background: #dff1ed; font-size: 7px; }
.micro-upload-review-grid figcaption { margin-top: 18px; color: #687570; font-size: 6px; }
.micro-upload-table { overflow: hidden; border: 1px solid #d6e1de; border-radius: 8px; background: #fff; }
.micro-upload-table header,.micro-upload-table article { display: grid; grid-template-columns: 1.35fr .8fr .85fr .55fr; gap: 8px; align-items: center; padding: 10px; }
.micro-upload-table header { color: #71807b; background: #edf2f0; font-size: 6px; font-weight: 800; }
.micro-upload-table article { min-height: 59px; border-top: 1px solid #e0e7e5; font-size: 7px; }
.micro-upload-table article b { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.micro-upload-table article strong { color: #34725e; font-size: 7px; }
.micro-review { padding-top: 9px !important; }
.process-demo .micro-review { padding: 24px 30px !important; }
.micro-review > div { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 92px; padding: 14px 4px; border-bottom: 1px solid #dbe3e1; }
.micro-review b,.micro-review small { display: block; }
.micro-review b { font-size: 12px; }
.micro-review small { margin-top: 5px; color: #596560; font-size: 9px; }
.micro-review > div > i { padding: 7px 10px; border-radius: 999px; color: #315957; background: #e0efec; font-size: 8px; font-style: normal; font-weight: 800; }
.micro-review > div:nth-child(2) { transition: padding .3s ease,background-color .3s ease; }
.micro-review > div:nth-child(2) > i { color: #80571d; background: #fff1d5; }
.micro-review mark,.micro-review i mark { display: none; color: inherit; background: transparent; }
.micro-review small em,.micro-review i em { font-style: normal; }
.micro-review > aside { margin-top: 15px; padding: 14px; border: 1px solid #c8d9d5; border-radius: 9px; opacity: 0; background: #fff; transform: translateY(7px); transition: opacity .35s ease,transform .35s ease; }
.micro-review > aside b,.micro-review > aside span,.micro-review > aside small { display: block; }
.micro-review > aside b { font-size: 9px; }
.micro-review > aside span { margin-top: 6px; color: #315957; font-size: 8px; }
.micro-review > aside small { margin-top: 8px; color: #596560; font-family: var(--serif); font-size: 11px; }
.process-step:is([data-phase="1"],[data-phase="2"],[data-phase="3"]) .micro-review > div:nth-child(2) { margin-inline: -10px; padding-inline: 10px; background: #fff8e9; }
.process-step:is([data-phase="2"],[data-phase="3"]) .micro-review > aside { opacity: 1; transform: none; }
.process-step[data-phase="3"] .micro-review > div:nth-child(2) { background: #edf7f3; }
.process-step[data-phase="3"] .micro-review > div:nth-child(2) em { display: none; }
.process-step[data-phase="3"] .micro-review > div:nth-child(2) mark { display: inline; }
.process-step[data-phase="3"] .micro-review > div:nth-child(2) > i { color: #26694f; background: #def2e7; }
.micro-data { overflow: hidden; }
.micro-data-view { position: absolute; inset: 28px; visibility: hidden; opacity: 0; }
.process-step[data-phase="0"] .micro-data-overview,
.process-step[data-phase="1"] .micro-data-biomarkers,
.process-step[data-phase="2"] .micro-data-care,
.process-step[data-phase="3"] .micro-data-sources { visibility: visible; opacity: 1; animation: micro-data-view-in .38s cubic-bezier(.22,.8,.28,1) both; }
@keyframes micro-data-view-in { from { opacity: 0; transform: translateY(9px) scale(.988); } to { opacity: 1; transform: none; } }
.micro-data-view > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.micro-data-view b,.micro-data-view small { display: block; }
.micro-data-view > header b { font-size: 14px; }
.micro-data-view > header small { margin-top: 3px; color: #64716d; font-size: 8px; }
.micro-data-view > header > span { padding: 8px 10px; border-radius: 7px; color: #315957; background: #e1efec; font-size: 7px; font-weight: 800; white-space: nowrap; }
.micro-data-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.micro-data-grid article { min-height: 93px; padding: 13px; border: 1px solid #d6e1de; border-radius: 9px; background: #fff; }
.micro-data-grid article > span { color: #65716d; font-size: 7px; }
.micro-data-grid article b { margin-top: 12px; color: #243b37; font-size: 18px; }
.micro-data-grid article small { margin-top: 7px; color: #34725e; font-size: 7px; }
.micro-data-toolbar { display: flex; gap: 6px; align-items: center; margin-bottom: 10px; }
.micro-data-toolbar em { min-width: 0; flex: 1; padding: 8px 9px; border: 1px solid #d2dfdc; border-radius: 7px; color: #7a8682; background: #fff; font-size: 7px; font-style: normal; }
.micro-data-toolbar span { padding: 7px 8px; border-radius: 999px; color: #315957; background: #e1efec; font-size: 7px; font-weight: 800; white-space: nowrap; }
.micro-data-table { overflow: hidden; border: 1px solid #d6e1de; border-radius: 8px; background: #fff; }
.micro-data-table header,.micro-data-table article { display: grid; grid-template-columns: 1.15fr .8fr 1fr .8fr; gap: 8px; align-items: center; padding: 9px 10px; }
.micro-data-table header { color: #71807b; background: #edf2f0; font-size: 6px; font-weight: 800; }
.micro-data-table article { min-height: 59px; border-top: 1px solid #e0e7e5; font-size: 7px; }
.micro-data-table article b,.micro-data-table article span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.micro-data-table article b { font-size: 8px; }
.micro-data-table article strong { color: #34725e; font-size: 7px; }
.micro-data-table article.is-selected { color: #244b49; background: #e9f5f2; }
.micro-data-table.sources header,.micro-data-table.sources article { grid-template-columns: 1.05fr .75fr 1.25fr .35fr; }
.micro-report { display: flex; flex-direction: column; }
.micro-report-choice { padding: 13px 14px; border: 1px solid #d7e1de; border-radius: 9px; background: #fff; transition: opacity .3s ease,transform .3s ease; }
.micro-report-choice span,.micro-report-choice b,.micro-report-choice i { display: block; }
.micro-report-choice span { color: #65716d; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.micro-report-choice b { margin-top: 7px; font-family: var(--serif); font-size: 18px; font-weight: 400; }
.micro-report-choice i { margin-top: 4px; color: #596560; font-size: 8px; font-style: normal; }
.micro-report header,.micro-report footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.micro-report header { margin-top: 20px; opacity: .28; transition: opacity .3s ease; }
.micro-report header b { font-family: var(--serif); font-size: 20px; font-weight: 400; }
.micro-report header i { padding: 6px 9px; border-radius: 999px; color: #80571d; background: #fff1d5; font-size: 8px; font-style: normal; font-weight: 800; }
.micro-report > em { width: 0; height: 8px; display: block; margin-top: 14px; border-radius: 5px; background: #d7e2df; transition: width .65s ease; }
.micro-report > em:nth-of-type(2) { max-width: 84%; }
.micro-report > em:nth-of-type(3) { max-width: 66%; }
.micro-report > aside { display: flex; justify-content: space-between; margin-top: 18px; padding: 11px 12px; border-radius: 8px; opacity: 0; color: #315957; background: #e7f3f0; font-size: 8px; transform: translateY(5px); transition: opacity .3s ease,transform .3s ease; }
.micro-report footer { margin-top: auto; color: #596560; font-size: 9px; }
.micro-report footer strong { opacity: 0; color: #26694f; font-size: 10px; transform: translateY(4px); }
.process-step:is([data-phase="1"],[data-phase="2"],[data-phase="3"]) .micro-report header { opacity: 1; }
.process-step:is([data-phase="1"],[data-phase="2"],[data-phase="3"]) .micro-report > em { width: 100%; }
.process-step:is([data-phase="2"],[data-phase="3"]) .micro-report > aside { opacity: 1; transform: none; }
.process-step[data-phase="3"] .micro-report header i { color: #26694f; background: #def2e7; }
.process-step[data-phase="3"] .micro-report header i { font-size: 0; }
.process-step[data-phase="3"] .micro-report header i::after { content: "Draft ready"; font-size: 8px; }
.process-step[data-phase="3"] .micro-report footer strong { opacity: 1; transform: none; }
.micro-report-flow { overflow: hidden; }
.micro-report-view { position: absolute; inset: 28px; visibility: hidden; opacity: 0; }
.process-step[data-phase="0"] .micro-report-picker,
.process-step[data-phase="1"] .micro-report-settings,
.process-step[data-phase="2"] .micro-report-draft,
.process-step[data-phase="3"] .micro-report-approve { visibility: visible; opacity: 1; animation: micro-report-view-in .38s cubic-bezier(.22,.8,.28,1) both; }
@keyframes micro-report-view-in { from { opacity: 0; transform: translateY(9px) scale(.988); } to { opacity: 1; transform: none; } }
.micro-report-view > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.micro-report-view b,.micro-report-view small { display: block; }
.micro-report-view > header b { font-size: 14px; }
.micro-report-view > header small { margin-top: 3px; color: #64716d; font-size: 8px; }
.micro-report-view > header > span { padding: 8px 10px; border-radius: 7px; color: #315957; background: #e1efec; font-size: 7px; font-weight: 800; white-space: nowrap; }
.micro-report-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.micro-report-grid article { position: relative; min-height: 140px; padding: 13px; border: 1px solid #d6e1de; border-radius: 9px; background: #fff; }
.micro-report-grid i { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 6px; color: #315957; background: #e1efec; font-size: 8px; font-style: normal; font-weight: 800; }
.micro-report-grid b { margin-top: 11px; font: 400 13px/1.1 var(--serif); }
.micro-report-grid small { margin-top: 6px; color: #64716d; font-size: 7px; line-height: 1.35; }
.micro-report-grid strong { position: absolute; bottom: 11px; color: #34725e; font-size: 7px; }
.micro-report-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px 11px; }
.micro-report-fields label { color: #66736f; font-size: 7px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.micro-report-fields label.wide { grid-column: 1/-1; }
.micro-report-fields em { min-height: 40px; display: flex; align-items: center; margin-top: 6px; padding: 9px 10px; border: 1px solid #d2dfdc; border-radius: 7px; color: #29302d; background: #fff; font-size: 8px; font-style: normal; font-weight: 500; letter-spacing: 0; line-height: 1.35; text-transform: none; }
.micro-report-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.micro-report-actions span,.micro-report-actions strong,.micro-report-approve footer em,.micro-report-approve footer strong { padding: 8px 10px; border: 1px solid #b8cbc6; border-radius: 7px; color: #315957; background: #fff; font-size: 8px; font-style: normal; font-weight: 800; }
.micro-report-actions strong,.micro-report-approve footer strong { border-color: #376361; color: #fff; background: #376361; }
.micro-report-sheet { padding: 16px; border: 1px solid #d6e1de; border-radius: 9px; background: #fff; }
.micro-report-sheet > span { color: #2f7773; font-size: 7px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.micro-report-sheet > p { margin: 12px 0 0; font: 400 12px/1.45 var(--serif); }
.micro-report-sheet mark { color: #244b49; background: #dff1ed; }
.micro-report-findings { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 14px; }
.micro-report-findings article { padding: 10px; border: 1px solid #dce5e2; border-radius: 7px; }
.micro-report-findings b { font-size: 8px; }
.micro-report-findings span,.micro-report-findings strong { display: block; margin-top: 5px; font-size: 7px; }
.micro-report-findings strong { color: #34725e; }
.micro-report-source { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 13px; padding: 10px; border-radius: 7px; background: #e9f5f2; }
.micro-report-source span { color: #2f7773; font-size: 7px; }
.micro-report-source b { font-size: 7px; text-align: right; }
.micro-report-approval { display: grid; grid-template-columns: .85fr 1.15fr; gap: 9px; }
.micro-report-approval article,.micro-report-approval aside { min-width: 0; min-height: 245px; padding: 13px; border: 1px solid #d6e1de; border-radius: 9px; background: #fff; }
.micro-report-approval article > span { color: #2f7773; font-size: 7px; font-weight: 800; }
.micro-report-approval article p { margin: 13px 0; font: 400 12px/1.4 var(--serif); }
.micro-report-approval article small { color: #64716d; font-size: 7px; line-height: 1.4; }
.micro-report-approval aside b { font-size: 9px; }
.micro-report-approval aside p { margin: 12px 0; padding: 10px; border: 1px solid #dbe4e1; border-radius: 7px; font-size: 8px; line-height: 1.45; }
.micro-report-approval aside span { color: #34725e; font-size: 7px; font-weight: 800; }
.micro-report-approve > footer { display: flex; align-items: center; justify-content: space-between; gap: 9px; margin-top: 13px; color: #64716d; font-size: 7px; }
.micro-report-approve > footer div { display: flex; gap: 7px; }
.micro-share-flow { overflow: hidden; }
.micro-share-view { position: absolute; inset: 28px; visibility: hidden; opacity: 0; }
.process-step[data-phase="0"] .micro-share-picker,
.process-step[data-phase="1"] .micro-share-settings,
.process-step[data-phase="2"] .micro-share-invite,
.process-step[data-phase="3"] .micro-share-connected { visibility: visible; opacity: 1; animation: micro-share-view-in .38s cubic-bezier(.22,.8,.28,1) both; }
@keyframes micro-share-view-in { from { opacity: 0; transform: translateY(9px) scale(.988); } to { opacity: 1; transform: none; } }
.micro-share-view > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.micro-share-view b,.micro-share-view small { display: block; }
.micro-share-view > header b { font-size: 14px; }
.micro-share-view > header small { margin-top: 3px; color: #64716d; font-size: 8px; }
.micro-share-view > header > span { padding: 8px 10px; border-radius: 7px; color: #315957; background: #e1efec; font-size: 7px; font-weight: 800; white-space: nowrap; }
.micro-share-list { overflow: hidden; border: 1px solid #d6e1de; border-radius: 9px; background: #fff; }
.micro-share-list article { min-height: 84px; display: grid; grid-template-columns: 35px minmax(0,1fr) auto; gap: 11px; align-items: center; padding: 12px; border-top: 1px solid #dce5e2; }
.micro-share-list article:first-child { border-top: 0; }
.micro-share-list i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 7px; color: #315957; background: #e1efec; font-size: 8px; font-style: normal; font-weight: 800; }
.micro-share-list b { font: 400 12px/1.15 var(--serif); }
.micro-share-list small { margin-top: 5px; color: #64716d; font-size: 7px; line-height: 1.35; }
.micro-share-list strong { color: #34725e; font-size: 8px; }
.micro-share-list em { color: #7a8682; font-size: 7px; font-style: normal; font-weight: 800; }
.micro-share-picker > aside { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 13px; padding: 11px 12px; border-radius: 8px; color: #596560; background: #e9f1ef; font-size: 7px; }
.micro-share-picker > aside b { color: #315957; font-size: 8px; text-align: right; }
.micro-share-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px 11px; }
.micro-share-fields label { color: #66736f; font-size: 7px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.micro-share-fields label.wide { grid-column: 1/-1; }
.micro-share-fields em { min-height: 42px; display: flex; align-items: center; margin-top: 6px; padding: 9px 10px; border: 1px solid #d2dfdc; border-radius: 7px; color: #29302d; background: #fff; font-size: 8px; font-style: normal; font-weight: 500; letter-spacing: 0; line-height: 1.35; overflow-wrap: anywhere; text-transform: none; }
.micro-share-fields label.micro-focus { padding: 7px; border: 1px solid #72b6aa; border-radius: 9px; }
.micro-share-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.micro-share-actions span,.micro-share-actions strong,.micro-share-connected > footer strong { padding: 8px 10px; border: 1px solid #b8cbc6; border-radius: 7px; color: #315957; background: #fff; font-size: 8px; font-weight: 800; }
.micro-share-actions strong { border-color: #376361; color: #fff; background: #376361; }
.micro-share-mail { max-width: 340px; margin: 10px auto 0; padding: 20px; border: 1px solid #d6e1de; border-radius: 10px; background: #fff; text-align: center; }
.micro-share-mail > span { color: #376361; font-size: 16px; font-weight: 800; }
.micro-share-mail h4 { margin: 19px 0 0; font: 400 19px/1.08 var(--serif); }
.micro-share-mail p { margin: 13px 0 17px; color: #596560; font-size: 9px; line-height: 1.5; }
.micro-share-mail strong { width: fit-content; display: block; margin: 0 auto; padding: 9px 11px; border-radius: 7px; color: #fff; background: #376361; font-size: 8px; }
.micro-share-mail small { margin-top: 15px; color: #74817d; font-size: 6px; line-height: 1.4; }
.micro-share-invite > footer { display: flex; justify-content: space-between; gap: 10px; margin-top: 13px; color: #64716d; font-size: 7px; }
.micro-share-invite > footer b { color: #34725e; font-size: 7px; }
.micro-share-report { display: grid; grid-template-columns: 1.25fr .75fr; gap: 9px; }
.micro-share-report > article,.micro-share-report > aside { min-width: 0; min-height: 258px; padding: 14px; border: 1px solid #d6e1de; border-radius: 9px; background: #fff; }
.micro-share-report > article > span { color: #2f7773; font-size: 7px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; }
.micro-share-report > article p { margin: 15px 0; font: 400 12px/1.45 var(--serif); }
.micro-share-report > article > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px; border-radius: 7px; background: #e7f3f0; }
.micro-share-report > article > div b,.micro-share-report > article > div strong { font-size: 8px; }
.micro-share-report > aside > b { font-size: 9px; }
.micro-share-report dl { display: grid; gap: 10px; margin: 16px 0 0; }
.micro-share-report dl div { display: grid; gap: 3px; padding-bottom: 8px; border-bottom: 1px solid #dce5e2; }
.micro-share-report dt { color: #74817d; font-size: 6px; }
.micro-share-report dd { margin: 0; color: #315957; font-size: 8px; font-weight: 800; }
.micro-share-connected > footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 13px; color: #64716d; font-size: 7px; }
.micro-share-connected > footer strong { white-space: nowrap; }
.micro-focus { position: relative; z-index: 2; border-color: #72b6aa !important; background-color: #fbfffe !important; box-shadow: 0 0 0 2px rgba(72,169,166,.16),0 18px 34px -24px rgba(37,79,73,.75); transform-origin: 50% 50%; }
.micro-patient-fields label.micro-focus { padding: 7px; border: 1px solid #72b6aa; border-radius: 9px; }
.process-step[data-phase="0"] .micro-focus { animation: micro-focus-in-0 .62s cubic-bezier(.22,.8,.28,1) both; }
.process-step[data-phase="1"] .micro-focus { animation: micro-focus-in-1 .62s cubic-bezier(.22,.8,.28,1) both; }
.process-step[data-phase="2"] .micro-focus { animation: micro-focus-in-2 .62s cubic-bezier(.22,.8,.28,1) both; }
.process-step[data-phase="3"] .micro-focus { animation: micro-focus-in-3 .62s cubic-bezier(.22,.8,.28,1) both; }
@keyframes micro-focus-in-0 { from { transform: scale(.955); box-shadow: 0 0 0 0 rgba(72,169,166,0); } to { transform: scale(1); } }
@keyframes micro-focus-in-1 { from { transform: scale(.955); box-shadow: 0 0 0 0 rgba(72,169,166,0); } to { transform: scale(1); } }
@keyframes micro-focus-in-2 { from { transform: scale(.955); box-shadow: 0 0 0 0 rgba(72,169,166,0); } to { transform: scale(1); } }
@keyframes micro-focus-in-3 { from { transform: scale(.955); box-shadow: 0 0 0 0 rgba(72,169,166,0); } to { transform: scale(1); } }
.patient-showcase { margin-top: clamp(96px,10vw,140px); padding-top: clamp(72px,7vw,100px); border-top: 1px solid #c8d5d1; }
.patient-showcase-head { max-width: 900px; margin: 0 auto clamp(48px,5vw,68px); text-align: center; }
.patient-showcase-head .page-kicker { display: block; margin-bottom: 16px; }
.patient-showcase-head h2 { max-width: 850px; margin: 0 auto; font-family: var(--serif); font-size: clamp(42px,4.7vw,62px); font-weight: 400; line-height: 1; letter-spacing: -.04em; text-wrap: balance; }
.patient-showcase-head p { max-width: 650px; margin: 22px auto 0; color: #596560; font-size: 16px; line-height: 1.6; text-wrap: balance; }
.patient-showcase-stage { position: relative; min-height: 650px; display: grid; place-items: center; overflow: hidden; border: 1px solid #d3d8e6; border-radius: 24px; background: radial-gradient(circle at 68% 18%,rgba(242,217,224,.64),transparent 42%),linear-gradient(135deg,#f0f1fb,#eef6f3); }
.patient-showcase-stage::before { position: absolute; inset: 0; background: linear-gradient(90deg,transparent 27%,rgba(91,111,174,.13) 27%,rgba(91,111,174,.13) calc(27% + 1px),transparent calc(27% + 1px),transparent 73%,rgba(91,111,174,.13) 73%,rgba(91,111,174,.13) calc(73% + 1px),transparent calc(73% + 1px)),linear-gradient(180deg,transparent 25%,rgba(91,111,174,.13) 25%,rgba(91,111,174,.13) calc(25% + 1px),transparent calc(25% + 1px),transparent 78%,rgba(91,111,174,.13) 78%,rgba(91,111,174,.13) calc(78% + 1px),transparent calc(78% + 1px)); content: ""; }
.patient-showcase-app { position: relative; z-index: 1; width: min(820px,78%); min-height: 500px; overflow: hidden; border: 1px solid #c8d6d2; border-radius: 18px; background: #f7faf9; box-shadow: 0 32px 72px -38px rgba(29,49,47,.68); }
.patient-showcase-appbar { height: 66px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 20px; padding: 0 24px; border-bottom: 1px solid #d6e0dd; background: #fff; }
.patient-showcase-appbar > b { color: #376361; font-size: 24px; font-weight: 400; letter-spacing: -.055em; }
.patient-showcase-appbar > b strong { font-weight: 800; }
.patient-showcase-appbar > span { color: #475652; font-size: 13px; font-weight: 800; }
.patient-showcase-appbar > i { justify-self: end; padding: 7px 10px; border-radius: 999px; color: #315957; background: #e2efec; font-size: 9px; font-style: normal; font-weight: 800; }
.patient-showcase-views { position: relative; height: 375px; overflow: hidden; }
.patient-showcase-view { position: absolute; inset: 0; z-index: 0; padding: 28px 32px; visibility: hidden; opacity: 0; pointer-events: none; transform: translateY(8px) scale(.994); transition: opacity .48s ease,transform .56s cubic-bezier(.22,.8,.28,1),visibility 0s .56s; will-change: opacity,transform; }
.patient-showcase-view.is-active { z-index: 1; visibility: visible; opacity: 1; pointer-events: auto; transform: none; transition-delay: 0s; }
.patient-showcase-view > header { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 22px; }
.patient-showcase-view > header span { display: block; margin-bottom: 5px; color: #2f7773; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.patient-showcase-view > header h3 { margin: 0; color: #202523; font-size: 25px; letter-spacing: -.035em; }
.patient-showcase-view > header > b,.patient-showcase-view > header > button { padding: 10px 13px; border: 0; border-radius: 8px; color: #fff; background: #376361; cursor: pointer; font: 800 10px/1 var(--sans); }
.patient-showcase-view > header > i { padding: 7px 10px; border-radius: 999px; color: #315957; background: #e2efec; font-size: 9px; font-style: normal; font-weight: 800; }
.patient-showcase-toolbar { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 9px; margin-bottom: 12px; }
.patient-showcase-toolbar > * { min-height: 38px; display: flex; align-items: center; padding: 0 12px; border: 1px solid #d3dfdc; border-radius: 8px; color: #66736f; background: #fff; font-size: 9px; font-weight: 500; }
.patient-showcase-table { overflow: hidden; border: 1px solid #d5dfdc; border-radius: 10px; background: #fff; }
.patient-showcase-table > header,.patient-showcase-table article { display: grid; grid-template-columns: 2fr .55fr .72fr .85fr; gap: 12px; align-items: center; }
.patient-showcase-table > header { min-height: 32px; padding: 0 13px; color: #687571; background: #edf3f1; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.patient-showcase-table article { min-height: 63px; padding: 0 13px; border-top: 1px solid #e0e7e5; color: #44514d; font-size: 10px; }
.patient-showcase-table article.is-selected { background: #f0f8f6; box-shadow: inset 3px 0 #48a9a6; }
.patient-showcase-table article > span { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 10px; align-items: center; }
.patient-showcase-table article i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #376361; font-size: 8px; font-style: normal; font-weight: 800; }
.patient-showcase-table article b,.patient-showcase-table article small { display: block; }
.patient-showcase-table article b { color: #26302d; font-size: 10px; }
.patient-showcase-table article small { margin-top: 3px; color: #74817d; font-size: 7px; font-weight: 500; }
.patient-showcase-table article em,.patient-showcase-table article u { width: fit-content; padding: 5px 7px; border-radius: 999px; color: #6e5220; background: #fff1d5; font-size: 8px; font-style: normal; font-weight: 800; text-decoration: none; }
.patient-showcase-table article u { color: #315957; background: #e3f0ed; }
.patient-showcase-invite-layout,.patient-showcase-share-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 18px; }
.patient-showcase-invite-layout > article,.patient-showcase-invite-layout > form,.patient-showcase-share-layout > article,.patient-showcase-share-layout > aside { min-height: 245px; padding: 20px; border: 1px solid #d4dfdc; border-radius: 11px; background: #fff; }
.patient-showcase-invite-layout > article > span,.patient-showcase-share-layout > article > span { color: #2f7773; font-size: 8px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.patient-showcase-invite-layout article > div { display: flex; align-items: center; gap: 11px; margin: 18px 0; }
.patient-showcase-invite-layout article > div i { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #376361; font-size: 9px; font-style: normal; font-weight: 800; }
.patient-showcase-invite-layout article b,.patient-showcase-invite-layout article small { display: block; }
.patient-showcase-invite-layout article b { font-size: 12px; }
.patient-showcase-invite-layout article small { margin-top: 4px; color: #6e7a76; font-size: 8px; }
.patient-showcase-invite-layout dl { display: grid; gap: 9px; margin: 0; }
.patient-showcase-invite-layout dl div { display: flex; justify-content: space-between; gap: 12px; padding-top: 8px; border-top: 1px solid #e0e7e5; }
.patient-showcase-invite-layout dt,.patient-showcase-invite-layout dd { margin: 0; font-size: 8px; }
.patient-showcase-invite-layout dt { color: #6e7a76; }
.patient-showcase-invite-layout dd { color: #315957; font-weight: 800; }
.patient-showcase-invite-layout form,.patient-showcase-share-layout aside { display: flex; flex-direction: column; gap: 10px; }
.patient-showcase-invite-layout label,.patient-showcase-share-layout label { display: grid; gap: 5px; color: #66736f; font-size: 8px; font-weight: 800; }
.patient-showcase-invite-layout label em,.patient-showcase-share-layout label em { min-height: 40px; display: flex; align-items: center; padding: 9px 10px; border: 1px solid #d6e0dd; border-radius: 7px; color: #33423e; background: #f8faf9; font-size: 9px; font-style: normal; font-weight: 500; line-height: 1.35; }
.patient-showcase-invite-layout form > small,.patient-showcase-share-layout aside > small { color: #687571; font-size: 8px; line-height: 1.4; }
.patient-showcase-invite-layout button,.patient-showcase-share-layout aside > b,.patient-showcase-share-layout aside > button { align-self: flex-end; margin-top: auto; padding: 10px 12px; border: 0; border-radius: 8px; color: #fff; background: #376361; cursor: pointer; font-family: inherit; font-size: 9px; font-weight: 800; line-height: 1; }
.patient-showcase-share-layout > article h4 { margin: 18px 0 8px; font: 400 25px/1 var(--serif); }
.patient-showcase-share-layout > article p { margin: 0; color: #64716d; font-size: 9px; line-height: 1.55; }
.patient-showcase-share-layout > article div { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 30px; padding: 13px; border-radius: 8px; background: #edf4f2; font-size: 9px; }
.patient-showcase-share-layout > article div strong { color: #315957; }
.patient-showcase-access-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.patient-showcase-access-summary article { min-height: 92px; padding: 14px; border: 1px solid #d5dfdc; border-radius: 9px; background: #fff; }
.patient-showcase-access-summary span,.patient-showcase-access-summary b,.patient-showcase-access-summary small { display: block; }
.patient-showcase-access-summary span { color: #6e7a76; font-size: 8px; }
.patient-showcase-access-summary b { margin-top: 8px; color: #25302d; font-size: 20px; }
.patient-showcase-access-summary small { margin-top: 4px; color: #66736f; font-size: 8px; }
.patient-showcase-access-row { min-height: 78px; display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 16px; align-items: center; margin-top: 13px; padding: 0 15px; border: 1px solid #b8d6cf; border-radius: 10px; background: #fff; }
.patient-showcase-access-row > span { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 10px; align-items: center; }
.patient-showcase-access-row i { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; color: #315957; background: #e3f0ed; font: 400 16px/1 var(--serif); }
.patient-showcase-access-row b,.patient-showcase-access-row small { display: block; }
.patient-showcase-access-row b { font-size: 11px; }
.patient-showcase-access-row small { margin-top: 4px; color: #6e7a76; font-size: 8px; }
.patient-showcase-access-row em { padding: 6px 8px; border-radius: 999px; color: #315957; background: #e2efec; font-size: 8px; font-style: normal; }
.patient-showcase-access-row strong,.patient-showcase-access-row > button { padding: 0; border: 0; color: #376361; background: transparent; cursor: pointer; font: 800 9px/1 var(--sans); }
.patient-showcase-access > footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 13px; color: #66736f; font-size: 8px; }
.patient-showcase-access > footer b { color: #7c4e42; }
.patient-showcase-progress { height: 58px; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; align-items: end; padding: 0 32px 17px; background: #f7faf9; }
.patient-showcase-progress span,.patient-showcase-progress button { min-width: 0; padding: 9px 0 0; border: 0; border-top: 3px solid #d3dedb; color: #687571; background: transparent; cursor: pointer; font: 800 8px/1.2 var(--sans); text-align: left; transition: color .3s ease,border-color .3s ease; }
.patient-showcase-progress span.is-complete,.patient-showcase-progress button.is-complete { border-color: #8fc4ba; }
.patient-showcase-progress span.is-active,.patient-showcase-progress button.is-active { color: #244b49; border-color: #376361; }
[data-patient-showcase-next] { transition: transform .18s ease,box-shadow .18s ease,background-color .18s ease; }
[data-patient-showcase-next].is-demo-click { background-color: #244b49; box-shadow: 0 0 0 5px rgba(72,169,166,.16); transform: scale(.965); }
.patient-showcase-toggle { position: absolute; z-index: 2; bottom: 20px; left: 20px; width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #587775; border-radius: 50%; color: #244b49; background: rgba(255,255,255,.76); cursor: pointer; font-size: 15px; }
.patient-showcase-points { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; margin-top: 30px; border-top: 1px solid #cad4d1; border-bottom: 1px solid #cad4d1; }
.patient-showcase-points article { min-height: 150px; padding: 25px 28px; border-left: 1px solid #cad4d1; }
.patient-showcase-points article:first-child { border-left: 0; }
.patient-showcase-points h3 { margin: 0; color: #27302e; font-size: 18px; letter-spacing: -.02em; }
.patient-showcase-points p { max-width: 330px; margin: 10px 0 0; color: #596560; font-size: 14px; line-height: 1.55; }
.mini-testimonials { margin-top: clamp(68px,7vw,98px); padding-top: 36px; border-top: 1px solid #c8d5d1; }
.mini-testimonials-head { display: flex; align-items: end; justify-content: space-between; gap: 32px; margin-bottom: 30px; }
.mini-testimonials-head .page-kicker { display: block; margin-bottom: 10px; }
.mini-testimonials-head h2 { margin: 0; font-family: var(--serif); font-size: clamp(34px,3.8vw,50px); font-weight: 400; line-height: 1; letter-spacing: -.035em; }
.mini-testimonials-head > p { max-width: 290px; margin: 0 0 4px; color: #596560; font-size: 13px; line-height: 1.5; text-align: right; }
.mini-testimonial-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); overflow: hidden; border: 1px solid #b8cbc6; border-radius: 20px; background: #fff; }
.mini-testimonial-grid blockquote { min-height: 248px; display: flex; flex-direction: column; margin: 0; padding: 29px 30px 27px; border-left: 1px solid #d2ddda; background: #fff; }
.mini-testimonial-grid blockquote:first-child { border-left: 0; }
.mini-testimonial-grid blockquote:nth-child(2) { background: #f0f6f4; }
.mini-testimonial-grid blockquote::before { height: 33px; color: #48a9a6; font: 400 44px/1 var(--serif); content: "“"; }
.mini-testimonial-grid blockquote p { margin: 8px 0 26px; color: #202523; font: 400 clamp(18px,1.55vw,22px)/1.36 var(--serif); letter-spacing: -.015em; text-wrap: pretty; }
.mini-testimonial-grid blockquote p::after { content: "”"; }
.mini-testimonial-grid footer { display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 11px; align-items: center; margin-top: auto; padding-top: 16px; border-top: 1px solid #d9e2df; }
.mini-testimonial-grid footer img { width: 40px; height: 40px; border: 1px solid #c7d6d2; border-radius: 50%; object-fit: cover; background: #edf3f1; }
.mini-testimonial-grid cite,.mini-testimonial-grid footer span { display: block; }
.mini-testimonial-grid cite { color: #244b49; font-size: 11px; font-style: normal; font-weight: 800; }
.mini-testimonial-grid footer span { margin-top: 4px; color: #596560; font-size: 9px; }
.mini-testimonials-note { margin: 11px 0 0; color: #596560; font-size: 9px; text-align: right; }
.data-capture-section { position: relative; z-index: 3; padding: clamp(86px,8vw,120px) 0; border-top: 1px solid #d7e2df; background: radial-gradient(circle at 88% 8%,rgba(72,169,166,.12),transparent 28%),linear-gradient(180deg,#f8faf8,#edf5f2); }
.data-capture-head { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(280px,.55fr); gap: clamp(36px,7vw,110px); align-items: end; }
.data-capture-head .page-kicker { display: block; margin-bottom: 16px; }
.data-capture-head h2 { max-width: 760px; margin: 0; font-family: var(--serif); font-size: clamp(48px,5.2vw,70px); font-weight: 400; line-height: .98; letter-spacing: -.04em; }
.data-capture-head > p { margin: 0 0 5px; color: #53615d; font-size: 15px; line-height: 1.62; }
.data-capture-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: clamp(42px,5vw,66px); overflow: hidden; border: 1px solid #b8cbc6; border-radius: 15px 15px 0 0; background: #376361; }
.data-capture-summary span { min-height: 68px; display: flex; align-items: center; gap: 7px; padding: 14px 20px; border-left: 1px solid rgba(255,255,255,.18); color: #d9e7e3; font-size: 12px; }
.data-capture-summary span:first-child { border-left: 0; }
.data-capture-summary b { color: #fff; font-size: 13px; }
.data-capture-table { overflow: hidden; border: 1px solid #b8cbc6; border-top: 0; border-radius: 0 0 15px 15px; background: #fff; box-shadow: 0 25px 55px -40px rgba(27,55,49,.4); }
.data-capture-table > header,.data-capture-table > article { display: grid; grid-template-columns: minmax(175px,1.05fr) minmax(260px,1.7fr) minmax(230px,1.4fr) minmax(150px,.9fr); gap: 22px; align-items: center; }
.data-capture-table > header { min-height: 45px; padding: 0 22px; color: #64716d; background: #e5efec; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.data-capture-table > article { min-height: 100px; padding: 18px 22px; border-top: 1px solid #dbe4e1; }
.data-capture-table > article:nth-child(odd) { background: #fbfcfb; }
.data-capture-table > article.is-genetics { background: linear-gradient(90deg,#edf6f3,#f8fbfa); box-shadow: inset 4px 0 #48a9a6; }
.data-capture-type { min-width: 0; display: grid; grid-template-columns: 38px minmax(0,1fr); gap: 11px; align-items: center; }
.data-capture-type > i { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: #315f5b; background: #dfeeea; font-size: 9px; font-style: normal; font-weight: 900; }
.data-capture-type b,.data-capture-type small { display: block; }
.data-capture-type b { color: #26302d; font-size: 14px; }
.data-capture-type small { margin-top: 4px; color: #6b7773; font-size: 10px; }
.data-capture-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.data-capture-tags span { padding: 5px 7px; border: 1px solid #cbdad6; border-radius: 999px; color: #445651; background: #f7faf9; font-size: 9px; font-weight: 700; white-space: nowrap; }
.data-capture-table article > p { margin: 0; color: #596560; font-size: 11px; line-height: 1.55; }
.data-capture-table article > strong { color: #2f6560; font-size: 10px; line-height: 1.45; }
.data-capture-footnote { max-width: 820px; margin: 20px 0 0; color: #687570; font-size: 11px; line-height: 1.55; }
.product-faq { padding: clamp(86px,9vw,130px) 0; background: radial-gradient(circle at 50% 0,rgba(219,222,242,.52),transparent 38%),#f3f3f8; }
.product-faq-head { max-width: 760px; margin: 0 auto; text-align: center; }
.product-faq-head .page-kicker { display: block; margin-bottom: 17px; }
.product-faq-head h2 { margin: 0; font-family: var(--serif); font-size: clamp(50px,5.4vw,72px); font-weight: 400; line-height: .98; letter-spacing: -.04em; }
.product-faq-head p { max-width: 560px; margin: 20px auto 0; color: #596560; font-size: 15px; line-height: 1.55; }
.product-faq-head .button { margin-top: 25px; }
.product-faq-list { margin-top: clamp(54px,7vw,84px); border-top: 1px solid #c3ced0; }
.product-faq-list details { border-bottom: 1px solid #c3ced0; }
.product-faq-list summary { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 28px; color: #29302d; cursor: pointer; list-style: none; font-size: clamp(18px,1.65vw,23px); line-height: 1.25; }
.product-faq-list summary::-webkit-details-marker { display: none; }
.product-faq-list summary i { position: relative; width: 30px; height: 30px; flex: 0 0 30px; border: 1px solid #376361; border-radius: 50%; transition: background-color .2s ease,transform .25s ease; }
.product-faq-list summary i::before,.product-faq-list summary i::after { position: absolute; top: 50%; left: 50%; width: 10px; height: 1px; background: #376361; content: ""; transform: translate(-50%,-50%); }
.product-faq-list summary i::after { transform: translate(-50%,-50%) rotate(90deg); }
.product-faq-list details[open] summary { color: #244b49; }
.product-faq-list details[open] summary i { background: #dcece8; transform: rotate(45deg); }
.product-faq-list details > p { max-width: 900px; margin: -3px 0 0; padding: 0 72px 28px 0; color: #596560; font-size: 14px; line-height: 1.65; }
.product-faq-list details > p a { color: #244b49; font-weight: 800; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.product-final-cta { min-height: 510px; display: grid; place-items: center; padding: 90px 0; color: #272836; text-align: center; background: radial-gradient(circle at 50% 12%,rgba(255,255,255,.42),transparent 42%),#ededfb; }
.product-final-cta h2 { max-width: 850px; margin: 0 auto; font-size: clamp(38px,4vw,56px); font-weight: 500; line-height: 1.08; letter-spacing: -.035em; text-wrap: balance; }
.product-final-cta p { max-width: 620px; margin: 17px auto 0; color: #5f607a; font-size: 16px; line-height: 1.55; }
.product-final-cta .button { margin-top: 34px; color: #fff; border-color: #376361; background: #376361; }
.product-page .marketing-footer { --footer-reveal-height: clamp(430px,58svh,660px); position: relative; padding: 0 12px var(--footer-reveal-height); overflow: clip; color: #29332f; background: transparent; }
.product-page .marketing-nav { transition: color .25s ease, transform .38s cubic-bezier(.22,1,.36,1); }
.product-page.is-footer-revealing .marketing-nav { pointer-events: none; transform: translateY(calc(-100% - 16px)); }
.product-page .marketing-footer > .shell { position: relative; z-index: 2; width: 100%; max-width: none; box-sizing: border-box; margin: 0; padding: clamp(66px,7vw,100px) max(32px,calc((100vw - 1320px)/2)) 34px; border-radius: 0 0 clamp(34px,4vw,62px) clamp(34px,4vw,62px); color: #29332f; background: #fbfaf7; box-shadow: 0 24px 42px -34px rgba(35,65,60,.45); }
.product-page .marketing-footer-top { padding-bottom: clamp(48px,6vw,72px); }
.product-page .marketing-footer-brand .logo { color: #376361; }
.product-page .marketing-footer-brand p,
.product-page .marketing-footer-links a,
.product-page .marketing-footer-bottom { color: #596560; }
.product-page .marketing-footer-links strong { color: #315f5b; }
.product-page .marketing-footer-bottom { display: flex; justify-content: flex-end; padding-top: 24px; border-color: #d7dfdc; font-family: ui-monospace,SFMono-Regular,Menlo,monospace; font-size: 10px; letter-spacing: .02em; }
.product-footer-reveal { position: fixed; z-index: 1; right: 12px; bottom: 0; left: 12px; height: var(--footer-reveal-height); overflow: hidden; pointer-events: none; background: linear-gradient(180deg,#e9f4f2 0%,#c8ecee 44%,#a8dfe7 100%); }
.product-footer-reveal::before,.product-footer-reveal::after { position: absolute; border-radius: 50%; background: rgba(255,255,255,.52); content: ""; }
.product-footer-reveal::before { top: 12%; left: 22%; width: clamp(46px,5vw,78px); aspect-ratio: 1; }
.product-footer-reveal::after { bottom: 13%; left: 14%; width: clamp(24px,3vw,48px); aspect-ratio: 1; }
.product-footer-reveal-note { position: absolute; z-index: 2; top: clamp(50px,8vh,82px); right: max(32px,calc((100vw - 1320px)/2)); display: grid; grid-template-columns: 24px auto; gap: 10px; align-items: start; color: #244b49; font: 700 10px/1.45 ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing: .02em; text-transform: uppercase; }
.product-footer-reveal-note i { width: 24px; height: 24px; display: block; border-radius: 50% 50% 48% 52%; background: radial-gradient(circle at 35% 35%,#376361 0 20%,transparent 22%),radial-gradient(circle at 68% 35%,#376361 0 20%,transparent 22%),radial-gradient(circle at 35% 68%,#376361 0 20%,transparent 22%),radial-gradient(circle at 68% 68%,#376361 0 20%,transparent 22%); transform: rotate(12deg); }
.product-footer-reveal > strong { position: absolute; right: 50%; bottom: -.13em; color: rgba(255,255,255,.88); font: 400 clamp(170px,31vw,520px)/.74 var(--serif); letter-spacing: -.085em; white-space: nowrap; transform: translateX(50%); }
.product-footer-reveal > strong b { color: inherit; font-weight: 600; }
.product-hero-bar { height: 68px; display: grid; grid-template-columns: 190px minmax(260px,1fr) auto; align-items: center; gap: 26px; padding: 0 24px; border-bottom: 1px solid #d7e1de; background: rgba(255,255,255,.96); }
.product-hero-brand { color: #376361; font-size: 27px; letter-spacing: -.06em; }
.product-hero-brand b { font-weight: 800; }
.product-hero-search { max-width: 610px; width: 100%; justify-self: center; padding: 11px 16px; border: 1px solid #d5dfdc; border-radius: 9px; color: #65716d; background: #f8faf9; font-size: 11px; text-align: left; }
.product-hero-search::before { margin-right: 9px; content: "⌕"; font-size: 15px; }
.product-hero-person { justify-self: center; display: flex; align-items: center; gap: 9px; padding: 7px 11px; border: 1px solid #d2ddda; border-radius: 10px; background: #fbfdfc; }
.product-hero-person > i { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #2b302e; font-size: 9px; font-style: normal; font-weight: 800; }
.product-hero-person b,.product-hero-person small { display: block; }
.product-hero-person b { font-size: 11px; }
.product-hero-person small { margin-top: 2px; color: #596560; font-size: 9px; }
.product-hero-actions { justify-self: end; display: flex; align-items: center; gap: 14px; }
.product-hero-actions > b { padding: 8px 10px; border: 1px solid #b8cbc6; border-radius: 7px; color: #376361; background: #fff; font-size: 9px; }
.product-hero-actions > span { display: flex; align-items: center; gap: 7px; color: #52615e; font-size: 10px; }
.product-hero-actions > span i { width: 7px; height: 7px; border-radius: 50%; background: #38a169; box-shadow: 0 0 0 4px #e5f4eb; }
.product-hero-actions > em { width: 31px; height: 31px; display: grid; place-items: center; border: 1px solid #dce2e0; border-radius: 8px; color: #4e5a57; background: #fff; font-size: 14px; font-style: normal; }
.product-hero-app { position: relative; height: calc(100% - 68px); display: grid; grid-template-columns: 200px minmax(0,1fr); background: #f7faf9; }
.product-hero-sidebar { display: flex; flex-direction: column; padding: 18px 16px; border-right: 1px solid #d8e2df; background: #f3f7f6; }
.product-hero-sidebar span { margin: 9px 11px 5px; color: #596560; font-size: 8px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.product-hero-sidebar span:first-child { margin-top: 0; }
.product-hero-sidebar b { min-height: 31px; display: flex; align-items: center; gap: 8px; margin-bottom: 2px; padding: 0 11px; border-radius: 7px; color: #596560; font-size: 10px; font-weight: 700; }
.product-hero-sidebar b::before { width: 12px; height: 12px; display: grid; place-items: center; color: #71827c; content: "□"; font-size: 10px; }
.product-hero-sidebar b:has(svg)::before { display: none; }
.product-hero-sidebar b svg { width: 14px; height: 14px; flex: 0 0 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.product-hero-sidebar b.is-active { color: #fff; background: #376361; }
.product-hero-sidebar b.is-active::before { color: #fff; }
.product-hero-records { position: relative; min-width: 0; overflow: hidden; padding: 27px 30px; background: #fff; }
.product-hero-records-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.product-hero-records-head small,.product-hero-records-head strong { display: block; }
.product-hero-records-head small { color: #65706c; font-size: 8px; font-weight: 700; letter-spacing: .09em; }
.product-hero-records-head strong { margin-top: 4px; color: #202523; font-size: 23px; letter-spacing: -.035em; }
.product-hero-records-head > b { padding: 9px 12px; border-radius: 7px; color: #fff; background: #376361; font-size: 9px; }
.product-hero-records-empty { min-height: 335px; margin-top: 18px; border: 1px dashed #cbd8d4; border-radius: 10px; background: #f8faf9; }
.product-hero-upload { position: absolute; z-index: 4; top: 74px; left: 50%; width: min(720px,78%); min-height: 299px; overflow: hidden; border: 1px solid #c7d3cf; border-radius: 14px; background: #fff; box-shadow: 0 24px 64px rgba(31,52,47,.24); transform: translateX(calc(-50% + var(--hero-modal-x,0px))); }
.product-hero-upload > .product-hero-upload-head { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 16px; border-bottom: 1px solid #dce3e1; color: #202523; font-size: 13px; }
.product-hero-upload > .product-hero-upload-head b { display: flex; align-items: center; gap: 8px; }
.product-hero-upload > .product-hero-upload-head i { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 7px; color: #fff; background: #376361; font-size: 13px; font-style: normal; }
.product-hero-upload > .product-hero-upload-head span { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 6px; color: #65706c; background: #f3f6f5; font-size: 15px; }
.product-hero-upload-body { padding: 15px 16px 16px; opacity: 1; transition: opacity .24s ease,transform .35s ease; }
.product-hero-upload-drop { padding: 9px; border: 1.5px dashed #c1ceca; border-radius: 7px; color: #5f6b67; background: #fafcfb; font-size: 8px; text-align: center; }
.product-hero-upload-file { min-height: 46px; display: grid; grid-template-columns: 34px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 7px 9px; border-bottom: 1px solid #e7ecea; }
.product-hero-upload-file > i { width: 27px; height: 20px; display: grid; place-items: center; border: 1px solid #cce2dd; border-radius: 4px; color: #376361; background: #edf6f4; font-size: 6px; font-style: normal; font-weight: 800; }
.product-hero-upload-file b,.product-hero-upload-file small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-hero-upload-file b { color: #303735; font-size: 9px; }
.product-hero-upload-file small { margin-top: 2px; color: #596560; font-size: 8px; }
.product-hero-upload-file em { color: #65706c; font-size: 11px; font-style: normal; }
.product-hero-upload .product-hero-upload-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 10px; padding-top: 10px; color: #626d69; font-size: 8px; }
.product-hero-upload .product-hero-upload-foot b { padding: 8px 12px; border-radius: 7px; color: #fff; background: #376361; font-size: 9px; transition: transform .16s ease,background-color .16s ease; }
.product-hero-upload-button.is-pressed { background: #284f4d; transform: scale(.96); }
.product-hero-processing { position: absolute; inset: 52px 0 0; display: grid; align-content: center; justify-items: center; padding: 18px 30px 20px; opacity: 0; background: #fff; text-align: center; transform: translateY(8px); transition: opacity .32s ease,transform .38s ease; }
.product-hero-upload.is-processing .product-hero-upload-body { opacity: 0; transform: translateY(-8px); }
.product-hero-upload.is-processing .product-hero-processing { opacity: 1; transform: none; }
.product-hero-processing-icon { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #48a9a6; font-size: 12px; font-weight: 800; }
.product-hero-processing-title { margin-top: 8px; color: #202523; font-size: 13px; }
.product-hero-processing-lead { margin: 4px 0 0; color: #5e6b67; font-size: 8px; }
.product-hero-processing-list { width: min(390px,100%); display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px 10px; margin-top: 13px; text-align: left; }
.product-hero-processing-list span { min-height: 29px; display: flex; align-items: center; gap: 7px; padding: 6px 8px; border: 1px solid #dbe5e2; border-radius: 7px; color: #64716d; background: #f8faf9; font-size: 8px; transition: color .2s ease,border-color .2s ease,background-color .2s ease; }
.product-hero-processing-list i { width: 9px; height: 9px; flex: 0 0 9px; border: 1px solid #adbfba; border-radius: 50%; }
.product-hero-processing-list span.is-done { color: #2c5c4c; border-color: #bad9cf; background: #edf7f3; }
.product-hero-processing-list span.is-done i { display: grid; place-items: center; border-color: #48a984; color: #fff; background: #48a984; }
.product-hero-processing-list span.is-done i::after { content: "✓"; font-size: 6px; font-style: normal; }
.product-hero-processing-ready { margin-top: 11px; opacity: 0; color: #25684f; font-size: 9px; transform: translateY(4px); transition: opacity .25s ease,transform .25s ease; }
.product-hero-upload.is-ready .product-hero-processing-icon { background: #32956f; }
.product-hero-upload.is-ready .product-hero-processing-title { font-size: 0; }
.product-hero-upload.is-ready .product-hero-processing-title::after { content: "Upload complete"; font-size: 13px; }
.product-hero-upload.is-ready .product-hero-processing-ready { opacity: 1; transform: none; }
.product-hero-records-table { display: grid; grid-template-columns: 1.4fr .7fr .7fr .55fr; gap: 12px; margin-top: 13px; padding: 9px 11px; color: #596560; background: #f5f8f7; font-size: 7px; font-weight: 800; text-transform: uppercase; }
.product-hero-records-table.row { min-height: 44px; align-items: center; margin-top: 0; border-top: 1px solid #e1e8e6; color: #303735; background: #fff; font-size: 8px; font-weight: 500; text-transform: none; }
.product-hero-records-table.row b,.product-hero-records-table.row small { display: block; }
.product-hero-records-table.row small { margin-top: 2px; color: #596560; font-size: 7px; }
.product-hero-menu-stage { position: absolute; z-index: 8; inset: 0; overflow: hidden; opacity: 0; background: #fff; pointer-events: none; transition: opacity .28s ease; }
.product-hero-menu-stage.is-visible { opacity: 1; }
.product-hero-menu-page { position: absolute; inset: 0; padding: 27px 30px; visibility: hidden; opacity: 0; transform: translateY(10px); transition: opacity .3s ease,transform .36s cubic-bezier(.22,.8,.28,1),visibility 0s linear .36s; }
.product-hero-menu-page.is-active { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
.product-hero-menu-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.product-hero-menu-head small,.product-hero-menu-head strong { display: block; }
.product-hero-menu-head small { color: #65706c; font-size: 9px; font-weight: 800; letter-spacing: .09em; }
.product-hero-menu-head strong { margin-top: 4px; color: #202523; font-size: 23px; letter-spacing: -.035em; }
.product-hero-menu-head > div:last-child { display: flex; align-items: center; gap: 8px; }
.product-hero-menu-head > div:last-child span { padding: 7px 10px; border-radius: 999px; color: #315957; background: #e0efec; font-size: 8px; font-weight: 800; }
.product-hero-menu-head > div:last-child b { padding: 8px 10px; border-radius: 7px; color: #fff; background: #376361; font-size: 8px; }
.hero-patient-notes-demo { margin-top: 24px; padding: 22px; border: 1px solid #d7e1de; border-radius: 12px; background: #f7faf9; }
.hero-patient-notes-demo > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 15px; border-bottom: 1px solid #dce5e2; }
.hero-patient-notes-demo > header b,.hero-patient-notes-demo > header span { display: block; }
.hero-patient-notes-demo > header b { color: #24302c; font-size: 13px; }
.hero-patient-notes-demo > header span { margin-top: 4px; color: #6b7773; font-size: 8px; }
.hero-patient-notes-demo > header em { padding: 6px 9px; border-radius: 999px; color: #315957; background: #e0efec; font-size: 7px; font-style: normal; font-weight: 800; }
.hero-patient-note-card { margin-top: 16px; padding: 18px; border: 1px solid #ccd9d5; border-radius: 10px; background: #fff; box-shadow: 0 12px 28px -24px rgba(28,56,50,.4); }
.hero-patient-note-card > div b,.hero-patient-note-card > div span { display: block; }
.hero-patient-note-card > div b { color: #26312e; font-size: 11px; }
.hero-patient-note-card > div span { margin-top: 5px; color: #697570; font-size: 8px; }
.hero-patient-note-card p { min-height: 94px; box-sizing: border-box; margin: 14px 0 0; padding: 13px; border: 1px solid #d7e1de; border-radius: 8px; color: #34423e; background: #fbfcfc; font-size: 9px; line-height: 1.55; }
.hero-patient-note-card footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 13px; }
.hero-patient-note-card footer small { color: #71807b; font-size: 7px; }
.hero-patient-note-card footer b { padding: 8px 11px; border-radius: 7px; color: #fff; background: #376361; font-size: 8px; }
.hero-record-count { display: grid; }
.hero-record-count i { grid-area: 1/1; font-style: normal; }
.hero-record-count i:last-child { opacity: 0; }
.hero-record-upload-demo { min-height: 365px; position: relative; margin-top: 14px; overflow: hidden; }
.hero-record-empty { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 6px; border: 1px dashed #cbd8d4; border-radius: 10px; color: #687570; background: #f8faf9; text-align: center; }
.hero-record-empty i { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #376361; background: #e3efec; font-size: 16px; font-style: normal; }
.hero-record-empty b { color: #2d3935; font-size: 11px; }
.hero-record-empty span { font-size: 8px; }
.hero-record-upload-modal { width: min(610px,78%); position: absolute; z-index: 5; top: 22px; left: 50%; overflow: hidden; border: 1px solid #c7d3cf; border-radius: 12px; opacity: 0; background: #fff; transform: translate(-50%,-7px) scale(.985); }
.hero-record-upload-modal > header { min-height: 43px; display: flex; align-items: center; justify-content: space-between; padding: 0 13px; border-bottom: 1px solid #dce3e1; font-size: 10px; }
.hero-record-upload-modal > header span { color: #69746f; font-size: 14px; }
.hero-record-upload-modal > div { margin: 10px 12px 3px; padding: 7px; border: 1px dashed #c7d4d0; border-radius: 6px; color: #68746f; background: #fafcfb; font-size: 7px; text-align: center; }
.hero-record-upload-modal article { min-height: 38px; display: grid; grid-template-columns: 29px minmax(0,1fr) auto; gap: 8px; align-items: center; margin: 0 12px; border-bottom: 1px solid #e7ecea; }
.hero-record-upload-modal article > i { width: 24px; height: 18px; display: grid; place-items: center; border: 1px solid #cce2dd; border-radius: 4px; color: #376361; background: #edf6f4; font-size: 6px; font-style: normal; font-weight: 800; }
.hero-record-upload-modal article b,.hero-record-upload-modal article small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero-record-upload-modal article b { color: #303735; font-size: 8px; }
.hero-record-upload-modal article small { margin-top: 2px; color: #77817d; font-size: 6px; }
.hero-record-upload-modal article > em { color: #69746f; font-size: 10px; font-style: normal; }
.hero-record-upload-modal footer { min-height: 45px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 12px; color: #68736f; font-size: 7px; }
.hero-record-upload-modal footer b { padding: 7px 10px; border-radius: 6px; color: #fff; background: #376361; font-size: 8px; }
.hero-record-status { min-height: 27px; display: flex; align-items: center; justify-content: space-between; opacity: 0; color: #68736f; font-size: 7px; }
.hero-record-status > b { display: grid; color: #34423e; font-size: 8px; }
.hero-record-status > b span { grid-area: 1/1; opacity: 0; }
.hero-record-table { overflow: hidden; border: 1px solid #d7e1de; border-radius: 9px; opacity: 0; background: #fff; }
.hero-record-table > header,.hero-record-table > article { display: grid; grid-template-columns: 1.4fr .7fr .7fr .62fr; gap: 10px; align-items: center; }
.hero-record-table > header { min-height: 31px; padding: 0 10px; color: #65706c; background: #f4f7f6; }
.hero-record-table > header b { font-size: 7px; letter-spacing: .04em; text-transform: uppercase; }
.hero-record-table > article { min-height: 51px; padding: 6px 10px; border-top: 1px solid #e3eae8; opacity: 0; color: #596560; font-size: 7px; transform: translateY(7px); }
.hero-record-table > article > span { min-width: 0; }
.hero-record-table > article > span:first-child b,.hero-record-table > article > span:first-child small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero-record-table > article > span:first-child b { color: #303735; font-size: 8px; }
.hero-record-table > article > span:first-child small { margin-top: 2px; color: #77817d; font-size: 6px; }
.hero-upload-live { position: relative; isolation: isolate; min-width: 74px; min-height: 22px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; overflow: hidden; border: 1px solid #dbe5e2; border-radius: 999px; color: #376361; background: #f1f5f4; font-size: 6px; font-style: normal; font-weight: 800; }
.hero-upload-live::before { position: absolute; z-index: -1; inset: 0; background: currentColor; opacity: .1; content: ''; transform: scaleX(0); transform-origin: left; }
.hero-upload-live > i { width: 8px; height: 8px; border: 1px solid currentColor; border-top-color: transparent; border-radius: 50%; }
.hero-upload-live > span { display: grid; }
.hero-upload-live u { grid-area: 1/1; text-decoration: none; opacity: 0; }
.hero-record-ready { position: absolute; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: 29px minmax(0,1fr); gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid #b9ead0; border-radius: 9px; opacity: 0; color: #596560; background: rgba(248,253,250,.98); transform: translateY(7px); }
.hero-record-ready > i { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 50%; color: #15803d; background: #dcfce7; font-size: 12px; font-style: normal; font-weight: 800; }
.hero-record-ready div > b,.hero-record-ready div > span,.hero-record-ready div > small { display: block; }
.hero-record-ready div > b { color: #25302d; font-size: 9px; }
.hero-record-ready div > span { margin-top: 2px; font-size: 7px; }
.hero-record-ready div > small { margin-top: 6px; color: #697570; font-size: 6px; }
.hero-record-ready small b { display: inline; color: #315f55; font-size: inherit; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-empty { animation: hero-record-empty-out .35s .75s ease forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-upload-modal { animation: hero-record-modal 2.65s .4s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-upload-modal footer b { animation: hero-record-submit .35s 2.15s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-status,.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-table { animation: hero-record-surface-in .25s 2.85s ease forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-table > article { animation: hero-record-row-in .32s calc(3.02s + var(--hero-record-delay,0s)) ease forwards; }
.hero-record-table > article:nth-child(2) { --hero-record-delay: 0s; }
.hero-record-table > article:nth-child(3) { --hero-record-delay: .15s; }
.hero-record-table > article:nth-child(4) { --hero-record-delay: .3s; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-upload-live::before { animation: hero-record-pill-fill 3s calc(3.25s + var(--hero-record-delay,0s)) linear forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-upload-live > i { animation: hero-record-spin .55s calc(3.25s + var(--hero-record-delay,0s)) linear 6,hero-record-icon-done .01s calc(6.2s + var(--hero-record-delay,0s)) forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-upload-live u:nth-child(1) { animation: hero-record-label-1 3s calc(3.25s + var(--hero-record-delay,0s)) linear forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-upload-live u:nth-child(2) { animation: hero-record-label-2 3s calc(3.25s + var(--hero-record-delay,0s)) linear forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-upload-live u:nth-child(3) { animation: hero-record-label-3 3s calc(3.25s + var(--hero-record-delay,0s)) linear forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-upload-live u:nth-child(4) { animation: hero-record-label-4 3s calc(3.25s + var(--hero-record-delay,0s)) linear forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-status > b span:nth-child(1) { animation: hero-record-status-1 3.2s 2.9s linear forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-status > b span:nth-child(2) { animation: hero-record-status-2 3.2s 2.9s linear forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-status > b span:nth-child(3) { animation: hero-record-status-3 3.2s 2.9s linear forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-ready { animation: hero-record-ready-in .35s 6.45s ease forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-count i:first-child { animation: hero-record-count-out .01s 3s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-count i:last-child { animation: hero-record-count-in .01s 3s forwards; }
@keyframes hero-record-empty-out { to { opacity: 0; transform: translateY(-5px); } }
@keyframes hero-record-modal { 0%,8% { opacity: 0; transform: translate(-50%,-7px) scale(.985); } 15%,78% { opacity: 1; transform: translate(-50%,0) scale(1); } 100% { opacity: 0; transform: translate(-50%,6px) scale(.99); } }
@keyframes hero-record-submit { 50% { background: #244b49; transform: scale(.96); } }
@keyframes hero-record-surface-in { to { opacity: 1; } }
@keyframes hero-record-row-in { to { opacity: 1; transform: none; } }
@keyframes hero-record-pill-fill { to { transform: scaleX(1); } }
@keyframes hero-record-spin { to { transform: rotate(360deg); } }
@keyframes hero-record-icon-done { to { border-color: #15803d; border-top-color: #15803d; background: #dcfce7; } }
@keyframes hero-record-label-1 { 0%,17% { opacity: 1; } 18%,100% { opacity: 0; } }
@keyframes hero-record-label-2 { 0%,17% { opacity: 0; } 18%,46% { opacity: 1; } 47%,100% { opacity: 0; } }
@keyframes hero-record-label-3 { 0%,46% { opacity: 0; } 47%,83% { opacity: 1; } 84%,100% { opacity: 0; } }
@keyframes hero-record-label-4 { 0%,83% { opacity: 0; } 84%,100% { opacity: 1; } }
@keyframes hero-record-status-1 { 0%,25% { opacity: 1; } 26%,100% { opacity: 0; } }
@keyframes hero-record-status-2 { 0%,25% { opacity: 0; } 26%,82% { opacity: 1; } 83%,100% { opacity: 0; } }
@keyframes hero-record-status-3 { 0%,82% { opacity: 0; } 83%,100% { opacity: 1; } }
@keyframes hero-record-ready-in { to { opacity: 1; transform: none; } }
@keyframes hero-record-count-out { to { opacity: 0; } }
@keyframes hero-record-count-in { to { opacity: 1; } }
.hero-report-demo { min-height: 365px; position: relative; margin-top: 10px; overflow: hidden; }
.hero-report-tabs { min-height: 31px; display: flex; align-items: end; gap: 18px; border-bottom: 1px solid #d7e1de; }
.hero-report-tabs b,.hero-report-tabs span { height: 31px; display: flex; align-items: center; color: #65706c; font-size: 8px; }
.hero-report-tabs b { color: #244b49; border-bottom: 2px solid #376361; }
.hero-report-toolbar { min-height: 40px; display: flex; align-items: center; gap: 8px; }
.hero-report-toolbar span { padding: 7px 9px; border: 1px solid #d5dfdc; border-radius: 6px; color: #697570; background: #fff; font-size: 7px; }
.hero-report-toolbar span:first-child { min-width: 210px; flex: 1; background: #f8faf9; }
.hero-report-table { overflow: hidden; border: 1px solid #d7e1de; border-radius: 8px; background: #fff; }
.hero-report-table > header,.hero-report-table > article { display: grid; grid-template-columns: 1.35fr .65fr .75fr .55fr; gap: 9px; align-items: center; }
.hero-report-table > header { min-height: 31px; padding: 0 10px; color: #65706c; background: #f4f7f6; }
.hero-report-table > header b { font-size: 7px; letter-spacing: .04em; text-transform: uppercase; }
.hero-report-table > article { min-height: 49px; padding: 6px 10px; border-top: 1px solid #e3eae8; color: #596560; font-size: 7px; }
.hero-report-table > article > b { color: #303735; font-size: 8px; }
.hero-report-table > article em { width: fit-content; padding: 5px 8px; border-radius: 999px; color: #315f55; background: #e1f0ec; font-size: 6px; font-style: normal; font-weight: 800; }
.hero-report-new,.hero-report-custom-new { opacity: 0; transform: translateY(7px); }
.hero-report-count { display: grid; }
.hero-report-count i { grid-area: 1/1; font-style: normal; }
.hero-report-count i:nth-child(n+2) { opacity: 0; }
.hero-report-generator { width: min(620px,82%); position: absolute; z-index: 8; top: 19px; left: 50%; overflow: hidden; border: 1px solid #c7d3cf; border-radius: 12px; opacity: 0; background: #fff; transform: translate(-50%,-7px) scale(.985); }
.hero-report-generator > header { min-height: 48px; display: flex; align-items: center; justify-content: space-between; padding: 0 13px; border-bottom: 1px solid #dce3e1; }
.hero-report-generator > header b,.hero-report-generator > header span { display: block; }
.hero-report-generator > header b { color: #26312e; font-size: 10px; }
.hero-report-generator > header span { margin-top: 2px; color: #707b77; font-size: 7px; }
.hero-report-generator > header i { color: #69746f; font-size: 14px; font-style: normal; }
.hero-report-types { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; padding: 12px; }
.hero-report-types article { min-height: 94px; padding: 11px; border: 1px solid #dce5e2; border-radius: 8px; background: #fff; }
.hero-report-types article > i { width: 25px; height: 25px; display: grid; place-items: center; margin-bottom: 9px; border-radius: 6px; color: #376361; background: #e7f1ef; font-size: 10px; font-style: normal; }
.hero-report-types b,.hero-report-types span { display: block; }
.hero-report-types b { color: #293532; font-size: 8px; }
.hero-report-types span { margin-top: 4px; color: #6d7874; font-size: 6px; line-height: 1.4; }
.hero-report-generator > footer { min-height: 49px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 12px; border-top: 1px solid #e2e8e6; color: #65706c; font-size: 7px; }
.hero-report-generator > footer b { padding: 7px 10px; border-radius: 6px; color: #fff; background: #376361; font-size: 8px; }
.hero-report-generating { position: absolute; inset: 48px 0 0; display: grid; align-content: center; justify-items: center; opacity: 0; background: #fff; text-align: center; }
.hero-report-generating i { width: 27px; height: 27px; border: 3px solid #d8e8e4; border-top-color: #376361; border-radius: 50%; }
.hero-report-generating b { margin-top: 10px; color: #26312e; font-size: 10px; }
.hero-report-generating span { margin-top: 4px; color: #6d7874; font-size: 7px; }
.hero-report-viewer { position: absolute; z-index: 12; inset: 0; overflow: hidden; border: 1px solid #cbd9d5; border-radius: 9px; visibility: hidden; opacity: 0; background: #fbfdfc; transform: translateY(8px); }
.hero-report-viewer > header { min-height: 43px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; padding: 0 12px; border-bottom: 1px solid #dce5e2; color: #68736f; font-size: 7px; }
.hero-report-viewer > header b { color: #27332f; font-size: 10px; text-align: center; }
.hero-report-viewer > header em { justify-self: end; font-size: 6px; font-style: normal; }
.hero-report-viewer-body { padding: 16px; }
.hero-report-viewer-body > section { padding: 14px; border-radius: 8px; background: linear-gradient(120deg,#e9f3f0,#f6f3df); }
.hero-report-viewer-body > section span { color: #2f7773; font-size: 6px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hero-report-viewer-body h3 { margin: 5px 0 0; color: #27312e; font: 400 19px/1 var(--serif); }
.hero-report-viewer-body p { max-width: 440px; margin: 7px 0 0; color: #5e6965; font-size: 7px; line-height: 1.5; }
.hero-report-viewer-body > div { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 9px; }
.hero-report-viewer-body > div article { padding: 10px; border: 1px solid #dbe4e1; border-radius: 7px; background: #fff; }
.hero-report-viewer-body > div span,.hero-report-viewer-body > div b { display: block; }
.hero-report-viewer-body > div span { color: #6b7672; font-size: 6px; }
.hero-report-viewer-body > div b { margin-top: 5px; color: #315f5b; font-size: 15px; }
.hero-report-viewer-body > footer { display: flex; align-items: center; justify-content: space-between; margin-top: 9px; padding: 10px 11px; border: 1px solid #bfe0d7; border-radius: 7px; color: #5e6a66; background: #edf7f4; font-size: 7px; }
.hero-report-viewer-body > footer b { color: #285c50; font-size: 8px; }
.hero-custom-report-generator { width: min(640px,84%); position: absolute; z-index: 14; top: 12px; left: 50%; overflow: hidden; border: 1px solid #c7d3cf; border-radius: 12px; opacity: 0; background: #fff; transform: translate(-50%,-7px) scale(.985); }
.hero-custom-report-generator > header { min-height: 45px; display: flex; align-items: center; justify-content: space-between; padding: 0 13px; border-bottom: 1px solid #dce3e1; }
.hero-custom-report-generator > header b,.hero-custom-report-generator > header span { display: block; }
.hero-custom-report-generator > header b { color: #26312e; font-size: 10px; }
.hero-custom-report-generator > header span { margin-top: 2px; color: #707b77; font-size: 7px; }
.hero-custom-report-generator > header i { color: #69746f; font-size: 14px; font-style: normal; }
.hero-custom-report-name { display: flex; align-items: center; gap: 10px; margin: 10px 12px 0; padding: 8px 10px; border: 1px solid #d8e2df; border-radius: 7px; }
.hero-custom-report-name span { color: #707b77; font-size: 7px; }
.hero-custom-report-name b { color: #293531; font-size: 8px; }
.hero-custom-report-layout { display: grid; grid-template-columns: 128px minmax(0,1fr); gap: 9px; padding: 9px 12px; }
.hero-custom-report-layout nav { display: flex; flex-direction: column; gap: 4px; padding: 8px; border-radius: 7px; background: #f3f7f6; }
.hero-custom-report-layout nav b { margin-bottom: 3px; color: #46534f; font-size: 7px; }
.hero-custom-report-layout nav span { padding: 6px; border-radius: 5px; color: #68736f; font-size: 6px; }
.hero-custom-report-layout nav .is-selected { color: #285c55; background: #deeeea; font-weight: 800; }
.hero-custom-report-layout > section { overflow: hidden; border: 1px solid #d9e3e0; border-radius: 7px; }
.hero-custom-report-layout > section > header { min-height: 30px; display: flex; align-items: center; justify-content: space-between; padding: 0 9px; border-bottom: 1px solid #e2e8e6; }
.hero-custom-report-layout > section > header b { color: #293531; font-size: 8px; }
.hero-custom-report-layout > section > header span { color: #68736f; font-size: 6px; }
.hero-custom-chart { height: 88px; position: relative; padding: 8px 10px 14px; background: repeating-linear-gradient(to bottom,transparent 0,transparent 27px,#edf0ef 28px); }
.hero-custom-chart svg { width: 100%; height: 61px; display: block; }
.hero-custom-chart span { position: absolute; bottom: 5px; color: #707b77; font-size: 5px; }
.hero-custom-chart span:nth-of-type(1) { left: 10px; }
.hero-custom-chart span:nth-of-type(2) { left: 48%; }
.hero-custom-chart span:nth-of-type(3) { right: 10px; }
.hero-custom-report-generator > footer { min-height: 43px; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; border-top: 1px solid #e2e8e6; color: #65706c; font-size: 7px; }
.hero-custom-report-generator > footer b { padding: 7px 10px; border-radius: 6px; color: #fff; background: #376361; font-size: 8px; }
.hero-custom-report-generating { position: absolute; inset: 45px 0 0; display: grid; align-content: center; justify-items: center; opacity: 0; background: #fff; text-align: center; }
.hero-custom-report-generating i { width: 27px; height: 27px; border: 3px solid #d8e8e4; border-top-color: #376361; border-radius: 50%; }
.hero-custom-report-generating b { margin-top: 9px; color: #26312e; font-size: 10px; }
.hero-custom-report-generating span { margin-top: 4px; color: #6d7874; font-size: 7px; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .product-hero-menu-head > div:last-child b { animation: hero-report-action-click .32s .65s ease both,hero-report-action-click .32s 8.35s ease; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-generator { animation: hero-report-generator-open 4.45s .72s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-types article:first-child { animation: hero-report-type-select .45s 2s ease forwards; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-generator > footer b { animation: hero-report-action-click .32s 2.85s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-generating { animation: hero-report-generating-in 1.45s 3.12s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-generating i { animation: hero-record-spin .6s 3.12s linear 3; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-new { animation: hero-report-new-in .38s 5.05s ease forwards; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-viewer { animation: hero-report-viewer-sequence 2.35s 6.15s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-custom-report-generator { animation: hero-custom-report-open 4.15s 8.45s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-custom-report-layout > section { animation: hero-custom-chart-select .4s 9.75s ease forwards; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-custom-report-generator > footer b { animation: hero-report-action-click .32s 10.65s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-custom-report-generating { animation: hero-report-generating-in 1.45s 10.95s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-custom-report-generating i { animation: hero-record-spin .6s 10.95s linear 3; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-custom-new { animation: hero-report-new-in .38s 12.65s ease forwards; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-count i:nth-child(1) { animation: hero-record-count-out .01s 5.05s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-count i:nth-child(2) { animation: hero-record-count-in .01s 5.05s forwards,hero-record-count-out .01s 12.65s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-report-count i:nth-child(3) { animation: hero-record-count-in .01s 12.65s forwards; }
@keyframes hero-report-action-click { 50% { background: #244b49; transform: scale(.95); } }
@keyframes hero-report-generator-open { 0%,7% { opacity: 0; transform: translate(-50%,-7px) scale(.985); } 12%,85% { opacity: 1; transform: translate(-50%,0) scale(1); } 100% { opacity: 0; transform: translate(-50%,5px) scale(.99); } }
@keyframes hero-report-type-select { to { border-color: #72a49b; background: #eaf4f1; } }
@keyframes hero-report-generating-in { 0%,8% { opacity: 0; } 18%,88% { opacity: 1; } 100% { opacity: 0; } }
@keyframes hero-report-new-in { to { opacity: 1; background: #edf7f4; transform: none; } }
@keyframes hero-report-viewer-sequence { 0% { visibility: hidden; opacity: 0; transform: translateY(8px); } 14%,82% { visibility: visible; opacity: 1; transform: none; } 100% { visibility: hidden; opacity: 0; transform: translateY(-6px); } }
@keyframes hero-custom-report-open { 0%,7% { opacity: 0; transform: translate(-50%,-7px) scale(.985); } 12%,86% { opacity: 1; transform: translate(-50%,0) scale(1); } 100% { opacity: 0; transform: translate(-50%,5px) scale(.99); } }
@keyframes hero-custom-chart-select { to { border-color: #72a49b; background: #f4faf8; } }
.hero-demo-cursor { width: 17px; height: 22px; position: absolute; z-index: 40; top: 25%; left: 28%; opacity: 0; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(25,42,37,.25)); }
.hero-demo-cursor::before { width: 17px; height: 22px; display: block; background: #244b49; clip-path: polygon(0 0,0 83%,27% 64%,46% 100%,62% 91%,43% 58%,76% 57%); content: ''; transform: rotate(-8deg); transform-origin: top left; }
.hero-demo-cursor::after { width: 25px; height: 25px; position: absolute; top: -8px; left: -9px; border: 2px solid #48a9a6; border-radius: 50%; opacity: 0; content: ''; }
.product-hero-menu-page.is-animating .hero-demo-cursor { animation: hero-menu-cursor 3.2s ease both; }
.product-hero-menu-page.is-animating .hero-demo-cursor::after { animation: hero-menu-cursor-click 3.2s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-demo-cursor { animation: hero-record-cursor 7s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-demo-cursor::after { animation: hero-record-cursor-click 7s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-demo-cursor { animation: hero-report-cursor 14s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .hero-demo-cursor::after { animation: hero-report-cursor-click 14s ease both; }
@keyframes hero-menu-cursor { 0% { top: 40%; left: 35%; opacity: 0; } 10% { opacity: 1; } 42% { top: 40%; left: 35%; opacity: 1; } 68% { top: 72%; left: 72%; opacity: 1; } 100% { top: 72%; left: 72%; opacity: 0; } }
@keyframes hero-menu-cursor-click { 0%,37%,47%,100% { opacity: 0; transform: scale(.35); } 41% { opacity: .9; transform: scale(1); } }
@keyframes hero-record-cursor { 0% { top: 7%; left: 91%; opacity: 0; } 5% { opacity: 1; } 13% { top: 7%; left: 91%; opacity: 1; } 27% { top: 54%; left: 79%; opacity: 1; } 46% { top: 38%; left: 86%; opacity: 1; } 72% { top: 56%; left: 86%; opacity: 1; } 94% { top: 88%; left: 52%; opacity: 1; } 100% { top: 88%; left: 52%; opacity: 0; } }
@keyframes hero-record-cursor-click { 0%,9%,15%,25%,32%,100% { opacity: 0; transform: scale(.35); } 12%,29% { opacity: .9; transform: scale(1); } }
@keyframes hero-report-cursor { 0% { top: 7%; left: 91%; opacity: 0; } 2% { opacity: 1; } 6% { top: 7%; left: 91%; opacity: 1; } 15% { top: 37%; left: 26%; opacity: 1; } 22% { top: 68%; left: 79%; opacity: 1; } 39% { top: 60%; left: 80%; opacity: 1; } 48% { top: 58%; left: 32%; opacity: 1; } 53% { top: 13%; left: 13%; opacity: 1; } 61% { top: 7%; left: 91%; opacity: 1; } 70% { top: 58%; left: 58%; opacity: 1; } 77% { top: 81%; left: 79%; opacity: 1; } 91% { top: 82%; left: 38%; opacity: 1; } 100% { top: 82%; left: 38%; opacity: 0; } }
@keyframes hero-report-cursor-click { 0%,3%,7%,13%,17%,20%,24%,37%,41%,46%,50%,51%,55%,59%,63%,68%,72%,75%,79%,89%,93%,100% { opacity: 0; transform: scale(.35); } 5%,15%,22%,39%,48%,53%,61%,70%,77%,91% { opacity: .9; transform: scale(1); } }
.hero-biomarker-demo { min-height: 365px; position: relative; margin-top: 11px; overflow: hidden; }
.hero-bio-toolbar { min-height: 41px; display: flex; align-items: center; gap: 8px; }
.hero-bio-toolbar span { padding: 7px 9px; border: 1px solid #d5dfdc; border-radius: 6px; color: #697570; background: #fff; font-size: 7px; }
.hero-bio-toolbar span:first-child { min-width: 215px; flex: 1; background: #f8faf9; }
.hero-bio-table { overflow: hidden; border: 1px solid #d7e1de; border-radius: 8px; background: #fff; }
.hero-bio-table > header,.hero-bio-table > article { display: grid; grid-template-columns: 1.15fr .55fr .82fr .72fr .55fr .7fr 22px; gap: 8px; align-items: center; }
.hero-bio-table > header { min-height: 31px; padding: 0 10px; color: #65706c; background: #f4f7f6; }
.hero-bio-table > header b { font-size: 7px; letter-spacing: .04em; text-transform: uppercase; }
.hero-bio-table > article { min-height: 55px; padding: 6px 10px; border-top: 1px solid #e3eae8; color: #596560; font-size: 7px; }
.hero-bio-table > article > span { min-width: 0; }
.hero-bio-table > article > span:first-child b,.hero-bio-table > article > span:first-child small,.hero-bio-table > article > span:nth-child(3) b,.hero-bio-table > article > span:nth-child(3) small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero-bio-table > article > span:first-child b,.hero-bio-table > article > span:nth-child(3) b { color: #303735; font-size: 8px; }
.hero-bio-table > article small { margin-top: 2px; color: #77817d; font-size: 6px; }
.hero-bio-table > article > span:nth-child(5) svg { width: 56px; height: 21px; display: block; }
.hero-bio-table > article > span:last-child { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.hero-bio-table > article > span:last-child b { color: #376361; font-size: 6px; opacity: .7; }
.hero-bio-table > article > span:last-child i { width: 20px; height: 20px; display: grid; place-items: center; border: 1px solid #cedbd7; border-radius: 5px; color: #376361; font-size: 10px; font-style: normal; }
.hero-bio-table > article > span:last-child i svg,
.hero-diag-table > article > span:last-child i svg { width: 11px; height: 11px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.hero-bio-custom-range { opacity: 0; }
.hero-bio-detail { position: absolute; z-index: 10; inset: 0; overflow: hidden; border: 1px solid #cbd9d5; border-radius: 9px; visibility: hidden; opacity: 0; background: #fbfdfc; transform: translateY(7px); }
.hero-bio-detail > header { min-height: 49px; display: grid; grid-template-columns: 1fr auto 25px; gap: 12px; align-items: center; padding: 0 12px; border-bottom: 1px solid #dce5e2; }
.hero-bio-detail > header b,.hero-bio-detail > header span,.hero-bio-detail > header strong,.hero-bio-detail > header small { display: block; }
.hero-bio-detail > header b { color: #26312e; font-size: 11px; }
.hero-bio-detail > header span,.hero-bio-detail > header small { margin-top: 2px; color: #6d7874; font-size: 6px; }
.hero-bio-detail > header strong { color: #315f5b; font-size: 12px; text-align: right; }
.hero-bio-detail > header i { width: 23px; height: 23px; display: grid; place-items: center; border-radius: 5px; color: #69746f; background: #f0f4f3; font-size: 12px; font-style: normal; }
.hero-bio-detail > section { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,.75fr); gap: 9px; padding: 10px; }
.hero-bio-chart,.hero-bio-review { overflow: hidden; border: 1px solid #d9e3e0; border-radius: 7px; background: #fff; }
.hero-bio-chart > header,.hero-bio-review > header { min-height: 34px; display: flex; align-items: center; justify-content: space-between; padding: 0 9px; border-bottom: 1px solid #e3e9e7; }
.hero-bio-chart > header b,.hero-bio-review > header b { color: #293531; font-size: 8px; }
.hero-bio-chart > header span,.hero-bio-review > header span { color: #707b77; font-size: 5px; }
.hero-bio-chart > svg { width: calc(100% - 18px); height: 160px; display: block; margin: 0 9px; }
.hero-bio-chart > footer { display: flex; justify-content: space-between; padding: 0 10px 8px; color: #707b77; font-size: 5px; }
.hero-bio-review > div { min-height: 69px; display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; align-items: center; padding: 8px 9px; border-top: 1px solid #e6ebe9; color: #68736f; font-size: 6px; }
.hero-bio-review > div:first-of-type { border-top: 0; }
.hero-bio-review > div b { color: #293531; font-size: 9px; text-align: right; }
.hero-bio-review > div em { grid-column: 2; width: fit-content; padding: 4px 6px; border-radius: 999px; color: #9a4b2b; background: #fff0e8; font-size: 5px; font-style: normal; }
.hero-bio-range-modal { width: min(550px,76%); position: absolute; z-index: 14; top: 54px; left: 50%; overflow: hidden; border: 1px solid #c7d3cf; border-radius: 11px; visibility: hidden; opacity: 0; background: #fff; transform: translate(-50%,-7px) scale(.985); }
.hero-bio-range-modal > header { min-height: 55px; display: flex; align-items: center; justify-content: space-between; padding: 0 13px; border-bottom: 1px solid #dce3e1; }
.hero-bio-range-modal > header b,.hero-bio-range-modal > header span { display: block; }
.hero-bio-range-modal > header b { color: #26312e; font-size: 10px; }
.hero-bio-range-modal > header span { max-width: 350px; margin-top: 3px; color: #707b77; font-size: 6px; }
.hero-bio-range-modal > header i { color: #69746f; font-size: 14px; font-style: normal; }
.hero-bio-range-modal > p { margin: 10px 13px 0; color: #68736f; font-size: 7px; }
.hero-bio-range-modal > div { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; padding: 9px 13px 13px; }
.hero-bio-range-modal label > span { display: block; margin-bottom: 5px; color: #48534f; font-size: 7px; font-weight: 800; }
.hero-bio-range-modal label > b { min-height: 35px; display: grid; grid-template-columns: 1fr auto; align-items: center; padding: 0 9px; border: 1px solid #d3dedb; border-radius: 6px; color: #293531; background: #fff; }
.hero-bio-range-modal label i { grid-area: 1/1; font-size: 8px; font-style: normal; font-weight: 500; }
.hero-bio-range-modal label em { color: #707b77; font-size: 7px; font-style: normal; }
.hero-bio-range-min,.hero-bio-range-max { opacity: 0; }
.hero-bio-range-placeholder { color: #929a97; }
.hero-bio-range-modal > footer { min-height: 47px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 0 13px; border-top: 1px solid #e2e8e6; }
.hero-bio-range-modal > footer span,.hero-bio-range-modal > footer b { padding: 7px 10px; border-radius: 6px; font-size: 8px; }
.hero-bio-range-modal > footer span { color: #596560; border: 1px solid #d2ddda; }
.hero-bio-range-modal > footer b { color: #fff; background: #376361; }
.hero-bio-saved { position: absolute; right: 10px; bottom: 10px; padding: 8px 10px; border: 1px solid #bce2d2; border-radius: 7px; opacity: 0; color: #28604c; background: #edf8f2; font-size: 7px; font-weight: 800; transform: translateY(6px); }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-detail { animation: hero-bio-detail-sequence 4.1s .65s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-focus { animation: hero-bio-row-review 4.1s .65s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-focus > span:nth-child(6) b { animation: hero-bio-edit-highlight .35s 5s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-range-modal { animation: hero-bio-modal-sequence 4.15s 5.05s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-range-modal label:first-child .hero-bio-range-placeholder { animation: hero-record-count-out .01s 6.18s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-range-min { animation: hero-record-count-in .01s 6.18s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-range-modal label:last-child .hero-bio-range-placeholder { animation: hero-record-count-out .01s 6.92s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-range-max { animation: hero-record-count-in .01s 6.92s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-range-modal > footer b { animation: hero-report-action-click .32s 8.05s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-lab-range { animation: hero-record-count-out .01s 9.05s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-custom-range { animation: hero-record-count-in .01s 9.05s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-focus > span:nth-child(3) > b { animation: hero-bio-outside-range .25s 9.05s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-bio-saved { animation: hero-bio-saved-in .3s 9.05s ease forwards; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-demo-cursor { animation: hero-bio-cursor 10s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="biomarkers"] .hero-demo-cursor::after { animation: hero-bio-cursor-click 10s ease both; }
@keyframes hero-bio-detail-sequence { 0%,7% { visibility: hidden; opacity: 0; transform: translateY(7px); } 13%,87% { visibility: visible; opacity: 1; transform: none; } 100% { visibility: hidden; opacity: 0; transform: translateY(-6px); } }
@keyframes hero-bio-row-review { 0%,10%,92%,100% { background: #fff; } 15%,87% { background: #edf6f3; } }
@keyframes hero-bio-edit-highlight { 50% { color: #fff; background: #376361; transform: scale(.96); } }
@keyframes hero-bio-modal-sequence { 0%,7% { visibility: hidden; opacity: 0; transform: translate(-50%,-7px) scale(.985); } 13%,88% { visibility: visible; opacity: 1; transform: translate(-50%,0) scale(1); } 100% { visibility: hidden; opacity: 0; transform: translate(-50%,5px) scale(.99); } }
@keyframes hero-bio-outside-range { to { color: #b04836; } }
@keyframes hero-bio-saved-in { to { opacity: 1; transform: none; } }
@keyframes hero-bio-cursor { 0% { top: 42%; left: 92%; opacity: 0; } 3% { opacity: 1; } 8% { top: 42%; left: 92%; opacity: 1; } 21% { top: 44%; left: 47%; opacity: 1; } 32% { top: 70%; left: 69%; opacity: 1; } 42% { top: 14%; left: 92%; opacity: 1; } 52% { top: 42%; left: 84%; opacity: 1; } 62% { top: 51%; left: 40%; opacity: 1; } 70% { top: 51%; left: 67%; opacity: 1; } 82% { top: 76%; left: 78%; opacity: 1; } 94% { top: 42%; left: 58%; opacity: 1; } 100% { top: 42%; left: 58%; opacity: 0; } }
@keyframes hero-bio-cursor-click { 0%,6%,10%,40%,44%,50%,54%,60%,64%,68%,72%,80%,84%,100% { opacity: 0; transform: scale(.35); } 8%,42%,52%,62%,70%,82% { opacity: .9; transform: scale(1); } }
.hero-diagnosis-demo { min-height: 365px; position: relative; margin-top: 11px; overflow: hidden; }
.hero-diag-toolbar { min-height: 41px; display: flex; align-items: center; gap: 8px; }
.hero-diag-toolbar span { padding: 7px 9px; border: 1px solid #d5dfdc; border-radius: 6px; color: #697570; background: #fff; font-size: 7px; }
.hero-diag-toolbar span:first-child { min-width: 215px; flex: 1; background: #f8faf9; }
.hero-diag-table { overflow: hidden; border: 1px solid #d7e1de; border-radius: 8px; background: #fff; }
.hero-diag-table > header,.hero-diag-table > article { display: grid; grid-template-columns: 1.05fr .62fr .7fr .55fr 1.35fr 24px; gap: 8px; align-items: center; }
.hero-diag-table > header { min-height: 31px; padding: 0 9px; color: #65706c; background: #f4f7f6; }
.hero-diag-table > header b { overflow: hidden; font-size: 7px; letter-spacing: .03em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.hero-diag-table > article { min-height: 61px; padding: 6px 9px; border-top: 1px solid #e3eae8; color: #596560; font-size: 7px; }
.hero-diag-table > article > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero-diag-table > article > span:first-child b,.hero-diag-table > article > span:first-child small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero-diag-table > article > span:first-child b { color: #303735; font-size: 8px; }
.hero-diag-table > article > span:first-child small { margin-top: 2px; color: #77817d; font-size: 6px; }
.hero-diag-table > article > span:last-child i { width: 21px; height: 21px; display: grid; place-items: center; border: 1px solid #cedbd7; border-radius: 5px; color: #376361; font-size: 9px; font-style: normal; }
.hero-diag-focus > span:nth-child(3),.hero-diag-focus > span:nth-child(4) { display: grid; }
.hero-diag-focus > span:nth-child(3) i,.hero-diag-focus > span:nth-child(4) i { grid-area: 1/1; font-style: normal; }
.hero-diag-resolved-date,.hero-diag-resolved-status { opacity: 0; }
.hero-diag-tooltip { width: 290px; position: absolute; z-index: 9; top: 73px; left: 92px; padding: 10px 11px; border: 1px solid #bfcfca; border-radius: 8px; opacity: 0; color: #5c6864; background: #fff; font-size: 7px; transform: translateY(5px); }
.hero-diag-tooltip > header { display: flex; align-items: center; justify-content: space-between; }
.hero-diag-tooltip > header b { color: #28332f; font-size: 8px; }
.hero-diag-tooltip > header span { padding: 4px 6px; border-radius: 999px; color: #315f55; background: #e4f1ed; font-size: 6px; }
.hero-diag-tooltip p { margin: 7px 0 0; line-height: 1.5; }
.hero-diag-tooltip footer { margin-top: 7px; padding-top: 7px; border-top: 1px solid #e3e9e7; color: #74807b; font-size: 6px; }
.hero-diag-edit { width: min(620px,84%); position: absolute; z-index: 13; top: 7px; left: 50%; overflow: hidden; border: 1px solid #c7d3cf; border-radius: 11px; visibility: hidden; opacity: 0; background: #fff; transform: translate(-50%,-7px) scale(.985); }
.hero-diag-edit > header { min-height: 44px; display: flex; align-items: center; justify-content: space-between; padding: 0 13px; border-bottom: 1px solid #dce3e1; }
.hero-diag-edit > header b { color: #26312e; font-size: 10px; }
.hero-diag-edit > header i { color: #69746f; font-size: 14px; font-style: normal; }
.hero-diag-form { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px 13px; }
.hero-diag-form label.is-wide { grid-column: 1/-1; }
.hero-diag-form label > span { display: block; margin-bottom: 4px; color: #48534f; font-size: 7px; font-weight: 800; }
.hero-diag-form label > span em { color: #7b8581; font-style: normal; font-weight: 500; }
.hero-diag-form label > b { min-height: 31px; display: grid; grid-template-columns: 1fr auto; align-items: center; padding: 0 8px; border: 1px solid #d3dedb; border-radius: 6px; color: #293531; background: #fff; font-size: 7px; font-weight: 500; }
.hero-diag-form label > b i { grid-area: 1/1; font-style: normal; }
.hero-diag-form label > b strong { color: #6c7773; font-size: 8px; }
.hero-diag-form label > b.is-textarea { min-height: 46px; align-items: start; padding-top: 7px; line-height: 1.4; }
.hero-diag-date-value,.hero-diag-modal-resolved { opacity: 0; }
.hero-diag-date-placeholder { color: #8b9491; }
.hero-diag-edit > footer { min-height: 43px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 0 13px; border-top: 1px solid #e2e8e6; }
.hero-diag-edit > footer span,.hero-diag-edit > footer b { padding: 7px 10px; border-radius: 6px; font-size: 8px; }
.hero-diag-edit > footer span { color: #596560; border: 1px solid #d2ddda; }
.hero-diag-edit > footer b { color: #fff; background: #376361; }
.hero-diag-calendar { width: 190px; position: absolute; z-index: 2; top: 132px; right: 13px; padding: 8px; border: 1px solid #c9d6d2; border-radius: 8px; opacity: 0; background: #fff; transform: translateY(-4px); }
.hero-diag-calendar > header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; }
.hero-diag-calendar > header b { color: #2d3834; font-size: 7px; }
.hero-diag-calendar > header span { color: #68736f; font-size: 8px; }
.hero-diag-calendar > div { display: grid; grid-template-columns: repeat(7,1fr); gap: 2px; }
.hero-diag-calendar i { height: 19px; display: grid; place-items: center; border-radius: 4px; color: #64706c; font-size: 6px; font-style: normal; }
.hero-diag-calendar i:nth-child(-n+7) { color: #8a9390; font-size: 5px; font-weight: 800; }
.hero-diag-calendar .is-picked { color: #fff; background: #376361; }
.hero-diag-saved { position: absolute; right: 10px; bottom: 10px; padding: 8px 10px; border: 1px solid #bce2d2; border-radius: 7px; opacity: 0; color: #28604c; background: #edf8f2; font-size: 7px; font-weight: 800; transform: translateY(6px); }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-tooltip { animation: hero-diag-tooltip-sequence 2.2s .45s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-focus > span:last-child i { animation: hero-diag-edit-click .32s 2.95s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-edit { animation: hero-diag-edit-sequence 4s 3.08s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-calendar { animation: hero-diag-calendar-sequence 1.55s 4.18s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-date-placeholder { animation: hero-record-count-out .01s 5.35s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-date-value { animation: hero-record-count-in .01s 5.35s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-modal-current { animation: hero-record-count-out .01s 5.35s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-modal-resolved { animation: hero-record-count-in .01s 5.35s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-edit > footer b { animation: hero-report-action-click .32s 6.35s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-open-date,.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-current-status { animation: hero-record-count-out .01s 7.12s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-resolved-date,.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-resolved-status { animation: hero-record-count-in .01s 7.12s forwards; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-focus { animation: hero-diag-row-hover 2.2s .45s ease both,hero-diag-row-saved .35s 7.12s ease forwards; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-diag-saved { animation: hero-diag-saved-in .3s 7.12s ease forwards; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-demo-cursor { animation: hero-diag-cursor 8s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="diagnoses"] .hero-demo-cursor::after { animation: hero-diag-cursor-click 8s ease both; }
@keyframes hero-diag-tooltip-sequence { 0%,8% { opacity: 0; transform: translateY(5px); } 16%,84% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(-4px); } }
@keyframes hero-diag-row-hover { 0%,8%,92%,100% { background: #fff; } 16%,84% { background: #edf6f3; } }
@keyframes hero-diag-edit-click { 50% { color: #fff; background: #376361; transform: scale(.94); } }
@keyframes hero-diag-edit-sequence { 0%,7% { visibility: hidden; opacity: 0; transform: translate(-50%,-7px) scale(.985); } 13%,88% { visibility: visible; opacity: 1; transform: translate(-50%,0) scale(1); } 100% { visibility: hidden; opacity: 0; transform: translate(-50%,5px) scale(.99); } }
@keyframes hero-diag-calendar-sequence { 0%,7% { opacity: 0; transform: translateY(-4px); } 15%,82% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(4px); } }
@keyframes hero-diag-row-saved { to { background: #edf7f4; } }
@keyframes hero-diag-saved-in { to { opacity: 1; transform: none; } }
@keyframes hero-diag-cursor { 0% { top: 39%; left: 23%; opacity: 0; } 3% { opacity: 1; } 18% { top: 39%; left: 23%; opacity: 1; } 36% { top: 39%; left: 92%; opacity: 1; } 51% { top: 49%; left: 68%; opacity: 1; } 63% { top: 66%; left: 79%; opacity: 1; } 79% { top: 82%; left: 79%; opacity: 1; } 93% { top: 39%; left: 56%; opacity: 1; } 100% { top: 39%; left: 56%; opacity: 0; } }
@keyframes hero-diag-cursor-click { 0%,33%,39%,48%,54%,60%,66%,76%,82%,100% { opacity: 0; transform: scale(.35); } 36%,51%,63%,79% { opacity: .9; transform: scale(1); } }
.product-hero-menu-toolbar { min-height: 44px; display: flex; align-items: center; gap: 8px; margin-top: 17px; }
.product-hero-menu-toolbar span { padding: 8px 10px; border: 1px solid #d5dfdc; border-radius: 7px; color: #596560; background: #fff; font-size: 9px; }
.product-hero-menu-toolbar .is-search { min-width: 205px; flex: 1; color: #7a8581; background: #f8faf9; }
.product-hero-menu-toolbar .is-search::before { margin-right: 7px; content: "⌕"; font-size: 11px; }
.product-hero-data-table { overflow: hidden; border: 1px solid #d7e1de; border-radius: 9px; background: #fff; }
.product-hero-data-table > header,
.product-hero-data-table > div { display: grid; grid-template-columns: repeat(var(--hero-columns),minmax(0,1fr)); gap: 9px; align-items: center; }
.product-hero-data-table > header { min-height: 35px; padding: 0 11px; color: #65706c; background: #f4f7f6; }
.product-hero-data-table > header b { overflow: hidden; font-size: 8px; letter-spacing: .04em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.product-hero-data-table > div { min-height: 55px; padding: 7px 11px; border-top: 1px solid #e3eae8; }
.product-hero-data-table > div b,
.product-hero-data-table > div span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-hero-data-table > div b { color: #303735; font-size: 9px; }
.product-hero-data-table > div span { color: #596560; font-size: 8px; }
.product-hero-data-table.is-editable > header,
.product-hero-data-table.is-editable > div { grid-template-columns: repeat(var(--hero-data-columns),minmax(0,1fr)) 42px; }
.hero-data-edit-button { width: 37px; min-height: 24px; padding: 0; border: 1px solid #b9d2cc; border-radius: 6px; color: #315f5b; background: #f7fbfa; font: 800 8px/1 var(--sans); }
.hero-data-edit-button svg { width: 12px; height: 12px; display: block; margin: auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.product-hero-menu-page.is-animating .product-hero-data-table.is-editable .is-demo-row .hero-data-edit-button { animation: hero-data-edit-press 4.8s ease both; }
.hero-data-modal { position: absolute; z-index: 18; inset: 0; visibility: hidden; opacity: 0; }
.hero-data-modal-shade { position: absolute; inset: 0; background: rgba(24,36,33,.24); backdrop-filter: blur(1.5px); }
.hero-data-modal > section { position: absolute; top: 50%; left: 50%; width: min(620px,calc(100% - 34px)); max-height: calc(100% - 28px); box-sizing: border-box; padding: 16px; overflow: hidden; border: 1px solid #becfca; border-radius: 13px; background: #fff; box-shadow: 0 28px 65px rgba(24,42,38,.28); transform: translate(-50%,calc(-50% + 10px)) scale(.985); }
.hero-data-modal > section > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding-bottom: 11px; border-bottom: 1px solid #e0e7e5; }
.hero-data-modal > section > header small,.hero-data-modal > section > header b,.hero-data-modal > section > header span { display: block; }
.hero-data-modal > section > header small { color: #6a7672; font-size: 7px; font-weight: 800; letter-spacing: .1em; }
.hero-data-modal > section > header b { margin-top: 3px; color: #202523; font-size: 14px; }
.hero-data-modal > section > header span { margin-top: 3px; color: #67736f; font-size: 8px; }
.hero-data-modal > section > header i { width: 25px; height: 25px; display: grid; place-items: center; flex: none; border-radius: 6px; color: #64706c; background: #f1f5f3; font-size: 13px; font-style: normal; }
.hero-data-modal-fields { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin-top: 11px; }
.hero-data-modal-fields label,.hero-data-modal-note { min-width: 0; display: block; padding: 8px 9px; border: 1px solid #d5dfdc; border-radius: 7px; background: #fbfcfc; }
.hero-data-modal-fields span,.hero-data-modal-note span { display: block; color: #6d7975; font-size: 7px; font-weight: 700; }
.hero-data-modal-fields strong,.hero-data-modal-note strong { display: block; margin-top: 4px; overflow: hidden; color: #29332f; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.hero-data-modal-note { margin-top: 8px; }
.hero-data-modal-note strong { line-height: 1.4; white-space: normal; }
.hero-data-modal-notes { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.hero-data-modal-source { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 8px; align-items: center; margin-top: 8px; padding: 8px 9px; border-radius: 7px; color: #51605b; background: #edf5f2; font-size: 7px; }
.hero-data-modal-source b { color: #294e49; }
.hero-data-modal-source span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero-data-modal-source strong { color: #315f5b; }
.hero-data-modal footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 11px; }
.hero-data-modal footer > span { color: #78827f; font-size: 7px; }
.hero-data-modal footer > div { display: flex; gap: 6px; }
.hero-data-modal footer b,.hero-data-modal footer strong { padding: 8px 10px; border: 1px solid #c8d5d1; border-radius: 6px; color: #42514d; background: #fff; font-size: 8px; }
.hero-data-modal footer strong { border-color: #376361; color: #fff; background: #376361; }
.hero-data-modal.is-genetics > section { width: min(710px,calc(100% - 28px)); }
.hero-data-modal.is-genetics .hero-data-modal-fields { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; }
.hero-data-modal.is-genetics .hero-data-modal-fields label { padding: 6px 8px; }
.hero-genetics-tabs { margin-top: 18px; }
.hero-genetics-tier { margin-top: 14px; overflow: hidden; border: 1px solid #d3dfdc; border-radius: 10px; background: #fff; }
.hero-genetics-tier > header { min-height: 69px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 14px; }
.hero-genetics-tier > header div :is(small,b,span) { display: block; }
.hero-genetics-tier > header small { color: #65706c; font-size: 7px; font-weight: 800; letter-spacing: .08em; }
.hero-genetics-tier > header b { margin-top: 3px; color: #28332f; font-size: 11px; }
.hero-genetics-tier > header b em { margin-left: 6px; padding: 2px 6px; border-radius: 999px; color: #52615e; background: #edf2f0; font-size: 7px; font-style: normal; }
.hero-genetics-tier > header span { margin-top: 3px; color: #65706c; font-size: 8px; }
.hero-genetics-tier > header > i { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; color: #4f5c58; background: #edf2f0; font-size: 12px; font-style: normal; }
.hero-genetics-tier > section { border-top: 1px solid #dfe7e4; }
.hero-genetics-tier article { min-height: 62px; display: grid; grid-template-columns: 150px minmax(0,1fr) 22px; gap: 12px; align-items: center; padding: 8px 14px; border-top: 1px solid #e6ecea; }
.hero-genetics-tier article:first-child { border-top: 0; }
.hero-genetics-tier article div { display: flex; align-items: center; gap: 7px; }
.hero-genetics-tier article b { color: #28332f; font-size: 10px; }
.hero-genetics-tier article span { padding: 3px 6px; border-radius: 999px; color: #5e6b67; background: #edf2f0; font-size: 7px; }
.hero-genetics-tier article p { margin: 0; overflow: hidden; color: #596560; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.hero-genetics-tier article strong { color: #376361; font-size: 14px; }
.hero-genetics-tier.is-secondary { margin-top: 9px; }
.product-hero-menu-page.is-animating .hero-data-modal { animation: hero-data-modal-layer 4.8s ease both; }
.product-hero-menu-page.is-animating .hero-data-modal > section { animation: hero-data-modal-card 4.8s cubic-bezier(.22,.8,.28,1) both; }
@keyframes hero-data-edit-press { 0%,18%,100% { color:#315f5b;background:#f7fbfa;transform:none; } 22%,27% { color:#fff;background:#376361;transform:scale(.94); } }
@keyframes hero-data-modal-layer { 0%,27% { visibility:hidden;opacity:0; } 31%,100% { visibility:visible;opacity:1; } }
@keyframes hero-data-modal-card { 0%,27% { transform:translate(-50%,calc(-50% + 10px)) scale(.985); } 34%,100% { transform:translate(-50%,-50%) scale(1); } }
.hero-record-upload-card { position: absolute; z-index: 9; top: 72px; left: 50%; width: min(610px,calc(100% - 54px)); overflow: hidden; border: 1px solid #c7d3cf; border-radius: 13px; opacity: 0; background: #fff; box-shadow: 0 24px 64px rgba(31,52,47,.24); transform: translate(-50%,-7px) scale(.985); pointer-events: none; }
.hero-record-upload-card > header { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 15px; border-bottom: 1px solid #dce3e1; }
.hero-record-upload-card > header b { display: flex; align-items: center; gap: 8px; color: #202523; font-size: 12px; }
.hero-record-upload-card > header i { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 7px; color: #fff; background: #376361; font-size: 12px; font-style: normal; }
.hero-record-upload-card > header span { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 6px; color: #65706c; background: #f3f6f5; font-size: 14px; }
.hero-record-upload-drop { margin: 12px 14px 2px; padding: 7px; border: 1.5px dashed #c1ceca; border-radius: 7px; color: #5f6b67; background: #fafcfb; font-size: 9px; text-align: center; }
.hero-record-upload-file { min-height: 41px; display: grid; grid-template-columns: 31px minmax(0,1fr) auto; gap: 9px; align-items: center; margin: 0 14px; padding: 6px 7px; border-bottom: 1px solid #e7ecea; }
.hero-record-upload-file > i { width: 25px; height: 19px; display: grid; place-items: center; border: 1px solid #cce2dd; border-radius: 4px; color: #376361; background: #edf6f4; font-size: 6px; font-style: normal; font-weight: 800; }
.hero-record-upload-file b,.hero-record-upload-file small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hero-record-upload-file b { color: #303735; font-size: 10px; }
.hero-record-upload-file small { margin-top: 2px; color: #707a76; font-size: 8px; }
.hero-record-upload-file em { color: #7d8582; font-size: 10px; font-style: normal; }
.hero-record-upload-card > footer { min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 14px; color: #626d69; background: #fafcfb; font-size: 8px; }
.hero-record-upload-card > footer strong { padding: 8px 11px; border-radius: 7px; color: #fff; background: #376361; font-size: 9px; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-upload-card { animation: hero-record-upload-card 6.2s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-upload-card > footer strong { animation: hero-record-upload-button 6.2s ease both; }
@keyframes hero-record-upload-card { 0% { opacity: 0; transform: translate(-50%,-7px) scale(.985); } 5%,31% { opacity: 1; transform: translate(-50%,0) scale(1); } 38%,100% { opacity: 0; transform: translate(-50%,6px) scale(.99); } }
@keyframes hero-record-upload-button { 0%,25%,35%,100% { transform: none; background: #376361; } 29%,32% { transform: scale(.96); background: #244b49; } }
.hero-record-live-status { --hero-record-progress: 0; position: relative; isolation: isolate; width: 102px; min-height: 25px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; gap: 5px; overflow: hidden; padding: 4px 7px; border: 1px solid #e2e8f0; border-radius: 999px; color: #475569; background: #f1f5f9; counter-reset: hero-record-progress var(--hero-record-progress); font-size: 8px; font-style: normal; font-weight: 700; }
.hero-record-live-status::before { position: absolute; z-index: -1; inset: 0; background: currentColor; opacity: .1; content: ""; transform: scaleX(0); transform-origin: left; }
.hero-record-live-status > i { width: 9px; height: 9px; box-sizing: border-box; display: inline-grid; place-items: center; flex: none; border: 1.5px solid currentColor; border-top-color: transparent; border-radius: 50%; font-style: normal; }
.hero-record-live-status > i > u { color: inherit; font-size: 8px; font-weight: 800; line-height: 1; text-decoration: none; opacity: 0; }
.hero-record-live-status > span { display: grid; min-width: 43px; color: inherit !important; font-size: inherit !important; }
.hero-record-live-status > span > u { grid-area: 1/1; color: inherit; font-size: inherit; font-weight: inherit; text-decoration: none; opacity: 0; }
.hero-record-live-status > span > .is-preparing { opacity: 1; }
.hero-record-live-status > b { color: inherit !important; font-size: inherit !important; }
.hero-record-live-status > b::after { content: counter(hero-record-progress) "%"; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status { animation: hero-record-stage-surface 3.2s var(--hero-record-delay) step-end both,hero-record-progress 3.2s var(--hero-record-delay) linear both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status::before { animation: hero-record-fill 3.2s var(--hero-record-delay) linear both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status > i { animation: hero-record-spin .5s var(--hero-record-delay) linear 7 both,hero-record-icon 3.2s var(--hero-record-delay) step-end both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status > i > u { animation: hero-record-complete 3.2s var(--hero-record-delay) linear both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status .is-preparing { animation: hero-record-preparing 3.2s var(--hero-record-delay) linear both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status .is-queued { animation: hero-record-queued 3.2s var(--hero-record-delay) linear both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status .is-routing { animation: hero-record-routing 3.2s var(--hero-record-delay) linear both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status .is-parsing { animation: hero-record-parsing 3.2s var(--hero-record-delay) linear both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status .is-grouping { animation: hero-record-grouping 3.2s var(--hero-record-delay) linear both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status .is-storing { animation: hero-record-storing 3.2s var(--hero-record-delay) linear both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status .is-complete { animation: hero-record-complete 3.2s var(--hero-record-delay) linear both; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-live-status > b { animation: hero-record-percent-hide .01s calc(var(--hero-record-delay) + 3.14s) forwards; }
@property --hero-record-progress { syntax: '<integer>'; initial-value: 0; inherits: false; }
@keyframes hero-record-progress { to { --hero-record-progress: 100; } }
@keyframes hero-record-fill { to { transform: scaleX(1); } }
@keyframes hero-record-spin { to { transform: rotate(360deg); } }
@keyframes hero-record-preparing { 0%,8% { opacity: 1; } 9%,100% { opacity: 0; } }
@keyframes hero-record-queued { 0%,8% { opacity: 0; } 9%,16% { opacity: 1; } 17%,100% { opacity: 0; } }
@keyframes hero-record-routing { 0%,16% { opacity: 0; } 17%,31% { opacity: 1; } 32%,100% { opacity: 0; } }
@keyframes hero-record-parsing { 0%,31% { opacity: 0; } 32%,57% { opacity: 1; } 58%,100% { opacity: 0; } }
@keyframes hero-record-grouping { 0%,57% { opacity: 0; } 58%,78% { opacity: 1; } 79%,100% { opacity: 0; } }
@keyframes hero-record-storing { 0%,78% { opacity: 0; } 79%,97% { opacity: 1; } 98%,100% { opacity: 0; } }
@keyframes hero-record-complete { 0%,97% { opacity: 0; } 98%,100% { opacity: 1; } }
@keyframes hero-record-stage-surface { 0%,8% { color:#475569;border-color:#e2e8f0;background:#f1f5f9; } 9%,31% { color:#28706c;border-color:#bfe0db;background:#e9f5f3; } 32%,57% { color:#2563eb;border-color:#dbeafe;background:#eff6ff; } 58%,78% { color:#ea580c;border-color:#fed7aa;background:#ffedd5; } 79%,97% { color:#ca8a04;border-color:#fef08a;background:#fef9c3; } 98%,100% { color:#15803d;border-color:#bbf7d0;background:#f0fdf4; } }
@keyframes hero-record-icon { 0%,97% { border-width:1.5px; } 98%,100% { border-width:0; } }
@keyframes hero-record-percent-hide { to { width:0;margin:0;overflow:hidden;opacity:0; } }
.hero-record-complete { position: absolute; z-index: 8; right: 30px; bottom: 20px; left: 30px; display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 10px; align-items: center; padding: 11px 13px; border: 1px solid #bbf7d0; border-radius: 10px; opacity: 0; color: #4e5a57; background: rgba(248,253,250,.98); box-shadow: 0 12px 28px rgba(35,58,52,.12); transform: translateY(8px); }
.hero-record-complete > i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: #15803d; background: #dcfce7; font-size: 12px; font-style: normal; font-weight: 800; }
.hero-record-complete header { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 7px; }
.hero-record-complete header b { color: #202523; font-size: 10px; }
.hero-record-complete header small { color: #6d7774; font-size: 8px; }
.hero-record-complete section { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 5px; }
.hero-record-complete section span { min-width: 0; padding-right: 5px; border-right: 1px solid #dce8e3; color: #65706c; font-size: 7px; white-space: nowrap; }
.hero-record-complete section span:last-child { border-right: 0; }
.hero-record-complete section b { margin-right: 2px; color: #244b49; font-size: 8px; }
.product-hero-menu-page.is-animating[data-hero-page="medical-records"] .hero-record-complete { animation: hero-record-note-in .35s 5.55s ease forwards; }
@keyframes hero-record-note-in { to { opacity:1;transform:none; } }
.product-hero-native-motion { min-height: 59px; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.35fr); gap: 9px; align-items: stretch; margin-top: 9px; }
.product-hero-native-motion > div { min-width: 0; padding: 9px 11px; border: 1px solid #d5dfdc; border-radius: 8px; background: #fff; }
.product-hero-native-motion b,.product-hero-native-motion span,.product-hero-native-motion strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-hero-native-motion b { color: #263330; font-size: 8px; }
.product-hero-native-motion span { margin-top: 4px; color: #65706c; font-size: 7px; }
.product-hero-native-motion strong { color: #315f5b; font-size: 7px; }
.hero-native-dropdown { position: relative; z-index: 3; }
.hero-native-dropdown span { position: absolute; right: 0; left: 0; margin: 0; padding: 6px 10px; border-right: 1px solid #cddbd7; border-left: 1px solid #cddbd7; opacity: 0; background: #fff; transform: translateY(-5px); }
.hero-native-dropdown span:nth-of-type(1) { top: 34px; border-top: 1px solid #cddbd7; border-radius: 7px 7px 0 0; }
.hero-native-dropdown span:nth-of-type(2) { top: 55px; color: #285c55; background: #e9f4f1; }
.hero-native-dropdown span:nth-of-type(3) { top: 76px; border-bottom: 1px solid #cddbd7; border-radius: 0 0 7px 7px; }
.hero-native-detail { opacity: 0; transform: translateY(7px); }
.hero-native-detail strong { margin-top: 6px; }
.product-hero-native-motion.is-edit { grid-template-columns: .8fr 1.2fr; border: 1px solid #b9d2cc; border-radius: 8px; background: #f7fbfa; }
.product-hero-native-motion.is-edit > div { border: 0; background: transparent; }
.product-hero-native-motion.is-edit > div:last-child { display: grid; grid-template-columns: 1fr 1fr auto; gap: 7px; align-items: center; opacity: 0; }
.product-hero-native-motion.is-edit > div:last-child span { margin: 0; padding: 7px; border: 1px solid #d2dfdc; border-radius: 6px; background: #fff; }
.product-hero-native-motion.is-edit > div:last-child strong { padding: 8px; border-radius: 6px; color: #fff; background: #376361; }
.product-hero-native-motion.is-source,.product-hero-native-motion.is-genetics { grid-template-columns: 1fr auto; align-items: center; padding: 9px 11px; border: 1px solid #d5dfdc; border-radius: 8px; background: #f7faf9; }
.product-hero-native-motion.is-source > div { padding: 0; border: 0; background: transparent; }
.product-hero-native-motion.is-source > strong { padding: 8px 10px; border-radius: 6px; background: #e5f1ee; }
.product-hero-native-motion.is-schedule { grid-template-columns: 1fr 1fr; padding: 9px 11px; border: 1px solid #d5dfdc; border-radius: 8px; background: #f7faf9; }
.product-hero-native-motion.is-schedule > div { padding: 0; border: 0; background: transparent; }
.product-hero-native-motion.is-schedule > div:last-child { display: flex; align-items: center; gap: 5px; }
.product-hero-native-motion.is-schedule > div:last-child > * { margin: 0; padding: 7px 9px; border: 1px solid #d2dfdc; border-radius: 999px; background: #fff; }
.product-hero-native-motion.is-schedule > div:last-child strong { color: #fff; border-color: #376361; background: #376361; }
.product-hero-native-motion.is-genetics { min-height: 42px; grid-template-columns: auto auto 1fr; }
.product-hero-native-motion.is-genetics span,.product-hero-native-motion.is-genetics strong { padding: 7px 9px; border-radius: 6px; }
.product-hero-native-motion.is-genetics span { margin: 0; background: #eef3f2; }
.product-hero-native-motion.is-genetics strong { color: #fff; background: #376361; }
.product-hero-native-motion.is-genetics b { text-align: right; }
.product-hero-menu-page.is-animating .product-hero-data-table .is-demo-row { animation: hero-row-open 3.2s ease both; }
.product-hero-menu-page.is-animating .hero-native-dropdown span { animation: hero-dropdown-open 3.2s ease both; }
.product-hero-menu-page.is-animating .hero-native-dropdown span:nth-of-type(2) { animation-delay: .08s; }
.product-hero-menu-page.is-animating .hero-native-dropdown span:nth-of-type(3) { animation-delay: .16s; }
.product-hero-menu-page.is-animating .hero-native-detail { animation: hero-detail-in 3.2s ease both; }
.product-hero-menu-page.is-animating .product-hero-native-motion.is-edit > div:last-child { animation: hero-edit-open 3.2s ease both; }
.product-hero-menu-page.is-animating .product-hero-native-motion.is-source > strong { animation: hero-source-open 3.2s ease both; }
.product-hero-menu-page.is-animating .product-hero-native-motion.is-schedule > div:last-child { animation: hero-detail-in 3.2s ease both; }
.product-hero-menu-page.is-animating .product-hero-native-motion.is-genetics strong { animation: hero-tab-switch 3.2s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="dashboard"] .product-hero-dashboard-stats article,
.product-hero-menu-page.is-animating[data-hero-page="dashboard"] .product-hero-dashboard-body > section { animation: hero-card-in .65s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="dashboard"] .product-hero-dashboard-stats article:nth-child(2) { animation-delay: .08s; }
.product-hero-menu-page.is-animating[data-hero-page="dashboard"] .product-hero-dashboard-stats article:nth-child(3) { animation-delay: .16s; }
.product-hero-menu-page.is-animating[data-hero-page="dashboard"] .product-hero-dashboard-stats article:nth-child(4) { animation-delay: .24s; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .product-hero-report-market article:first-child { animation: hero-report-select 3.2s ease both; }
.product-hero-menu-page.is-animating[data-hero-page="reports"] .product-hero-menu-tabs b { animation: hero-tab-underline 3.2s ease both; }
@keyframes hero-card-in { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: none; } }
@keyframes hero-row-open { 0%,28% { background: #fff; } 42%,75% { background: #edf6f3; } 100% { background: #fff; } }
@keyframes hero-dropdown-open { 0%,17%,82%,100% { opacity: 0; transform: translateY(-5px); } 28%,68% { opacity: 1; transform: none; } }
@keyframes hero-detail-in { 0%,42% { opacity: 0; transform: translateY(7px); } 55%,100% { opacity: 1; transform: none; } }
@keyframes hero-edit-open { 0%,24% { opacity: 0; transform: translateY(5px); } 40%,100% { opacity: 1; transform: none; } }
@keyframes hero-source-open { 0%,30% { opacity: .35; transform: translateX(-7px); } 48%,100% { opacity: 1; transform: none; } }
@keyframes hero-tab-switch { 0%,28% { color: #315f5b; background: #eef3f2; } 45%,100% { color: #fff; background: #376361; } }
@keyframes hero-report-select { 0%,25% { border-color: #dce5e2; background: #fff; } 42%,100% { border-color: #7eaaa2; background: #eaf4f1; } }
@keyframes hero-tab-underline { 0%,32% { border-color: transparent; } 48%,100% { border-color: #376361; } }

/* The hero is a product demonstration, not a thumbnail. Keep its data readable at laptop size. */
@media (min-width: 721px) {
  .product-hero-person b { font-size: 14px; }
  .product-hero-person small { font-size: 11px; }
  .product-hero-actions > b,.product-hero-actions > span { font-size: 12px; }
  .product-hero-sidebar span { font-size: 8px; }
  .product-hero-sidebar b { font-size: 11px; }
  .product-hero-records-head small { font-size: 10px; }
  .product-hero-records-head strong { font-size: 26px; }
  .product-hero-records-head > b { font-size: 12px; }
  .product-hero-upload > .product-hero-upload-head { font-size: 15px; }
  .product-hero-upload-drop { font-size: 12px; }
  .product-hero-upload-file b { font-size: 13px; }
  .product-hero-upload-file small,.product-hero-upload .product-hero-upload-foot { font-size: 11px; }
  .product-hero-upload .product-hero-upload-foot b { font-size: 12px; }
  .product-hero-processing-title,.product-hero-upload.is-ready .product-hero-processing-title::after { font-size: 15px; }
  .product-hero-processing-lead,.product-hero-processing-list span { font-size: 11px; }
  .product-hero-processing-ready { font-size: 12px; }
  .product-hero-records-table { font-size: 10px; }
  .product-hero-records-table.row { font-size: 12px; }
  .product-hero-records-table.row small { font-size: 10px; }
  .product-hero-menu-head small { font-size: 11px; }
  .product-hero-menu-head strong { font-size: 26px; }
  .product-hero-menu-head > div:last-child span,
  .product-hero-menu-head > div:last-child b { font-size: 11px; }
  .product-hero-menu-toolbar span { font-size: 12px; }
  .product-hero-data-table > header b { font-size: 10px; }
  .product-hero-data-table > div b { font-size: 13px; }
  .product-hero-data-table > div span { font-size: 12px; }
  .product-hero-dashboard-stats span { font-size: 11px; }
  .product-hero-dashboard-body section > header b { font-size: 12px; }
  .product-hero-dashboard-body section > header span { font-size: 11px; }
  .product-hero-quick-actions b { font-size: 13px; }
  .product-hero-quick-actions span { font-size: 11px; }
  .product-hero-dashboard-list b { font-size: 12px; }
  .product-hero-dashboard-list span { font-size: 11px; }
  .product-hero-dashboard-list strong { font-size: 10px; }
  .product-hero-report-market > header b { font-size: 13px; }
  .product-hero-report-market > header span { font-size: 11px; }
  .product-hero-report-market article b { font-size: 12px; }
  .product-hero-report-market article small { font-size: 10px; }
  .product-hero-menu-tabs b,.product-hero-menu-tabs span { font-size: 12px; }
  .product-hero-genetic-summary { font-size: 11px; }
  .product-hero-native-motion b { font-size: 12px; }
  .product-hero-native-motion span,.product-hero-native-motion strong { font-size: 11px; }
}

/* Medication history mirrors the application's dated timeline rather than reducing
   treatment history to a static inventory table. */
.hero-medication-timeline { padding: 14px 16px 12px; color: #25322f; }
.hero-medication-tools { display: flex; align-items: center; gap: 7px; margin-bottom: 12px; }
.hero-medication-tools > span { min-width: 180px; flex: 1; padding: 8px 10px; border: 1px solid #d7e0dd; border-radius: 7px; color: #7a8581; background: #fff; font-size: 8px; }
.hero-medication-tools > div { display: flex; overflow: hidden; border: 1px solid #d7e0dd; border-radius: 7px; background: #fff; }
.hero-medication-tools > div :is(b,span),.hero-medication-tools > button { padding: 7px 9px; border: 0; color: #67736f; background: transparent; font: 700 7px var(--sans); }
.hero-medication-tools .is-selected { color: #244b49; background: #e2efec; }
.hero-medication-tools > button { border: 1px solid #d7e0dd; border-radius: 7px; background: #fff; }
.hero-medication-axis,.hero-medication-rows article { display: grid; grid-template-columns: minmax(118px,.9fr) minmax(260px,2.35fr) minmax(150px,1.15fr); }
.hero-medication-axis { min-height: 42px; align-items: end; border: 1px solid #dfe6e4; border-bottom: 0; border-radius: 9px 9px 0 0; color: #75817d; background: #f8faf9; }
.hero-medication-axis > div:nth-child(2) { position: relative; height: 100%; border-inline: 1px solid #e1e7e5; }
.hero-medication-axis > div:nth-child(2) i { position: absolute; bottom: 7px; font-size: 6px; font-style: normal; transform: translateX(-50%); }
.hero-medication-axis > div:nth-child(2) em { position: absolute; top: 5px; padding: 2px 5px; border-radius: 999px; color: #244b49; background: #dfeeea; font-size: 5px; font-style: normal; font-weight: 800; transform: translateX(-100%); }
.hero-medication-axis > div:last-child { display: grid; grid-template-columns: repeat(3,1fr); padding: 0 8px 8px; }
.hero-medication-axis > div:last-child i { font-size: 5px; font-style: normal; font-weight: 800; letter-spacing: .04em; }
.hero-medication-rows { overflow: hidden; border: 1px solid #dfe6e4; border-radius: 0 0 9px 9px; background: #fff; }
.hero-medication-rows article { min-height: 67px; border-top: 1px solid #e8eceb; }
.hero-medication-rows article:first-child { border-top: 0; }
.hero-medication-rows article > header { display: flex; flex-direction: column; justify-content: center; padding: 9px 12px; }
.hero-medication-rows article > header b { font-size: 8px; }
.hero-medication-rows article > header small { margin-top: 2px; color: #6c7874; font-size: 6px; }
.hero-medication-rows article > header u { margin-top: 5px; color: #2f7773; font-size: 5px; text-decoration: none; }
.hero-medication-track { position: relative; overflow: hidden; border-inline: 1px solid #edf0ef; background: #fbfcfc; }
.hero-medication-track > i { position: absolute; inset-block: 0; width: 1px; background: #e2e8e6; }
.hero-medication-track .year-2023 { left: 4%; }.hero-medication-track .year-2024 { left: 31%; }.hero-medication-track .year-2025 { left: 58%; }.hero-medication-track .today { left: 91%; background: #8ebeb7; }
.hero-medication-track .bar { position: absolute; top: 22px; left: var(--start); width: 0; height: 22px; display: flex; align-items: center; overflow: hidden; border-radius: 5px; color: #fff; background: #376361; box-shadow: 0 4px 10px rgba(36,75,73,.16); animation: hero-medication-bar-in .8s .2s cubic-bezier(.22,.78,.25,1) forwards; }
.hero-medication-track .bar.is-stopped { background: #98a6a2; }
.hero-medication-track .bar em { padding-left: 8px; font-size: 6px; font-style: normal; font-weight: 750; white-space: nowrap; }
.hero-medication-rows article > footer { display: grid; grid-template-columns: repeat(3,1fr); align-items: center; padding: 8px; }
.hero-medication-rows article > footer :is(time,b) { color: #5d6965; font-size: 5.5px; }
.hero-medication-rows article > footer b { width: fit-content; padding: 3px 5px; border-radius: 999px; color: #22654e; background: #e4f4eb; }
.hero-medication-rows article > footer b.is-stopped { color: #64706c; background: #edf0ef; }
.hero-medication-legend { display: flex; align-items: center; gap: 12px; padding: 9px 2px 0; color: #65716d; font-size: 5.5px; }
.hero-medication-legend span { display: flex; align-items: center; gap: 4px; }.hero-medication-legend span i { width: 7px; height: 7px; border-radius: 2px; background: #376361; }.hero-medication-legend span:nth-child(2) i { background: #98a6a2; }.hero-medication-legend small { margin-left: auto; font-size: 5.5px; }
@keyframes hero-medication-bar-in { to { width: var(--length); } }
@media (max-width:720px) { .hero-medication-axis,.hero-medication-rows article { grid-template-columns: 104px minmax(185px,1fr); }.hero-medication-axis > div:last-child,.hero-medication-rows article > footer { display:none; }.hero-medication-tools > div { display:none; }.hero-medication-tools > span { min-width:0; }.hero-medication-legend small { display:none; } }

/* Patient management walkthrough — a reduced, platform-accurate rendering of
   the React application. Kept code-native so the demo remains crisp at every
   viewport and can show real click states instead of playing a screen capture. */
.clinician-patient-management .patient-showcase-stage { min-height: 720px; }
.clinician-patient-management .patient-platform-demo { width: min(1080px,88%); min-height: 584px; border-radius: 15px; color: #27312f; background: #fff; font-family: var(--sans); }
.patient-platform-topbar { height: 64px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 18px; padding: 0 24px; border-bottom: 1px solid #d8e2df; background: #fff; }
.patient-platform-brand { color: #376361; font-size: 23px; font-weight: 400; letter-spacing: -.055em; }
.patient-platform-brand strong { font-weight: 800; }
.patient-platform-selector { min-width: 168px; display: grid; grid-template-columns: 32px minmax(0,1fr) 14px; gap: 9px; align-items: center; padding: 6px 10px; border: 1px solid #d4dfdc; border-radius: 9px; background: #fff; }
.patient-platform-selector > i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #293330; font-size: 8px; font-style: normal; font-weight: 800; }
.patient-platform-selector span,.patient-platform-selector small,.patient-platform-selector b { min-width: 0; display: block; }
.patient-platform-selector small { color: #77827f; font-size: 7px; font-weight: 700; letter-spacing: .08em; line-height: 1; text-transform: uppercase; }
.patient-platform-selector b { margin-top: 3px; overflow: hidden; font-size: 10px; line-height: 1; text-overflow: ellipsis; white-space: nowrap; }
.patient-platform-selector svg { width: 13px; fill: none; stroke: #60706b; stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.patient-platform-actions { justify-self: end; display: flex; align-items: center; gap: 13px; color: #596762; font-size: 8px; }
.patient-platform-actions button { min-height: 34px; padding: 0 12px; border: 1px solid #a9c8c0; border-radius: 7px; color: #315f5b; background: #fff; font: 800 9px/1 var(--sans); }
.patient-platform-actions span { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.patient-platform-actions span i { width: 7px; height: 7px; border-radius: 50%; background: #50b88a; box-shadow: 0 0 0 3px #e6f5ee; }
.patient-platform-actions em { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid #d6e0dd; border-radius: 7px; font-size: 13px; font-style: normal; }
.patient-platform-shell { height: 462px; display: grid; grid-template-columns: 172px minmax(0,1fr); background: #fff; }
.patient-platform-sidebar { padding: 20px 12px; border-right: 1px solid #d8e2df; background: #f3f7f6; }
.patient-platform-sidebar span { display: block; margin: 11px 9px 6px; color: #65736e; font-size: 6.5px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.patient-platform-sidebar span:first-child { margin-top: 0; }
.patient-platform-sidebar b { min-height: 29px; display: flex; align-items: center; gap: 8px; padding: 0 9px; border-radius: 6px; color: #52605c; font-size: 8.5px; font-weight: 700; }
.patient-platform-sidebar b.is-active { color: #fff; background: #376b67; }
.patient-platform-sidebar svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.patient-platform-content { position: relative; height: 462px; overflow: hidden; background: #fff; }
.patient-platform-content .patient-showcase-view { padding: 30px 32px; }
.patient-platform-list > header { min-height: 43px; align-items: flex-start; margin-bottom: 17px; }
.patient-platform-list > header > div:first-child { display: flex; align-items: baseline; gap: 9px; }
.patient-platform-list > header h3 { color: #202725; font-size: 25px; letter-spacing: -.035em; }
.patient-platform-list > header span { margin: 0; color: #71807b; font-size: 8px; letter-spacing: 0; text-transform: none; }
.patient-platform-list > header > button,.patient-platform-action-menu > button { min-height: 34px; padding: 0 12px; border: 1px solid #a9c8c0; border-radius: 7px; color: #315f5b; background: #fff; font: 800 9px/1 var(--sans); }
.patient-platform-action-menu > button { display: inline-flex; align-items: center; gap: 5px; }
.patient-platform-action-menu > button svg { width: 10px; height: 10px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.patient-platform-action-menu { position: relative; z-index: 4; }
.patient-platform-action-menu > aside { position: absolute; top: 39px; right: 0; width: 154px; overflow: hidden; padding: 5px; border: 1px solid #d5dfdc; border-radius: 9px; background: #fff; box-shadow: 0 12px 32px -16px rgba(29,49,47,.42); }
.patient-platform-action-menu aside > * { width: 100%; min-height: 34px; display: flex; align-items: center; gap: 8px; padding: 0 9px; border: 0; border-radius: 6px; color: #40504b; background: transparent; font: 500 8.5px/1 var(--sans); text-align: left; }
.patient-platform-action-menu aside > button { color: #2f625d; cursor: pointer; }
.patient-platform-action-menu aside > button svg { width: 15px; height: 15px; flex: 0 0 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.patient-platform-action-menu aside > button:hover { background: #eef6f4; }
.patient-platform-action-menu aside b { font-size: inherit; }
.patient-platform-toolbar { display: grid; grid-template-columns: minmax(190px,1fr) auto auto; gap: 9px; margin-bottom: 12px; }
.patient-platform-toolbar > * { min-height: 35px; display: flex; align-items: center; padding: 0 11px; border: 1px solid #d5dfdc; border-radius: 7px; color: #6b7874; background: #fff; font-size: 8px; font-weight: 500; }
.patient-platform-toolbar label b { color: #384844; font-size: inherit; }
.patient-platform-table { overflow: hidden; border: 1px solid #d5dfdc; border-radius: 8px; background: #fff; }
.patient-platform-table > header,.patient-platform-table > article { display: grid; grid-template-columns: minmax(180px,1.6fr) 1fr .5fr .65fr 30px; gap: 12px; align-items: center; }
.patient-platform-table > header { min-height: 34px; padding: 0 12px; color: #687671; background: #eff4f3; font-size: 7px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.patient-platform-table > article { min-height: 61px; padding: 0 12px; border-top: 1px solid #e0e7e5; color: #5c6a66; font-size: 8.5px; transition: background-color .2s ease,box-shadow .2s ease; }
.patient-platform-table > article > span { min-width: 0; display: grid; grid-template-columns: 31px minmax(0,1fr); gap: 9px; align-items: center; }
.patient-platform-table article i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #376361; font-size: 7.5px; font-style: normal; font-weight: 800; }
.patient-platform-table article b { min-width: 0; display: flex; align-items: center; gap: 6px; overflow: hidden; color: #27312f; font-size: 9.5px; text-overflow: ellipsis; white-space: nowrap; }
.patient-platform-table article b u { width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: #4fbd89; box-shadow: 0 0 0 2px #e5f5ed; text-decoration: none; }
.patient-platform-table article em { font-style: normal; }
.patient-platform-table article > button { border: 0; color: #53615d; background: transparent; font-size: 11px; letter-spacing: 1px; }
.patient-platform-table article.is-new { cursor: pointer; background: #eff8f5; box-shadow: inset 3px 0 #48a9a6; }
.patient-platform-modal-view { display: grid; place-items: center; padding: 0 !important; }
.patient-platform-page-ghost { position: absolute; inset: 0; opacity: .42; background: linear-gradient(#edf3f1 0 35px,transparent 35px),repeating-linear-gradient(180deg,transparent 0 62px,#e1e8e6 62px 63px); }
.patient-platform-modal-view::before { position: absolute; inset: 0; z-index: 1; background: rgba(241,245,244,.68); content: ""; backdrop-filter: blur(1px); }
.patient-platform-modal { position: relative; z-index: 2; width: min(580px,82%); padding: 23px 25px 20px; border: 1px solid #cad6d3; border-radius: 11px; background: #fff; box-shadow: 0 25px 60px -28px rgba(30,49,46,.52); }
.patient-platform-modal > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 19px; }
.patient-platform-modal header h3 { margin: 0; color: #202725; font-size: 18px; letter-spacing: -.025em; }
.patient-platform-modal header p { max-width: 510px; margin: 6px 0 0; color: #697671; font-size: 8.5px; line-height: 1.5; }
.patient-platform-modal header i { color: #74817d; font-size: 13px; font-style: normal; }
.patient-platform-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px 15px; }
.patient-platform-modal label { display: grid; gap: 5px; color: #3d4a46; font-size: 8px; font-weight: 700; }
.patient-platform-modal label em { min-height: 36px; display: flex; align-items: center; justify-content: space-between; padding: 0 10px; border: 1px solid #d1dcda; border-radius: 6px; color: #34423e; background: #fff; font-size: 9px; font-style: normal; font-weight: 500; }
.patient-platform-modal label em span { color: #72807c; }
.patient-platform-modal > footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 19px; padding-top: 15px; border-top: 1px solid #e1e7e5; }
.patient-platform-modal footer button { min-height: 34px; padding: 0 12px; border: 1px solid #d1dcda; border-radius: 7px; color: #45534f; background: #fff; font: 700 8.5px/1 var(--sans); }
.patient-platform-modal footer button:last-child { border-color: #376b67; color: #fff; background: #376b67; }
.patient-platform-invite-modal { width: min(480px,78%); }
.patient-platform-invite-modal > label { margin-top: 8px; }
.patient-platform-toast { position: absolute; z-index: 5; top: 16px; right: 25px; display: grid; grid-template-columns: 25px minmax(0,1fr); gap: 9px; align-items: center; padding: 10px 13px; border: 1px solid #b8dbcd; border-radius: 8px; background: #f2faf6; box-shadow: 0 13px 32px -20px rgba(35,79,62,.5); }
.patient-platform-toast > i { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #46aa7d; font-size: 10px; font-style: normal; }
.patient-platform-toast b,.patient-platform-toast small { display: block; }
.patient-platform-toast b { color: #275343; font-size: 8.5px; }
.patient-platform-toast small { margin-top: 3px; color: #65756f; font-size: 7px; }
.patient-platform-ready > header { padding-right: 205px; }
.clinician-patient-management .patient-showcase-progress { height: 58px; padding-right: 26px; padding-left: 198px; }
.patient-showcase-cursor { position: absolute; z-index: 9; width: 26px; height: 26px; pointer-events: none; filter: drop-shadow(0 2px 2px rgba(19,42,37,.28)); transition: left 1s cubic-bezier(.22,1,.36,1),top 1s cubic-bezier(.22,1,.36,1),transform .16s ease; }
.patient-showcase-cursor svg { width: 100%; height: 100%; fill: #fff; stroke: #244b49; stroke-linejoin: round; stroke-width: 1.5; animation: patient-showcase-cursor-breathe 2.1s ease-in-out infinite; }
@keyframes patient-showcase-cursor-breathe { 0%,100% { translate: 0 0; } 50% { translate: 2px -3px; } }
[data-patient-showcase][data-phase="0"] .patient-showcase-cursor { left: calc(50% + 397px); top: 259px; }
[data-patient-showcase][data-phase="1"] .patient-showcase-cursor { left: calc(50% + 290px); top: 522px; }
[data-patient-showcase][data-phase="2"] .patient-showcase-cursor { left: calc(50% + 235px); top: 462px; }
[data-patient-showcase][data-phase="3"] .patient-showcase-cursor { left: calc(50% - 10px); top: 313px; }
.patient-showcase-cursor.is-clicking { transform: scale(.78) translateY(2px); }

@media (max-width: 800px) {
  .clinician-patient-management .patient-showcase-stage { min-height: 570px; border-radius: 17px; }
  .clinician-patient-management .patient-platform-demo { width: calc(100% - 28px); min-height: 480px; }
  .patient-platform-topbar { grid-template-columns: 1fr auto; height: 56px; padding: 0 14px; }
  .patient-platform-selector { min-width: 145px; }
  .patient-platform-actions { display: none; }
  .patient-platform-shell { height: 368px; grid-template-columns: 1fr; }
  .patient-platform-sidebar { display: none; }
  .patient-platform-content { height: 368px; }
  .patient-platform-content .patient-showcase-view { padding: 22px 18px; }
  .patient-platform-list > header { min-height: 40px; margin-bottom: 12px; }
  .patient-platform-list > header h3 { font-size: 21px; }
  .patient-platform-toolbar { grid-template-columns: 1fr auto; }
  .patient-platform-toolbar label:last-child { display: none; }
  .patient-platform-table > header,.patient-platform-table > article { grid-template-columns: minmax(140px,1.5fr) .9fr 30px; }
  .patient-platform-table > :is(header,article) > :is(span,em):nth-child(3),.patient-platform-table > :is(header,article) > :is(span,em):nth-child(4) { display: none; }
  .patient-platform-table > article { min-height: 58px; }
  .patient-platform-action-menu > aside { width: 142px; }
  .patient-platform-modal { width: calc(100% - 28px); padding: 20px; }
  .patient-platform-form-grid { gap: 10px; }
  .patient-platform-ready > header { padding-right: 0; }
  .patient-platform-toast { top: 7px; right: 12px; max-width: 172px; }
  .patient-platform-toast small { display: none; }
  .clinician-patient-management .patient-showcase-progress { height: 56px; padding: 0 16px 13px; }
  [data-patient-showcase][data-phase="0"] .patient-showcase-cursor { left: 78%; top: 226px; }
  [data-patient-showcase][data-phase="1"] .patient-showcase-cursor { left: 75%; top: 443px; }
  [data-patient-showcase][data-phase="2"] .patient-showcase-cursor { left: 70%; top: 405px; }
  [data-patient-showcase][data-phase="3"] .patient-showcase-cursor { left: 43%; top: 271px; }
}
.product-hero-dashboard-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 9px; margin-top: 18px; }
.product-hero-dashboard-stats article { min-height: 70px; display: flex; align-items: center; gap: 10px; padding: 10px; border: 1px solid #d5dfdc; border-radius: 9px; }
.product-hero-dashboard-stats i { width: 31px; height: 31px; flex: 0 0 31px; border-radius: 8px; background: #e5f1ee; }
.product-hero-dashboard-stats b,.product-hero-dashboard-stats span { display: block; }
.product-hero-dashboard-stats b { font-size: 17px; }
.product-hero-dashboard-stats span { margin-top: 2px; color: #65706c; font-size: 8px; }
.product-hero-dashboard-body { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 10px; }
.product-hero-dashboard-body > section { overflow: hidden; border: 1px solid #d5dfdc; border-radius: 9px; background: #fff; }
.product-hero-dashboard-body > section:first-child { grid-row: span 2; }
.product-hero-dashboard-body section > header { min-height: 38px; display: flex; align-items: center; justify-content: space-between; padding: 0 11px; border-bottom: 1px solid #e3eae8; }
.product-hero-dashboard-body section > header b { font-size: 9px; }
.product-hero-dashboard-body section > header span { color: #376361; font-size: 7px; }
.product-hero-quick-actions { display: grid; gap: 8px; padding: 10px; }
.product-hero-quick-actions article { min-height: 64px; display: grid; grid-template-columns: 31px minmax(0,1fr) auto; gap: 9px; align-items: center; padding: 8px; border: 1px solid #e0e7e5; border-radius: 8px; }
.product-hero-quick-actions i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; color: #376361; background: #e5f1ee; font-size: 12px; font-style: normal; }
.product-hero-quick-actions b,.product-hero-quick-actions span { display: block; }
.product-hero-quick-actions b { font-size: 9px; }
.product-hero-quick-actions span { margin-top: 3px; color: #65706c; font-size: 8px; }
.product-hero-quick-actions strong { color: #376361; font-size: 11px; }
.product-hero-dashboard-list article { min-height: 41px; display: grid; grid-template-columns: 1fr 1fr auto; gap: 8px; align-items: center; padding: 6px 10px; border-top: 1px solid #edf1f0; }
.product-hero-dashboard-list article:first-child { border-top: 0; }
.product-hero-dashboard-list b { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.product-hero-dashboard-list span { overflow: hidden; color: #65706c; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.product-hero-dashboard-list strong { padding: 4px 6px; border-radius: 999px; color: #2f6658; background: #e7f3ef; font-size: 7px; }
.product-hero-report-market { margin-top: 15px; padding: 10px; border: 1px solid #d5dfdc; border-radius: 9px; background: #f8faf9; }
.product-hero-report-market > header { display: flex; align-items: center; justify-content: space-between; }
.product-hero-report-market > header b { font-size: 9px; }
.product-hero-report-market > header span { color: #65706c; font-size: 7px; }
.product-hero-report-market > div { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 7px; margin-top: 9px; }
.product-hero-report-market article { min-height: 64px; padding: 8px; border: 1px solid #dce5e2; border-radius: 7px; background: #fff; }
.product-hero-report-market article b,.product-hero-report-market article small { display: block; }
.product-hero-report-market article b { font-size: 7px; }
.product-hero-report-market article small { margin-top: 5px; color: #65706c; font-size: 6px; line-height: 1.35; }
.product-hero-menu-tabs { min-height: 34px; display: flex; align-items: end; gap: 18px; margin-top: 10px; border-bottom: 1px solid #d7e1de; }
.product-hero-menu-tabs b,.product-hero-menu-tabs span { height: 34px; display: flex; align-items: center; gap: 4px; color: #65706c; font-size: 8px; }
.product-hero-menu-tabs b { border-bottom: 2px solid #376361; color: #244b49; }
.product-hero-menu-tabs em { font-style: normal; }
.product-hero-menu-tabs + .product-hero-menu-toolbar { min-height: 38px; margin-top: 4px; }
.product-hero-genetic-summary { display: grid; grid-template-columns: repeat(3,auto) minmax(0,1fr); gap: 10px; align-items: center; min-height: 42px; padding: 7px 10px; color: #596560; background: #f2f7f5; font-size: 7px; }
.product-hero-genetic-summary span { white-space: nowrap; }
.product-hero-genetic-summary b { margin-right: 2px; color: #315957; white-space: nowrap; }
.product-hero-genetic-summary > strong { color: #315957; text-align: right; white-space: nowrap; }
.product-hero-menu-metrics { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-top: 20px; }
.product-hero-menu-metrics article { min-height: 76px; padding: 12px 13px; border: 1px solid #d3dfdc; border-radius: 9px; background: #fff; }
.product-hero-menu-metrics span,.product-hero-menu-metrics b,.product-hero-menu-metrics small { display: block; }
.product-hero-menu-metrics span { color: #65706c; font-size: 7px; }
.product-hero-menu-metrics b { margin-top: 8px; color: #202523; font-size: 18px; }
.product-hero-menu-metrics small { margin-top: 3px; color: #42716a; font-size: 7px; }
.product-hero-menu-panel { margin-top: 12px; overflow: hidden; border: 1px solid #d3dfdc; border-radius: 10px; background: #fff; }
.product-hero-menu-panel > header { min-height: 45px; display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 0 14px; border-bottom: 1px solid #e0e7e5; }
.product-hero-menu-panel > header b { font-size: 11px; }
.product-hero-menu-panel > header span { color: #52615e; font-size: 8px; }
.product-hero-menu-row { min-height: 48px; display: grid; grid-template-columns: 1.25fr 1fr auto; gap: 14px; align-items: center; padding: 8px 14px; border-top: 1px solid #e7ecea; }
.product-hero-menu-panel > header + .product-hero-menu-row { border-top: 0; }
.product-hero-menu-row b,.product-hero-menu-row span,.product-hero-menu-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.product-hero-menu-row b { color: #303735; font-size: 9px; }
.product-hero-menu-row span { color: #596560; font-size: 8px; }
.product-hero-menu-row strong { padding: 5px 7px; border-radius: 999px; color: #2c6657; background: #e6f2ee; font-size: 7px; }
.product-hero-dashboard { min-width: 0; padding: 30px 34px; }
.product-hero-title { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.product-hero-title small,.product-hero-title strong { display: block; }
.product-hero-title small { color: #596560; font-size: 8px; font-weight: 800; letter-spacing: .11em; }
.product-hero-title strong { margin-top: 5px; font-size: 25px; letter-spacing: -.035em; }
.product-hero-title > span { padding: 7px 10px; border-radius: 999px; color: #26694f; background: #def2e7; font-size: 8px; font-weight: 800; }
.product-hero-stats { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; margin-top: 21px; }
.product-hero-stats article { min-height: 86px; padding: 13px; border: 1px solid #d3dfdc; border-radius: 10px; background: #fff; }
.product-hero-stats small,.product-hero-stats strong,.product-hero-stats span { display: block; }
.product-hero-stats small { color: #596560; font-size: 7px; }
.product-hero-stats strong { margin-top: 9px; font-size: 20px; }
.product-hero-stats span { margin-top: 3px; color: #51706a; font-size: 7px; }
.product-hero-detail { display: grid; grid-template-columns: 1.35fr .65fr; gap: 12px; margin-top: 12px; }
.product-hero-chart,.product-hero-review { min-width: 0; min-height: 236px; padding: 17px; border: 1px solid #d3dfdc; border-radius: 11px; background: #fff; }
.product-hero-chart > div { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 5px 14px; }
.product-hero-chart small { grid-column: 1/-1; color: #596560; font-size: 7px; font-weight: 800; letter-spacing: .1em; }
.product-hero-chart b { font-size: 18px; }
.product-hero-chart span { color: #26735b; font-size: 8px; font-weight: 700; }
.product-hero-chart svg { width: 100%; height: 125px; overflow: visible; }
.product-hero-chart path { fill: none; stroke: #376361; stroke-width: 3; }
.product-hero-chart circle { fill: #48a9a6; stroke: #fff; stroke-width: 3; }
.product-hero-chart footer { display: flex; justify-content: space-between; color: #596560; font-size: 7px; }
.product-hero-review > small { color: #596560; font-size: 7px; font-weight: 800; letter-spacing: .1em; }
.product-hero-review > strong { display: block; margin: 7px 0 10px; font-size: 12px; }
.product-hero-review > div { display: grid; grid-template-columns: 25px minmax(0,1fr); gap: 8px; align-items: center; padding: 9px 0; border-top: 1px solid #e0e7e5; }
.product-hero-review i { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 7px; color: #80571d; background: #fff1d5; font-size: 9px; font-style: normal; font-weight: 800; }
.product-hero-review b,.product-hero-review div small { display: block; }
.product-hero-review b { font-size: 8px; }
.product-hero-review div small { margin-top: 3px; color: #596560; font-size: 7px; }
.product-hero-review button { width: 100%; min-height: 30px; margin-top: 9px; border: 0; border-radius: 7px; color: #fff; background: #376361; font: 800 8px var(--sans); }

.product-tour-section { padding: clamp(64px,7vw,96px) 0 clamp(82px,9vw,128px); overflow: clip; background: #e7f0ed; }
.product-tour-list { display: grid; gap: clamp(80px,10vw,140px); }
.product-tour-feature { scroll-margin-top: 150px; display: grid; grid-template-columns: minmax(260px,.54fr) minmax(0,1.46fr); gap: clamp(34px,5vw,72px); align-items: center; }
.product-tour-feature:nth-child(even) { grid-template-columns: minmax(0,1.46fr) minmax(260px,.54fr); }
.product-tour-feature:nth-child(even) .product-tour-copy { grid-column: 2; grid-row: 1; }
.product-tour-feature:nth-child(even) .product-tour-mount { grid-column: 1; grid-row: 1; }
.product-tour-copy { align-self: center; }
.product-tour-number { display: block; margin-bottom: 17px; color: #2f7773; font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.product-tour-copy h3 { margin: 0; font-family: var(--serif); font-size: clamp(36px,4vw,54px); font-weight: 400; line-height: .98; letter-spacing: -.035em; }
.product-tour-copy > p { margin: 22px 0 0; color: #56625e; font-size: 15px; line-height: 1.68; }
.product-tour-copy ul { display: grid; gap: 10px; margin: 24px 0 0; padding: 0; list-style: none; }
.product-tour-copy li { position: relative; padding-left: 19px; color: #344642; font-size: 12px; line-height: 1.5; }
.product-tour-copy li::before { position: absolute; top: .58em; left: 0; width: 7px; height: 7px; border-radius: 50%; background: #48a9a6; content: ""; }
.product-tour-concept { width: fit-content; margin-top: 18px; padding: 7px 9px; border: 1px solid #aec8c2; border-radius: 7px; color: #315957; background: rgba(255,255,255,.56); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.product-tour-mount { min-width: 0; }
.product-tour-copy.pth-scroll-reveal,
.product-tour-mount.pth-scroll-reveal {
  opacity: 0;
  translate: 0 12px;
  transition: opacity .68s cubic-bezier(.22,.7,.2,1), translate .68s cubic-bezier(.22,.7,.2,1);
  transition-delay: var(--pth-reveal-delay,0ms);
  will-change: opacity, translate;
}
.product-tour-copy.pth-scroll-reveal.is-in-view,
.product-tour-mount.pth-scroll-reveal.is-in-view { opacity: 1; translate: 0 0; }

.pth-player { --pth-accent:#376361; position: relative; min-height: 530px; overflow: hidden; border: 1px solid #9fbdb7; border-radius: 22px; color: #26312e; background: #fff; box-shadow: 0 34px 80px -42px rgba(28,54,49,.55); font-family: var(--sans); }
.pth-player:focus-visible { outline: 3px solid #48a9a6; outline-offset: 4px; }
.pth-appbar { height: 56px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; padding: 0 18px; border-bottom: 1px solid #cfdbd8; background: #fff; }
.pth-brand { color: #376361; font-size: 22px; letter-spacing: -.05em; }
.pth-brand b { font-weight: 800; }
.pth-patient { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid #d6dfdc; border-radius: 9px; background: #fafcfb; }
.pth-avatar { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #2b302e; font-size: 8px; font-weight: 800; }
.pth-patient strong, .pth-patient small { display: block; }
.pth-patient strong { font-size: 9px; }
.pth-patient small { margin-top: 2px; color: #596560; font-size: 7px; }
.pth-appstatus { justify-self: end; display: flex; align-items: center; gap: 7px; color: #60716c; font-size: 8px; }
.pth-appstatus::before { width: 7px; height: 7px; border-radius: 50%; background: #48a987; box-shadow: 0 0 0 4px #e2f3ec; content: ""; }
.pth-workspace { height: 410px; display: grid; grid-template-columns: 126px minmax(0,1fr); background: #f8faf9; }
.pth-sidebar { padding: 17px 11px; border-right: 1px solid #d6e0dd; background: #f5f8f7; }
.pth-side-label { display: block; margin: 0 8px 9px; color: #596560; font-size: 6px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.pth-side-item { min-height: 31px; display: flex; align-items: center; gap: 8px; margin-bottom: 3px; padding: 0 9px; border-radius: 7px; color: #596560; font-size: 8px; font-weight: 700; }
.pth-side-item::before { width: 12px; height: 12px; display: grid; place-items: center; color: currentColor; content: attr(data-icon); font-size: 10px; }
.pth-side-item.is-active { color: #fff; background: #376361; }
.pth-stage { position: relative; min-width: 0; overflow: hidden; }
.pth-view { position: absolute; inset: 0; padding: 22px 24px; overflow: hidden; opacity: 0; transform: translateY(8px); transition: opacity .3s ease, transform .35s cubic-bezier(.22,.8,.28,1); pointer-events: none; }
.pth-view.is-active { z-index: 2; opacity: 1; transform: none; pointer-events: auto; }
.pth-viewhead { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
.pth-eyebrow { display: block; margin-bottom: 5px; color: #596560; font-size: 7px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.pth-view h4 { margin: 0; color: #171817; font-size: 20px; line-height: 1.05; letter-spacing: -.03em; }
.pth-viewlead { max-width: 340px; margin: 7px 0 0; color: #56635e; font-size: 8px; line-height: 1.45; }
.pth-button { min-height: 30px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 6px 11px; border: 1px solid #376361; border-radius: 7px; color: #fff; background: #376361; font-size: 8px; font-weight: 800; }
.pth-button.is-quiet { color: #376361; background: #fff; }
.pth-chip { display: inline-flex; align-items: center; gap: 5px; padding: 5px 7px; border-radius: 999px; color: #315957; background: #e0efec; font-size: 7px; font-weight: 800; }
.pth-chip.amber { color: #80571d; background: #fff1d5; }
.pth-chip.red { color: #9a4141; background: #fde4e3; }
.pth-chip.green { color: #26694f; background: #def2e7; }
.pth-card { border: 1px solid #d1ddda; border-radius: 11px; background: #fff; box-shadow: 0 10px 26px rgba(42,64,59,.05); }
.pth-grid { display: grid; gap: 10px; }
.pth-grid.cols-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.pth-grid.cols-3 { grid-template-columns: repeat(3,minmax(0,1fr)); }
.pth-muted { color: #596560; }

.pth-dropzone { min-height: 104px; display: grid; place-items: center; border: 1px dashed #8eb5ae; border-radius: 11px; color: #51706a; background: #f6fbf9; text-align: center; }
.pth-dropzone b { display: block; font-size: 10px; }
.pth-dropzone small { display: block; margin-top: 5px; font-size: 7px; }
.pth-upload-list { margin-top: 10px; }
.pth-file { display: grid; grid-template-columns: 28px minmax(0,1fr) auto; gap: 9px; align-items: center; padding: 9px 10px; border-top: 1px solid #e1e8e6; }
.pth-file:first-child { border-top: 0; }
.pth-filetype { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 6px; color: #376361; background: #e0efec; font-size: 6px; font-weight: 900; }
.pth-file b, .pth-file small { display: block; }
.pth-file b { font-size: 8px; }
.pth-file small { margin-top: 2px; color: #596560; font-size: 6px; }
.pth-file-state { min-width: 70px; text-align: right; color: #55716b; font-size: 7px; font-weight: 800; }
.pth-meter { width: 74px; height: 4px; margin-top: 4px; overflow: hidden; border-radius: 9px; background: #e3e9e7; }
.pth-meter i { height: 100%; display: block; border-radius: inherit; background: #48a9a6; animation: pth-fill 2.4s ease both; }
.pth-process { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-top: 24px; }
.pth-process article { position: relative; min-height: 88px; padding: 13px 10px; border: 1px solid #d5dfdc; border-radius: 9px; background: #fff; }
.pth-process article::after { position: absolute; top: 23px; left: calc(100% + 1px); width: 8px; height: 1px; background: #9bb9b3; content: ""; }
.pth-process article:last-child::after { display: none; }
.pth-process b { display: block; font-size: 8px; }
.pth-process span { display: block; margin-top: 6px; color: #596560; font-size: 6px; line-height: 1.4; }
.pth-process article.is-done { border-color: #8fc7b5; background: #f0faf6; }
.pth-type-grid { grid-template-columns: repeat(3,1fr); }
.pth-type-card { min-height: 86px; padding: 12px; }
.pth-type-card span { display: block; color: #596560; font-size: 6px; }
.pth-type-card b { display: block; margin-top: 15px; font-size: 18px; }
.pth-type-card small { display: block; margin-top: 3px; color: #54726c; font-size: 7px; }
.pth-toolbar { display: flex; gap: 7px; margin-bottom: 10px; }
.pth-search { flex: 1; padding: 8px 10px; border: 1px solid #d2ddda; border-radius: 7px; color: #596560; background: #fff; font-size: 7px; }
.pth-table { overflow: hidden; }
.pth-tr { display: grid; grid-template-columns: 1.1fr .65fr .7fr .55fr; align-items: center; min-height: 38px; padding: 0 11px; border-top: 1px solid #e1e8e6; font-size: 7px; }
.pth-tr:first-child { border-top: 0; color: #596560; background: #f5f8f7; font-size: 6px; font-weight: 800; text-transform: uppercase; }
.pth-tr.is-selected { background: #edf7f4; box-shadow: inset 3px 0 #48a9a6; }
.pth-source-drawer { display: grid; grid-template-columns: 1fr 1.15fr; gap: 12px; }
.pth-source-copy { padding: 14px; }
.pth-source-copy dl { margin: 12px 0 0; }
.pth-source-copy div { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-top: 1px solid #e3e9e7; font-size: 7px; }
.pth-source-copy dt { color: #596560; }
.pth-source-copy dd { margin: 0; font-weight: 800; }
.pth-source-page { min-height: 250px; padding: 18px; background: #fffdfa; }
.pth-source-page b { font-family: var(--serif); font-size: 14px; }
.pth-source-line { height: 6px; margin-top: 10px; border-radius: 5px; background: #e2e0da; }
.pth-source-line.is-hit { width: 86%; height: auto; padding: 7px; color: #244b49; background: #d8efea; font-size: 7px; line-height: 1.4; }

.pth-report-tiles { grid-template-columns: repeat(3,1fr); }
.pth-report-tile { min-height: 116px; padding: 13px; }
.pth-report-tile i { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 7px; color: #fff; background: #376361; font-size: 11px; font-style: normal; }
.pth-report-tile b { display: block; margin-top: 16px; font-size: 9px; }
.pth-report-tile span { display: block; margin-top: 5px; color: #596560; font-size: 6px; line-height: 1.4; }
.pth-report-tile.is-selected { border-color: #48a9a6; box-shadow: inset 0 0 0 1px #48a9a6; }
.pth-modal { width: min(430px,92%); margin: 0 auto; overflow: hidden; }
.pth-modal-head { display: flex; align-items: center; justify-content: space-between; padding: 13px 15px; border-bottom: 1px solid #dde5e3; }
.pth-modal-head b { font-size: 10px; }
.pth-modal-body { padding: 14px 15px; }
.pth-field { margin-top: 10px; }
.pth-field:first-child { margin-top: 0; }
.pth-field label { display: block; margin-bottom: 5px; color: #65716d; font-size: 6px; font-weight: 800; text-transform: uppercase; }
.pth-input, .pth-textarea { width: 100%; padding: 8px 9px; border: 1px solid #cad7d3; border-radius: 7px; color: #303b38; background: #fbfdfc; font-size: 7px; }
.pth-textarea { min-height: 58px; line-height: 1.45; }
.pth-segment { display: grid; grid-template-columns: repeat(2,1fr); overflow: hidden; border: 1px solid #cad7d3; border-radius: 7px; }
.pth-segment span { padding: 8px; color: #6e7975; text-align: center; font-size: 7px; }
.pth-segment span.is-active { color: #fff; background: #376361; }
.pth-generation { display: grid; grid-template-columns: .75fr 1.25fr; gap: 14px; }
.pth-thinking { padding: 15px; }
.pth-thinking li { position: relative; margin-top: 12px; padding-left: 18px; color: #6b7773; font-size: 7px; line-height: 1.4; list-style: none; }
.pth-thinking li::before { position: absolute; top: 1px; left: 0; width: 10px; height: 10px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #48a987; content: "✓"; font-size: 6px; }
.pth-report-sheet { min-height: 272px; padding: 20px; }
.pth-report-sheet .pth-source-line:nth-child(2) { width: 68%; }
.pth-report-sheet .pth-source-line:nth-child(3) { width: 92%; }
.pth-report-sheet .pth-source-line:nth-child(4) { width: 78%; }

.pth-gantt { padding: 13px; }
.pth-gantt-head, .pth-gantt-row { display: grid; grid-template-columns: 112px repeat(6,1fr); }
.pth-gantt-head span { padding-bottom: 8px; color: #596560; font-size: 6px; text-align: center; }
.pth-gantt-row { position: relative; min-height: 50px; align-items: center; border-top: 1px solid #e1e8e6; }
.pth-gantt-label { padding-right: 9px; }
.pth-gantt-label b, .pth-gantt-label small { display: block; }
.pth-gantt-label b { font-size: 7px; }
.pth-gantt-label small { margin-top: 3px; color: #596560; font-size: 6px; }
.pth-gantt-track { position: absolute; z-index: 0; right: 0; left: 112px; height: 1px; background: repeating-linear-gradient(90deg,#dfe7e5 0,#dfe7e5 1px,transparent 1px,transparent 16.66%); }
.pth-gantt-bar { z-index: 1; height: 20px; display: flex; align-items: center; padding: 0 8px; border-radius: 6px; color: #fff; background: #376361; font-size: 6px; font-weight: 800; transition: grid-column .55s cubic-bezier(.22,.8,.28,1), background .3s; }
.pth-gantt-bar.supp { background: #26735b; }
.pth-gantt-bar.pause { color: #775c2d; background: #f6dfad; }
.pth-gantt-row .pth-gantt-bar { grid-row: 1; }
.pth-gantt-note { margin-top: 12px; padding: 11px 12px; border-color: #a7c8c1; background: #f2faf8; font-size: 7px; line-height: 1.45; }
.pth-date-editor { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: 12px; }
.pth-date-editor div { padding: 9px; border: 1px solid #d4dfdc; border-radius: 7px; background: #fff; }
.pth-date-editor span, .pth-date-editor b { display: block; }
.pth-date-editor span { color: #596560; font-size: 6px; }
.pth-date-editor b { margin-top: 5px; font-size: 8px; }

.pth-review-layout { display: grid; grid-template-columns: .88fr 1.12fr; gap: 12px; }
.pth-issue-list { overflow: hidden; }
.pth-issue { padding: 11px 12px; border-top: 1px solid #e1e8e6; }
.pth-issue:first-child { border-top: 0; }
.pth-issue.is-selected { background: #fff7e8; box-shadow: inset 3px 0 #d4a14d; }
.pth-issue b, .pth-issue span { display: block; }
.pth-issue b { font-size: 8px; }
.pth-issue span { margin-top: 4px; color: #596560; font-size: 6px; line-height: 1.35; }
.pth-issue-detail { padding: 14px; }
.pth-issue-detail h5 { margin: 0; font-size: 11px; }
.pth-evidence { margin-top: 12px; padding: 10px; border-left: 3px solid #48a9a6; background: #edf7f4; font-size: 7px; line-height: 1.45; }
.pth-resolved { min-height: 230px; display: grid; place-items: center; padding: 28px; text-align: center; }
.pth-resolved i { width: 48px; height: 48px; display: grid; place-items: center; margin: auto; border-radius: 50%; color: #fff; background: #48a987; font-size: 22px; font-style: normal; }
.pth-resolved b { display: block; margin-top: 14px; font-size: 12px; }
.pth-resolved p { max-width: 240px; margin: 7px auto 0; color: #71807a; font-size: 7px; line-height: 1.45; }

.pth-patient-stats { grid-template-columns: repeat(4,1fr); margin-bottom: 12px; }
.pth-stat { padding: 11px; }
.pth-stat span, .pth-stat b { display: block; }
.pth-stat span { color: #596560; font-size: 6px; }
.pth-stat b { margin-top: 7px; font-size: 15px; }
.pth-patient-table .pth-tr { grid-template-columns: 1.15fr .6fr .6fr .7fr .25fr; }
.pth-patient-name { display: flex; align-items: center; gap: 7px; }
.pth-mini-avatar { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #376361; font-size: 6px; font-weight: 800; }
.pth-add-patient { width: min(390px,92%); margin: 0 auto; padding: 16px; }
.pth-form-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 9px; }
.pth-workspace-summary { display: grid; grid-template-columns: .7fr 1.3fr; gap: 12px; }
.pth-profile-card { padding: 15px; }
.pth-profile-card .pth-mini-avatar { width: 42px; height: 42px; font-size: 10px; }
.pth-profile-card h5 { margin: 12px 0 0; font-size: 12px; }
.pth-profile-card p { margin: 5px 0 0; color: #596560; font-size: 7px; }
.pth-ready-list { overflow: hidden; }
.pth-ready-row { display: flex; justify-content: space-between; gap: 10px; padding: 12px; border-top: 1px solid #e1e8e6; font-size: 7px; }
.pth-ready-row:first-child { border-top: 0; }

.pth-invite-flow { display: grid; grid-template-columns: 1fr 34px 1fr; align-items: stretch; min-height: 270px; }
.pth-invite-person { padding: 15px; }
.pth-invite-person h5 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 10px; }
.pth-invite-person p { margin: 7px 0 0; color: #596560; font-size: 7px; line-height: 1.4; }
.pth-invite-divider { position: relative; display: grid; place-items: center; color: #7b918c; font-size: 14px; }
.pth-invite-divider::before { position: absolute; top: 10px; bottom: 10px; left: 50%; width: 1px; background: #d6e0dd; content: ""; }
.pth-invite-divider span { z-index: 1; padding: 7px 0; background: #f8faf9; }
.pth-mail { margin-top: 18px; padding: 12px; border: 1px solid #c8d8d4; border-radius: 9px; background: #fff; box-shadow: 0 12px 24px rgba(42,64,59,.06); }
.pth-mail strong { display: block; font-size: 8px; }
.pth-mail span { display: block; margin-top: 5px; color: #596560; font-size: 6px; line-height: 1.4; }
.pth-invite-status { margin-top: 14px; padding: 10px; border-radius: 8px; color: #315957; background: #e0efec; font-size: 7px; font-weight: 800; }
.pth-invite-status.pending { color: #80571d; background: #fff1d5; }

.pth-controls { min-height: 64px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 10px 14px 11px; border-top: 1px solid #cad8d4; background: #eef6f3; }
.pth-play { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid #8eb5ae; border-radius: 50%; color: #376361; background: #fff; cursor: pointer; }
.pth-play:disabled { opacity: .55; cursor: default; }
.pth-steps { min-width: 0; display: grid; gap: 6px; }
.pth-stepbuttons { display: flex; gap: 5px; overflow-x: auto; scrollbar-width: none; }
.pth-stepbuttons::-webkit-scrollbar { display: none; }
.pth-step { flex: 1 0 auto; min-width: 72px; padding: 4px 6px; border: 0; border-radius: 6px; color: #56645f; background: transparent; font-size: 6px; font-weight: 800; cursor: pointer; }
.pth-step.is-active { color: #fff; background: #376361; }
.pth-progress { height: 3px; overflow: hidden; border-radius: 9px; background: #cfddda; }
.pth-progress i { height: 100%; display: block; width: 0; border-radius: inherit; background: #48a9a6; transition: width .35s ease; }
.pth-count { color: #5f746e; font-size: 7px; font-weight: 800; white-space: nowrap; }
.pth-caption { position: absolute; z-index: 4; right: 14px; bottom: 72px; max-width: 58%; padding: 8px 10px; border: 1px solid #9fbbb5; border-radius: 8px; color: #315957; background: rgba(255,255,255,.96); box-shadow: 0 10px 25px rgba(28,54,49,.09); font-size: 7px; font-weight: 700; line-height: 1.4; }

@keyframes pth-fill { from { width: 8%; } to { width: 100%; } }
.pth-view.is-active .pth-card, .pth-view.is-active .pth-file, .pth-view.is-active .pth-type-card { animation: pth-rise .42s both; }
.pth-view.is-active .pth-card:nth-child(2), .pth-view.is-active .pth-file:nth-child(2), .pth-view.is-active .pth-type-card:nth-child(2) { animation-delay: .08s; }
.pth-view.is-active .pth-card:nth-child(3), .pth-view.is-active .pth-file:nth-child(3), .pth-view.is-active .pth-type-card:nth-child(3) { animation-delay: .16s; }
@keyframes pth-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

@media (max-width: 1080px) {
  .patient-showcase-app { width: 86%; }
  .data-capture-table > header,.data-capture-table > article { grid-template-columns: minmax(150px,1fr) minmax(220px,1.55fr) minmax(190px,1.25fr) minmax(120px,.8fr); gap: 14px; }
  .data-capture-table > article { padding-inline: 16px; }
  .product-page .product-hero { height: 650svh; min-height: 4300px; }
  .product-page .product-hero h1 { font-size: clamp(44px,5.4vw,56px); }
  .product-hero-story { width: min(320px,35vw); }
  .product-hero-story h2 { font-size: 38px; }
  .product-tour-feature, .product-tour-feature:nth-child(even) { grid-template-columns: 1fr; gap: 30px; }
  .product-tour-feature:nth-child(even) .product-tour-copy, .product-tour-feature:nth-child(even) .product-tour-mount { grid-column: 1; grid-row: auto; }
  .product-tour-copy { max-width: 720px; }
}
@media (max-width: 720px) {
  .product-page .marketing-footer { --footer-reveal-height: 420px; padding-right: 6px; padding-left: 6px; }
  .product-page .marketing-footer > .shell { padding: 56px 24px 28px; border-radius: 0 0 32px 32px; }
  .product-page .marketing-footer-bottom { justify-content: flex-start; }
  .product-footer-reveal { right: 6px; left: 6px; }
  .product-footer-reveal-note { top: 48px; right: 22px; grid-template-columns: 21px auto; font-size: 8px; }
  .product-footer-reveal-note i { width: 21px; height: 21px; }
  .product-footer-reveal > strong { bottom: -.03em; font-size: clamp(170px,42vw,230px); }
  .data-capture-section { padding: 72px 0; }
  .data-capture-head { grid-template-columns: 1fr; gap: 20px; }
  .data-capture-head h2 { font-size: 46px; }
  .data-capture-head > p { max-width: 520px; font-size: 14px; }
  .data-capture-summary { grid-template-columns: 1fr; margin-top: 38px; border-radius: 13px 13px 0 0; }
  .data-capture-summary span { min-height: 54px; border-top: 1px solid rgba(255,255,255,.18); border-left: 0; }
  .data-capture-summary span:first-child { border-top: 0; }
  .data-capture-table > header { display: none; }
  .data-capture-table > article { min-height: 0; grid-template-columns: 1fr; gap: 13px; padding: 22px 18px; }
  .data-capture-type { grid-template-columns: 42px minmax(0,1fr); }
  .data-capture-type > i { width: 42px; height: 42px; }
  .data-capture-type b { font-size: 15px; }
  .data-capture-table article > p { font-size: 12px; }
  .data-capture-table article > strong { padding-top: 10px; border-top: 1px solid #dce5e2; }
  .product-page .product-hero { height: 205svh; min-height: 1320px; padding: 0; }
  .product-hero-sticky { min-height: 600px; }
  .product-hero-inner { width: calc(100% - 24px); }
  .product-hero-copy { top: 104px; }
  .product-page .product-hero h1 { font-size: 38px; }
  .product-hero-copy .page-actions { flex-direction: column; align-items: stretch; width: min(310px,100%); margin-inline: auto; }
  .product-hero-story { top: 105px; left: 0; width: 100%; transform: translate3d(0,var(--hero-story-y,24px),0); }
  .product-hero-story h2 { font-size: 38px; }
  .product-hero-story p { max-width: 490px; margin-top: 15px; font-size: 13px; }
  .product-hero-story ul { grid-template-columns: 1fr; gap: 6px; margin-top: 15px; }
  .product-hero-story li { font-size: 10px; }
  .product-hero-window { top: var(--hero-window-top, clamp(190px,24svh,225px)); width: 100%; height: min(520px,calc(100svh - var(--hero-window-top, 205px) - 18px)); min-height: 300px; margin: 0; border-radius: 15px; transform-origin: 50% 36%; }
  .product-page .product-hero + .page-section.paper { margin-top: 0; padding-top: 56px; border-radius: 22px 22px 0 0; }
  .product-hero-bar { height: 55px; grid-template-columns: 1fr auto; padding: 0 14px; }
  .product-hero-brand { font-size: 22px; }
  .product-hero-search { display: none; }
  .product-hero-actions { display: none; }
  .product-hero-person { padding: 5px 7px; }
  .product-hero-person > i { width: 26px; height: 26px; }
  .product-hero-app { height: calc(100% - 55px); grid-template-columns: 72px minmax(0,1fr); }
  .product-hero-sidebar { padding: 10px 7px; overflow: hidden; }
  .product-hero-sidebar span { margin: 5px 6px 3px; font-size: 5px; line-height: 1.1; }
  .product-hero-sidebar b { min-height: 26px; margin-bottom: 0; padding: 0 6px; font-size: 6px; }
  .product-hero-sidebar b svg { width: 12px; height: 12px; flex-basis: 12px; }
  .product-hero-sidebar b::before { width: 12px; }
  .product-hero-dashboard { padding: 18px 12px; }
  .product-hero-records { padding: 18px 12px; }
  .product-hero-records-head strong { font-size: 18px; }
  .product-hero-records-head > b { padding: 7px 8px; font-size: 7px; }
  .product-hero-records-empty { min-height: 350px; margin-top: 14px; }
  .product-hero-upload { top: 67px; width: calc(100% - 20px); }
  .product-hero-upload > .product-hero-upload-head { min-height: 44px; padding: 0 11px; font-size: 10px; }
  .product-hero-upload-body { padding: 10px; }
  .product-hero-upload-file { min-height: 42px; padding-inline: 5px; }
  .product-hero-upload-file b { font-size: 7px; }
  .product-hero-upload-file small { font-size: 6px; }
  .product-hero-processing { padding-inline: 14px; }
  .product-hero-processing-list { grid-template-columns: 1fr; gap: 4px; }
  .product-hero-records-table { display: none; }
  .product-hero-title strong { font-size: 18px; }
  .product-hero-stats { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-top: 14px; }
  .product-hero-stats article { min-height: 66px; padding: 9px; }
  .product-hero-stats strong { margin-top: 5px; font-size: 15px; }
  .product-hero-detail { grid-template-columns: 1fr; }
  .product-hero-chart { min-height: 180px; padding: 12px; }
  .product-hero-chart svg { height: 80px; }
  .product-hero-review { display: none; }
  .process-overview { padding-bottom: 76px; }
  .process-intro { margin-bottom: 54px; text-align: left; }
  .process-intro p { margin-left: 0; font-size: 15px; }
  .process-list { gap: 74px; }
  .process-list::before { left: 8px; }
  .process-step,.process-step:nth-child(even) { min-height: 0; grid-template-columns: 1fr; gap: 28px; padding-left: 34px; }
  .process-step::before { top: 7px; left: 0; transform: none; }
  .process-step:nth-child(even) .process-copy,
  .process-step:nth-child(even) .process-demo { grid-column: 1; grid-row: auto; }
  .process-copy h3 { font-size: 44px; }
  .process-copy p { margin-top: 18px; font-size: 15px; }
  .process-demo { width: 100%; min-height: 620px; border-radius: 16px; }
  .process-demo > header { top: 54px; left: 6%; width: 88%; min-height: 52px; grid-template-columns: 1fr auto; padding: 0 14px; }
  .process-demo > header > b { font-size: 19px; }
  .process-demo > header > span { display: none; }
  .product-page .process-demo .workflow-visual { top: 105px; left: 6%; width: 88%; min-height: 422px; grid-column: auto; grid-row: auto; align-self: stretch; margin: 0; padding: 22px; }
  .workflow-steps { right: 6%; bottom: 22px; left: 6%; }
  .workflow-steps span { font-size: 6px; }
  .micro-upload > div { grid-template-columns: 36px minmax(0,1fr); min-height: 72px; }
  .micro-upload > div > em { grid-column: 1 / -1; width: 100%; }
  .process-demo .micro-review { padding: 18px 22px !important; }
  .micro-review > div { min-height: 86px; }
  .micro-share-list article { min-height: 76px; grid-template-columns: 29px minmax(0,1fr) auto; gap: 8px; padding: 9px; }
  .micro-share-list i { width: 27px; height: 27px; }
  .micro-share-fields { gap: 10px 8px; }
  .micro-share-fields label.micro-focus { padding: 5px; }
  .micro-share-mail { padding: 14px; }
  .micro-share-mail h4 { margin-top: 13px; font-size: 16px; }
  .micro-share-mail p { margin: 10px 0 13px; }
  .micro-share-mail small { margin-top: 11px; }
  .micro-share-report { grid-template-columns: 1fr; gap: 7px; }
  .micro-share-report > article { min-height: 148px; padding: 10px; }
  .micro-share-report > aside { min-height: 80px; padding: 9px; }
  .micro-share-report > article p { margin: 10px 0; font-size: 10px; }
  .micro-share-report dl { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; margin-top: 9px; }
  .micro-share-report dl div { padding: 0; border: 0; }
  .micro-share-connected > footer { align-items: flex-start; }
  .patient-showcase { margin-top: 88px; padding-top: 68px; }
  .patient-showcase-head { margin-bottom: 40px; text-align: left; }
  .patient-showcase-head h2,.patient-showcase-head p { margin-left: 0; }
  .patient-showcase-head h2 { font-size: 44px; }
  .patient-showcase-stage { min-height: 580px; border-radius: 18px; }
  .patient-showcase-app { width: calc(100% - 32px); min-height: 500px; }
  .patient-showcase-appbar { height: 58px; grid-template-columns: 1fr auto; padding: 0 16px; }
  .patient-showcase-appbar > span { display: none; }
  .patient-showcase-appbar > b { font-size: 21px; }
  .patient-showcase-views { height: 385px; }
  .patient-showcase-view { padding: 23px 18px; }
  .patient-showcase-view > header h3 { font-size: 21px; }
  .patient-showcase-toolbar { grid-template-columns: 1fr auto; }
  .patient-showcase-toolbar > b:last-child { display: none; }
  .patient-showcase-table > header,.patient-showcase-table article { grid-template-columns: 1.55fr .42fr .58fr; }
  .patient-showcase-table > header span:last-child,.patient-showcase-table article > u { display: none; }
  .patient-showcase-invite-layout,.patient-showcase-share-layout { grid-template-columns: 1fr; }
  .patient-showcase-invite-layout > article,.patient-showcase-share-layout > article { display: none; }
  .patient-showcase-invite-layout > form,.patient-showcase-share-layout > aside { min-height: 265px; }
  .patient-showcase-access-summary article { min-height: 82px; padding: 11px; }
  .patient-showcase-access-row { grid-template-columns: minmax(0,1fr) auto; }
  .patient-showcase-access-row > em { display: none; }
  .patient-showcase-progress { height: 57px; padding: 0 18px 15px; }
  .patient-showcase-progress span,.patient-showcase-progress button { font-size: 7px; }
  .patient-showcase-toggle { bottom: 10px; left: 10px; width: 36px; height: 36px; }
  .patient-showcase-points { grid-template-columns: 1fr; margin-top: 22px; }
  .patient-showcase-points article { min-height: 0; padding: 22px 5px; border-top: 1px solid #cad4d1; border-left: 0; }
  .patient-showcase-points article:first-child { border-top: 0; }
  .mini-testimonials { margin-top: 88px; padding-top: 28px; }
  .mini-testimonials-head { align-items: start; flex-direction: column; gap: 12px; margin-bottom: 24px; }
  .mini-testimonials-head > p { max-width: none; margin: 0; text-align: left; }
  .mini-testimonial-grid { grid-template-columns: 1fr; border-radius: 16px; }
  .mini-testimonial-grid blockquote { min-height: 0; padding: 25px 24px 23px; border-top: 1px solid #d2ddda; border-left: 0; }
  .mini-testimonial-grid blockquote:first-child { border-top: 0; }
  .mini-testimonial-grid blockquote p { font-size: 20px; }
  .product-faq { padding: 76px 0; }
  .product-faq-head h2 { font-size: 48px; }
  .product-faq-head .button { width: 100%; }
  .product-faq-list { margin-top: 52px; }
  .product-faq-list summary { min-height: 74px; gap: 18px; font-size: 18px; }
  .product-faq-list summary i { width: 28px; height: 28px; flex-basis: 28px; }
  .product-faq-list details > p { padding: 0 46px 24px 0; font-size: 13px; }
  .product-final-cta { min-height: 430px; padding: 76px 0; }
  .product-final-cta h2 { font-size: 40px; }
  .product-final-cta p { font-size: 15px; }
  .product-final-cta .button { width: 100%; max-width: 280px; }
  .product-tour-section { padding: 52px 0 68px; }
  .product-tour-list { gap: 76px; }
  .pth-player { min-height: 620px; border-radius: 16px; }
  .pth-appbar { grid-template-columns: 1fr auto; height: 52px; padding: 0 12px; }
  .pth-patient { display: none; }
  .pth-workspace { height: 500px; grid-template-columns: 88px minmax(0,1fr); }
  .pth-sidebar { padding: 12px 7px; }
  .pth-side-item { padding: 0 6px; font-size: 6px; }
  .pth-view { padding: 16px 13px; }
  .pth-view h4 { font-size: 17px; }
  .pth-grid.cols-3, .pth-type-grid, .pth-report-tiles { grid-template-columns: repeat(2,1fr); }
  .pth-process { grid-template-columns: repeat(2,1fr); }
  .pth-process article::after { display: none; }
  .pth-source-drawer, .pth-generation, .pth-review-layout, .pth-workspace-summary { grid-template-columns: 1fr; }
  .pth-source-page, .pth-report-sheet { min-height: 150px; padding: 13px; }
  .pth-gantt-head, .pth-gantt-row { grid-template-columns: 82px repeat(6,1fr); }
  .pth-gantt-track { left: 82px; }
  .pth-gantt-bar { padding: 0 4px; overflow: hidden; white-space: nowrap; }
  .pth-invite-flow { grid-template-columns: 1fr; gap: 8px; }
  .pth-invite-divider { min-height: 22px; }
  .pth-invite-divider::before { top: 50%; right: 10px; bottom: auto; left: 10px; width: auto; height: 1px; }
  .pth-controls { grid-template-columns: auto minmax(0,1fr); }
  .pth-count { display: none; }
  .pth-caption { right: 10px; bottom: 70px; max-width: 72%; }
}
@media (prefers-reduced-motion: reduce) {
  .product-page .product-hero { height: auto; min-height: 0; padding: clamp(126px,10vw,158px) 0 0; }
  .product-hero-sticky { position: relative; height: auto; min-height: 0; overflow: hidden; }
  .product-hero-inner { height: auto; display: flex; flex-direction: column; align-items: center; }
  .product-hero-copy { position: relative; top: auto; left: auto; width: 100%; opacity: 1; transform: none; }
  .product-hero-story { display: none; }
  .product-hero-window { position: relative; top: auto; left: auto; width: 100%; height: 510px; margin-top: clamp(50px,5vw,72px); transform: none; }
  .product-page .product-hero + .page-section.paper { margin-top: -32px; }
  .product-tour-copy.pth-scroll-reveal,
  .product-tour-mount.pth-scroll-reveal { opacity: 1; translate: none; transition: none; }
  .pth-view, .pth-progress i, .pth-gantt-bar { transition: none; }
  .pth-view.is-active .pth-card, .pth-view.is-active .pth-file, .pth-view.is-active .pth-type-card, .pth-meter i { animation: none; }
  .micro-upload-view, .micro-data-view, .micro-report-view, .micro-share-view, .micro-focus,.patient-showcase-cursor svg { animation: none !important; }
  .process-step { opacity: 1; transform: none; transition: none; }
  .process-step.is-active .micro-patient > em::before,
  .process-step.is-active .micro-upload > div > em::before,
  .process-step.is-active .micro-report > em { width: 100%; animation: none; }
  .process-step.is-active .micro-patient > strong,
  .process-step.is-active .micro-upload > strong,
  .process-step.is-active .micro-review > strong,
  .process-step.is-active .micro-report footer strong { opacity: 1; transform: none; animation: none; }
}

/* Responsive typography calibration
   Content type scales continuously from phone to wide desktop. Product mockups
   keep a denser scale, but important labels never drop below a readable floor. */
.product-page {
  --type-display-xl: clamp(42px,calc(34px + 2vw),78px);
  --type-display-lg: clamp(42px,calc(32px + 2.35vw),76px);
  --type-section: clamp(40px,calc(30px + 2.2vw),72px);
  --type-lead: clamp(16px,calc(15px + .2vw),19px);
  --type-body: clamp(15px,calc(14.2px + .16vw),17px);
  --type-body-sm: clamp(14px,calc(13.4px + .12vw),15px);
  --type-label: clamp(11px,calc(10.5px + .08vw),12px);
}
.product-page main { position: relative; z-index: 2; background: #fbfaf7; }
.product-page .marketing-links,
.product-page .marketing-actions { font-size: clamp(15px,calc(14px + .12vw),16px); }
.product-page .marketing-actions .button { font-size: clamp(14px,calc(13px + .12vw),15px); }
.product-page .page-kicker { font-size: var(--type-label); }
.product-page .product-hero h1 { max-width: 980px; font-size: var(--type-display-xl); }
.product-page .product-hero-story h2 { font-size: clamp(36px,calc(30px + 1.2vw),54px); }
.product-page .product-hero-story p { font-size: var(--type-body); }
.product-page .product-hero-story li { font-size: var(--type-body-sm); }
.product-page .process-intro { max-width: 920px; }
.product-page .process-intro h2 { font-size: clamp(48px,calc(32px + 2.6vw),82px); }
.product-page .process-intro p { max-width: 680px; font-size: var(--type-lead); }
.product-page .process-number { font-size: var(--type-label); }
.product-page .process-copy h3 { font-size: clamp(44px,calc(30px + 2.3vw),76px); }
.product-page .process-copy p { font-size: var(--type-body); }
.product-page .process-copy li { font-size: var(--type-body-sm); }
.product-page .process-next small { font-size: 10px; }
.product-page .process-next b { font-size: clamp(12px,calc(11px + .1vw),13px); }
.product-page .process-demo > header { font-size: clamp(11px,calc(10px + .1vw),12px); }
.product-page .workflow-steps span { font-size: clamp(8px,calc(7px + .08vw),9px); }
.product-page .process-demo small,
.product-page .process-demo dt,
.product-page .process-demo figcaption { font-size: clamp(8px,calc(7px + .08vw),9px); }
.product-page .patient-showcase-head h2 { font-size: clamp(42px,calc(31px + 2.2vw),72px); }
.product-page .patient-showcase-head p { font-size: var(--type-lead); }
.product-page .patient-showcase-points h3 { font-size: clamp(19px,calc(18px + .14vw),21px); }
.product-page .patient-showcase-points p { font-size: var(--type-body-sm); }
.product-page .patient-showcase-app small { font-size: clamp(8px,calc(7px + .1vw),9px); }
.product-page .patient-showcase-progress span { font-size: clamp(8px,calc(7px + .08vw),9px); }
.product-page .mini-testimonials-head h2 { font-size: clamp(36px,calc(29px + 1.55vw),54px); }
.product-page .mini-testimonials-head > p { font-size: var(--type-body-sm); }
.product-page .mini-testimonial-grid blockquote p { font-size: clamp(20px,calc(17px + .4vw),24px); }
.product-page .mini-testimonial-grid cite { font-size: 12px; }
.product-page .mini-testimonial-grid footer span { font-size: 10px; }
.product-page .mini-testimonials-note,
.product-page .data-capture-footnote,
.product-page .practice-credit,
.product-page .clinician-voices-note { font-size: 12px; }
.product-page .data-capture-head h2 { font-size: clamp(44px,calc(30px + 2.5vw),80px); }
.product-page .data-capture-head > p { font-size: var(--type-body); }
.product-page .data-capture-summary span { font-size: clamp(12px,calc(11px + .1vw),13px); }
.product-page .data-capture-summary b { font-size: clamp(13px,calc(12px + .1vw),14px); }
.product-page .data-capture-table > header { font-size: 10px; }
.product-page .data-capture-type b { font-size: clamp(14px,calc(13px + .12vw),15px); }
.product-page .data-capture-type small { font-size: 11px; }
.product-page .data-capture-tags span { font-size: 10px; }
.product-page .data-capture-table article > p { font-size: clamp(13px,calc(12px + .1vw),14px); }
.product-page .data-capture-table article > strong,
.product-page .data-capture-footnote { font-size: clamp(11px,calc(10px + .1vw),12px); }
.product-page .product-faq-head h2 { font-size: clamp(46px,calc(31px + 2.55vw),80px); }
.product-page .product-faq-head p { font-size: var(--type-body); }
.product-page .product-faq-list summary { font-size: clamp(19px,calc(17px + .45vw),25px); }
.product-page .product-faq-list details > p { font-size: var(--type-body-sm); }
.product-page .page-media-copy h2 { font-size: clamp(34px,calc(27px + 1.45vw),58px); }
.product-page .page-media-copy p,
.product-page .section-head > p,
.product-page .section-head > div:last-child > p { font-size: var(--type-body); }
.product-page .section-head h2 { font-size: clamp(40px,calc(29px + 2.25vw),72px); }
.product-page .clinical-questions h3 { font-size: clamp(28px,calc(25px + .3vw),31px); }
.product-page .clinical-questions p,
.product-page .boundary-list p,
.product-page .practice-strip span { font-size: var(--type-body-sm); }
.product-page .control-boundary h2 { font-size: clamp(40px,calc(29px + 2vw),64px); }
.product-page .product-final-cta h2 { font-size: clamp(40px,calc(31px + 1.75vw),64px); }
.product-page .product-final-cta p { font-size: var(--type-lead); }
.product-page .marketing-footer-brand p,
.product-page .marketing-footer-links a { font-size: var(--type-body-sm); }
.product-page .marketing-footer-links strong,
.product-page .marketing-footer-bottom { font-size: var(--type-label); }
.product-page .product-hero-window small { font-size: clamp(8px,calc(7px + .08vw),9px); }

@media (max-width: 720px) {
  .product-page .product-hero h1 { font-size: 42px; }
  .product-page .product-hero-story h2 { font-size: 38px; }
  .product-page .process-intro h2 { font-size: 46px; }
  .product-page .process-copy h3 { font-size: 42px; }
  .product-page .patient-showcase-head h2 { font-size: 42px; }
  .product-page .data-capture-head h2 { font-size: 44px; }
  .product-page .product-faq-head h2 { font-size: 46px; }
  .product-page .data-capture-table article > p { font-size: 14px; }
  .product-page .product-faq-list details > p { font-size: 14px; }
}

@media (min-width: 1800px) {
  .product-page main .shell { width: min(1520px,calc(100% - 128px)); }
  .product-page .product-hero-copy { width: min(1060px,100%); }
  .product-page .product-hero-story { width: min(400px,26vw); }
  .product-page .product-hero-window { width: min(1280px,calc(100vw - 128px),calc((100svh - 72px) * 1.7778)); }
  .product-page .process-step { grid-template-columns: minmax(320px,480px) minmax(0,660px); gap: 90px; }
  .product-page .process-step:nth-child(even) { grid-template-columns: minmax(0,660px) minmax(320px,480px); }
  .product-page .process-copy { max-width: 480px; }
  .product-page .process-copy p,
  .product-page .process-copy ul,
  .product-page .process-next { max-width: 430px; }
  .product-page .process-demo { width: min(100%,660px); }
  .product-page .patient-showcase-app { width: min(940px,78%); }
  .product-page .product-faq-head { max-width: 860px; }
  .product-page .marketing-footer > .shell { padding-right: max(64px,calc((100vw - 1520px)/2)); padding-left: max(64px,calc((100vw - 1520px)/2)); }
}

/* Keep the full-size product walkthrough legible. The navigation remains dense,
   while the changing workspace is presented at a readable demonstration scale. */
@media (min-width: 721px) {
  .clinician-product-chapter .product-hero-menu-stage :is(b,strong,span,small,em,u,label,p,button) {
    font-size: 10px !important;
  }
  .clinician-product-chapter .product-hero-menu-head small {
    font-size: 11px !important;
  }
  .clinician-product-chapter .product-hero-menu-head strong {
    font-size: 28px !important;
  }
  .clinician-product-chapter .product-hero-menu-head > div:last-child :is(span,b),
  .clinician-product-chapter :is(.product-hero-menu-toolbar,.hero-diag-toolbar,.hero-bio-toolbar,.hero-report-toolbar) span,
  .clinician-product-chapter :is(.hero-report-tabs,.product-hero-menu-tabs) :is(b,span) {
    font-size: 11px !important;
  }
  .clinician-product-chapter :is(.product-hero-data-table,.hero-record-table,.hero-report-table,.hero-bio-table,.hero-diag-table) > header b {
    font-size: 9px !important;
  }
  .clinician-product-chapter :is(.product-hero-data-table,.hero-record-table,.hero-report-table,.hero-bio-table,.hero-diag-table) > :is(div,article) > :is(b,strong),
  .clinician-product-chapter :is(.hero-record-table,.hero-bio-table,.hero-diag-table) > article > span:first-child b {
    font-size: 12px !important;
  }
  .clinician-product-chapter :is(.product-hero-data-table,.hero-record-table,.hero-report-table,.hero-bio-table,.hero-diag-table) > :is(div,article) :is(small,span,em) {
    font-size: 9.5px !important;
  }
  .clinician-product-chapter :is(.hero-record-upload-modal,.hero-report-generator,.hero-diag-edit,.hero-bio-detail,.hero-data-modal) header :is(b,strong),
  .clinician-product-chapter :is(.hero-report-viewer,.hero-custom-report) header :is(b,strong) {
    font-size: 13px !important;
  }
  .clinician-product-chapter :is(.hero-record-upload-modal,.hero-report-generator,.hero-diag-edit,.hero-bio-detail,.hero-data-modal) :is(label,article,section,footer) :is(b,strong,span,small),
  .clinician-product-chapter :is(.hero-report-viewer,.hero-custom-report) :is(b,strong,span,small,p) {
    font-size: 10px !important;
  }
  .clinician-product-chapter .product-hero-dashboard-stats b,
  .clinician-product-chapter .product-hero-menu-metrics b {
    font-size: 19px !important;
  }
  .clinician-product-chapter .product-hero-dashboard-stats span,
  .clinician-product-chapter .product-hero-menu-metrics :is(span,small),
  .clinician-product-chapter .product-hero-dashboard-body section > header span {
    font-size: 10px !important;
  }
  .clinician-product-chapter .product-hero-dashboard-body section > header b,
  .clinician-product-chapter .product-hero-quick-actions b,
  .clinician-product-chapter .product-hero-dashboard-list b,
  .clinician-product-chapter .product-hero-menu-panel > header b {
    font-size: 12px !important;
  }
  .clinician-product-chapter :is(.product-hero-quick-actions,.product-hero-dashboard-list,.product-hero-menu-panel) :is(span,strong),
  .clinician-product-chapter .product-hero-menu-row :is(b,span,strong) {
    font-size: 10px !important;
  }
  .clinician-product-chapter :is(.hero-record-empty,.hero-record-ready,.hero-record-complete) b,
  .clinician-product-chapter .hero-record-upload-card :is(b,strong) {
    font-size: 11px !important;
  }
  .clinician-product-chapter :is(.hero-record-empty,.hero-record-ready,.hero-record-complete,.hero-record-upload-card) :is(span,small) {
    font-size: 9.5px !important;
  }
}

/* The mock is scaled from its top-left on a phone, so it needs an origin and
   somewhere to scale into. Width and height come from the harness. */
@media (max-width: 720px) {
  .product-hero-app { transform-origin: 0 0; }
}
