/* Match the reception and clinician illustrations to the room-seeker hero scale. */
html body main.page > :is(#intro,#top.ralph-landing-reception) .ralph-reception-slot,
html body main.page > .ralph-illustration-scene--clinician .ralph-clinician-slot {
  box-sizing:border-box;
  width:min(1360px,calc(100vw - 28px),calc((100dvh - var(--ralph-nav-height) - 62px)*1.8))!important;
  max-width:1360px!important;
  margin-inline:auto!important;
  aspect-ratio:9/5;
}
/* The heading shares the illustration's horizontal centre, with no layout shift.
   Animate both lines together only once the patient is comfortably seated. */
html body main.page > #room-manager.product-screenshot.surface .product-screenshot-heading {
  position:absolute!important;
  z-index:5!important;
  top:clamp(28px,5vh,61px)!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  box-sizing:border-box!important;
  width:min(1110px,calc(100% - 36px))!important;
  max-width:1110px!important;
  margin:0!important;
  padding:0!important;
  text-align:center!important;
  pointer-events:none;
}
html body main.page > #room-manager.product-screenshot.surface .product-screenshot-heading h2,
html body main.page > #room-manager.product-screenshot.surface .product-screenshot-heading h2 em {
  display:block!important;
  width:100%!important;
  font-size:clamp(56px,6.5vw,94px)!important;
  font-weight:720!important;
  line-height:1.08!important;
  letter-spacing:-.035em!important;
  word-spacing:normal!important;
  text-align:center!important;
  margin:0!important;
  color:#225da6!important;
  -webkit-text-fill-color:#225da6!important;
  background:none!important;
  text-shadow:none!important;
}
html body main.page > #room-manager.product-screenshot.surface .product-screenshot-heading p {
  width:100%!important;
  margin:clamp(18px,2.8vh,28px) 0 0!important;
  color:#405d7d!important;
  -webkit-text-fill-color:#405d7d!important;
  font-size:clamp(18px,1.8vw,25px)!important;
  line-height:1.38!important;
  text-align:center!important;
}
html body main.page > #room-manager.product-screenshot.surface .product-screenshot-heading :is(h2,p) {
  opacity:0;
  visibility:hidden;
  transform:translateY(9px);
}
html body main.page > #room-manager.ralph-room-motion-loaded.product-screenshot.surface .product-screenshot-heading :is(h2,p) {
  animation:ralph-room-heading-arrival 22s linear infinite both;
}
@keyframes ralph-room-heading-arrival {
  /* Patient sits around 73.2%; hold her happy ending for ~1 second. */
  0%,77.5% {opacity:0;visibility:hidden;transform:translateY(9px)}
  77.6% {opacity:0;visibility:visible;transform:translateY(9px);animation-timing-function:ease-out}
  82.2%,94.7% {opacity:1;visibility:visible;transform:none;animation-timing-function:ease-in-out}
  98.7% {opacity:0;visibility:visible;transform:translateY(-4px)}
  99%,100% {opacity:0;visibility:hidden;transform:translateY(-4px)}
}
html body main.page > #room-manager.ralph-room-story-paused.product-screenshot.surface .product-screenshot-heading :is(h2,p) {
  animation:none!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
}
@media(max-width:750px) {
  html body main.page > :is(#intro,#top.ralph-landing-reception) .ralph-reception-slot,
  html body main.page > .ralph-illustration-scene--clinician .ralph-clinician-slot {
    width:min(100%,600px)!important;
    max-width:600px!important;
  }
  html body main.page > #room-manager.product-screenshot.surface .product-screenshot-heading {
    top:clamp(24px,4vh,38px)!important;
    width:calc(100% - 20px)!important;
  }
  html body main.page > #room-manager.product-screenshot.surface .product-screenshot-heading h2,
  html body main.page > #room-manager.product-screenshot.surface .product-screenshot-heading h2 em {
    font-size:clamp(39px,9vw,58px)!important;
  }
  html body main.page > #room-manager.product-screenshot.surface .product-screenshot-heading p {
    font-size:clamp(15px,3.7vw,18px)!important;
    margin-top:clamp(14px,2vh,20px)!important;
  }
}
@media(prefers-reduced-motion:reduce){
  html body main.page > #room-manager.product-screenshot.surface .product-screenshot-heading :is(h2,p) {
    opacity:1!important;visibility:visible!important;animation:none!important;transform:none!important;
  }
}