/* R8: one continuous mobile composition, measured against the selected reference. */
@media(max-width:760px){
 body[data-page="home"] .hero{
  --mobile-scene-height:min(141.2vw,calc(100svh - 138px));
  background:#dff5fd;
 }
 body[data-page="home"] .hero::before,
 body[data-page="home"] .hero::after{display:none}
 body[data-page="home"] .hero .hero-inner{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:var(--mobile-scene-height) auto;
  align-items:stretch;
  padding:0;
 }
 body[data-page="home"] .hero .hero-copy{
  grid-area:1/1;
  align-self:start;
  width:89.6%;
  margin:calc(var(--sticky-header-height,78px) + 2vw) auto 0;
  z-index:3;
 }
 body[data-page="home"] .hero h1{
  font-size:clamp(36px,11.5vw,56px);
  line-height:1.04;
  letter-spacing:-.055em;
  margin-bottom:4px;
 }
 body[data-page="home"] .hero h1 small{margin-bottom:3px}
 body[data-page="home"] .hero .hero-specialty{
  font-size:clamp(16px,4.4vw,22px);
  line-height:1.25;
 }
 body[data-page="home"] .hero .hero-specialty::after{margin-block:8px;width:9.25vw;max-width:44px}
 body[data-page="home"] .hero .hero-location{margin-bottom:0}
 body[data-page="home"] .hero .hero-visual{
  grid-area:1/1;
  position:relative;
  align-self:stretch;
  width:100%;
  height:auto;
  min-height:0;
  overflow:hidden;
  background:#ddf4fe;
 }
 body[data-page="home"] .hero .hero-visual::before{
  content:"";
  display:block;
  position:absolute;
  inset:15vw 0 auto;
  width:100%;
  height:91%;
  z-index:0;
  background:url('/assets/hero-r8/clinical-atlas-backdrop-r8-1055.webp') center top / 100% 100% no-repeat;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 8vw);
  mask-image:linear-gradient(to bottom,transparent,#000 8vw);
  opacity:1;
  transform:none;
  filter:none;
  pointer-events:none;
 }
 body[data-page="home"] .hero .hero-visual::after{display:none}
 body[data-page="home"] .hero .hero-visual .portrait-orbit{
  inset:max(calc(var(--mobile-scene-height) - 79.22vw),calc(var(--sticky-header-height,78px) + 42vw)) auto auto 4.5vw;
  width:80vw;
  height:auto;
  aspect-ratio:983/998;
  z-index:2;
 }
 body[data-page="home"] .hero .hero-visual .portrait-orbit img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center bottom;
 }
 body[data-page="home"] .hero .anatomy-motion{display:none}
 body[data-page="home"] .hero-mobile-actions{
  grid-area:2/1;
  padding-block:10px;
  gap:8px;
  background:linear-gradient(105deg,#fbfdfd,#f0f9fe);
 }
 body[data-page="home"] .hero-mobile-actions > .button{font-size:clamp(12px,3.8vw,16px)}
}
@media(max-width:350px){
 body[data-page="home"] .hero{--mobile-scene-height:min(141.2vw,calc(100svh - 120px))}
 body[data-page="home"] .hero-mobile-actions{padding-block:7px}
 body[data-page="home"] .hero .hero-copy{margin-top:calc(var(--sticky-header-height,78px) + 1vw)}
 body[data-page="home"] .hero h1{font-size:11.5vw}
 body[data-page="home"] .hero .hero-specialty{font-size:4.4vw}
 body[data-page="home"] .hero .hero-location{font-size:3.35vw}
}
@media(min-width:540px) and (max-width:760px){
 body[data-page="home"] .hero{--mobile-scene-height:min(120vw,calc(100svh - 138px))}
 body[data-page="home"] .hero .hero-visual .portrait-orbit{width:70%;left:4.5%}
}
@media(max-width:760px) and (max-height:620px){
 body[data-page="home"] .hero .hero-copy{margin-top:calc(var(--sticky-header-height,78px) + 1vw)}
 body[data-page="home"] .hero h1{margin-bottom:4px}
}
