/* Showroom image and readable hero copy. */
.hero .intro { text-align: justify; }
.hero-visual .hero-showroom-image { clip-path: none; object-position: center; filter: saturate(.93) contrast(1.02); }
.hero-title span, .hero-title em { white-space: nowrap; }
.quick-contact { position: fixed; right: 20px; bottom: 20px; z-index: 11; display: grid; place-items: center; width: 62px; height: 62px; border-radius: 50%; background: var(--yellow); color: var(--deep); box-shadow: 0 5px 20px rgba(0,26,55,.38); transition: transform .2s ease, background .2s ease; }
.quick-contact::before { content: '☎'; font-size: 29px; line-height: 1; transform: rotate(-12deg); }
.quick-contact:hover { background: #ffe071; transform: scale(1.07); }
.quick-contact span, .quick-contact b { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

@media (min-width: 851px) {
  .hero { grid-template-columns: minmax(0, 1.05fr) minmax(370px, .95fr); }
  .hero-visual { width: min(100%, 465px); height: 465px; justify-self: end; }
}
@media (min-width: 851px) and (max-width: 1050px) { .hero { grid-template-columns: 1fr; } .hero-visual { justify-self: end; } }
@media (max-width: 850px) {
  .hero-visual { width: min(100%, 500px); height: auto; aspect-ratio: 1 / 1; }
  .hero-visual .hero-showroom-image { object-position: center; }
}
@media (max-width: 520px) {
  .hero-visual { height: auto; aspect-ratio: 1 / 1; }
  .hero-title { font-size: clamp(1.9rem, 8vw, 3.2rem); }
  .hero-title span, .hero-title em { white-space: nowrap; }
  .hero .intro { text-align: left; }
  .quick-contact { right: 14px; bottom: 14px; width: 56px; height: 56px; }
  .quick-contact::before { font-size: 26px; }
}