body {
  background-color: var(--color-background);
}

.hero--accommodations {
  min-height: min(80vh, 760px);
}

.hero-content--accommodations {
  padding-block: clamp(var(--space-12), 9vw, var(--space-15));
}

.section-header {
  margin-bottom: var(--space-9);
}

.section-intro-grid {
  align-items: center;
  gap: var(--space-10);
}

.section-intro-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.suites-image-wrapper,
.rooms-image-wrapper {
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: var(--shadow-medium);
}

.section-suites-grid,
.section-rooms-grid,
.section-outdoor-grid,
.section-accessibility-grid,
.section-butler-grid {
  align-items: center;
  gap: var(--space-10);
}

.room-highlights,
.accessibility-list {
  display: grid;
  gap: var(--space-3);
  margin-top: var(--space-5);
}

.room-highlights li,
.accessibility-list li {
  position: relative;
  padding-left: 1.3rem;
  color: var(--color-text-soft);
  font-size: var(--font-size-sm);
}

.room-highlights li::before,
.accessibility-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55rem;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--color-primary), var(--color-success));
}

.virtual-tour-container {
  position: relative;
}

.virtual-tour-card {
  overflow: hidden;
}

.virtual-tour-grid {
  align-items: stretch;
  gap: var(--space-10);
}

.virtual-tour-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
  margin-top: var(--space-6);
}

.virtual-tour-panel {
  border-radius: var(--radius-lg);
  background: radial-gradient(circle at top, rgba(201, 164, 106, 0.18), transparent 60%),
              rgba(5, 8, 23, 0.9);
  padding: clamp(var(--space-6), 3vw, var(--space-8));
  display: flex;
  align-items: center;
}

.virtual-tour-title {
  font-size: var(--font-size-xl);
  margin-bottom: var(--space-3);
}

.virtual-tour-text {
  margin-bottom: var(--space-3);
}

.virtual-tour-note {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}

.section-outdoor-grid .card,
.section-butler-grid .card,
.section-accessibility-grid .card {
  height: 100%;
}

.signature-layout {
  display: grid;
  gap: var(--space-9);
}

.signature-media {
  order: -1;
}

.signature-copy {
  position: relative;
}

.signature-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
}

.section-stories-grid {
  align-items: stretch;
}

.section-stories-grid .card {
  height: 100%;
}

.stories-author {
  margin-top: var(--space-4);
  font-size: var(--font-size-sm);
  color: var(--color-text-muted);
}

.stories-footer {
  margin-top: var(--space-9);
}

.crosslinks-grid .card {
  height: 100%;
}

.center {
  margin-inline: auto;
}

@media (min-width: 960px) {
  .signature-layout {
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    align-items: center;
  }

  .signature-media {
    order: 0;
  }
}

@media (max-width: 959.98px) {
  .hero--accommodations {
    min-height: 70vh;
  }

  .section-intro-grid,
  .section-suites-grid,
  .section-rooms-grid,
  .section-outdoor-grid,
  .section-accessibility-grid,
  .section-butler-grid,
  .virtual-tour-grid {
    gap: var(--space-6);
  }
}

@media (max-width: 767.98px) {
  .hero-content--accommodations {
    padding-block: clamp(var(--space-11), 18vh, var(--space-13));
  }

  .section-header {
    margin-bottom: var(--space-7);
  }

  .virtual-tour-panel {
    margin-top: var(--space-6);
  }

  .signature-actions {
    flex-direction: column;
  }

  .section-intro-ctas,
  .virtual-tour-actions {
    flex-direction: column;
  }
}
