.hero-content {
  max-width: 850px;
}

.hero h1 {
  font-size: clamp(3rem, 6vw, 5.6rem);
}

.hero-copy {
  max-width: 600px;
}

.comfort-band picture {
  display: block;
  min-width: 0;
}

.comfort-band picture img {
  display: block;
  aspect-ratio: 4 / 3;
}

.comfort-book-button {
  margin-top: 0.75rem;
}

.bring-section {
  max-width: none;
  background: #efe8de;
}

.site-footer .footer-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  width: fit-content;
  margin: 0 0 1rem;
}

.site-footer .footer-brand img {
  flex: 0 0 42px;
}

.site-footer .footer-brand span {
  line-height: 1.2;
}

.quote-rotator {
  display: grid;
  align-items: center;
  max-width: 1000px;
  margin: 0 auto 1.5rem;
}

.quote-section .quote-rotator blockquote {
  grid-area: 1 / 1;
  margin: 0;
  opacity: 0;
  pointer-events: none;
  transition: opacity 1.2s ease;
}

.quote-section .quote-rotator blockquote.is-active {
  opacity: 1;
  pointer-events: auto;
}

/* Keep the hero calm and readable while allowing more of the film through. */
.hero-shade {
  background: linear-gradient(
    90deg,
    rgba(33, 28, 33, 0.76) 0%,
    rgba(33, 28, 33, 0.32) 58%,
    rgba(33, 28, 33, 0.15) 100%
  );
}

@media (prefers-reduced-motion: reduce) {
  .hero-shade {
    background: rgba(33, 28, 33, 0.52);
  }
}