.hero-inner { grid-template-columns: 1.05fr .95fr; gap: 44px; }
.roof-photo { min-width: 0; margin: 0; }
.roof-photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  border: 1px solid #b9d9d64d;
  border-radius: 3px;
  box-shadow: 0 18px 50px #001f2a55;
}
.roof-photo figcaption {
  margin-top: 9px;
  color: #c8dfdf;
  text-align: right;
  font: 400 11px/1.4 system-ui, -apple-system, Segoe UI, sans-serif;
}
@media (max-width: 860px) {
  .hero-inner { grid-template-columns: 1fr; gap: 32px; }
  .roof-photo { width: 100%; }
}