/* The art keeps one uniform scale; no landmark is cropped or hidden by its neighbour. */
/* Presentation only: retain the reviewed SVG geometry, palette relationships
   and motion, while bringing small façade details out of the pale midtones. */
.hero .landmark-scene {
  padding: 1.25rem .75rem 3.5rem;
  filter: contrast(1.28) saturate(1.3);
}
@media (min-width: 901px) and (max-width: 1080px) {
  .hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .hero { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto; min-height: 0; }
  .hero-copy { padding: 3.5rem clamp(1.3rem, 6vw, 3.5rem) 3rem; }
  .hero h1 { font-size: clamp(3.4rem, 11vw, 6rem); }
  .hero-intro { max-width: 40rem; }
  .city-stage { width: 100%; min-height: 0; aspect-ratio: 1000 / 1080; max-height: 840px; }
  .landmark-scene { padding: 2.5rem .75rem 4.5rem; object-fit: contain; }
}
@media (max-width: 430px) {
  .hero-copy { padding-top: 2.5rem; padding-bottom: 2.5rem; }
  .hero h1 { font-size: clamp(3rem, 15vw, 4rem); }
  .hero h1 em { white-space: normal; }
  .city-stage { aspect-ratio: 1000 / 1140; }
  .stage-caption { top: 1.25rem; font-size: .55rem; }
  .landmark-key { inset-inline: .75rem; gap: .4rem; font-size: .64rem; }
  .landmark-key small { font-size: .54rem; }
}
@media (max-width: 900px) {
  .hero .city-stage { height: 300px; aspect-ratio: auto; max-height: none; }
  .hero .landmark-scene { padding: 8px 8px 60px; }
}
