.page {
  min-height: 100vh;
  overflow-x: hidden;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbf7 100%);
}

.mobileBar {
  display: none;
}

.header {
  position: relative;
  z-index: 10;
  border-bottom: 1px solid rgb(16 22 35 / 8%);
  background: rgb(255 255 255 / 88%);
  backdrop-filter: blur(16px);
}

.headerInner {
  width: min(1180px, calc(100% - 48px));
  min-height: 86px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.brand {
  display: inline-flex;
  align-items: center;
  width: 146px;
  height: 62px;
}

.brand img {
  width: 100%;
  height: auto;
}

.nav {
  display: flex;
  align-items: center;
  gap: clamp(18px, 2.4vw, 34px);
  margin-left: auto;
}

.nav a {
  color: #475569;
  font-size: 0.94rem;
  font-weight: 600;
  text-decoration: none;
  transition: color 160ms ease;
}

.nav a:hover {
  color: #62b55a;
}

.loginButton,
.patientHeaderLink,
.primaryButton,
.secondaryButton {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 14px;
  padding: 0 20px;
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
  transition: transform 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.loginButton,
.primaryButton {
  color: #fff;
  background: #62b55a;
  box-shadow: 0 10px 24px rgb(98 181 90 / 20%);
}

.loginButton:hover,
.primaryButton:hover {
  transform: translateY(-2px);
  background: #4da747;
  box-shadow: 0 14px 28px rgb(98 181 90 / 26%);
}

.loginButton {
  min-height: 44px;
  padding-inline: 18px;
  font-size: 0.95rem;
}

.patientHeaderLink {
  min-height: 44px;
  padding-inline: 14px;
  border: 1px solid #cfe4ce;
  color: #448f3f;
  background: #f5fbf5;
  font-size: 0.9rem;
}

.patientHeaderLink:hover {
  border-color: #62b55a;
  background: #eaf6ee;
}
.authActions { display: flex; align-items: center; gap: 14px; }
.signInLink { color: #315e40; font-size: .9rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.signInLink:hover { color: #62b55a; }

.hero {
  position: relative;
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
  padding: 92px 0 66px;
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(480px, 1.1fr);
  align-items: center;
  gap: clamp(44px, 5vw, 74px);
}

.hero::before {
  content: '';
  position: absolute;
  z-index: 0;
  width: 600px;
  height: 520px;
  top: -54px;
  right: -96px;
  background-image: url('/images/sonrie-dental-line-background.webp');
  background-position: right top;
  background-repeat: no-repeat;
  background-size: 920px 613px;
  filter: saturate(0.72);
  opacity: 0.1;
  pointer-events: none;
}

.heroCopy,
.productVisual,
.heroMedia {
  position: relative;
  z-index: 1;
}

.eyebrow {
  width: fit-content;
  margin: 0 0 22px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #cfe8cd;
  border-radius: 999px;
  padding: 8px 13px;
  color: #448c3f;
  background: rgb(255 255 255 / 82%);
  font-size: 0.91rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}

.hero h1 {
  max-width: 680px;
  margin: 0;
  color: #2c3748;
  font-size: clamp(3.15rem, 5.7vw, 5.15rem);
  font-weight: 700;
  letter-spacing: -0.055em;
  line-height: 0.96;
}

.hero h1 span {
  color: #62b55a;
}

.heroLead {
  max-width: 620px;
  margin: 28px 0 0;
  color: #475569;
  font-size: clamp(1.1rem, 1.7vw, 1.28rem);
  line-height: 1.6;
}

.heroActions {
  margin-top: 34px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.secondaryButton {
  border: 1px solid #bfcfc5;
  color: #3d7f39;
  background: rgb(255 255 255 / 68%);
}

.secondaryButton:hover {
  transform: translateY(-2px);
  border-color: #62b55a;
  background: #fff;
}

.locationNote {
  margin: 22px 0 0;
  color: #717784;
  font-size: 0.93rem;
  font-weight: 600;
}

.locationNote span {
  margin-right: 7px;
  color: #62b55a;
}

.heroMedia {
  min-height: 590px;
  overflow: hidden;
  border: 1px solid rgb(16 22 35 / 9%);
  border-radius: 30px;
  background: #eaf6ee;
  box-shadow: 0 34px 82px rgb(16 22 35 / 16%), 0 2px 8px rgb(16 22 35 / 5%);
}

.heroPhoto {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 47% center;
}

.photoShade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent 22%, rgb(16 22 35 / 5%) 50%, rgb(16 22 35 / 22%) 100%),
    linear-gradient(0deg, rgb(16 22 35 / 20%) 0%, transparent 34%);
}

.messageStack {
  position: absolute;
  z-index: 2;
  top: 30px;
  right: 22px;
  width: min(340px, calc(100% - 44px));
  display: grid;
  justify-items: end;
  gap: 10px;
}

.messageCard {
  border: 1px solid rgb(255 255 255 / 76%);
  border-radius: 16px;
  padding: 12px 14px;
  color: #101623;
  background: rgb(255 255 255 / 93%);
  box-shadow: 0 13px 34px rgb(16 22 35 / 16%);
  backdrop-filter: blur(13px);
}

.messageCard p {
  margin: 5px 0 0;
  font-size: 0.9rem;
  line-height: 1.42;
}

.messageSource {
  color: #697386;
  font-size: 0.72rem;
  font-weight: 600;
}

.patientMessage {
  width: 88%;
  justify-self: start;
  border-bottom-left-radius: 5px;
}

.sonrieMessage {
  width: 96%;
  border-color: rgb(98 181 90 / 28%);
  border-bottom-right-radius: 5px;
  background: rgb(241 250 242 / 96%);
}

.messageBrand {
  display: flex;
  align-items: center;
  gap: 8px;
}

.messageBrand img {
  width: 31px;
  height: 31px;
}

.messageBrand div {
  display: flex;
  flex-direction: column;
}

.messageBrand strong {
  color: #4d9e47;
  font-size: 0.81rem;
  line-height: 1.1;
}

.messageBrand span {
  margin-top: 2px;
  color: #697386;
  font-size: 0.68rem;
}

.slotChip {
  width: fit-content;
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  padding: 6px 9px;
  color: #3f833a;
  background: #dcf1de;
  font-size: 0.75rem;
  font-weight: 700;
}

.patientReply {
  width: fit-content;
  min-width: 128px;
  border-bottom-left-radius: 5px;
}

.patientReply p {
  margin: 0;
}

.confirmationBadge {
  position: absolute;
  z-index: 3;
  right: 22px;
  bottom: 24px;
  display: grid;
  grid-template-columns: 34px 1fr;
  align-items: center;
  gap: 9px;
  border: 1px solid rgb(98 181 90 / 36%);
  border-radius: 15px;
  padding: 11px 14px;
  color: #101623;
  background: rgb(255 255 255 / 94%);
  box-shadow: 0 16px 38px rgb(16 22 35 / 20%);
  backdrop-filter: blur(14px);
}

.confirmationBadge > span {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #62b55a;
}

.confirmationBadge div {
  display: flex;
  flex-direction: column;
}

.confirmationBadge small {
  color: #697386;
  font-size: 0.68rem;
}

.confirmationBadge strong {
  margin-top: 1px;
  font-size: 0.86rem;
}

.productVisual {
  border: 1px solid rgb(16 22 35 / 9%);
  border-radius: 28px;
  padding: 26px;
  background: rgb(255 255 255 / 91%);
  box-shadow: 0 32px 80px rgb(16 22 35 / 12%), 0 2px 8px rgb(16 22 35 / 5%);
  transform: rotate(1.2deg);
}

.productVisual::after {
  content: '';
  position: absolute;
  z-index: -1;
  inset: 18px -18px -18px 18px;
  border-radius: 28px;
  background: #eaf6ee;
}

.visualHeader {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 22px;
  border-bottom: 1px solid #e2eae5;
}

.visualHeader p {
  margin: 0 0 3px;
  color: #738178;
  font-size: 0.83rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.visualHeader strong {
  color: #101623;
  font-size: 1.13rem;
}

.activeBadge {
  border-radius: 999px;
  padding: 7px 10px;
  color: #397f35;
  background: #eaf6ee;
  font-size: 0.78rem;
  font-weight: 700;
  white-space: nowrap;
}

.journey {
  padding: 24px 2px 17px;
}

.journeyStep {
  position: relative;
  display: grid;
  grid-template-columns: 42px 1fr;
  gap: 13px;
  min-height: 68px;
}

.stepIcon {
  position: relative;
  z-index: 1;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 1px solid #cddad2;
  border-radius: 12px;
  color: #6c7c72;
  background: #f4f7f5;
}

.stepIconDone {
  border-color: #9fc6ae;
  color: #fff;
  background: #62b55a;
}

.stepCopy {
  padding-top: 1px;
  display: flex;
  flex-direction: column;
}

.stepCopy strong {
  color: #101623;
  font-size: 0.96rem;
}

.stepCopy span {
  margin-top: 2px;
  color: #717784;
  font-size: 0.87rem;
}

.stepLine {
  position: absolute;
  top: 38px;
  left: 18px;
  width: 2px;
  height: 30px;
  background: #d9e4dd;
}

.nextAction {
  display: grid;
  grid-template-columns: 40px 1fr auto;
  align-items: center;
  gap: 12px;
  border: 1px solid #cfe8cd;
  border-radius: 17px;
  padding: 14px;
  color: #397f35;
  background: #f2faf3;
}

.nextActionIcon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 12px;
  color: #fff;
  background: #62b55a;
}

.nextAction div:nth-child(2) {
  display: flex;
  flex-direction: column;
}

.nextAction span {
  color: #717784;
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
}

.nextAction strong {
  margin-top: 2px;
  color: #253128;
  font-size: 0.91rem;
}

.valueStrip {
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto 38px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid rgb(16 22 35 / 10%);
  border-bottom: 1px solid rgb(16 22 35 / 10%);
}

.valueStrip div {
  min-height: 76px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: #344054;
  font-weight: 700;
}

.valueStrip div + div {
  border-left: 1px solid rgb(16 22 35 / 10%);
}

.definitionSection,
.lifecycleSection,
.automationSection,
.rolesSection,
.operationsSection,
.roiSection,
.patientSection,
.localSection,
.faqSection,
.footer {
  width: min(1180px, calc(100% - 48px));
  margin-inline: auto;
}

.definitionSection {
  padding: 116px 0 108px;
}

.sectionKicker,
.darkKicker {
  margin: 0 0 16px;
  color: #4b9b45;
  font-size: 0.88rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.definitionGrid {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 0.75fr);
  gap: clamp(48px, 9vw, 128px);
  align-items: start;
}

.definitionGrid h2,
.sectionHeading h2,
.agendaCopy h2,
.automationCopy h2,
.operationsHeader h2,
.patientCopy h2,
.localSection h2,
.faqIntro h2,
.finalCta h2 {
  margin: 0;
  color: #101623;
  font-size: clamp(2.35rem, 4.2vw, 4.2rem);
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 1.03;
}

.definitionGrid > div p {
  margin: 0;
  color: #5b6473;
  font-size: 1.06rem;
  line-height: 1.75;
}

.definitionGrid > div .definitionLead {
  margin-bottom: 20px;
  color: #1e293b;
  font-size: 1.28rem;
  font-weight: 600;
  line-height: 1.55;
}

.lifecycleSection {
  padding: 104px 0 116px;
  border-top: 1px solid #e5e7eb;
}

.sectionHeading {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.6fr);
  gap: 72px;
  align-items: end;
}

.sectionHeading > p {
  margin: 0 0 4px;
  color: #5b6473;
  font-size: 1.04rem;
  line-height: 1.65;
}

.lifecycleGrid {
  margin-top: 58px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.lifecycleCard {
  position: relative;
  min-height: 290px;
  padding: 26px;
  overflow: hidden;
  border: 1px solid #e2e7e3;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 12px 34px rgb(16 22 35 / 5%);
}

.cardNumber {
  position: absolute;
  top: 17px;
  right: 21px;
  color: #dce3dd;
  font-size: 2.6rem;
  font-weight: 700;
  letter-spacing: -0.06em;
}

.cardIcon,
.roleIcon,
.localBadge {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  color: #448f3f;
  background: #eaf6ee;
}

.lifecycleCard h3 {
  margin: 52px 0 11px;
  color: #101623;
  font-size: 1.32rem;
  line-height: 1.2;
}

.lifecycleCard p {
  margin: 0;
  color: #667085;
  line-height: 1.62;
}

.agendaSection {
  width: min(1280px, calc(100% - 32px));
  margin: 0 auto;
  padding: 96px max(48px, calc((100% - 1120px) / 2));
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(430px, 0.9fr);
  gap: clamp(58px, 8vw, 112px);
  align-items: center;
  border-radius: 34px;
  color: #fff;
  background: #101623;
  box-shadow: 0 30px 70px rgb(16 22 35 / 15%);
}

.darkKicker {
  color: #83cf7c;
}

.agendaCopy h2,
.finalCta h2 {
  color: #fff;
}

.agendaCopy > p:last-of-type {
  margin: 24px 0 0;
  color: #cbd2dc;
  font-size: 1.07rem;
  line-height: 1.7;
}

.checkList {
  margin: 30px 0 0;
  padding: 0;
  display: grid;
  gap: 13px;
  list-style: none;
}

.checkList li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: #eef2f6;
}

.checkList svg {
  flex: 0 0 auto;
  margin-top: 3px;
  color: #83cf7c;
}

.connectionMap {
  position: relative;
  padding: 28px;
  border-radius: 25px;
  color: #101623;
  background: #fff;
  box-shadow: 0 25px 55px rgb(0 0 0 / 26%);
}

.personNode {
  display: grid;
  grid-template-columns: 50px 1fr;
  column-gap: 13px;
  align-items: center;
  padding: 17px;
  border: 1px solid #dce7dc;
  border-radius: 17px;
  background: #f7fbf7;
}

.avatar {
  grid-row: 1 / 3;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #62b55a;
}

.personNode span,
.locationNode span,
.resultTime span {
  color: #7a8190;
  font-size: 0.8rem;
  font-weight: 600;
}

.personNode strong,
.locationNode strong {
  font-size: 0.98rem;
}

.connector {
  height: 50px;
  display: grid;
  grid-template-columns: 1fr 28px 1fr;
  align-items: center;
  gap: 7px;
  color: #62b55a;
}

.connector span {
  height: 1px;
  background: #b9dcb6;
}

.locationNodes {
  display: grid;
  gap: 9px;
}

.locationNode {
  display: grid;
  grid-template-columns: 26px 1fr auto;
  align-items: center;
  gap: 10px;
  padding: 13px 14px;
  border: 1px solid #e4e9e5;
  border-radius: 14px;
}

.locationNode > svg {
  color: #62b55a;
}

.locationNode div {
  display: flex;
  flex-direction: column;
}

.locationNode em {
  border-radius: 999px;
  padding: 6px 9px;
  color: #3d7f39;
  background: #eaf6ee;
  font-size: 0.75rem;
  font-style: normal;
  font-weight: 700;
}

.availabilityFlag {
  margin-top: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #3f7f3a;
  font-size: 0.88rem;
  font-weight: 700;
}

.automationSection {
  padding: 130px 0;
  display: grid;
  grid-template-columns: minmax(380px, 0.85fr) minmax(0, 0.9fr);
  align-items: center;
  gap: clamp(66px, 10vw, 138px);
}

.automationVisual {
  padding: 22px;
  border: 1px solid #e2e7e3;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 28px 70px rgb(16 22 35 / 11%);
}

.chatHeader {
  display: grid;
  grid-template-columns: 43px 1fr auto;
  align-items: center;
  gap: 11px;
  padding-bottom: 17px;
  border-bottom: 1px solid #ebeeec;
}

.chatAvatar {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  color: #fff;
  background: #62b55a;
}

.chatHeader div:nth-child(2) {
  display: flex;
  flex-direction: column;
}

.chatHeader strong {
  color: #101623;
}

.chatHeader span {
  color: #777f8d;
  font-size: 0.8rem;
}

.chatHeader .onlineDot {
  color: #3f8f3a;
  font-weight: 700;
}

.chatBubbleIncoming,
.chatBubbleOutgoing {
  width: 82%;
  margin-top: 22px;
  border-radius: 16px 16px 16px 4px;
  padding: 14px 16px;
  color: #344054;
  background: #f2f4f6;
  line-height: 1.5;
}

.agentThinking {
  margin: 16px 0 0 auto;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 7px;
  color: #4b9b45;
  font-size: 0.85rem;
  font-weight: 600;
}

.chatBubbleOutgoing {
  margin-left: auto;
  border-radius: 16px 16px 4px 16px;
  color: #22421f;
  background: #eaf6ee;
}

.handoffNotice {
  margin-top: 22px;
  display: grid;
  grid-template-columns: 24px 1fr;
  gap: 10px;
  padding: 15px;
  border: 1px solid #dbe4dc;
  border-radius: 15px;
  color: #62b55a;
}

.handoffNotice div {
  display: flex;
  flex-direction: column;
}

.handoffNotice strong {
  color: #344054;
  font-size: 0.9rem;
}

.handoffNotice span {
  margin-top: 2px;
  color: #7a8190;
  font-size: 0.8rem;
}

.automationCopy > p:not(.sectionKicker) {
  margin: 24px 0 0;
  color: #5f6876;
  font-size: 1.06rem;
  line-height: 1.7;
}

.automationList {
  margin-top: 32px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.automationList > div {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 9px;
  color: #62b55a;
}

.automationList span {
  display: flex;
  flex-direction: column;
  color: #667085;
  font-size: 0.9rem;
  line-height: 1.4;
}

.automationList strong {
  margin-bottom: 3px;
  color: #101623;
  font-size: 0.98rem;
}

.rolesSection {
  padding: 112px 0;
  border-top: 1px solid #e5e7eb;
}

.roleGrid {
  margin-top: 56px;
  display: grid;
  grid-template-columns: 1.12fr 1fr 1fr;
  gap: 18px;
}

.roleCard {
  min-height: 400px;
  padding: 30px;
  display: flex;
  flex-direction: column;
  border: 1px solid #e0e5e1;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 16px 45px rgb(16 22 35 / 5%);
}

.roleLabel {
  margin: 24px 0 8px !important;
  color: #4b9b45 !important;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.roleCard h3 {
  margin: 0;
  color: #101623;
  font-size: 1.65rem;
  letter-spacing: -0.025em;
  line-height: 1.12;
}

.roleCard > p:not(.roleLabel) {
  margin: 17px 0 28px;
  color: #667085;
  line-height: 1.62;
}

.roleCard a {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #448f3f;
  font-weight: 700;
  text-decoration: none;
}

.roleCardFeatured {
  color: #fff;
  border-color: #62b55a;
  background: #62b55a;
  box-shadow: 0 24px 55px rgb(98 181 90 / 24%);
}

.roleCardFeatured .roleIcon {
  color: #62b55a;
  background: #fff;
}

.roleCardFeatured .roleLabel,
.roleCardFeatured h3,
.roleCardFeatured > p:not(.roleLabel),
.roleCardFeatured a {
  color: #fff !important;
}

.roleCardFeatured > p:not(.roleLabel) {
  color: rgb(255 255 255 / 88%) !important;
}

.operationsSection {
  padding: 100px 48px;
  border-radius: 30px;
  background: #f0f8f1;
}

.operationsHeader {
  max-width: 800px;
}

.operationsGrid {
  margin-top: 56px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
}

.operationsGrid article {
  padding-top: 25px;
  border-top: 2px solid #cce6ca;
}

.operationsGrid svg {
  color: #62b55a;
}

.operationsGrid h3 {
  margin: 19px 0 9px;
  color: #101623;
  font-size: 1.18rem;
}

.operationsGrid p {
  margin: 0;
  color: #5e6877;
  line-height: 1.58;
}

.roiSection {
  padding: 128px 0;
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(430px, 0.78fr);
  align-items: center;
  gap: clamp(62px, 9vw, 126px);
}

.roiCopy h2 {
  margin: 0;
  color: #101623;
  font-size: clamp(2.35rem, 4.2vw, 4.2rem);
  font-weight: 700;
  letter-spacing: -0.045em;
  line-height: 1.03;
}

.roiCopy > p:not(.sectionKicker) {
  margin: 24px 0 0;
  color: #5f6876;
  font-size: 1.06rem;
  line-height: 1.7;
}

.metricList {
  margin-top: 34px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}

.metricList > div {
  display: grid;
  grid-template-columns: 28px 1fr;
  gap: 9px;
  color: #62b55a;
}

.metricList span {
  display: flex;
  flex-direction: column;
  color: #667085;
  font-size: 0.9rem;
  line-height: 1.42;
}

.metricList strong {
  margin-bottom: 3px;
  color: #101623;
  font-size: 0.98rem;
}

.roiCard {
  padding: 28px;
  border: 1px solid #dce6dc;
  border-radius: 26px;
  background: #fff;
  box-shadow: 0 28px 70px rgb(16 22 35 / 11%);
}

.roiCardHeader {
  display: grid;
  grid-template-columns: 46px 1fr auto;
  align-items: center;
  gap: 12px;
  padding-bottom: 22px;
  border-bottom: 1px solid #e7ebe8;
}

.roiIcon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #fff;
  background: #62b55a;
}

.roiCardHeader > div:nth-child(2) {
  display: flex;
  flex-direction: column;
}

.roiCardHeader span {
  color: #7a8190;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.roiCardHeader strong {
  margin-top: 2px;
  color: #101623;
  font-size: 1.12rem;
}

.roiCardHeader em {
  border-radius: 999px;
  padding: 6px 9px;
  color: #3f833a;
  background: #eaf6ee;
  font-size: 0.74rem;
  font-style: normal;
  font-weight: 700;
}

.roiFormula {
  margin-top: 22px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 9px;
  text-align: center;
}

.roiFormula span {
  min-height: 70px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  padding: 10px;
  color: #344054;
  background: #f4f6f4;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.3;
}

.roiFormula span:first-child {
  color: #32722f;
  background: #eaf6ee;
}

.roiFormula i {
  color: #98a0ad;
  font-size: 1.2rem;
  font-style: normal;
}

.roiFormula b {
  grid-column: 1 / -1;
  color: #4b5565;
  font-size: 0.8rem;
  font-weight: 700;
}

.roiSources {
  margin-top: 25px;
  display: grid;
  gap: 10px;
}

.roiSources p {
  margin: 0;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  color: #4f5968;
  font-size: 0.88rem;
}

.roiSources svg {
  flex: 0 0 auto;
  margin-top: 2px;
  color: #62b55a;
}

.roiDisclaimer {
  margin: 22px 0 0;
  border-top: 1px solid #e7ebe8;
  padding-top: 17px;
  color: #7a8190;
  font-size: 0.78rem;
  line-height: 1.5;
}

.patientSection {
  padding: 132px 0;
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(430px, 0.95fr);
  gap: clamp(58px, 9vw, 126px);
  align-items: center;
}

.patientCopy > p:not(.sectionKicker) {
  margin: 24px 0 0;
  color: #5f6876;
  font-size: 1.06rem;
  line-height: 1.7;
}

.patientValue {
  margin-top: 24px;
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 10px;
  border-left: 3px solid #62b55a;
  padding: 12px 0 12px 16px;
  color: #62b55a;
}

.patientValue span {
  display: flex;
  flex-direction: column;
  color: #667085;
  line-height: 1.45;
}

.patientValue strong {
  margin-bottom: 3px;
  color: #101623;
}

.inlineLink {
  margin-top: 28px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #448f3f;
  font-weight: 700;
  text-decoration: none;
}

.searchMockup {
  padding: 22px;
  border: 1px solid #e2e7e3;
  border-radius: 25px;
  background: #fff;
  box-shadow: 0 26px 65px rgb(16 22 35 / 10%);
}

.searchBar {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid #dce2dd;
  border-radius: 14px;
  padding: 0 15px;
  color: #777f8d;
}

.searchBar svg {
  color: #62b55a;
}

.searchFilters {
  margin: 13px 0 20px;
  display: flex;
  gap: 8px;
}

.searchFilters span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  border-radius: 999px;
  padding: 7px 10px;
  color: #5f6876;
  background: #f2f4f6;
  font-size: 0.78rem;
  font-weight: 600;
}

