/* Keep the opening message usable on landscape phones and short laptop windows. */
@media(max-height:600px) and (min-width:600px){
  .motion-ready .hero-copy{padding-top:92px;padding-bottom:0;max-width:560px;width:72%;position:relative;z-index:6}
  .motion-ready .hero h1{font-size:clamp(40px,9.5vh,56px);line-height:1.05;letter-spacing:-1px}
  .motion-ready .hero-copy p{font-size:16px;line-height:1.4;max-width:360px;margin:18px auto}
  .motion-ready .hero-copy .actions{gap:12px}
  .motion-ready .hero-copy .button{font-size:14px;padding:11px 18px;min-height:40px}
  .real-artifact{width:clamp(110px,32vh,175px)}
  .real-artifact[data-card=church]{left:-24px;right:auto;top:104px;bottom:auto}
  .real-artifact[data-card=group]{right:-24px;left:auto;top:104px;bottom:auto}
  .real-artifact[data-card=team]{left:5%;right:auto;top:auto;bottom:12px}
  .real-artifact[data-card=gt]{right:5%;left:auto;top:auto;bottom:12px}
  .motion-ready .dashboard-shell{--frame-width:min(90vw,calc((100svh - 110px)*1.43939));width:var(--frame-width);margin-left:calc(var(--frame-width)/-2);left:50%;top:76px}
  .real-demo-caption{bottom:12px;font-size:11px;gap:18px;flex-direction:row}
}
@media(max-height:400px) and (min-width:600px){
  .motion-ready .hero-copy{padding-top:80px}
  .motion-ready .hero h1{font-size:40px}
  .motion-ready .hero-copy p{margin:12px auto;font-size:15px}
}
@media(max-height:680px) and (max-width:599px){
  .motion-ready .hero-copy{padding-top:84px;padding-left:20px;padding-right:20px;position:relative;z-index:6}
  .motion-ready .hero h1{font-size:clamp(34px,10vw,42px);line-height:1.08;letter-spacing:-.7px}
  .motion-ready .hero-copy p{font-size:14px;line-height:1.4;margin:16px auto;max-width:280px}
  .motion-ready .hero-copy .actions{gap:10px;flex-wrap:nowrap}
  .motion-ready .hero-copy .button{font-size:12px;padding:11px 14px;min-height:39px;white-space:nowrap}
  .real-artifact{width:38vw}
}