/* v4: tablet keeps hero and about side by side; shorter hero photo on phones. */
.mk-hero-question{display:inline}
@media(min-width:700px) and (max-width:1023px){
 .mk-hero-layout{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:28px;align-items:center}
 .mk-hero-copy h1{font-size:clamp(2.1rem,.9rem + 3.4vw,2.85rem)}
 .mk-hero-portrait{max-width:300px;justify-self:end}
 .mk-hero-image{aspect-ratio:4/5}
 .mk-about-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:32px;align-items:center}
 .mk-about-photo{max-width:none}
 .mk-about-photo>img{aspect-ratio:4/5!important;object-position:55% 50%}
}
@media(max-width:699px){
 .mk-hero-image{aspect-ratio:5/4;object-position:50% 18%!important}
}