.professionalResult {
  display: grid;
  grid-template-columns: 52px 1fr auto;
  gap: 13px;
  align-items: center;
  border: 1px solid #dbe5dc;
  border-radius: 17px;
  padding: 17px;
  background: #fbfdfb;
}

.resultAvatar {
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #62b55a;
  font-weight: 700;
}

.resultInfo {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.resultInfo strong {
  color: #101623;
}

.resultInfo span,
.resultInfo small {
  margin-top: 3px;
  color: #717784;
  font-size: 0.78rem;
}

.resultInfo small {
  color: #448f3f;
  font-weight: 700;
}

.resultTime {
  display: flex;
  flex-direction: column;
  text-align: right;
}

.resultTime strong {
  margin-top: 3px;
  color: #3f863a;
  font-size: 0.9rem;
}

.localSection {
  padding: 56px;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) minmax(300px, 0.6fr);
  gap: 28px;
  align-items: center;
  border: 1px solid #dde6de;
  border-radius: 28px;
  background: #fff;
  box-shadow: 0 18px 50px rgb(16 22 35 / 5%);
}

.localSection h2 {
  font-size: clamp(2rem, 3.3vw, 3.2rem);
}

.localSection > p {
  margin: 0;
  color: #5f6876;
  line-height: 1.68;
}

