.design-hero-media>img{display:block;width:100%;height:auto}
/* A single column is the default, including fractional widths between breakpoints. */
.design-site .design-hero-shell{grid-template-columns:minmax(0,1fr)}
.design-site .design-hero-photo{width:100%;max-width:none}
/* The text and photograph share one top and bottom line on desktop. */
@media(min-width:1151px){
  .design-site .design-hero-shell{grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:48px;align-items:stretch}
  .design-site .design-hero-photo{align-self:stretch;display:flex;flex-direction:column;max-width:none;min-height:0}
  .design-site .design-hero-media{position:relative;flex:1;min-height:0}
  .design-site .design-hero-media>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:53% center}
  .design-site .design-hero-photo figcaption{position:relative;z-index:1;margin-top:0;flex:none;background:#1a2326}
}
@media(min-width:851px) and (max-width:1150px){
  .design-site .design-hero-shell{grid-template-columns:minmax(0,1fr);gap:30px}
  .design-site .hero-copy{max-width:650px}
  .design-site .design-hero-photo{max-width:none;width:100%}
  .design-site .design-hero-media>img{height:auto;max-height:540px;object-fit:cover;object-position:center}
}