.spark-page .rooms-hero-copy h1 { max-width: 18ch; font-size: clamp(40px, 5.6vw, 78px); }
.spark-page .rooms-intro { gap: clamp(20px, 4vw, 48px); }
.spark-page .rooms-intro .text-link { display: inline-block; margin-top: 16px; }
.spark-page :is(.rooms-intro, .location-overview, .stay-overview, .faq-section) { padding-top: clamp(40px, 6vw, 80px); }
.spark-page .section-heading { margin-bottom: 28px; }
.spark-page .location-overview .section-heading { margin-bottom: 48px; }
.spark-directions { display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: start; }
.spark-directions > p, .spark-room-intro { color: var(--cream-dim); max-width: 65ch; }
.spark-directions > p { margin: 0; }
.spark-directions > div { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; text-align: right; }
.spark-directions > div > p { margin: 0; }
.spark-directions a { align-items: baseline; gap: .5em; }
.spark-room-intro { margin-bottom: 28px; }
@media (max-width: 650px) {
  .spark-directions { grid-template-columns: 1fr; gap: 20px; }
  .spark-page .rooms-hero-copy h1 { font-size: clamp(36px, 10vw, 52px); }
  .spark-page .rooms-hero-copy > p:last-of-type { margin-bottom: 22px; }
  .spark-page .section-heading { gap: 16px; margin-bottom: 24px; }
  .spark-page .location-overview .section-heading { margin-bottom: 28px; }
}
@media (max-width: 640px) {
  .spark-directions > div { align-items: flex-start; gap: 12px; text-align: left; min-width: 0; }
  .spark-directions > div > p { display: contents; }
  .spark-directions a { min-height: 44px; max-width: 100%; white-space: nowrap; }
  .spark-directions .btn { width: 100%; }
  .spark-directions .text-link { align-items: baseline; padding-block: 12px; }
}