.faqSection {
  padding: 132px 0 120px;
  display: grid;
  grid-template-columns: minmax(280px, 0.62fr) minmax(0, 0.95fr);
  gap: clamp(60px, 10vw, 140px);
  align-items: start;
}

.faqIntro {
  position: sticky;
  top: 118px;
}

.faqIntro > p:last-child {
  margin: 22px 0 0;
  color: #667085;
  font-size: 1.04rem;
}

.faqItem {
  border-top: 1px solid #dfe4e0;
}

.faqItem:last-child {
  border-bottom: 1px solid #dfe4e0;
}

.faqItem summary {
  min-height: 78px;
  display: grid;
  grid-template-columns: 1fr 30px;
  align-items: center;
  gap: 18px;
  color: #101623;
  font-size: 1.08rem;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
}

.faqItem summary::-webkit-details-marker {
  display: none;
}

.faqItem summary span {
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #438e3e;
  background: #eaf6ee;
  font-size: 1.25rem;
  font-weight: 400;
  transition: transform 160ms ease;
}

.faqItem[open] summary span {
  transform: rotate(45deg);
}

.faqItem p {
  margin: -3px 44px 26px 0;
  color: #667085;
  line-height: 1.68;
}

.finalCta {
  width: min(1280px, calc(100% - 32px));
  margin: 0 auto;
  padding: 82px max(48px, calc((100% - 1120px) / 2));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 64px;
  align-items: end;
  border-radius: 34px;
  background: #101623;
}

.finalCta > div:first-child {
  max-width: 780px;
}

.finalCta > div:first-child > p:last-child {
  margin: 22px 0 0;
  color: #cbd2dc;
  font-size: 1.05rem;
}

.finalActions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.lightButton,
.ghostButton {
  min-height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 14px;
  padding: 0 20px;
  font-weight: 700;
  text-decoration: none;
}

.lightButton {
  color: #254722;
  background: #83cf7c;
}

.ghostButton {
  border: 1px solid rgb(255 255 255 / 22%);
  color: #fff;
}

.footer {
  padding: 62px 0 28px;
}

.footerTop {
  display: grid;
  grid-template-columns: 170px minmax(240px, 1fr) auto;
  gap: 30px;
  align-items: center;
}

.footerTop img {
  width: 140px;
  height: auto;
}

.footerTop p {
  margin: 0;
  color: #667085;
}

.footerTop nav {
  display: flex;
  gap: 24px;
}

.footerTop a {
  color: #344054;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
}

.footerBottom {
  margin-top: 42px;
  padding-top: 20px;
  display: flex;
  justify-content: space-between;
  border-top: 1px solid #e2e7e3;
  color: #858b96;
  font-size: 0.83rem;
}

@media (max-width: 980px) {
  .nav { display: none; }
  .hero { grid-template-columns: 1fr; gap: 58px; padding-top: 68px; }
  .heroCopy { max-width: 760px; }
  .productVisual { width: min(100%, 620px); justify-self: center; }
  .heroMedia { width: min(100%, 720px); justify-self: center; }
  .definitionGrid, .sectionHeading, .automationSection, .roiSection, .patientSection, .faqSection {
    grid-template-columns: 1fr;
    gap: 44px;
  }
  .lifecycleGrid { grid-template-columns: 1fr 1fr; }
  .agendaSection { grid-template-columns: 1fr; padding-inline: 54px; }
  .connectionMap { width: min(100%, 620px); justify-self: center; }
  .roleGrid { grid-template-columns: 1fr 1fr; }
  .roleCardFeatured { grid-column: 1 / -1; min-height: 330px; }
  .operationsGrid { grid-template-columns: 1fr 1fr; }
  .localSection { grid-template-columns: 58px 1fr; }
  .localSection > p { grid-column: 2; }
  .faqIntro { position: static; }
  .finalCta { grid-template-columns: 1fr; align-items: start; }
  .finalActions { flex-direction: row; flex-wrap: wrap; }
  .footerTop { grid-template-columns: 150px 1fr; }
  .footerTop nav { grid-column: 1 / -1; }
}

@media (max-width: 640px) {
  .page { padding-bottom: 74px; }
  .header { position: sticky; top: 0; }
  .headerInner, .hero, .valueStrip { width: min(100% - 32px, 1180px); }
  .headerInner { min-height: 66px; gap: 10px; }
  .brand { width: 112px; height: 54px; }
  .loginButton { min-height: 42px; padding: 0 14px; }
  .loginButton svg { display: none; }
  .patientHeaderLink { display: none; }
  .authActions { gap: 8px; }
  .signInLink { font-size: .84rem; }
  .mobileBar {
    position: fixed;
    z-index: 50;
    right: 10px;
    bottom: max(10px, env(safe-area-inset-bottom));
    left: 10px;
    min-height: 58px;
    display: grid;
    grid-template-columns: 1.35fr 0.9fr;
    gap: 7px;
    border: 1px solid rgb(16 22 35 / 10%);
    border-radius: 18px;
    padding: 6px;
    background: rgb(255 255 255 / 94%);
    box-shadow: 0 16px 45px rgb(16 22 35 / 22%);
    backdrop-filter: blur(16px);
  }
  .mobileBar a {
    min-width: 0;
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border-radius: 12px;
    color: #3e8039;
    background: #edf8ee;
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
  }
  .mobileBar a:last-child { color: #fff; background: #62b55a; }
  .hero { gap: 42px; padding: 38px 0 42px; }
  .hero::before {
    width: 330px;
    height: 350px;
    top: -8px;
    right: -112px;
    background-size: 620px 413px;
    opacity: 0.075;
  }
  .eyebrow { margin-bottom: 16px; padding: 7px 10px; font-size: 0.78rem; }
  .hero h1 { font-size: clamp(2.38rem, 11.7vw, 3.25rem); letter-spacing: -0.046em; line-height: 1; }
  .heroLead { margin-top: 20px; font-size: 1.01rem; line-height: 1.52; }
  .heroActions { margin-top: 26px; flex-direction: column; gap: 9px; }
  .primaryButton, .secondaryButton { width: 100%; min-height: 52px; }
  .locationNote { margin-top: 17px; font-size: 0.84rem; }
  .productVisual { padding: 20px; border-radius: 22px; transform: none; }
  .productVisual::after { inset: 12px -10px -12px 10px; border-radius: 22px; }
  .heroMedia { min-height: 500px; border-radius: 22px; }
  .heroPhoto { object-position: 40% center; }
  .photoShade {
    background:
      linear-gradient(0deg, rgb(16 22 35 / 30%) 0%, transparent 47%),
      linear-gradient(90deg, transparent 0%, rgb(16 22 35 / 10%) 100%);
  }
  .messageStack { top: 14px; right: 12px; width: calc(100% - 24px); }
  .messageCard { padding: 10px 12px; }
  .messageCard p { font-size: 0.79rem; line-height: 1.36; }
  .patientMessage { width: 76%; }
  .sonrieMessage { width: 87%; }
  .messageBrand img { width: 27px; height: 27px; }
  .slotChip { margin-top: 7px; padding: 5px 8px; font-size: 0.7rem; }
  .confirmationBadge { right: 12px; bottom: 14px; max-width: calc(100% - 24px); }
  .visualHeader { align-items: center; }
  .activeBadge { white-space: normal; text-align: center; }
  .valueStrip {
    width: calc(100% - 16px);
    margin-bottom: 14px;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    border: 0;
    padding: 0 8px 8px;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }
  .valueStrip::-webkit-scrollbar { display: none; }
  .valueStrip div {
    min-width: 205px;
    min-height: 58px;
    justify-content: flex-start;
    border: 1px solid rgb(16 22 35 / 9%);
    border-radius: 14px;
    padding-inline: 15px;
    background: rgb(255 255 255 / 78%);
    scroll-snap-align: start;
  }
  .valueStrip div + div { border: 1px solid rgb(16 22 35 / 9%); }
  .definitionSection, .lifecycleSection, .automationSection, .rolesSection, .operationsSection, .roiSection,
  .patientSection, .localSection, .faqSection, .footer {
    width: min(100% - 28px, 1180px);
  }
  .definitionSection { padding: 68px 0 62px; }
  .definitionGrid { gap: 28px; }
  .definitionGrid h2, .sectionHeading h2, .agendaCopy h2, .automationCopy h2,
  .operationsHeader h2, .roiCopy h2, .patientCopy h2, .faqIntro h2, .finalCta h2 {
    font-size: clamp(2.05rem, 9.8vw, 2.75rem);
    line-height: 1.04;
  }
  .definitionGrid > div .definitionLead { font-size: 1.12rem; }
  .definitionGrid > div p { font-size: 1rem; line-height: 1.62; }
  .lifecycleSection, .rolesSection { padding: 66px 0; }
  .sectionHeading { gap: 25px; }
  .lifecycleGrid, .roleGrid, .operationsGrid { grid-template-columns: 1fr; }
  .lifecycleGrid, .roleGrid { margin-top: 36px; }
  .lifecycleCard { min-height: 220px; padding: 22px; }
  .lifecycleCard h3 { margin-top: 40px; }
  .agendaSection, .finalCta {
    width: min(100% - 16px, 1280px);
    padding: 56px 20px;
    border-radius: 22px;
  }
  .connectionMap { padding: 18px; }
  .locationNode { grid-template-columns: 24px 1fr; }
  .locationNode em { grid-column: 2; width: fit-content; }
  .automationSection, .roiSection, .patientSection, .faqSection { padding: 70px 0; }
  .automationCopy { order: -1; }
  .metricList { grid-template-columns: 1fr; }
  .roiCard { padding: 20px; }
  .roiFormula { grid-template-columns: 1fr; }
  .roiFormula i { line-height: 0.6; }
  .roiFormula b { grid-column: auto; }
  .automationVisual, .searchMockup { padding: 16px; }
  .automationList { grid-template-columns: 1fr; }
  .chatBubbleIncoming, .chatBubbleOutgoing { width: 92%; }
  .roleCardFeatured { grid-column: auto; }
  .roleCard { min-height: 310px; padding: 24px; }
  .operationsSection { padding: 58px 20px; border-radius: 22px; }
  .operationsGrid { gap: 30px; }
  .professionalResult { grid-template-columns: 48px 1fr; }
  .resultTime { grid-column: 2; text-align: left; }
  .localSection { padding: 30px 20px; grid-template-columns: 46px 1fr; }
  .localSection > p { grid-column: 1 / -1; }
  .finalActions { flex-direction: column; width: 100%; }
  .faqItem summary { min-height: 70px; font-size: 1rem; }
  .faqItem p { margin-right: 8px; }
  .footer { padding-top: 48px; padding-bottom: 34px; }
  .footerTop { grid-template-columns: 1fr; }
  .footerTop nav { grid-column: auto; flex-direction: column; gap: 12px; }
  .footerBottom { flex-direction: column; gap: 7px; }
}

.refined { background: #fcfdfb; color: #33463e; }
.refined :is(a, summary):focus-visible { outline: 3px solid #315d46; outline-offset: 5px; }
.refined section[id] { scroll-margin-top: 90px; }
.skipLink { position: absolute; left: 16px; top: -100px; z-index: 100; background: white; padding: 12px; }
.skipLink:focus { top: 12px; }
.refined .header { background: #fcfdfbf2; }
.refined .headerInner { gap: 22px; min-height: 80px; }
.refined .brand { width: 138px; }
.refined .nav { gap: 24px; }
.refined .nav a { font-size: .9rem; }
.refined .loginButton, .refined .primaryButton { background: #62b55a; color: #173b22; box-shadow: none; border-radius: 8px; }
.refined .primaryButton:hover, .refined .loginButton:hover { background: #77c26f; }
.refined .hero { padding: 64px 0 52px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 60px; }
.refined .hero h1 { font-size: clamp(2.9rem, 4.7vw, 4.25rem); line-height: 1.06; letter-spacing: -.045em; color: #354c44; font-weight: 600; }
.refined .hero h1 span { color: #50884b; }
.refined .hero::before { opacity: .055; }
.refined .eyebrow { padding: 0; border: 0; background: none; border-radius: 0; color: #546e60; font-size: .88rem; font-weight: 600; margin-bottom: 24px; }
.refined .heroLead { font-size: 1.12rem; line-height: 1.6; max-width: 465px; margin-top: 24px; }
.refined .heroActions { align-items: center; gap: 24px; margin-top: 30px; }
.textAction { display: inline-flex; align-items: center; gap: 4px; color: #435a4e; text-decoration: none; font-weight: 600; min-height: 44px; }
.refined .locationNote { font-size: .875rem; margin-top: 14px; }
.patientEntry { display: inline-flex; align-items: center; gap: 8px; margin-top: 28px; color: #435a4e; font-size: .9rem; text-underline-offset: 5px; }
.refined .heroMedia { min-height: 535px; border-radius: 100px 12px 12px 12px; border: 0; box-shadow: none; }
.refined .heroPhoto { object-position: 36% center; }
.photoCaption { position: absolute; top: 22px; right: 20px; background: #fffffff0; border-radius: 4px; padding: 7px 11px; font-size: .8rem; color: #435a4e; }
.requestPreview { position: absolute; right: 18px; bottom: 20px; left: 18px; padding: 20px; background: #fffffff5; border: 1px solid #fff; border-radius: 12px; box-shadow: 0 10px 30px #16301f12; }
.previewHeading { display: flex; align-items: center; gap: 8px; color: #3c5c49; }
.previewHeading > span { margin-left: auto; font-size: .75rem; color: #667369; }
.requestPreview > p { margin: 14px 0 5px; font-size: .9rem; }
.requestTime { display: flex; justify-content: space-between; align-items: baseline; }
.requestTime strong { font-size: 1.5rem; font-weight: 600; }
.requestTime > span { font-size: 1.5rem; color: #446644; }
.requestStatus { display: flex; align-items: center; gap: 7px; margin-top: 14px; font-size: .875rem; color: #765a2c; }
.requestStatus > span { width: 6px; height: 6px; border-radius: 100%; background: #ab8240; }
.requestPreview small { display: block; margin-top: 8px; color: #6a756e; font-size: .75rem; }
.refined .valueStrip { margin-bottom: 0; }
.refined .valueStrip div { color: #526256; font-size: .94rem; min-height: 65px; font-weight: 600; }
.refined .valueStrip svg { color: #50884b; }
.searchIntentSection { width: min(1180px, calc(100% - 48px)); margin: 0 auto; padding: 76px 0 28px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 18px 70px; border-bottom: 1px solid #dce3d8; }
.searchIntentSection > .sectionKicker { grid-column: 1 / -1; margin: 0; }
.searchIntentSection h2 { margin: 0; color: #354c44; font-size: clamp(2rem, 3.2vw, 3rem); line-height: 1.12; letter-spacing: -.035em; font-weight: 600; }
.searchIntentSection > p:not(.sectionKicker) { margin: 0; color: #5c6d62; line-height: 1.65; }
.searchIntentSection ul { grid-column: 2; margin: 6px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.searchIntentSection li { position: relative; padding-left: 22px; color: #435a4e; }
.searchIntentSection li::before { content: ''; position: absolute; left: 0; top: .55em; width: 7px; height: 7px; border-radius: 50%; background: #62b55a; }
.refined .definitionSection { padding: 88px 0; }
.refined .definitionGrid { grid-template-columns: 1.05fr .95fr; gap: 72px; }
.refined :is(.definitionGrid h2, .faqIntro h2) { color: #354c44; font-weight: 600; font-size: clamp(2rem, 3.2vw, 3rem); line-height: 1.12; }
.refined .sectionKicker { color: #526e59; font-size: .8rem; letter-spacing: .08em; }
.editorialSteps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 38px; margin-top: 54px; }
.editorialSteps article { border-top: 1px solid #ccd9cd; padding-top: 22px; }
.stepIndex { color: #72916f; font-size: .9rem; }
.editorialSteps h3 { font-size: 1.3rem; font-weight: 600; margin: 15px 0 10px; }
.editorialSteps p { color: #637067; line-height: 1.6; margin: 0; }
.productSection, .measureSection, .patientBand, .closingSection { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.productSection { display: grid; grid-template-columns: .8fr 1.2fr; gap: 76px; align-items: center; padding: 65px 0 100px; }
.productCopy h2, .futureIntro h2, .measureSection h2, .patientBand h2 { font-size: clamp(2rem, 3.3vw, 3.2rem); font-weight: 600; line-height: 1.12; letter-spacing: -.035em; margin: 0; }
.productCopy > p:not(:first-child), .measureSection p, .patientBand p { line-height: 1.65; color: #5c6d62; }
.schedulePreview { border: 1px solid #d5dfd3; border-radius: 12px; background: white; padding: 28px; box-shadow: 18px 20px 0 #eaf1e6; }
.scheduleTop { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; padding-bottom: 22px; }
.scheduleTop div > span { font-size: .75rem; letter-spacing: .09em; color: #62725e; }
.scheduleTop h3 { font-size: 1.4rem; font-weight: 600; margin: 5px 0 0; }
.exampleLabel { color: #6e786b; font-size: .75rem; white-space: nowrap; }
.scheduleRow { display: flex; align-items: center; gap: 18px; border-top: 1px solid #e5eae2; padding: 22px 0; }
.scheduleRow time { font-size: .9rem; color: #657563; }
.scheduleRow > div { flex: 1; border-left: 3px solid #8bbb81; padding-left: 13px; }
.scheduleRow strong, .scheduleRow span { display: block; }
.scheduleRow strong { font-weight: 600; }
.scheduleRow span { font-size: .875rem; color: #6b7667; margin-top: 4px; }
.availableRow > div { border-color: #ccd6c7; }
.scheduleFoot { display: flex; align-items: center; gap: 8px; font-size: .875rem; border-top: 1px solid #e5eae2; padding-top: 16px; color: #60725b; }
.futureSection { width: min(1280px, calc(100% - 32px)); margin: 0 auto; display: grid; grid-template-columns: 1.2fr .8fr; gap: 80px; background: #e7eee3; border-radius: 12px; padding: 70px 50px; }
.futureLabel { font-size: .75rem; letter-spacing: .1em; color: #576d51; margin: 0 0 22px; }
.futureIntro > p:not(:first-child) { color: #53634c; line-height: 1.65; max-width: 510px; }
.demoPending { display: grid; gap: 6px; margin-top: 26px; border-left: 2px solid #739065; padding-left: 16px; }
.demoPending span { font-size: .875rem; color: #5c6e54; }
.futureDetails { align-self: center; }
.futureDetails > span { font-size: .75rem; letter-spacing: .08em; }
.futureDetails > p { border-bottom: 1px solid #c6d4c1; padding: 20px 0; margin: 0; }
.futureDetails b { font-size: .8rem; margin-right: 16px; color: #71876a; font-weight: 400; }
.futureDetails > div { display: flex; gap: 12px; margin-top: 24px; }
.futureDetails small { font-size: .875rem; line-height: 1.5; color: #64735c; }
.futureDetails svg { flex-shrink: 0; }
.measureSection { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; padding: 84px 0; align-items: center; }
.roadmapNote { font-size: .875rem; border-top: 1px solid #dce3d8; padding-top: 18px; }
.patientBand { border-block: 1px solid #dce3d8; padding: 44px 0; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.patientBand h2 { font-size: 2rem; }
.patientBand .secondaryButton { flex-shrink: 0; border-radius: 8px; }
.refined .faqSection { padding: 80px 0; gap: 80px; }
.refined .faqItem summary { font-size: 1rem; }
.refined .faqIntro { top: 100px; }
.closingSection { padding: 35px 0; display: flex; align-items: center; justify-content: space-between; gap: 24px; border-block: 1px solid #dce3d8; }
.closingSection > p { font-size: 1.65rem; max-width: 590px; line-height: 1.3; }
.refined .footer { padding-top: 40px; }
.refined .mobileBar a:last-child { color: #173b22; }
@media (max-width: 980px) {
  .refined .hero { gap: 30px; }
  .refined .hero h1 { font-size: 3rem; }
  .refined .heroActions { gap: 12px; }
  .refined .definitionGrid, .productSection { gap: 32px; }
  .futureSection { gap: 32px; padding: 45px 30px; }
  .measureSection { gap: 35px; }
  .schedulePreview { padding: 20px; }
}
@media (max-width: 640px) {
  .refined .hero { grid-template-columns: 1fr; padding-top: 30px; gap: 26px; padding-bottom: 30px; }
  .refined .headerInner { min-height: 66px; }
  .refined .brand { width: 112px; }
  .refined .loginButton { font-size: .875rem; padding-inline: 12px; }
  .refined .hero h1 { font-size: clamp(2.25rem, 9vw, 2.7rem); line-height: 1.09; letter-spacing: -.04em; }
  .refined .eyebrow { margin-bottom: 15px; font-size: .8rem; }
  .refined .heroLead { font-size: 1rem; margin-top: 18px; line-height: 1.55; }
  .refined .heroActions { flex-direction: row; margin-top: 20px; }
  .refined .heroActions .textAction { margin: 0 auto; font-size: .9rem; }
  .refined .locationNote { font-size: .8rem; text-align: center; margin-top: 6px; }
  .patientEntry { font-size: .875rem; margin-top: 18px; min-height: 44px; }
  .refined .heroMedia { min-height: 440px; border-radius: 64px 10px 10px 10px; }
  .photoCaption { font-size: .75rem; right: 12px; top: 14px; }
  .requestPreview { padding: 16px; left: 12px; right: 12px; bottom: 12px; }
  .refined .valueStrip { width: calc(100% - 32px); display: grid; grid-template-columns: 1fr; gap: 0; padding: 10px 0; border-block: 1px solid #dce3d8; overflow: visible; }
  .refined .valueStrip div { min-height: 38px; border: 0; padding: 0; background: none; font-size: .9rem; }
  .searchIntentSection { width: calc(100% - 32px); grid-template-columns: 1fr; gap: 16px; padding: 48px 0 20px; }
  .searchIntentSection > .sectionKicker, .searchIntentSection ul { grid-column: auto; }
  .searchIntentSection h2 { font-size: 2rem; }
  .refined .definitionSection { padding: 48px 0; }
  .refined .definitionGrid { grid-template-columns: 1fr; gap: 22px; }
  .refined .definitionGrid h2, .refined .faqIntro h2 { font-size: 2rem; }
  .editorialSteps { grid-template-columns: 1fr; gap: 22px; margin-top: 30px; }
  .editorialSteps article { padding-top: 16px; display: grid; grid-template-columns: 28px 1fr; gap: 0 10px; }
  .stepIndex { padding-top: 4px; }
  .editorialSteps h3 { margin: 0 0 8px; font-size: 1.2rem; }
  .editorialSteps p { grid-column: 2; }
  .productSection, .measureSection, .patientBand, .closingSection { width: calc(100% - 32px); }
  .productSection { grid-template-columns: 1fr; padding: 20px 0 55px; gap: 28px; }
  .productCopy h2, .futureIntro h2, .measureSection h2, .patientBand h2 { font-size: 2rem; }
  .schedulePreview { padding: 18px; box-shadow: 6px 8px 0 #eaf1e6; }
  .scheduleTop { gap: 8px; flex-wrap: wrap; }
  .scheduleRow { gap: 12px; padding: 18px 0; }
  .scheduleRow > svg { display: none; }
  .scheduleRow span { font-size: .875rem; }
  .futureSection { width: calc(100% - 16px); grid-template-columns: 1fr; padding: 38px 20px; gap: 32px; }
  .futureIntro h2 br { display: none; }
  .futureDetails > p { padding: 15px 0; }
  .measureSection { grid-template-columns: 1fr; padding: 48px 0; gap: 16px; }
  .patientBand { flex-direction: column; align-items: flex-start; gap: 16px; padding: 32px 0; }
  .refined .faqSection { padding: 48px 0; gap: 25px; }
  .closingSection { flex-direction: column; align-items: stretch; gap: 8px; padding: 26px 0; }
  .closingSection > p { font-size: 1.5rem; margin: 0 0 15px; }
  .refined .mobileBar { grid-template-columns: 1fr 1.2fr; border-radius: 12px; box-shadow: 0 4px 18px #233c2118; }
  .refined .mobileBar a { border-radius: 7px; font-size: .875rem; }
}

.refined .conversationHero { min-height: 0; overflow: hidden; border-radius: 64px 12px 12px 12px; background: #f1f5ee; border: 1px solid #dfe7db; }
.carePhoto { position: relative; height: 640px; overflow: hidden; }
.refined .carePhoto .heroPhoto { object-position: 34% center; }
.agentConversation { position: absolute; bottom: 18px; right: 14px; width: 49%; padding: 0; display: grid; gap: 7px; }
.agentConversation .conversationHeading { background: #fffffff2; padding: 9px 10px; border-radius: 10px; flex-wrap: wrap; gap: 5px; }
.agentConversation .conversationHeading > span { width: 100%; margin-left: 23px; }
.agentConversation .incomingPreview { background: #ffffffdc; }
.agentConversation .outgoingPreview { background: #e7efdfdf; }
.agentConversation .incomingPreview, .agentConversation .outgoingPreview { box-shadow: 0 3px 10px #17332209; backdrop-filter: blur(4px); }
.agentConversation .conversationReminder { background: #fffffff2; border: 0; border-radius: 8px; padding: 10px; }
.conversationHeading { display: flex; gap: 8px; align-items: center; color: #3d5947; margin-bottom: 5px; }
.conversationHeading strong { font-size: .9rem; font-weight: 600; }
.conversationHeading > span { margin-left: auto; font-size: .75rem; color: #5f705e; }
.incomingPreview, .outgoingPreview { padding: 10px 13px; border-radius: 10px; max-width: 88%; }
.incomingPreview { justify-self: start; background: #fff; border: 1px solid #e0e6db; border-bottom-left-radius: 2px; }
.outgoingPreview { justify-self: end; background: #e0eed9; border: 1px solid #cddfc4; border-bottom-right-radius: 2px; }
.agentConversation small { font-size: .75rem; color: #537147; display: flex; align-items: flex-start; gap: 5px; margin-bottom: 3px; font-weight: 600; }
.agentConversation small img { flex-shrink: 0; margin-top: 2px; }
.agentConversation p { font-size: .9rem; line-height: 1.4; margin: 0; color: #35483b; }
.conversationReminder { display: flex; align-items: center; justify-content: center; gap: 7px; border-top: 1px solid #d5e1cf; padding-top: 12px; margin-top: 3px; color: #526d47; font-size: .8rem; }
.conversationReminder svg { flex-shrink: 0; }
@media (max-width: 640px) {
  .refined .conversationHero { min-height: 0; border-radius: 44px 10px 10px 10px; }
  .carePhoto { height: 600px; aspect-ratio: auto; }
  .refined .carePhoto .heroPhoto { object-position: 44% center; }
  .agentConversation { bottom: 12px; right: 10px; width: 54%; padding: 0; gap: 6px; }
  .agentConversation p { font-size: .875rem; }
  .agentConversation .conversationHeading strong { font-size: .8rem; }
  .incomingPreview, .outgoingPreview { max-width: 100%; padding: 7px 9px; }
  .conversationReminder { align-items: flex-start; justify-content: flex-start; line-height: 1.4; }
}

@media (prefers-reduced-motion: reduce) {
  .loginButton, .primaryButton, .secondaryButton { transition: none; }
}